Slider Parts & Part Concepts

This was created to begin to investigate the anatomy of the Slider/Range control. This was spurred on by this CSSWG Psuedo issue.

Legend:

True: part or concept exists
False: Part or concept does not exist
Depends: It does exist but it depends on certain functionality existing. This does not contribute to the total below but should be considered when reviewing the totals.
NA: This part or concept doesn’t apply
Browser Parts: This component library leverages the currently available parts so reference the browser columns for support. These columns do not contribute to the total.

Part Concepts

These are general concepts that may exist for the Slider control. This does not attempt to show what the names should be called but the top utilized concepts should be prioritized for having a part defined.

Concept	Ant Design	Carbon	UI Fabric	FAST	Lightning	Stardust	WAI-ARIA	Material	AtlasKit	-Webkit	Firefox	TOTAL
Thumb	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	11
Track	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	TRUE	11
Filled Selected Track	TRUE	TRUE	TRUE	FALSE	FALSE	TRUE	N/A	TRUE	FALSE	TRUE	TRUE	7
Content End	TRUE	TRUE	TRUE	FALSE	TRUE	TRUE	N/A	FALSE	TRUE	FALSE	FALSE	6
Content Start	TRUE	TRUE	FALSE	FALSE	TRUE	TRUE	N/A	FALSE	TRUE	FALSE	FALSE	5
Number Output	TRUE	TRUE	TRUE	FALSE	FALSE	TRUE	N/A	FALSE	FALSE	FALSE	FALSE	4
Marks	TRUE	FALSE	FALSE	FALSE	FALSE	FALSE	N/A	FALSE	FALSE	TRUE	FALSE	2
Step	TRUE	FALSE	FALSE	FALSE	FALSE	FALSE	N/A	TRUE	FALSE	FALSE	FALSE	2
Tooltip	TRUE	FALSE	FALSE	FALSE	FALSE	FALSE	N/A	TRUE	FALSE	FALSE	FALSE	2
Two Handles	TRUE	FALSE	FALSE	FALSE	FALSE	FALSE	TRUE	FALSE	FALSE	FALSE	FALSE	2
Mark Content	TRUE	FALSE	FALSE	FALSE	FALSE	FALSE	N/A	FALSE	FALSE	FALSE	FALSE	1

Notes for some items:

Step: This does not reference if the step attribute is supported but that they provide a part/denotion to the UI of the steps for styling
Mark content: This denotes whether you can put content into the mark. This is already a standard by assinging a datalist to a range input. This is not fully supported by any browser.

Parts

These are names for the parts that may be used in a part concept.

PART	PART Concept	Ant Design	Carbon	UI Fabric	FAST	Lightning	Stardust	WAI-ARIA	Material	AtlasKit	-Webkit	Firefox	TOTAL
thumb	Thumb	FALSE	TRUE	TRUE	TRUE	Browser Parts	TRUE	TRUE	TRUE	Browser Parts	TRUE	TRUE	8
track	Track	DEPENDS	TRUE	FALSE	TRUE	Browser Parts	DEPENDS	N/A	TRUE	Browser Parts	TRUE	TRUE	5
value-label	Number Output	FALSE	FALSE	TRUE	FALSE	Browser Parts	TRUE	N/A	TRUE	Browser Parts	FALSE	FALSE	3
rail	Filled Selected Track	TRUE	FALSE	FALSE	FALSE	Browser Parts	TRUE	N/A	FALSE	Browser Parts	FALSE	FALSE	2
line	Track	FALSE	FALSE	TRUE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
progress	Filled Selected Track	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	TRUE	1
handle-one	Two Handles	TRUE	FALSE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
handle-two	Two Handles	TRUE	FALSE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
tickmarks	Marks	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	FALSE	Browser Parts	TRUE	FALSE	1
mark	Marksk	TRUE	FALSE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
mark text	Mark Content	TRUE	FALSE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
step	Step	TRUE	FALSE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
input-for-slider	Number Output	FALSE	TRUE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1
input-number	Number Output	TRUE	FALSE	FALSE	FALSE	Browser Parts	FALSE	N/A	FALSE	Browser Parts	FALSE	FALSE	1

Slider Parts & Part Concepts

Part ConceptsSection titled Part%20Concepts

Notes for some items:Section titled Notes%20for%20some%20items%3A

PartsSection titled Parts

Part Concepts

Notes for some items:

Parts