@warp-ds/elements 2.4.0-next.3 → 2.4.0

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 (36) hide show
  1. package/dist/custom-elements.json +148 -3267
  2. package/dist/index.d.ts +34 -762
  3. package/dist/packages/checkbox/checkbox-group.js +11 -3
  4. package/dist/packages/checkbox/checkbox.js +201 -2572
  5. package/dist/packages/deadtoggle/index.js +51 -2547
  6. package/dist/packages/pageindicator/index.js +44 -28
  7. package/dist/packages/pagination/index.js +183 -2484
  8. package/dist/packages/radio/radio-group-styles.js +3 -3
  9. package/dist/packages/radio/radio-group.js +313 -2619
  10. package/dist/packages/radio/radio-styles.js +0 -1
  11. package/dist/packages/radio/radio.js +109 -2556
  12. package/dist/packages/radio/radio.stories.js +47 -3688
  13. package/dist/packages/slider/slider-thumb.js +400 -2647
  14. package/dist/packages/slider/slider.js +272 -2603
  15. package/dist/packages/stepindicator/index.js +189 -2459
  16. package/dist/packages/tabs/tab.js +91 -2451
  17. package/dist/packages/tabs/tabs.js +251 -2444
  18. package/dist/packages/textarea/textarea.js +210 -2465
  19. package/dist/web-types.json +28 -811
  20. package/package.json +1 -37
  21. package/dist/packages/checkbox/checkbox-group.js.map +0 -7
  22. package/dist/packages/checkbox/checkbox.js.map +0 -7
  23. package/dist/packages/deadtoggle/index.js.map +0 -7
  24. package/dist/packages/pageindicator/index.js.map +0 -7
  25. package/dist/packages/pagination/index.js.map +0 -7
  26. package/dist/packages/radio/radio-group-styles.js.map +0 -7
  27. package/dist/packages/radio/radio-group.js.map +0 -7
  28. package/dist/packages/radio/radio-styles.js.map +0 -7
  29. package/dist/packages/radio/radio.js.map +0 -7
  30. package/dist/packages/radio/radio.stories.js.map +0 -7
  31. package/dist/packages/slider/slider-thumb.js.map +0 -7
  32. package/dist/packages/slider/slider.js.map +0 -7
  33. package/dist/packages/stepindicator/index.js.map +0 -7
  34. package/dist/packages/tabs/tab.js.map +0 -7
  35. package/dist/packages/tabs/tabs.js.map +0 -7
  36. package/dist/packages/textarea/textarea.js.map +0 -7
package/dist/index.d.ts CHANGED
@@ -17,21 +17,8 @@ import type { ModalHeader } from "./packages/modal/modal-header.ts";
17
17
  import type { ModalMain } from "./packages/modal/modal-main.ts";
18
18
  import type { WarpToastContainer } from "./packages/toast/toast-container.ts";
19
19
  import type { WarpDatepicker } from "./packages/datepicker/datepicker.ts";
20
- import type { WarpCombobox } from "./packages/combobox/index.ts";
21
- import type { WarpDeadToggle } from "./packages/deadtoggle/index.ts";
22
- import type { WarpPageIndicator } from "./packages/pageindicator/index.ts";
23
- import type { WarpPagination } from "./packages/pagination/index.ts";
24
- import type { WRadio } from "./packages/radio/radio.ts";
25
- import type { WRadioGroup } from "./packages/radio/radio-group.ts";
26
- import type { WCheckbox } from "./packages/checkbox/checkbox.ts";
27
- import type { WCheckboxGroup } from "./packages/checkbox/checkbox-group.ts";
28
- import type { WarpSliderThumb } from "./packages/slider/slider-thumb.ts";
29
- import type { WarpSlider } from "./packages/slider/slider.ts";
30
- import type { WarpStepIndicator, WarpStep } from "./packages/stepindicator/index.ts";
31
20
  import type { WarpSwitch } from "./packages/switch/index.ts";
32
- import type { WarpTab } from "./packages/tabs/tab.ts";
33
- import type { WarpTabs } from "./packages/tabs/tabs.ts";
34
- import type { WarpTextarea } from "./packages/textarea/textarea.ts";
21
+ import type { WarpCombobox } from "./packages/combobox/index.ts";
35
22
 
36
23
  /**
37
24
  * This type can be used to create scoped tags for your components.
@@ -589,6 +576,21 @@ the query will point to an element that doesn't exist anymore. */
589
576
  }
590
577
 
591
578
 
579
+ export type WarpSwitchProps = {
580
+ /** */
581
+ "name"?: WarpSwitch['name'];
582
+ /** */
583
+ "value"?: WarpSwitch['value'];
584
+ /** */
585
+ "checked"?: WarpSwitch['checked'];
586
+ /** */
587
+ "disabled"?: WarpSwitch['disabled'];
588
+
589
+ /** */
590
+ "onchange"?: (e: CustomEvent<CustomEvent>) => void;
591
+ }
592
+
593
+
592
594
  export type WarpComboboxProps = {
593
595
  /** The available options to select from */
594
596
  "options"?: WarpCombobox['options'];
@@ -632,353 +634,6 @@ export type WarpComboboxProps = {
632
634
  "autocomplete"?: WarpCombobox['autocomplete'];
633
635
 
634
636
 
635
- }
636
-
637
-
638
- export type WarpDeadToggleProps = {
639
- /** */
640
- "type"?: WarpDeadToggle['type'];
641
- /** */
642
- "checked"?: WarpDeadToggle['checked'];
643
- /** */
644
- "indeterminate"?: WarpDeadToggle['indeterminate'];
645
- /** */
646
- "invalid"?: WarpDeadToggle['invalid'];
647
- /** */
648
- "disabled"?: WarpDeadToggle['disabled'];
649
-
650
-
651
- }
652
-
653
-
654
- export type WarpPageIndicatorProps = {
655
- /** Currently selected page (1-based index) */
656
- "selected-page"?: WarpPageIndicator['selectedPage'];
657
- /** Currently selected page (1-based index) */
658
- "selectedPage"?: WarpPageIndicator['selectedPage'];
659
- /** Total number of pages */
660
- "page-count"?: WarpPageIndicator['pageCount'];
661
- /** Total number of pages */
662
- "pageCount"?: WarpPageIndicator['pageCount'];
663
-
664
-
665
- }
666
-
667
-
668
- export type WarpPaginationProps = {
669
- /** */
670
- "base-url"?: WarpPagination['baseUrl'];
671
- /** */
672
- "baseUrl"?: WarpPagination['baseUrl'];
673
- /** */
674
- "pages"?: WarpPagination['pages'];
675
- /** */
676
- "current-page"?: WarpPagination['currentPageNumber'];
677
- /** */
678
- "currentPageNumber"?: WarpPagination['currentPageNumber'];
679
- /** */
680
- "visible-pages"?: WarpPagination['visiblePages'];
681
- /** */
682
- "visiblePages"?: WarpPagination['visiblePages'];
683
-
684
- /** Triggered when a link button in the pagination is clicked. Contains the page number in `string` form. */
685
- "onpage-click"?: (e: CustomEvent<CustomEvent>) => void;
686
- }
687
-
688
-
689
- export type WRadioProps = {
690
- /** The string pointing to a form's id. */
691
- "form"?: WRadio['form'];
692
- /** The radio's value. When selected, the radio group will receive this value. */
693
- "value"?: WRadio['value'];
694
- /** The radio's value. When selected, the radio group will receive this value. */
695
- "appearance"?: WRadio['appearance'];
696
- /** The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
697
- attribute can typically be omitted. */
698
- "size"?: WRadio['size'];
699
- /** Disables the radio. */
700
- "disabled"?: WRadio['disabled'];
701
- /** */
702
- "checked"?: WRadio['checked'];
703
-
704
-
705
- }
706
-
707
-
708
- export type WRadioGroupProps = {
709
- /** The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
710
- instead. */
711
- "label"?: WRadioGroup['label'];
712
- /** The radio groups's hint. If you need to display HTML, use the `hint` slot instead. */
713
- "hint"?: WRadioGroup['hint'];
714
- /** The name of the radio group, submitted as a name/value pair with form data. */
715
- "name"?: WRadioGroup['name'];
716
- /** Disables the radio group and all child radios. */
717
- "disabled"?: WRadioGroup['disabled'];
718
- /** The orientation in which to show radio items. */
719
- "orientation"?: WRadioGroup['orientation'];
720
- /** The default value of the form control. Primarily used for resetting the form control. */
721
- "value"?: WRadioGroup['defaultValue'];
722
- /** The default value of the form control. Primarily used for resetting the form control. */
723
- "defaultValue"?: WRadioGroup['defaultValue'];
724
- /** The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overridden. */
725
- "size"?: WRadioGroup['size'];
726
- /** Ensures a child radio is checked before allowing the containing form to submit. */
727
- "required"?: WRadioGroup['required'];
728
- /** Used for SSR. if true, will show slotted label on initial render. */
729
- "with-label"?: WRadioGroup['withLabel'];
730
- /** Used for SSR. if true, will show slotted label on initial render. */
731
- "withLabel"?: WRadioGroup['withLabel'];
732
- /** Used for SSR. if true, will show slotted hint on initial render. */
733
- "with-hint"?: WRadioGroup['withHint'];
734
- /** Used for SSR. if true, will show slotted hint on initial render. */
735
- "withHint"?: WRadioGroup['withHint'];
736
- /** */
737
- "hasRadioButtons"?: WRadioGroup['hasRadioButtons'];
738
- /** */
739
- "defaultSlot"?: WRadioGroup['defaultSlot'];
740
-
741
- /** */
742
- "oninput"?: (e: CustomEvent<InputEvent>) => void;
743
- /** */
744
- "onchange"?: (e: CustomEvent<Event>) => void;
745
- }
746
-
747
-
748
- export type WCheckboxProps = {
749
- /** */
750
- "title"?: WCheckbox['title'];
751
- /** The name of the checkbox, submitted as a name/value pair with form data. */
752
- "name"?: WCheckbox['name'];
753
- /** The value of the checkbox, submitted as a name/value pair with form data. */
754
- "value"?: WCheckbox['value'];
755
- /** The checkbox's size. */
756
- "size"?: WCheckbox['size'];
757
- /** Disables the checkbox. */
758
- "disabled"?: WCheckbox['disabled'];
759
- /** Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
760
- all/none" behavior when associated checkboxes have a mix of checked and unchecked states. */
761
- "indeterminate"?: WCheckbox['indeterminate'];
762
- /** The default value of the form control. Primarily used for resetting the form control. */
763
- "checked"?: WCheckbox['defaultChecked'];
764
- /** The default value of the form control. Primarily used for resetting the form control. */
765
- "defaultChecked"?: WCheckbox['defaultChecked'];
766
- /** By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
767
- to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
768
- the same document or shadow root for this to work. */
769
- "form"?: WCheckbox['form'];
770
- /** Makes the checkbox a required field. */
771
- "required"?: WCheckbox['required'];
772
- /** The checkbox's hint. If you need to display HTML, use the `hint` slot instead. */
773
- "hint"?: WCheckbox['hint'];
774
- /** */
775
- "input"?: WCheckbox['input'];
776
-
777
- /** */
778
- "onchange"?: (e: CustomEvent<Event>) => void;
779
- }
780
-
781
-
782
- export type WCheckboxGroupProps = {
783
-
784
-
785
- }
786
-
787
-
788
- export type WarpSliderThumbProps = {
789
- /** */
790
- "aria-label"?: WarpSliderThumb['ariaLabel'];
791
- /** */
792
- "ariaLabel"?: WarpSliderThumb['ariaLabel'];
793
- /** */
794
- "aria-description"?: WarpSliderThumb['ariaDescription'];
795
- /** */
796
- "ariaDescription"?: WarpSliderThumb['ariaDescription'];
797
- /** */
798
- "label"?: WarpSliderThumb['label'];
799
- /** */
800
- "name"?: WarpSliderThumb['name'];
801
- /** */
802
- "value"?: WarpSliderThumb['value'];
803
- /** */
804
- "disabled"?: WarpSliderThumb['disabled'];
805
- /** */
806
- "invalid"?: WarpSliderThumb['invalid'];
807
- /** Set by `<w-slider>` */
808
- "allowValuesOutsideRange"?: WarpSliderThumb['allowValuesOutsideRange'];
809
- /** Set by `<w-slider>` */
810
- "markers"?: WarpSliderThumb['markers'];
811
- /** Set by `<w-slider>` */
812
- "required"?: WarpSliderThumb['required'];
813
- /** Set by `<w-slider>` */
814
- "step"?: WarpSliderThumb['step'];
815
- /** Set by `<w-slider>` */
816
- "min"?: WarpSliderThumb['min'];
817
- /** Set by `<w-slider>` */
818
- "max"?: WarpSliderThumb['max'];
819
- /** Set by `<w-slider>` */
820
- "suffix"?: WarpSliderThumb['suffix'];
821
- /** JS hook to help you format the numeric value how you want. */
822
- "formatter"?: WarpSliderThumb['formatter'];
823
- /** */
824
- "range"?: WarpSliderThumb['range'];
825
- /** */
826
- "textfield"?: WarpSliderThumb['textfield'];
827
-
828
- /** */
829
- "onslidervalidity"?: (e: CustomEvent<CustomEvent>) => void;
830
- }
831
-
832
-
833
- export type WarpSliderProps = {
834
- /** The slider fieldset label. Required for proper accessibility.
835
-
836
- If you need to display HTML, use the `label` slot instead. */
837
- "label"?: WarpSlider['label'];
838
- /** */
839
- "disabled"?: WarpSlider['disabled'];
840
- /** */
841
- "allow-values-outside-range"?: WarpSlider['allowValuesOutsideRange'];
842
- /** */
843
- "allowValuesOutsideRange"?: WarpSlider['allowValuesOutsideRange'];
844
- /** */
845
- "error"?: WarpSlider['error'];
846
- /** */
847
- "help-text"?: WarpSlider['helpText'];
848
- /** */
849
- "helpText"?: WarpSlider['helpText'];
850
- /** */
851
- "invalid"?: WarpSlider['invalid'];
852
- /** Ensures a child slider thumb has a value before allowing the containing form to submit. */
853
- "required"?: WarpSlider['required'];
854
- /** */
855
- "min"?: WarpSlider['min'];
856
- /** */
857
- "max"?: WarpSlider['max'];
858
- /** Pass a value similar to step to create visual markers at that interval */
859
- "markers"?: WarpSlider['markers'];
860
- /** */
861
- "step"?: WarpSlider['step'];
862
- /** Suffix used in text input fields and for the min and max values of the slider. */
863
- "suffix"?: WarpSlider['suffix'];
864
- /** Function to format the to- and from labels and value in the slider thumb tooltip. */
865
- "formatter"?: WarpSlider['formatter'];
866
- /** */
867
- "_invalidMessage"?: WarpSlider['_invalidMessage'];
868
- /** */
869
- "_hasInternalError"?: WarpSlider['_hasInternalError'];
870
-
871
-
872
- }
873
-
874
-
875
- export type WarpStepIndicatorProps = {
876
- /** */
877
- "horizontal"?: WarpStepIndicator['horizontal'];
878
- /** */
879
- "right"?: WarpStepIndicator['right'];
880
-
881
-
882
- }
883
-
884
-
885
- export type WarpStepProps = {
886
- /** */
887
- "active"?: WarpStep['active'];
888
- /** */
889
- "completed"?: WarpStep['completed'];
890
-
891
-
892
- }
893
-
894
-
895
- export type WarpSwitchProps = {
896
- /** */
897
- "name"?: WarpSwitch['name'];
898
- /** */
899
- "value"?: WarpSwitch['value'];
900
- /** */
901
- "checked"?: WarpSwitch['checked'];
902
- /** */
903
- "disabled"?: WarpSwitch['disabled'];
904
-
905
- /** */
906
- "onchange"?: (e: CustomEvent<CustomEvent>) => void;
907
- }
908
-
909
-
910
- export type WarpTabProps = {
911
- /** */
912
- "name"?: WarpTab['name'];
913
- /** */
914
- "label"?: WarpTab['label'];
915
- /** */
916
- "active"?: WarpTab['active'];
917
- /** */
918
- "over"?: WarpTab['over'];
919
- /** */
920
- "tab-class"?: WarpTab['tabClass'];
921
- /** */
922
- "tabClass"?: WarpTab['tabClass'];
923
-
924
-
925
- }
926
-
927
-
928
- export type WarpTabsProps = {
929
- /** */
930
- "active"?: WarpTabs['active'];
931
- /** */
932
- "tab-class"?: WarpTabs['tabClass'];
933
- /** */
934
- "tabClass"?: WarpTabs['tabClass'];
935
-
936
- /** */
937
- "onchange"?: (e: CustomEvent<CustomEvent>) => void;
938
- }
939
-
940
-
941
- export type WarpTextareaProps = {
942
- /** */
943
- "disabled"?: WarpTextarea['disabled'];
944
- /** */
945
- "invalid"?: WarpTextarea['invalid'];
946
- /** */
947
- "label"?: WarpTextarea['label'];
948
- /** */
949
- "help-text"?: WarpTextarea['helpText'];
950
- /** */
951
- "helpText"?: WarpTextarea['helpText'];
952
- /** */
953
- "maximum-rows"?: WarpTextarea['maxRows'];
954
- /** */
955
- "maxRows"?: WarpTextarea['maxRows'];
956
- /** */
957
- "minimum-rows"?: WarpTextarea['minRows'];
958
- /** */
959
- "minRows"?: WarpTextarea['minRows'];
960
- /** */
961
- "name"?: WarpTextarea['name'];
962
- /** */
963
- "placeholder"?: WarpTextarea['placeholder'];
964
- /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`. */
965
- "read-only"?: WarpTextarea['readOnly'];
966
- /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`. */
967
- "readOnly"?: WarpTextarea['readOnly'];
968
- /** */
969
- "readonly"?: WarpTextarea['readonly'];
970
- /** */
971
- "required"?: WarpTextarea['required'];
972
- /** */
973
- "value"?: WarpTextarea['value'];
974
- /** */
975
- "optional"?: WarpTextarea['optional'];
976
- /** */
977
- "minHeight"?: WarpTextarea['minHeight'];
978
- /** */
979
- "maxHeight"?: WarpTextarea['maxHeight'];
980
-
981
-
982
637
  }
983
638
 
984
639
  export type CustomElements = {
@@ -1487,347 +1142,6 @@ export type WarpTextareaProps = {
1487
1142
  "w-datepicker": Partial<WarpDatepickerProps & BaseProps<WarpDatepicker> & BaseEvents>;
1488
1143
 
1489
1144
 
1490
- /**
1491
- * A combobox element for text input with selectable options.
1492
- *
1493
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-combobox--docs)
1494
- *
1495
- * ## Attributes & Properties
1496
- *
1497
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1498
- *
1499
- * - `options`: The available options to select from
1500
- * - `label`: Label above input
1501
- * - `placeholder`: Input placeholder
1502
- * - `value`: The input value
1503
- * - `open-on-focus`/`openOnFocus`: Whether the popover opens when focus is on the text field
1504
- * - `select-on-blur`/`selectOnBlur`: Select active option on blur
1505
- * - `match-text-segments`/`matchTextSegments`: Whether the matching text segments in the options should be highlighted
1506
- * - `disable-static-filtering`/`disableStaticFiltering`: Disable client-side static filtering
1507
- * - `invalid`: Renders the input field in an invalid state
1508
- * - `help-text`/`helpText`: The content to display as the help text
1509
- * - `disabled`: Whether the element is disabled
1510
- * - `required`: Whether the element is required
1511
- * - `optional`: Whether to show optional text
1512
- * - `name`: Name attribute for form submission
1513
- * - `autocomplete`: Autocomplete attribute for the input field
1514
- *
1515
- * ## Methods
1516
- *
1517
- * Methods that can be called to access component functionality.
1518
- *
1519
- * - `resetFormControl() => void`: undefined
1520
- */
1521
- "w-combobox": Partial<WarpComboboxProps & BaseProps<WarpCombobox> & BaseEvents>;
1522
-
1523
-
1524
- /**
1525
- * Dead toggle can be used where the appearance of a checkbox or radio is needed - but for accessibility purposes an actual input element should not be present.
1526
- *
1527
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-dead-toggle--docs)
1528
- *
1529
- * ## Attributes & Properties
1530
- *
1531
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1532
- *
1533
- * - `type`: undefined
1534
- * - `checked`: undefined
1535
- * - `indeterminate`: undefined
1536
- * - `invalid`: undefined
1537
- * - `disabled`: undefined
1538
- */
1539
- "w-dead-toggle": Partial<WarpDeadToggleProps & BaseProps<WarpDeadToggle> & BaseEvents>;
1540
-
1541
-
1542
- /**
1543
- *
1544
- *
1545
- * ## Attributes & Properties
1546
- *
1547
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1548
- *
1549
- * - `selected-page`/`selectedPage`: Currently selected page (1-based index)
1550
- * - `page-count`/`pageCount`: Total number of pages
1551
- */
1552
- "w-pageindicator": Partial<WarpPageIndicatorProps & BaseProps<WarpPageIndicator> & BaseEvents>;
1553
-
1554
-
1555
- /**
1556
- * Pagination allows users to navigate through multiple pages of content by providing navigation controls with page numbers and directional arrows.
1557
- *
1558
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/navigation-pagination--docs)
1559
- *
1560
- * ## Attributes & Properties
1561
- *
1562
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1563
- *
1564
- * - `base-url`/`baseUrl`: undefined
1565
- * - `pages`: undefined
1566
- * - `current-page`/`currentPageNumber`: undefined
1567
- * - `visible-pages`/`visiblePages`: undefined
1568
- *
1569
- * ## Events
1570
- *
1571
- * Events that will be emitted by the component.
1572
- *
1573
- * - `page-click`: Triggered when a link button in the pagination is clicked. Contains the page number in `string` form.
1574
- */
1575
- "w-pagination": Partial<WarpPaginationProps & BaseProps<WarpPagination> & BaseEvents>;
1576
-
1577
-
1578
- /**
1579
- *
1580
- *
1581
- * ## Attributes & Properties
1582
- *
1583
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1584
- *
1585
- * - `form`: The string pointing to a form's id.
1586
- * - `value`: The radio's value. When selected, the radio group will receive this value.
1587
- * - `appearance`: The radio's value. When selected, the radio group will receive this value.
1588
- * - `size`: The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
1589
- * attribute can typically be omitted.
1590
- * - `disabled`: Disables the radio.
1591
- * - `checked`: undefined (property only)
1592
- *
1593
- * ## Methods
1594
- *
1595
- * Methods that can be called to access component functionality.
1596
- *
1597
- * - `setValue() => void`: undefined
1598
- */
1599
- "w-radio": Partial<WRadioProps & BaseProps<WRadio> & BaseEvents>;
1600
-
1601
-
1602
- /**
1603
- *
1604
- *
1605
- * ## Attributes & Properties
1606
- *
1607
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1608
- *
1609
- * - `label`: The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
1610
- * instead.
1611
- * - `hint`: The radio groups's hint. If you need to display HTML, use the `hint` slot instead.
1612
- * - `name`: The name of the radio group, submitted as a name/value pair with form data.
1613
- * - `disabled`: Disables the radio group and all child radios.
1614
- * - `orientation`: The orientation in which to show radio items.
1615
- * - `value`/`defaultValue`: The default value of the form control. Primarily used for resetting the form control.
1616
- * - `size`: The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overridden.
1617
- * - `required`: Ensures a child radio is checked before allowing the containing form to submit.
1618
- * - `with-label`/`withLabel`: Used for SSR. if true, will show slotted label on initial render.
1619
- * - `with-hint`/`withHint`: Used for SSR. if true, will show slotted hint on initial render.
1620
- * - `hasRadioButtons`: undefined (property only)
1621
- * - `defaultSlot`: undefined (property only)
1622
- * - `value`: The current value of the radio group, submitted as a name/value pair with form data. (property only)
1623
- * - `validationTarget`: We use the first available radio as the validationTarget similar to native HTML that shows the validation popup on
1624
- * the first radio element. (property only) (readonly)
1625
- *
1626
- * ## Events
1627
- *
1628
- * Events that will be emitted by the component.
1629
- *
1630
- * - `input`: undefined
1631
- * - `change`: undefined
1632
- *
1633
- * ## Slots
1634
- *
1635
- * Areas where markup can be added to the component.
1636
- *
1637
- * - `label`: Alternative to the `label` attribute should you need custom HTML.
1638
- *
1639
- * ## Methods
1640
- *
1641
- * Methods that can be called to access component functionality.
1642
- *
1643
- * - `formResetCallback(args: Parameters<BaseFormAssociatedElement['formResetCallback']>) => void`: undefined
1644
- * - `focus(options?: FocusOptions) => void`: Sets focus on the radio group.
1645
- */
1646
- "w-radio-group": Partial<WRadioGroupProps & BaseProps<WRadioGroup> & BaseEvents>;
1647
-
1648
-
1649
- /**
1650
- *
1651
- *
1652
- * ## Attributes & Properties
1653
- *
1654
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1655
- *
1656
- * - `title`: undefined
1657
- * - `name`: The name of the checkbox, submitted as a name/value pair with form data.
1658
- * - `value`: The value of the checkbox, submitted as a name/value pair with form data.
1659
- * - `size`: The checkbox's size.
1660
- * - `disabled`: Disables the checkbox.
1661
- * - `indeterminate`: Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
1662
- * all/none" behavior when associated checkboxes have a mix of checked and unchecked states.
1663
- * - `checked`/`defaultChecked`: The default value of the form control. Primarily used for resetting the form control.
1664
- * - `form`: By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
1665
- * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
1666
- * the same document or shadow root for this to work.
1667
- * - `required`: Makes the checkbox a required field.
1668
- * - `hint`: The checkbox's hint. If you need to display HTML, use the `hint` slot instead.
1669
- * - `input`: undefined (property only)
1670
- * - `checked`: Draws the checkbox in a checked state. (property only)
1671
- *
1672
- * ## Events
1673
- *
1674
- * Events that will be emitted by the component.
1675
- *
1676
- * - `change`: undefined
1677
- *
1678
- * ## Methods
1679
- *
1680
- * Methods that can be called to access component functionality.
1681
- *
1682
- * - `handleDefaultCheckedChange() => void`: undefined
1683
- * - `handleValueOrCheckedChange() => void`: undefined
1684
- * - `handleStateChange() => void`: undefined
1685
- * - `handleDisabledChange() => void`: undefined
1686
- * - `formResetCallback() => void`: undefined
1687
- * - `click() => void`: Simulates a click on the checkbox.
1688
- * - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox.
1689
- * - `blur() => void`: Removes focus from the checkbox.
1690
- */
1691
- "w-checkbox": Partial<WCheckboxProps & BaseProps<WCheckbox> & BaseEvents>;
1692
-
1693
-
1694
- /**
1695
- *
1696
- */
1697
- "w-checkbox-group": Partial<WCheckboxGroupProps & BaseProps<WCheckboxGroup> & BaseEvents>;
1698
-
1699
-
1700
- /**
1701
- * Component to place inside a `<w-slider>`.
1702
- *
1703
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
1704
- *
1705
- * ## Attributes & Properties
1706
- *
1707
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1708
- *
1709
- * - `aria-label`/`ariaLabel`: undefined
1710
- * - `aria-description`/`ariaDescription`: undefined
1711
- * - `label`: undefined
1712
- * - `name`: undefined
1713
- * - `value`: undefined
1714
- * - `disabled`: undefined
1715
- * - `invalid`: undefined
1716
- * - `allowValuesOutsideRange`: Set by `<w-slider>` (property only)
1717
- * - `markers`: Set by `<w-slider>` (property only)
1718
- * - `required`: Set by `<w-slider>` (property only)
1719
- * - `step`: Set by `<w-slider>` (property only)
1720
- * - `min`: Set by `<w-slider>` (property only)
1721
- * - `max`: Set by `<w-slider>` (property only)
1722
- * - `suffix`: Set by `<w-slider>` (property only)
1723
- * - `formatter`: JS hook to help you format the numeric value how you want. (property only)
1724
- * - `range`: undefined (property only)
1725
- * - `textfield`: undefined (property only)
1726
- * - `boundaryValue`: undefined (property only) (readonly)
1727
- * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
1728
- * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
1729
- *
1730
- * ## Events
1731
- *
1732
- * Events that will be emitted by the component.
1733
- *
1734
- * - `slidervalidity`: undefined
1735
- *
1736
- * ## Methods
1737
- *
1738
- * Methods that can be called to access component functionality.
1739
- *
1740
- * - `resetFormControl() => void`: undefined
1741
- * - `updateFieldAfterValidation() => void`: undefined
1742
- */
1743
- "w-slider-thumb": Partial<WarpSliderThumbProps & BaseProps<WarpSliderThumb> & BaseEvents>;
1744
-
1745
-
1746
- /**
1747
- * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
1748
- *
1749
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
1750
- *
1751
- * ## Attributes & Properties
1752
- *
1753
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1754
- *
1755
- * - `label`: The slider fieldset label. Required for proper accessibility.
1756
- *
1757
- * If you need to display HTML, use the `label` slot instead.
1758
- * - `disabled`: undefined
1759
- * - `allow-values-outside-range`/`allowValuesOutsideRange`: undefined
1760
- * - `error`: undefined
1761
- * - `help-text`/`helpText`: undefined
1762
- * - `invalid`: undefined
1763
- * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
1764
- * - `min`: undefined
1765
- * - `max`: undefined
1766
- * - `markers`: Pass a value similar to step to create visual markers at that interval
1767
- * - `step`: undefined
1768
- * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
1769
- * - `formatter`: Function to format the to- and from labels and value in the slider thumb tooltip. (property only)
1770
- * - `_invalidMessage`: undefined (property only)
1771
- * - `_hasInternalError`: undefined (property only)
1772
- * - `edgeMin`: undefined (property only) (readonly)
1773
- * - `edgeMax`: undefined (property only) (readonly)
1774
- * - `componentHasError`: undefined (property only) (readonly)
1775
- * - `errorText`: undefined (property only) (readonly)
1776
- *
1777
- * ## Slots
1778
- *
1779
- * Areas where markup can be added to the component.
1780
- *
1781
- * - `(default)`: For single sliders place a `<w-slider-thumb>` in the default slot.
1782
- * - `label`: Label for the slider or range slider as a whole.
1783
- * - `description`: Optional description between the label and slider.
1784
- * - `from`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
1785
- * - `to`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
1786
- */
1787
- "w-slider": Partial<WarpSliderProps & BaseProps<WarpSlider> & BaseEvents>;
1788
-
1789
-
1790
- /**
1791
- * Steps are used to show progress through a process or to guide users through a multi-step task.
1792
- *
1793
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/components-steps--docs)
1794
- *
1795
- * ## Attributes & Properties
1796
- *
1797
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1798
- *
1799
- * - `horizontal`: undefined
1800
- * - `right`: undefined
1801
- *
1802
- * ## Methods
1803
- *
1804
- * Methods that can be called to access component functionality.
1805
- *
1806
- * - `updateStepsContext() => void`: undefined
1807
- */
1808
- "w-step-indicator": Partial<WarpStepIndicatorProps & BaseProps<WarpStepIndicator> & BaseEvents>;
1809
-
1810
-
1811
- /**
1812
- * Individual step component that shows a single step in a process
1813
- *
1814
- * ## Attributes & Properties
1815
- *
1816
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1817
- *
1818
- * - `active`: undefined
1819
- * - `completed`: undefined
1820
- *
1821
- * ## Methods
1822
- *
1823
- * Methods that can be called to access component functionality.
1824
- *
1825
- * - `setContext(context: StepsContext) => void`: undefined
1826
- * - `getAriaLabel() => void`: undefined
1827
- */
1828
- "w-step": Partial<WarpStepProps & BaseProps<WarpStep> & BaseEvents>;
1829
-
1830
-
1831
1145
  /**
1832
1146
  *
1833
1147
  *
@@ -1856,79 +1170,37 @@ export type WarpTextareaProps = {
1856
1170
 
1857
1171
 
1858
1172
  /**
1859
- * Individual tab component used within w-tabs container.
1860
- *
1861
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
1862
- *
1863
- * ## Attributes & Properties
1864
- *
1865
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1866
- *
1867
- * - `name`: undefined
1868
- * - `label`: undefined
1869
- * - `active`: undefined
1870
- * - `over`: undefined
1871
- * - `tab-class`/`tabClass`: undefined
1872
- */
1873
- "w-tab": Partial<WarpTabProps & BaseProps<WarpTab> & BaseEvents>;
1874
-
1875
-
1876
- /**
1877
- * Tabs are used to organize content by grouping similar information on the same page.
1878
- *
1879
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
1880
- *
1881
- * ## Attributes & Properties
1882
- *
1883
- * Component attributes and properties that can be applied to the element or by using JavaScript.
1884
- *
1885
- * - `active`: undefined
1886
- * - `tab-class`/`tabClass`: undefined
1887
- * - `tabs`: undefined (property only) (readonly)
1888
- * - `activeTab`: undefined (property only) (readonly)
1889
- *
1890
- * ## Events
1891
- *
1892
- * Events that will be emitted by the component.
1893
- *
1894
- * - `change`: undefined
1895
- */
1896
- "w-tabs": Partial<WarpTabsProps & BaseProps<WarpTabs> & BaseEvents>;
1897
-
1898
-
1899
- /**
1900
- * A single line text input element.
1173
+ * A combobox element for text input with selectable options.
1901
1174
  *
1902
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-textfield--docs)
1175
+ * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-combobox--docs)
1903
1176
  *
1904
1177
  * ## Attributes & Properties
1905
1178
  *
1906
1179
  * Component attributes and properties that can be applied to the element or by using JavaScript.
1907
1180
  *
1908
- * - `disabled`: undefined
1909
- * - `invalid`: undefined
1910
- * - `label`: undefined
1911
- * - `help-text`/`helpText`: undefined
1912
- * - `maximum-rows`/`maxRows`: undefined
1913
- * - `minimum-rows`/`minRows`: undefined
1914
- * - `name`: undefined
1915
- * - `placeholder`: undefined
1916
- * - `read-only`/`readOnly`: undefined
1917
- * - `readonly`: undefined
1918
- * - `required`: undefined
1919
- * - `value`: undefined
1920
- * - `optional`: undefined
1921
- * - `minHeight`: undefined (property only)
1922
- * - `maxHeight`: undefined (property only)
1181
+ * - `options`: The available options to select from
1182
+ * - `label`: Label above input
1183
+ * - `placeholder`: Input placeholder
1184
+ * - `value`: The input value
1185
+ * - `open-on-focus`/`openOnFocus`: Whether the popover opens when focus is on the text field
1186
+ * - `select-on-blur`/`selectOnBlur`: Select active option on blur
1187
+ * - `match-text-segments`/`matchTextSegments`: Whether the matching text segments in the options should be highlighted
1188
+ * - `disable-static-filtering`/`disableStaticFiltering`: Disable client-side static filtering
1189
+ * - `invalid`: Renders the input field in an invalid state
1190
+ * - `help-text`/`helpText`: The content to display as the help text
1191
+ * - `disabled`: Whether the element is disabled
1192
+ * - `required`: Whether the element is required
1193
+ * - `optional`: Whether to show optional text
1194
+ * - `name`: Name attribute for form submission
1195
+ * - `autocomplete`: Autocomplete attribute for the input field
1923
1196
  *
1924
1197
  * ## Methods
1925
1198
  *
1926
1199
  * Methods that can be called to access component functionality.
1927
1200
  *
1928
1201
  * - `resetFormControl() => void`: undefined
1929
- * - `handler(e: InputEvent) => void`: undefined
1930
1202
  */
1931
- "w-textarea": Partial<WarpTextareaProps & BaseProps<WarpTextarea> & BaseEvents>;
1203
+ "w-combobox": Partial<WarpComboboxProps & BaseProps<WarpCombobox> & BaseEvents>;
1932
1204
  }
1933
1205
 
1934
1206
  export type CustomCssProperties = {