@warp-ds/elements 2.9.1-next.3 → 2.9.1-next.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (97) hide show
  1. package/dist/custom-elements.json +83 -239
  2. package/dist/docs/affix/affix.md +9 -10
  3. package/dist/docs/affix/api.md +9 -10
  4. package/dist/docs/alert/alert.md +4 -2
  5. package/dist/docs/alert/api.md +4 -2
  6. package/dist/docs/attention/api.md +16 -14
  7. package/dist/docs/attention/attention.md +16 -14
  8. package/dist/docs/badge/api.md +5 -6
  9. package/dist/docs/badge/badge.md +5 -6
  10. package/dist/docs/box/api.md +3 -4
  11. package/dist/docs/box/box.md +3 -4
  12. package/dist/docs/breadcrumbs/accessibility.md +46 -0
  13. package/dist/docs/breadcrumbs/api.md +8 -8
  14. package/dist/docs/breadcrumbs/breadcrumbs.md +127 -9
  15. package/dist/docs/breadcrumbs/examples.md +35 -0
  16. package/dist/docs/breadcrumbs/usage.md +36 -0
  17. package/dist/docs/button/api.md +15 -13
  18. package/dist/docs/button/button.md +15 -13
  19. package/dist/docs/card/api.md +5 -6
  20. package/dist/docs/card/card.md +5 -6
  21. package/dist/docs/combobox/api.md +18 -19
  22. package/dist/docs/combobox/combobox.md +18 -19
  23. package/dist/docs/datepicker/api.md +38 -39
  24. package/dist/docs/datepicker/datepicker.md +38 -39
  25. package/dist/docs/expandable/api.md +11 -12
  26. package/dist/docs/expandable/expandable.md +11 -12
  27. package/dist/docs/link/api.md +8 -6
  28. package/dist/docs/link/link.md +8 -6
  29. package/dist/docs/page-indicator/api.md +7 -8
  30. package/dist/docs/page-indicator/page-indicator.md +7 -8
  31. package/dist/docs/pagination/api.md +17 -9
  32. package/dist/docs/pagination/pagination.md +17 -9
  33. package/dist/docs/pill/api.md +30 -17
  34. package/dist/docs/pill/pill.md +30 -17
  35. package/dist/docs/select/api.md +17 -9
  36. package/dist/docs/select/select.md +17 -9
  37. package/dist/docs/slider/api.md +37 -116
  38. package/dist/docs/slider/examples.md +331 -0
  39. package/dist/docs/slider/slider.md +378 -118
  40. package/dist/docs/slider/usage.md +10 -0
  41. package/dist/docs/slider-thumb/api.md +26 -55
  42. package/dist/docs/slider-thumb/slider-thumb.md +26 -57
  43. package/dist/docs/step/api.md +3 -4
  44. package/dist/docs/step/step.md +3 -4
  45. package/dist/docs/step-indicator/api.md +3 -4
  46. package/dist/docs/step-indicator/step-indicator.md +3 -4
  47. package/dist/docs/switch/api.md +13 -5
  48. package/dist/docs/switch/switch.md +13 -5
  49. package/dist/docs/tab/api.md +9 -62
  50. package/dist/docs/tab/tab.md +9 -70
  51. package/dist/docs/tab-panel/api.md +7 -11
  52. package/dist/docs/tab-panel/tab-panel.md +7 -19
  53. package/dist/docs/tabs/accessibility.md +11 -0
  54. package/dist/docs/tabs/api.md +10 -18
  55. package/dist/docs/tabs/examples.md +68 -0
  56. package/dist/docs/tabs/tabs.md +97 -20
  57. package/dist/docs/tabs/usage.md +8 -0
  58. package/dist/docs/textarea/api.md +15 -16
  59. package/dist/docs/textarea/textarea.md +15 -16
  60. package/dist/docs/textfield/api.md +14 -15
  61. package/dist/docs/textfield/textfield.md +14 -15
  62. package/dist/index.d.ts +124 -224
  63. package/dist/packages/breadcrumbs/breadcrumbs.d.ts +7 -1
  64. package/dist/packages/breadcrumbs/breadcrumbs.js.map +2 -2
  65. package/dist/packages/button/button.react.stories.d.ts +8 -2
  66. package/dist/packages/button/button.react.test.d.ts +1 -0
  67. package/dist/packages/button/button.react.test.js +16 -0
  68. package/dist/packages/button/react.d.ts +5 -1
  69. package/dist/packages/button/react.js +8 -1
  70. package/dist/packages/pagination/pagination.test.js +38 -0
  71. package/dist/packages/select/select.react.stories.d.ts +1 -1
  72. package/dist/packages/slider/slider.d.ts +34 -45
  73. package/dist/packages/slider/slider.js +1 -1
  74. package/dist/packages/slider/slider.js.map +2 -2
  75. package/dist/packages/slider-thumb/slider-thumb.d.ts +36 -31
  76. package/dist/packages/slider-thumb/slider-thumb.js +1 -1
  77. package/dist/packages/slider-thumb/slider-thumb.js.map +2 -2
  78. package/dist/packages/tab/tab.d.ts +29 -24
  79. package/dist/packages/tab/tab.js +3 -3
  80. package/dist/packages/tab/tab.js.map +2 -2
  81. package/dist/packages/tab-panel/tab-panel.d.ts +9 -8
  82. package/dist/packages/tab-panel/tab-panel.js +3 -3
  83. package/dist/packages/tab-panel/tab-panel.js.map +2 -2
  84. package/dist/packages/tabs/index.d.ts +1 -0
  85. package/dist/packages/tabs/index.js +0 -1
  86. package/dist/packages/tabs/react.d.ts +4 -3
  87. package/dist/packages/tabs/tabs.d.ts +9 -3
  88. package/dist/packages/tabs/tabs.js.map +2 -2
  89. package/dist/packages/tabs/tabs.react.stories.d.ts +2 -2
  90. package/dist/web-types.json +201 -93
  91. package/package.json +2 -1
  92. package/dist/docs/tab/accessibility.md +0 -1
  93. package/dist/docs/tab/examples.md +0 -1
  94. package/dist/docs/tab/usage.md +0 -1
  95. package/dist/docs/tab-panel/accessibility.md +0 -1
  96. package/dist/docs/tab-panel/examples.md +0 -1
  97. package/dist/docs/tab-panel/usage.md +0 -1
package/dist/index.d.ts CHANGED
@@ -657,12 +657,14 @@ Defaults to a role of `region`. Set `role="none"` to override this behaviour for
657
657
  };
658
658
 
659
659
  export type WarpBreadcrumbsProps = {
660
- /** */
660
+ /** Accessible label for the breadcrumb navigation.
661
+ Defaults to the localized "You are here" label. Set `aria-label` when the default label is not specific enough for the page. */
661
662
  ariaLabel?: WarpBreadcrumbs["ariaLabel"];
662
663
  };
663
664
 
664
665
  export type WarpBreadcrumbsSolidJsProps = {
665
- /** */
666
+ /** Accessible label for the breadcrumb navigation.
667
+ Defaults to the localized "You are here" label. Set `aria-label` when the default label is not specific enough for the page. */
666
668
  "prop:ariaLabel"?: WarpBreadcrumbs["ariaLabel"];
667
669
 
668
670
  /** Set the innerHTML of the element */
@@ -1489,45 +1491,45 @@ export type WarpSelectSolidJsProps = {
1489
1491
  };
1490
1492
 
1491
1493
  export type WarpSliderThumbProps = {
1492
- /** */
1494
+ /** Label for the range input. */
1493
1495
  "aria-label"?: WarpSliderThumb["ariaLabel"];
1494
- /** */
1496
+ /** Label for the range input. */
1495
1497
  ariaLabel?: WarpSliderThumb["ariaLabel"];
1496
- /** */
1498
+ /** Contextual information for assistive technology, should it be needed */
1497
1499
  "aria-description"?: WarpSliderThumb["ariaDescription"];
1498
- /** */
1500
+ /** Contextual information for assistive technology, should it be needed */
1499
1501
  ariaDescription?: WarpSliderThumb["ariaDescription"];
1500
- /** */
1502
+ /** The name of this input field in the form. The canonical source of the value is the text field. */
1501
1503
  name?: WarpSliderThumb["name"];
1502
- /** */
1504
+ /** The initial value, if any */
1503
1505
  value?: WarpSliderThumb["value"];
1504
- /** */
1506
+ /** Placeholder in empty text fields */
1505
1507
  placeholder?: WarpSliderThumb["placeholder"];
1506
1508
 
1507
- /** */
1509
+ /** Internal event used by (and stopped by) `w-slider`. */
1508
1510
  onthumbreset?: (e: CustomEvent) => void;
1509
- /** */
1511
+ /** Internal event used by (and stopped by) `w-slider`. */
1510
1512
  onslidervalidity?: (e: CustomEvent) => void;
1511
1513
  };
1512
1514
 
1513
1515
  export type WarpSliderThumbSolidJsProps = {
1514
- /** */
1516
+ /** Label for the range input. */
1515
1517
  "attr:aria-label"?: WarpSliderThumb["ariaLabel"];
1516
- /** */
1518
+ /** Label for the range input. */
1517
1519
  "prop:ariaLabel"?: WarpSliderThumb["ariaLabel"];
1518
- /** */
1520
+ /** Contextual information for assistive technology, should it be needed */
1519
1521
  "attr:aria-description"?: WarpSliderThumb["ariaDescription"];
1520
- /** */
1522
+ /** Contextual information for assistive technology, should it be needed */
1521
1523
  "prop:ariaDescription"?: WarpSliderThumb["ariaDescription"];
1522
- /** */
1524
+ /** The name of this input field in the form. The canonical source of the value is the text field. */
1523
1525
  "prop:name"?: WarpSliderThumb["name"];
1524
- /** */
1526
+ /** The initial value, if any */
1525
1527
  "prop:value"?: WarpSliderThumb["value"];
1526
- /** */
1528
+ /** Placeholder in empty text fields */
1527
1529
  "prop:placeholder"?: WarpSliderThumb["placeholder"];
1528
- /** */
1530
+ /** Internal event used by (and stopped by) `w-slider`. */
1529
1531
  "on:thumbreset"?: (e: CustomEvent) => void;
1530
- /** */
1532
+ /** Internal event used by (and stopped by) `w-slider`. */
1531
1533
  "on:slidervalidity"?: (e: CustomEvent) => void;
1532
1534
 
1533
1535
  /** Set the innerHTML of the element */
@@ -1547,46 +1549,38 @@ If you need to display HTML, use the `label` slot instead (f. ex. `<legend class
1547
1549
  "open-ended"?: WarpSlider["openEnded"];
1548
1550
  /** Whether or not to allow values outside the range such as "Before 1950" and "2025+". */
1549
1551
  openEnded?: WarpSlider["openEnded"];
1550
- /** */
1552
+ /** Validation error text, if any */
1551
1553
  error?: WarpSlider["error"];
1552
- /** */
1554
+ /** Additional description to show below the fieldset */
1553
1555
  "help-text"?: WarpSlider["helpText"];
1554
- /** */
1556
+ /** Additional description to show below the fieldset */
1555
1557
  helpText?: WarpSlider["helpText"];
1556
- /** */
1558
+ /** Sets the form fields and fieldset in an invalid state */
1557
1559
  invalid?: WarpSlider["invalid"];
1558
- /** Ensures a child slider thumb has a value before allowing the containing form to submit. */
1560
+ /** Ensures a child slider thumb has a value before allowing the containing form to submit */
1559
1561
  required?: WarpSlider["required"];
1560
- /** */
1562
+ /** The minimum allowed value in the range inputs */
1561
1563
  min?: WarpSlider["min"];
1562
- /** */
1564
+ /** The maximum allowed value in the range inputs */
1563
1565
  max?: WarpSlider["max"];
1564
1566
  /** Pass a value similar to step to create visual markers at that interval */
1565
1567
  markers?: WarpSlider["markers"];
1566
- /** */
1568
+ /** ets step on the range input to jump between values when dragging */
1567
1569
  step?: WarpSlider["step"];
1568
- /** Suffix used in text input fields and for the min and max values of the slider. */
1570
+ /** Suffix used in text input fields and for the min and max values of the slider */
1569
1571
  suffix?: WarpSlider["suffix"];
1570
- /** */
1572
+ /** Should only be used in special cases */
1571
1573
  "hidden-textfield"?: WarpSlider["hiddenTextfield"];
1572
- /** */
1574
+ /** Should only be used in special cases */
1573
1575
  hiddenTextfield?: WarpSlider["hiddenTextfield"];
1574
- /** Formatter for the tooltip and input mask values. */
1576
+ /** Formatter for the tooltip and input mask values */
1575
1577
  valueFormatter?: WarpSlider["valueFormatter"];
1576
- /** Replaces valueFormatter for the tooltip. Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. */
1578
+ /** Overrides valueFormatter for the tooltip.
1579
+
1580
+ Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. */
1577
1581
  tooltipFormatter?: WarpSlider["tooltipFormatter"];
1578
1582
  /** Formatter for the min and max labels below the range. */
1579
1583
  labelFormatter?: WarpSlider["labelFormatter"];
1580
- /** */
1581
- fieldset?: WarpSlider["fieldset"];
1582
- /** */
1583
- _invalidMessage?: WarpSlider["_invalidMessage"];
1584
- /** */
1585
- _hasInternalError?: WarpSlider["_hasInternalError"];
1586
- /** */
1587
- _showError?: WarpSlider["_showError"];
1588
- /** */
1589
- _tabbableElements?: WarpSlider["_tabbableElements"];
1590
1584
  };
1591
1585
 
1592
1586
  export type WarpSliderSolidJsProps = {
@@ -1600,46 +1594,38 @@ If you need to display HTML, use the `label` slot instead (f. ex. `<legend class
1600
1594
  "bool:open-ended"?: WarpSlider["openEnded"];
1601
1595
  /** Whether or not to allow values outside the range such as "Before 1950" and "2025+". */
1602
1596
  "prop:openEnded"?: WarpSlider["openEnded"];
1603
- /** */
1597
+ /** Validation error text, if any */
1604
1598
  "prop:error"?: WarpSlider["error"];
1605
- /** */
1599
+ /** Additional description to show below the fieldset */
1606
1600
  "attr:help-text"?: WarpSlider["helpText"];
1607
- /** */
1601
+ /** Additional description to show below the fieldset */
1608
1602
  "prop:helpText"?: WarpSlider["helpText"];
1609
- /** */
1603
+ /** Sets the form fields and fieldset in an invalid state */
1610
1604
  "prop:invalid"?: WarpSlider["invalid"];
1611
- /** Ensures a child slider thumb has a value before allowing the containing form to submit. */
1605
+ /** Ensures a child slider thumb has a value before allowing the containing form to submit */
1612
1606
  "prop:required"?: WarpSlider["required"];
1613
- /** */
1607
+ /** The minimum allowed value in the range inputs */
1614
1608
  "prop:min"?: WarpSlider["min"];
1615
- /** */
1609
+ /** The maximum allowed value in the range inputs */
1616
1610
  "prop:max"?: WarpSlider["max"];
1617
1611
  /** Pass a value similar to step to create visual markers at that interval */
1618
1612
  "prop:markers"?: WarpSlider["markers"];
1619
- /** */
1613
+ /** ets step on the range input to jump between values when dragging */
1620
1614
  "prop:step"?: WarpSlider["step"];
1621
- /** Suffix used in text input fields and for the min and max values of the slider. */
1615
+ /** Suffix used in text input fields and for the min and max values of the slider */
1622
1616
  "prop:suffix"?: WarpSlider["suffix"];
1623
- /** */
1617
+ /** Should only be used in special cases */
1624
1618
  "bool:hidden-textfield"?: WarpSlider["hiddenTextfield"];
1625
- /** */
1619
+ /** Should only be used in special cases */
1626
1620
  "prop:hiddenTextfield"?: WarpSlider["hiddenTextfield"];
1627
- /** Formatter for the tooltip and input mask values. */
1621
+ /** Formatter for the tooltip and input mask values */
1628
1622
  "prop:valueFormatter"?: WarpSlider["valueFormatter"];
1629
- /** Replaces valueFormatter for the tooltip. Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. */
1623
+ /** Overrides valueFormatter for the tooltip.
1624
+
1625
+ Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. */
1630
1626
  "prop:tooltipFormatter"?: WarpSlider["tooltipFormatter"];
1631
1627
  /** Formatter for the min and max labels below the range. */
1632
1628
  "prop:labelFormatter"?: WarpSlider["labelFormatter"];
1633
- /** */
1634
- "prop:fieldset"?: WarpSlider["fieldset"];
1635
- /** */
1636
- "prop:_invalidMessage"?: WarpSlider["_invalidMessage"];
1637
- /** */
1638
- "prop:_hasInternalError"?: WarpSlider["_hasInternalError"];
1639
- /** */
1640
- "prop:_showError"?: WarpSlider["_showError"];
1641
- /** */
1642
- "prop:_tabbableElements"?: WarpSlider["_tabbableElements"];
1643
1629
 
1644
1630
  /** Set the innerHTML of the element */
1645
1631
  innerHTML?: string;
@@ -1718,45 +1704,17 @@ export type WarpSwitchSolidJsProps = {
1718
1704
  };
1719
1705
 
1720
1706
  export type WarpTabProps = {
1721
- /** */
1722
- id?: WarpTab["id"];
1723
- /** */
1707
+ /** The `id` of the `<w-tab-panel>` this tab controls. */
1724
1708
  for?: WarpTab["for"];
1725
- /** */
1726
- "aria-controls"?: WarpTab["_ariaControlsAttr"];
1727
- /** */
1728
- _ariaControlsAttr?: WarpTab["_ariaControlsAttr"];
1729
- /** */
1730
- "aria-selected"?: WarpTab["ariaSelected"];
1731
- /** */
1732
- ariaSelected?: WarpTab["ariaSelected"];
1733
- /** @deprecated Use `aria-selected="true"` instead */
1734
- active?: WarpTab["active"];
1735
- /** */
1709
+ /** Whether to show the `icon` slot over the tab title instead of inline. */
1736
1710
  over?: WarpTab["over"];
1737
- /** Override tabIndex setter to set _parentTabIndex (for backwards compatibility). */
1738
- tabIndex?: WarpTab["tabIndex"];
1739
1711
  };
1740
1712
 
1741
1713
  export type WarpTabSolidJsProps = {
1742
- /** */
1743
- "prop:id"?: WarpTab["id"];
1744
- /** */
1714
+ /** The `id` of the `<w-tab-panel>` this tab controls. */
1745
1715
  "prop:for"?: WarpTab["for"];
1746
- /** */
1747
- "attr:aria-controls"?: WarpTab["_ariaControlsAttr"];
1748
- /** */
1749
- "prop:_ariaControlsAttr"?: WarpTab["_ariaControlsAttr"];
1750
- /** */
1751
- "attr:aria-selected"?: WarpTab["ariaSelected"];
1752
- /** */
1753
- "prop:ariaSelected"?: WarpTab["ariaSelected"];
1754
- /** @deprecated Use `aria-selected="true"` instead */
1755
- "prop:active"?: WarpTab["active"];
1756
- /** */
1716
+ /** Whether to show the `icon` slot over the tab title instead of inline. */
1757
1717
  "prop:over"?: WarpTab["over"];
1758
- /** Override tabIndex setter to set _parentTabIndex (for backwards compatibility). */
1759
- "prop:tabIndex"?: WarpTab["tabIndex"];
1760
1718
 
1761
1719
  /** Set the innerHTML of the element */
1762
1720
  innerHTML?: string;
@@ -1765,15 +1723,13 @@ export type WarpTabSolidJsProps = {
1765
1723
  };
1766
1724
 
1767
1725
  export type WarpTabPanelProps = {
1768
- /** Whether this panel is active (visible).
1769
- Set by parent w-tabs via the _parentActive property. */
1770
- active?: WarpTabPanel["active"];
1726
+ /** Required so `<w-tab>` has something to target. */
1727
+ id?: WarpTabPanel["id"];
1771
1728
  };
1772
1729
 
1773
1730
  export type WarpTabPanelSolidJsProps = {
1774
- /** Whether this panel is active (visible).
1775
- Set by parent w-tabs via the _parentActive property. */
1776
- "prop:active"?: WarpTabPanel["active"];
1731
+ /** Required so `<w-tab>` has something to target. */
1732
+ "prop:id"?: WarpTabPanel["id"];
1777
1733
 
1778
1734
  /** Set the innerHTML of the element */
1779
1735
  innerHTML?: string;
@@ -1782,18 +1738,18 @@ Set by parent w-tabs via the _parentActive property. */
1782
1738
  };
1783
1739
 
1784
1740
  export type WarpTabsProps = {
1785
- /** */
1741
+ /** The `id` of the panel that should be active. */
1786
1742
  active?: WarpTabs["active"];
1787
1743
 
1788
- /** */
1789
- onchange?: (e: CustomEvent) => void;
1744
+ /** Includes `details.panelId` with the now active tab's ID */
1745
+ onchange?: (e: WarpTabsChangeEvent) => void;
1790
1746
  };
1791
1747
 
1792
1748
  export type WarpTabsSolidJsProps = {
1793
- /** */
1749
+ /** The `id` of the panel that should be active. */
1794
1750
  "prop:active"?: WarpTabs["active"];
1795
- /** */
1796
- "on:change"?: (e: CustomEvent) => void;
1751
+ /** Includes `details.panelId` with the now active tab's ID */
1752
+ "on:change"?: (e: WarpTabsChangeEvent) => void;
1797
1753
 
1798
1754
  /** Set the innerHTML of the element */
1799
1755
  innerHTML?: string;
@@ -2168,7 +2124,8 @@ export type CustomElements = {
2168
2124
  "w-box": Partial<WarpBoxProps & BaseProps<WarpBox> & BaseEvents>;
2169
2125
 
2170
2126
  /**
2171
- * Breadcrumbs show the navigation structure for the current location.
2127
+ * Shows the navigation structure for the current page.
2128
+ * Renders direct child links and non-link elements as a breadcrumb trail, inserts separators between items, and exposes the trail as navigation.
2172
2129
  *
2173
2130
  * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-breadcrumbs--docs)
2174
2131
  *
@@ -2176,7 +2133,8 @@ export type CustomElements = {
2176
2133
  *
2177
2134
  * Component attributes and properties that can be applied to the element or by using JavaScript.
2178
2135
  *
2179
- * - `ariaLabel`: undefined (property only)
2136
+ * - `ariaLabel`: Accessible label for the breadcrumb navigation.
2137
+ * Defaults to the localized "You are here" label. Set `aria-label` when the default label is not specific enough for the page. (property only)
2180
2138
  */
2181
2139
  "w-breadcrumbs": Partial<
2182
2140
  WarpBreadcrumbsProps & BaseProps<WarpBreadcrumbs> & BaseEvents
@@ -2658,28 +2616,22 @@ export type CustomElements = {
2658
2616
  /**
2659
2617
  * Component to place inside a `<w-slider>`.
2660
2618
  *
2661
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
2662
- *
2663
2619
  * ## Attributes & Properties
2664
2620
  *
2665
2621
  * Component attributes and properties that can be applied to the element or by using JavaScript.
2666
2622
  *
2667
- * - `aria-label`/`ariaLabel`: undefined
2668
- * - `aria-description`/`ariaDescription`: undefined
2669
- * - `name`: undefined
2670
- * - `value`: undefined
2671
- * - `placeholder`: undefined
2672
- * - `boundaryValue`: undefined (property only) (readonly)
2673
- * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
2674
- * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
2675
- * - `ariaDescriptionText`: undefined (property only) (readonly)
2623
+ * - `aria-label`/`ariaLabel`: Label for the range input.
2624
+ * - `aria-description`/`ariaDescription`: Contextual information for assistive technology, should it be needed
2625
+ * - `name`: The name of this input field in the form. The canonical source of the value is the text field.
2626
+ * - `value`: The initial value, if any
2627
+ * - `placeholder`: Placeholder in empty text fields
2676
2628
  *
2677
2629
  * ## Events
2678
2630
  *
2679
2631
  * Events that will be emitted by the component.
2680
2632
  *
2681
- * - `thumbreset`: undefined
2682
- * - `slidervalidity`: undefined
2633
+ * - `thumbreset`: Internal event used by (and stopped by) `w-slider`.
2634
+ * - `slidervalidity`: Internal event used by (and stopped by) `w-slider`.
2683
2635
  *
2684
2636
  * ## Methods
2685
2637
  *
@@ -2695,8 +2647,6 @@ export type CustomElements = {
2695
2647
  /**
2696
2648
  * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
2697
2649
  *
2698
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
2699
- *
2700
2650
  * ## Attributes & Properties
2701
2651
  *
2702
2652
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -2706,28 +2656,21 @@ export type CustomElements = {
2706
2656
  * If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
2707
2657
  * - `disabled`: undefined
2708
2658
  * - `open-ended`/`openEnded`: Whether or not to allow values outside the range such as "Before 1950" and "2025+".
2709
- * - `error`: undefined
2710
- * - `help-text`/`helpText`: undefined
2711
- * - `invalid`: undefined
2712
- * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
2713
- * - `min`: undefined
2714
- * - `max`: undefined
2659
+ * - `error`: Validation error text, if any
2660
+ * - `help-text`/`helpText`: Additional description to show below the fieldset
2661
+ * - `invalid`: Sets the form fields and fieldset in an invalid state
2662
+ * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit
2663
+ * - `min`: The minimum allowed value in the range inputs
2664
+ * - `max`: The maximum allowed value in the range inputs
2715
2665
  * - `markers`: Pass a value similar to step to create visual markers at that interval
2716
- * - `step`: undefined
2717
- * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
2718
- * - `hidden-textfield`/`hiddenTextfield`: undefined
2719
- * - `valueFormatter`: Formatter for the tooltip and input mask values. (property only)
2720
- * - `tooltipFormatter`: Replaces valueFormatter for the tooltip. Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. (property only)
2666
+ * - `step`: ets step on the range input to jump between values when dragging
2667
+ * - `suffix`: Suffix used in text input fields and for the min and max values of the slider
2668
+ * - `hidden-textfield`/`hiddenTextfield`: Should only be used in special cases
2669
+ * - `valueFormatter`: Formatter for the tooltip and input mask values (property only)
2670
+ * - `tooltipFormatter`: Overrides valueFormatter for the tooltip.
2671
+ *
2672
+ * Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. (property only)
2721
2673
  * - `labelFormatter`: Formatter for the min and max labels below the range. (property only)
2722
- * - `fieldset`: undefined (property only)
2723
- * - `_invalidMessage`: undefined (property only)
2724
- * - `_hasInternalError`: undefined (property only)
2725
- * - `_showError`: undefined (property only)
2726
- * - `_tabbableElements`: undefined (property only)
2727
- * - `edgeMin`: undefined (property only) (readonly)
2728
- * - `edgeMax`: undefined (property only) (readonly)
2729
- * - `componentHasError`: undefined (property only) (readonly)
2730
- * - `errorText`: undefined (property only) (readonly)
2731
2674
  *
2732
2675
  * ## Slots
2733
2676
  *
@@ -2811,20 +2754,12 @@ export type CustomElements = {
2811
2754
  /**
2812
2755
  * Individual tab component used within w-tabs container.
2813
2756
  *
2814
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
2815
- *
2816
2757
  * ## Attributes & Properties
2817
2758
  *
2818
2759
  * Component attributes and properties that can be applied to the element or by using JavaScript.
2819
2760
  *
2820
- * - `id`: undefined
2821
- * - `for`: undefined
2822
- * - `aria-controls`/`_ariaControlsAttr`: undefined
2823
- * - `aria-selected`/`ariaSelected`: undefined
2824
- * - `active`: undefined
2825
- * - `over`: undefined
2826
- * - `tabIndex`: Override tabIndex setter to set _parentTabIndex (for backwards compatibility). (property only)
2827
- * - `_computedAriaSelected`: Computed aria-selected: prefers parent-managed, falls back to own property (property only) (readonly)
2761
+ * - `for`: The `id` of the `<w-tab-panel>` this tab controls.
2762
+ * - `over`: Whether to show the `icon` slot over the tab title instead of inline.
2828
2763
  */
2829
2764
  "w-tab": Partial<WarpTabProps & BaseProps<WarpTab> & BaseEvents>;
2830
2765
 
@@ -2832,14 +2767,11 @@ export type CustomElements = {
2832
2767
  * Tab panel component that holds content for individual tabs.
2833
2768
  * Each tab panel should have a name that matches a corresponding tab.
2834
2769
  *
2835
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
2836
- *
2837
2770
  * ## Attributes & Properties
2838
2771
  *
2839
2772
  * Component attributes and properties that can be applied to the element or by using JavaScript.
2840
2773
  *
2841
- * - `active`: Whether this panel is active (visible).
2842
- * Set by parent w-tabs via the _parentActive property.
2774
+ * - `id`: Required so `<w-tab>` has something to target.
2843
2775
  */
2844
2776
  "w-tab-panel": Partial<
2845
2777
  WarpTabPanelProps & BaseProps<WarpTabPanel> & BaseEvents
@@ -2848,21 +2780,17 @@ export type CustomElements = {
2848
2780
  /**
2849
2781
  * Tabs are used to organize content by grouping similar information on the same page.
2850
2782
  *
2851
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
2852
- *
2853
2783
  * ## Attributes & Properties
2854
2784
  *
2855
2785
  * Component attributes and properties that can be applied to the element or by using JavaScript.
2856
2786
  *
2857
- * - `active`: undefined
2858
- * - `tabs`: undefined (property only) (readonly)
2859
- * - `activeTab`: undefined (property only) (readonly)
2787
+ * - `active`: The `id` of the panel that should be active.
2860
2788
  *
2861
2789
  * ## Events
2862
2790
  *
2863
2791
  * Events that will be emitted by the component.
2864
2792
  *
2865
- * - `change`: undefined
2793
+ * - `change`: Includes `details.panelId` with the now active tab's ID
2866
2794
  */
2867
2795
  "w-tabs": Partial<WarpTabsProps & BaseProps<WarpTabs> & BaseEvents>;
2868
2796
 
@@ -3210,7 +3138,8 @@ export type CustomElementsSolidJs = {
3210
3138
  >;
3211
3139
 
3212
3140
  /**
3213
- * Breadcrumbs show the navigation structure for the current location.
3141
+ * Shows the navigation structure for the current page.
3142
+ * Renders direct child links and non-link elements as a breadcrumb trail, inserts separators between items, and exposes the trail as navigation.
3214
3143
  *
3215
3144
  * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-breadcrumbs--docs)
3216
3145
  *
@@ -3218,7 +3147,8 @@ export type CustomElementsSolidJs = {
3218
3147
  *
3219
3148
  * Component attributes and properties that can be applied to the element or by using JavaScript.
3220
3149
  *
3221
- * - `ariaLabel`: undefined (property only)
3150
+ * - `ariaLabel`: Accessible label for the breadcrumb navigation.
3151
+ * Defaults to the localized "You are here" label. Set `aria-label` when the default label is not specific enough for the page. (property only)
3222
3152
  */
3223
3153
  "w-breadcrumbs": Partial<
3224
3154
  WarpBreadcrumbsProps &
@@ -3745,28 +3675,22 @@ export type CustomElementsSolidJs = {
3745
3675
  /**
3746
3676
  * Component to place inside a `<w-slider>`.
3747
3677
  *
3748
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
3749
- *
3750
3678
  * ## Attributes & Properties
3751
3679
  *
3752
3680
  * Component attributes and properties that can be applied to the element or by using JavaScript.
3753
3681
  *
3754
- * - `aria-label`/`ariaLabel`: undefined
3755
- * - `aria-description`/`ariaDescription`: undefined
3756
- * - `name`: undefined
3757
- * - `value`: undefined
3758
- * - `placeholder`: undefined
3759
- * - `boundaryValue`: undefined (property only) (readonly)
3760
- * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
3761
- * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
3762
- * - `ariaDescriptionText`: undefined (property only) (readonly)
3682
+ * - `aria-label`/`ariaLabel`: Label for the range input.
3683
+ * - `aria-description`/`ariaDescription`: Contextual information for assistive technology, should it be needed
3684
+ * - `name`: The name of this input field in the form. The canonical source of the value is the text field.
3685
+ * - `value`: The initial value, if any
3686
+ * - `placeholder`: Placeholder in empty text fields
3763
3687
  *
3764
3688
  * ## Events
3765
3689
  *
3766
3690
  * Events that will be emitted by the component.
3767
3691
  *
3768
- * - `thumbreset`: undefined
3769
- * - `slidervalidity`: undefined
3692
+ * - `thumbreset`: Internal event used by (and stopped by) `w-slider`.
3693
+ * - `slidervalidity`: Internal event used by (and stopped by) `w-slider`.
3770
3694
  *
3771
3695
  * ## Methods
3772
3696
  *
@@ -3785,8 +3709,6 @@ export type CustomElementsSolidJs = {
3785
3709
  /**
3786
3710
  * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
3787
3711
  *
3788
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
3789
- *
3790
3712
  * ## Attributes & Properties
3791
3713
  *
3792
3714
  * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -3796,28 +3718,21 @@ export type CustomElementsSolidJs = {
3796
3718
  * If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
3797
3719
  * - `disabled`: undefined
3798
3720
  * - `open-ended`/`openEnded`: Whether or not to allow values outside the range such as "Before 1950" and "2025+".
3799
- * - `error`: undefined
3800
- * - `help-text`/`helpText`: undefined
3801
- * - `invalid`: undefined
3802
- * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
3803
- * - `min`: undefined
3804
- * - `max`: undefined
3721
+ * - `error`: Validation error text, if any
3722
+ * - `help-text`/`helpText`: Additional description to show below the fieldset
3723
+ * - `invalid`: Sets the form fields and fieldset in an invalid state
3724
+ * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit
3725
+ * - `min`: The minimum allowed value in the range inputs
3726
+ * - `max`: The maximum allowed value in the range inputs
3805
3727
  * - `markers`: Pass a value similar to step to create visual markers at that interval
3806
- * - `step`: undefined
3807
- * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
3808
- * - `hidden-textfield`/`hiddenTextfield`: undefined
3809
- * - `valueFormatter`: Formatter for the tooltip and input mask values. (property only)
3810
- * - `tooltipFormatter`: Replaces valueFormatter for the tooltip. Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. (property only)
3728
+ * - `step`: ets step on the range input to jump between values when dragging
3729
+ * - `suffix`: Suffix used in text input fields and for the min and max values of the slider
3730
+ * - `hidden-textfield`/`hiddenTextfield`: Should only be used in special cases
3731
+ * - `valueFormatter`: Formatter for the tooltip and input mask values (property only)
3732
+ * - `tooltipFormatter`: Overrides valueFormatter for the tooltip.
3733
+ *
3734
+ * Use in open-ended sliders to show for example "300+ hk" instead of "Max" in the tooltip. (property only)
3811
3735
  * - `labelFormatter`: Formatter for the min and max labels below the range. (property only)
3812
- * - `fieldset`: undefined (property only)
3813
- * - `_invalidMessage`: undefined (property only)
3814
- * - `_hasInternalError`: undefined (property only)
3815
- * - `_showError`: undefined (property only)
3816
- * - `_tabbableElements`: undefined (property only)
3817
- * - `edgeMin`: undefined (property only) (readonly)
3818
- * - `edgeMax`: undefined (property only) (readonly)
3819
- * - `componentHasError`: undefined (property only) (readonly)
3820
- * - `errorText`: undefined (property only) (readonly)
3821
3736
  *
3822
3737
  * ## Slots
3823
3738
  *
@@ -3916,20 +3831,12 @@ export type CustomElementsSolidJs = {
3916
3831
  /**
3917
3832
  * Individual tab component used within w-tabs container.
3918
3833
  *
3919
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
3920
- *
3921
3834
  * ## Attributes & Properties
3922
3835
  *
3923
3836
  * Component attributes and properties that can be applied to the element or by using JavaScript.
3924
3837
  *
3925
- * - `id`: undefined
3926
- * - `for`: undefined
3927
- * - `aria-controls`/`_ariaControlsAttr`: undefined
3928
- * - `aria-selected`/`ariaSelected`: undefined
3929
- * - `active`: undefined
3930
- * - `over`: undefined
3931
- * - `tabIndex`: Override tabIndex setter to set _parentTabIndex (for backwards compatibility). (property only)
3932
- * - `_computedAriaSelected`: Computed aria-selected: prefers parent-managed, falls back to own property (property only) (readonly)
3838
+ * - `for`: The `id` of the `<w-tab-panel>` this tab controls.
3839
+ * - `over`: Whether to show the `icon` slot over the tab title instead of inline.
3933
3840
  */
3934
3841
  "w-tab": Partial<
3935
3842
  WarpTabProps & WarpTabSolidJsProps & BaseProps<WarpTab> & BaseEvents
@@ -3939,14 +3846,11 @@ export type CustomElementsSolidJs = {
3939
3846
  * Tab panel component that holds content for individual tabs.
3940
3847
  * Each tab panel should have a name that matches a corresponding tab.
3941
3848
  *
3942
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
3943
- *
3944
3849
  * ## Attributes & Properties
3945
3850
  *
3946
3851
  * Component attributes and properties that can be applied to the element or by using JavaScript.
3947
3852
  *
3948
- * - `active`: Whether this panel is active (visible).
3949
- * Set by parent w-tabs via the _parentActive property.
3853
+ * - `id`: Required so `<w-tab>` has something to target.
3950
3854
  */
3951
3855
  "w-tab-panel": Partial<
3952
3856
  WarpTabPanelProps &
@@ -3958,21 +3862,17 @@ export type CustomElementsSolidJs = {
3958
3862
  /**
3959
3863
  * Tabs are used to organize content by grouping similar information on the same page.
3960
3864
  *
3961
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
3962
- *
3963
3865
  * ## Attributes & Properties
3964
3866
  *
3965
3867
  * Component attributes and properties that can be applied to the element or by using JavaScript.
3966
3868
  *
3967
- * - `active`: undefined
3968
- * - `tabs`: undefined (property only) (readonly)
3969
- * - `activeTab`: undefined (property only) (readonly)
3869
+ * - `active`: The `id` of the panel that should be active.
3970
3870
  *
3971
3871
  * ## Events
3972
3872
  *
3973
3873
  * Events that will be emitted by the component.
3974
3874
  *
3975
- * - `change`: undefined
3875
+ * - `change`: Includes `details.panelId` with the now active tab's ID
3976
3876
  */
3977
3877
  "w-tabs": Partial<
3978
3878
  WarpTabsProps & WarpTabsSolidJsProps & BaseProps<WarpTabs> & BaseEvents
@@ -1,11 +1,17 @@
1
1
  import { LitElement, TemplateResult } from 'lit';
2
2
  /**
3
- * Breadcrumbs show the navigation structure for the current location.
3
+ * Shows the navigation structure for the current page.
4
+ * Renders direct child links and non-link elements as a breadcrumb trail, inserts separators between items, and exposes the trail as navigation.
4
5
  *
5
6
  * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-breadcrumbs--docs)
6
7
  */
7
8
  declare class WarpBreadcrumbs extends LitElement {
8
9
  private _internals;
10
+ /**
11
+ * Accessible label for the breadcrumb navigation.
12
+ * Defaults to the localized "You are here" label. Set `aria-label` when the default label is not specific enough for the page.
13
+ */
14
+ ariaLabel: string | null;
9
15
  static styles: import("lit").CSSResult[];
10
16
  constructor();
11
17
  /** @internal */