@warp-ds/elements 2.8.0-next.2 → 2.8.0-next.3

package/dist/index.d.ts

@@ -8,6 +8,8 @@ import type { WarpBadge } from "./packages/badge/badge.ts";
 import type { WarpBox } from "./packages/box/box.ts";
 import type { WarpBreadcrumbs } from "./packages/breadcrumbs/breadcrumbs.ts";
 import type { WarpCard } from "./packages/card/card.ts";
+import type { WCheckbox } from "./packages/checkbox/checkbox.ts";
+import type { WCheckboxGroup } from "./packages/checkbox-group/checkbox-group.ts";
 import type { WarpCombobox } from "./packages/combobox/combobox.ts";
 import type { WarpDatepicker } from "./packages/datepicker/datepicker.ts";
 import type { WarpExpandable } from "./packages/expandable/expandable.ts";
@@ -17,7 +19,12 @@ import type { ModalHeader } from "./packages/modal-header/modal-header.ts";
 import type { WarpPageIndicator } from "./packages/page-indicator/page-indicator.ts";
 import type { WarpPagination } from "./packages/pagination/pagination.ts";
 import type { WarpPill } from "./packages/pill/pill.ts";
+import type { WRadio } from "./packages/radio/radio.ts";
+import type { WRadioGroup } from "./packages/radio-group/radio-group.ts";
 import type { WarpSelect } from "./packages/select/select.ts";
+import type { WarpTextField } from "./packages/textfield/textfield.ts";
+import type { WarpSliderThumb } from "./packages/slider-thumb/slider-thumb.ts";
+import type { WarpSlider } from "./packages/slider/slider.ts";
 import type { WarpStep } from "./packages/step/step.ts";
 import type { WarpStepIndicator } from "./packages/step-indicator/step-indicator.ts";
 import type { WarpSwitch } from "./packages/switch/switch.ts";
@@ -25,12 +32,7 @@ import type { WarpTab } from "./packages/tab/tab.ts";
 import type { WarpTabPanel } from "./packages/tab-panel/tab-panel.ts";
 import type { WarpTabs } from "./packages/tabs/tabs.ts";
 import type { WarpTextarea } from "./packages/textarea/textarea.ts";
-import type { WarpTextField } from "./packages/textfield/textfield.ts";
 import type { WarpToastContainer } from "./packages/toast-container/toast-container.ts";
-import type { WCheckbox } from "./packages/checkbox/checkbox.ts";
-import type { WCheckboxGroup } from "./packages/checkbox-group/checkbox-group.ts";
-import type { WarpSliderThumb } from "./packages/slider-thumb/slider-thumb.ts";
-import type { WarpSlider } from "./packages/slider/slider.ts";
 
 /**
  * This type can be used to create scoped tags for your components.
@@ -494,6 +496,93 @@ export type WarpCardSolidJsProps = {
   textContent?: string | number;
 };
 
+export type WCheckboxProps = {
+  /** The name of the checkbox, submitted as a name/value pair with form data. */
+  name?: WCheckbox["name"];
+  /** The value of the checkbox, submitted as a name/value pair with form data. */
+  value?: WCheckbox["value"];
+  /** Draws the checkbox in an indeterminate state. */
+  indeterminate?: WCheckbox["indeterminate"];
+  /** Draws the checkbox in a checked state (reflected to attribute). */
+  checked?: WCheckbox["checked"];
+  /** Disables the checkbox. */
+  disabled?: WCheckbox["disabled"];
+  /** Makes the checkbox a required field. */
+  required?: WCheckbox["required"];
+  /** Draws the checkbox in an invalid state. */
+  invalid?: WCheckbox["invalid"];
+  /**  */
+  input?: WCheckbox["input"];
+
+  /**  */
+  onchange?: (e: Event) => void;
+};
+
+export type WCheckboxSolidJsProps = {
+  /** The name of the checkbox, submitted as a name/value pair with form data. */
+  "prop:name"?: WCheckbox["name"];
+  /** The value of the checkbox, submitted as a name/value pair with form data. */
+  "prop:value"?: WCheckbox["value"];
+  /** Draws the checkbox in an indeterminate state. */
+  "prop:indeterminate"?: WCheckbox["indeterminate"];
+  /** Draws the checkbox in a checked state (reflected to attribute). */
+  "prop:checked"?: WCheckbox["checked"];
+  /** Disables the checkbox. */
+  "prop:disabled"?: WCheckbox["disabled"];
+  /** Makes the checkbox a required field. */
+  "prop:required"?: WCheckbox["required"];
+  /** Draws the checkbox in an invalid state. */
+  "prop:invalid"?: WCheckbox["invalid"];
+  /**  */
+  "prop:input"?: WCheckbox["input"];
+  /**  */
+  "on:change"?: (e: Event) => void;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WCheckboxGroupProps = {
+  /** The group label displayed above the checkboxes. */
+  label?: WCheckboxGroup["label"];
+  /** The name applied to child checkboxes when they do not provide one. */
+  name?: WCheckboxGroup["name"];
+  /** Whether to show optional text next to the label. */
+  optional?: WCheckboxGroup["optional"];
+  /**  */
+  "help-text"?: WCheckboxGroup["helpText"];
+  /**  */
+  helpText?: WCheckboxGroup["helpText"];
+  /** Makes the checkbox group required. */
+  required?: WCheckboxGroup["required"];
+  /** Marks the checkbox group as invalid. */
+  invalid?: WCheckboxGroup["invalid"];
+};
+
+export type WCheckboxGroupSolidJsProps = {
+  /** The group label displayed above the checkboxes. */
+  "prop:label"?: WCheckboxGroup["label"];
+  /** The name applied to child checkboxes when they do not provide one. */
+  "prop:name"?: WCheckboxGroup["name"];
+  /** Whether to show optional text next to the label. */
+  "prop:optional"?: WCheckboxGroup["optional"];
+  /**  */
+  "attr:help-text"?: WCheckboxGroup["helpText"];
+  /**  */
+  "prop:helpText"?: WCheckboxGroup["helpText"];
+  /** Makes the checkbox group required. */
+  "prop:required"?: WCheckboxGroup["required"];
+  /** Marks the checkbox group as invalid. */
+  "prop:invalid"?: WCheckboxGroup["invalid"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
 export type WarpComboboxProps = {
   /** The available options to select from */
   options?: WarpCombobox["options"];
@@ -1023,6 +1112,90 @@ export type WarpPillSolidJsProps = {
   textContent?: string | number;
 };
 
+export type WRadioProps = {
+  /** The name of the radio, submitted as a name/value pair with form data. */
+  name?: WRadio["name"];
+  /** The radio's value. When selected, the radio group will receive this value. */
+  value?: WRadio["value"];
+  /** Draws the radio in a checked state (reflected to attribute). */
+  checked?: WRadio["checked"];
+  /** Disables the radio. */
+  disabled?: WRadio["disabled"];
+  /** Makes the radio a required field. */
+  required?: WRadio["required"];
+  /** Draws the radio in an invalid state. */
+  invalid?: WRadio["invalid"];
+};
+
+export type WRadioSolidJsProps = {
+  /** The name of the radio, submitted as a name/value pair with form data. */
+  "prop:name"?: WRadio["name"];
+  /** The radio's value. When selected, the radio group will receive this value. */
+  "prop:value"?: WRadio["value"];
+  /** Draws the radio in a checked state (reflected to attribute). */
+  "prop:checked"?: WRadio["checked"];
+  /** Disables the radio. */
+  "prop:disabled"?: WRadio["disabled"];
+  /** Makes the radio a required field. */
+  "prop:required"?: WRadio["required"];
+  /** Draws the radio in an invalid state. */
+  "prop:invalid"?: WRadio["invalid"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WRadioGroupProps = {
+  /** The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
+instead. */
+  label?: WRadioGroup["label"];
+  /** The radio group's help text. If you need to display HTML, use the `help-text` slot instead. */
+  "help-text"?: WRadioGroup["helpText"];
+  /** The radio group's help text. If you need to display HTML, use the `help-text` slot instead. */
+  helpText?: WRadioGroup["helpText"];
+  /** Optional indicator for the label. */
+  optional?: WRadioGroup["optional"];
+  /** Marks the radio group as invalid. */
+  invalid?: WRadioGroup["invalid"];
+  /** The name of the radio group */
+  name?: WRadioGroup["name"];
+  /** Disables the radio group and all child radios. */
+  disabled?: WRadioGroup["disabled"];
+  /** Ensures a child radio is checked before allowing the containing form to submit. */
+  required?: WRadioGroup["required"];
+  /**  */
+  hasInteracted?: WRadioGroup["hasInteracted"];
+};
+
+export type WRadioGroupSolidJsProps = {
+  /** The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
+instead. */
+  "prop:label"?: WRadioGroup["label"];
+  /** The radio group's help text. If you need to display HTML, use the `help-text` slot instead. */
+  "attr:help-text"?: WRadioGroup["helpText"];
+  /** The radio group's help text. If you need to display HTML, use the `help-text` slot instead. */
+  "prop:helpText"?: WRadioGroup["helpText"];
+  /** Optional indicator for the label. */
+  "prop:optional"?: WRadioGroup["optional"];
+  /** Marks the radio group as invalid. */
+  "prop:invalid"?: WRadioGroup["invalid"];
+  /** The name of the radio group */
+  "prop:name"?: WRadioGroup["name"];
+  /** Disables the radio group and all child radios. */
+  "prop:disabled"?: WRadioGroup["disabled"];
+  /** Ensures a child radio is checked before allowing the containing form to submit. */
+  "prop:required"?: WRadioGroup["required"];
+  /**  */
+  "prop:hasInteracted"?: WRadioGroup["hasInteracted"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
 export type WarpSelectProps = {
   /** @deprecated Use the native `autofocus` attribute instead. - Whether the element should receive focus on render. */
   "auto-focus"?: WarpSelect["autoFocus"];
@@ -1098,299 +1271,84 @@ export type WarpSelectSolidJsProps = {
   textContent?: string | number;
 };
 
-export type WarpStepProps = {
-  /**  */
-  active?: WarpStep["active"];
-  /**  */
-  completed?: WarpStep["completed"];
-};
-
-export type WarpStepSolidJsProps = {
+export type WarpTextFieldProps = {
   /**  */
-  "prop:active"?: WarpStep["active"];
+  disabled?: WarpTextField["disabled"];
   /**  */
-  "prop:completed"?: WarpStep["completed"];
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WarpStepIndicatorProps = {
+  invalid?: WarpTextField["invalid"];
   /**  */
-  horizontal?: WarpStepIndicator["horizontal"];
+  id?: WarpTextField["id"];
   /**  */
-  right?: WarpStepIndicator["right"];
-};
-
-export type WarpStepIndicatorSolidJsProps = {
+  label?: WarpTextField["label"];
   /**  */
-  "prop:horizontal"?: WarpStepIndicator["horizontal"];
+  "help-text"?: WarpTextField["helpText"];
   /**  */
-  "prop:right"?: WarpStepIndicator["right"];
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WarpSwitchProps = {
+  helpText?: WarpTextField["helpText"];
   /**  */
-  name?: WarpSwitch["name"];
+  size?: WarpTextField["size"];
   /**  */
-  value?: WarpSwitch["value"];
+  max?: WarpTextField["max"];
   /**  */
-  checked?: WarpSwitch["checked"];
+  min?: WarpTextField["min"];
   /**  */
-  disabled?: WarpSwitch["disabled"];
-
+  "min-length"?: WarpTextField["minLength"];
   /**  */
-  onchange?: (e: CustomEvent) => void;
-};
-
-export type WarpSwitchSolidJsProps = {
+  minLength?: WarpTextField["minLength"];
   /**  */
-  "prop:name"?: WarpSwitch["name"];
+  "max-length"?: WarpTextField["maxLength"];
   /**  */
-  "prop:value"?: WarpSwitch["value"];
+  maxLength?: WarpTextField["maxLength"];
   /**  */
-  "prop:checked"?: WarpSwitch["checked"];
+  pattern?: WarpTextField["pattern"];
   /**  */
-  "prop:disabled"?: WarpSwitch["disabled"];
+  placeholder?: WarpTextField["placeholder"];
+  /** @deprecated Use the native readonly attribute instead.  */
+  "read-only"?: WarpTextField["readOnly"];
+  /** @deprecated Use the native readonly attribute instead.  */
+  readOnly?: WarpTextField["readOnly"];
   /**  */
-  "on:change"?: (e: CustomEvent) => void;
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WarpTabProps = {
+  readonly?: WarpTextField["readonly"];
   /**  */
-  for?: WarpTab["for"];
+  required?: WarpTextField["required"];
   /**  */
-  active?: WarpTab["active"];
+  type?: WarpTextField["type"];
   /**  */
-  over?: WarpTab["over"];
-};
-
-export type WarpTabSolidJsProps = {
+  value?: WarpTextField["value"];
   /**  */
-  "prop:for"?: WarpTab["for"];
+  name?: WarpTextField["name"];
   /**  */
-  "prop:active"?: WarpTab["active"];
+  step?: WarpTextField["step"];
   /**  */
-  "prop:over"?: WarpTab["over"];
+  autocomplete?: WarpTextField["autocomplete"];
+  /** Function to format value when the input field.
 
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
+Only active when the input field does not have focus,
+similar to the accessible input masking example from Filament Group
 
-export type WarpTabPanelProps = {
-  /**  */
-  hidden?: WarpTabPanel["hidden"];
+https://css-tricks.com/input-masking/
+https://filamentgroup.github.io/politespace/demo/demo.html */
+  formatter?: WarpTextField["formatter"];
 };
 
-export type WarpTabPanelSolidJsProps = {
+export type WarpTextFieldSolidJsProps = {
   /**  */
-  "prop:hidden"?: WarpTabPanel["hidden"];
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WarpTabsProps = {
+  "prop:disabled"?: WarpTextField["disabled"];
   /**  */
-  active?: WarpTabs["active"];
-
+  "prop:invalid"?: WarpTextField["invalid"];
   /**  */
-  onchange?: (e: CustomEvent) => void;
-};
-
-export type WarpTabsSolidJsProps = {
+  "prop:id"?: WarpTextField["id"];
   /**  */
-  "prop:active"?: WarpTabs["active"];
+  "prop:label"?: WarpTextField["label"];
   /**  */
-  "on:change"?: (e: CustomEvent) => void;
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WarpTextareaProps = {
+  "attr:help-text"?: WarpTextField["helpText"];
   /**  */
-  disabled?: WarpTextarea["disabled"];
+  "prop:helpText"?: WarpTextField["helpText"];
   /**  */
-  invalid?: WarpTextarea["invalid"];
+  "prop:size"?: WarpTextField["size"];
   /**  */
-  label?: WarpTextarea["label"];
+  "prop:max"?: WarpTextField["max"];
   /**  */
-  "help-text"?: WarpTextarea["helpText"];
-  /**  */
-  helpText?: WarpTextarea["helpText"];
-  /**  */
-  "maximum-rows"?: WarpTextarea["maxRows"];
-  /**  */
-  maxRows?: WarpTextarea["maxRows"];
-  /**  */
-  "minimum-rows"?: WarpTextarea["minRows"];
-  /**  */
-  minRows?: WarpTextarea["minRows"];
-  /**  */
-  name?: WarpTextarea["name"];
-  /**  */
-  placeholder?: WarpTextarea["placeholder"];
-  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
-  "read-only"?: WarpTextarea["readOnly"];
-  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
-  readOnly?: WarpTextarea["readOnly"];
-  /**  */
-  readonly?: WarpTextarea["readonly"];
-  /**  */
-  required?: WarpTextarea["required"];
-  /**  */
-  value?: WarpTextarea["value"];
-  /**  */
-  optional?: WarpTextarea["optional"];
-  /**  */
-  minHeight?: WarpTextarea["minHeight"];
-  /**  */
-  maxHeight?: WarpTextarea["maxHeight"];
-};
-
-export type WarpTextareaSolidJsProps = {
-  /**  */
-  "prop:disabled"?: WarpTextarea["disabled"];
-  /**  */
-  "prop:invalid"?: WarpTextarea["invalid"];
-  /**  */
-  "prop:label"?: WarpTextarea["label"];
-  /**  */
-  "attr:help-text"?: WarpTextarea["helpText"];
-  /**  */
-  "prop:helpText"?: WarpTextarea["helpText"];
-  /**  */
-  "attr:maximum-rows"?: WarpTextarea["maxRows"];
-  /**  */
-  "prop:maxRows"?: WarpTextarea["maxRows"];
-  /**  */
-  "attr:minimum-rows"?: WarpTextarea["minRows"];
-  /**  */
-  "prop:minRows"?: WarpTextarea["minRows"];
-  /**  */
-  "prop:name"?: WarpTextarea["name"];
-  /**  */
-  "prop:placeholder"?: WarpTextarea["placeholder"];
-  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
-  "bool:read-only"?: WarpTextarea["readOnly"];
-  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
-  "prop:readOnly"?: WarpTextarea["readOnly"];
-  /**  */
-  "prop:readonly"?: WarpTextarea["readonly"];
-  /**  */
-  "prop:required"?: WarpTextarea["required"];
-  /**  */
-  "prop:value"?: WarpTextarea["value"];
-  /**  */
-  "prop:optional"?: WarpTextarea["optional"];
-  /**  */
-  "prop:minHeight"?: WarpTextarea["minHeight"];
-  /**  */
-  "prop:maxHeight"?: WarpTextarea["maxHeight"];
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WarpTextFieldProps = {
-  /**  */
-  disabled?: WarpTextField["disabled"];
-  /**  */
-  invalid?: WarpTextField["invalid"];
-  /**  */
-  id?: WarpTextField["id"];
-  /**  */
-  label?: WarpTextField["label"];
-  /**  */
-  "help-text"?: WarpTextField["helpText"];
-  /**  */
-  helpText?: WarpTextField["helpText"];
-  /**  */
-  size?: WarpTextField["size"];
-  /**  */
-  max?: WarpTextField["max"];
-  /**  */
-  min?: WarpTextField["min"];
-  /**  */
-  "min-length"?: WarpTextField["minLength"];
-  /**  */
-  minLength?: WarpTextField["minLength"];
-  /**  */
-  "max-length"?: WarpTextField["maxLength"];
-  /**  */
-  maxLength?: WarpTextField["maxLength"];
-  /**  */
-  pattern?: WarpTextField["pattern"];
-  /**  */
-  placeholder?: WarpTextField["placeholder"];
-  /** @deprecated Use the native readonly attribute instead.  */
-  "read-only"?: WarpTextField["readOnly"];
-  /** @deprecated Use the native readonly attribute instead.  */
-  readOnly?: WarpTextField["readOnly"];
-  /**  */
-  readonly?: WarpTextField["readonly"];
-  /**  */
-  required?: WarpTextField["required"];
-  /**  */
-  type?: WarpTextField["type"];
-  /**  */
-  value?: WarpTextField["value"];
-  /**  */
-  name?: WarpTextField["name"];
-  /**  */
-  step?: WarpTextField["step"];
-  /**  */
-  autocomplete?: WarpTextField["autocomplete"];
-  /** Function to format value when the input field.
-
-Only active when the input field does not have focus,
-similar to the accessible input masking example from Filament Group
-
-https://css-tricks.com/input-masking/
-https://filamentgroup.github.io/politespace/demo/demo.html */
-  formatter?: WarpTextField["formatter"];
-};
-
-export type WarpTextFieldSolidJsProps = {
-  /**  */
-  "prop:disabled"?: WarpTextField["disabled"];
-  /**  */
-  "prop:invalid"?: WarpTextField["invalid"];
-  /**  */
-  "prop:id"?: WarpTextField["id"];
-  /**  */
-  "prop:label"?: WarpTextField["label"];
-  /**  */
-  "attr:help-text"?: WarpTextField["helpText"];
-  /**  */
-  "prop:helpText"?: WarpTextField["helpText"];
-  /**  */
-  "prop:size"?: WarpTextField["size"];
-  /**  */
-  "prop:max"?: WarpTextField["max"];
-  /**  */
-  "prop:min"?: WarpTextField["min"];
+  "prop:min"?: WarpTextField["min"];
   /**  */
   "attr:min-length"?: WarpTextField["minLength"];
   /**  */
@@ -1436,102 +1394,6 @@ https://filamentgroup.github.io/politespace/demo/demo.html */
   textContent?: string | number;
 };
 
-export type WarpToastContainerProps = {};
-
-export type WarpToastContainerSolidJsProps = {
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WCheckboxProps = {
-  /** The name of the checkbox, submitted as a name/value pair with form data. */
-  name?: WCheckbox["name"];
-  /** The value of the checkbox, submitted as a name/value pair with form data. */
-  value?: WCheckbox["value"];
-  /** Draws the checkbox in an indeterminate state. */
-  indeterminate?: WCheckbox["indeterminate"];
-  /** Draws the checkbox in a checked state (reflected to attribute). */
-  checked?: WCheckbox["checked"];
-  /** Disables the checkbox. */
-  disabled?: WCheckbox["disabled"];
-  /** Makes the checkbox a required field. */
-  required?: WCheckbox["required"];
-  /** Draws the checkbox in an invalid state. */
-  invalid?: WCheckbox["invalid"];
-  /**  */
-  input?: WCheckbox["input"];
-
-  /**  */
-  onchange?: (e: Event) => void;
-};
-
-export type WCheckboxSolidJsProps = {
-  /** The name of the checkbox, submitted as a name/value pair with form data. */
-  "prop:name"?: WCheckbox["name"];
-  /** The value of the checkbox, submitted as a name/value pair with form data. */
-  "prop:value"?: WCheckbox["value"];
-  /** Draws the checkbox in an indeterminate state. */
-  "prop:indeterminate"?: WCheckbox["indeterminate"];
-  /** Draws the checkbox in a checked state (reflected to attribute). */
-  "prop:checked"?: WCheckbox["checked"];
-  /** Disables the checkbox. */
-  "prop:disabled"?: WCheckbox["disabled"];
-  /** Makes the checkbox a required field. */
-  "prop:required"?: WCheckbox["required"];
-  /** Draws the checkbox in an invalid state. */
-  "prop:invalid"?: WCheckbox["invalid"];
-  /**  */
-  "prop:input"?: WCheckbox["input"];
-  /**  */
-  "on:change"?: (e: Event) => void;
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
-export type WCheckboxGroupProps = {
-  /** The group label displayed above the checkboxes. */
-  label?: WCheckboxGroup["label"];
-  /** The name applied to child checkboxes when they do not provide one. */
-  name?: WCheckboxGroup["name"];
-  /** Whether to show optional text next to the label. */
-  optional?: WCheckboxGroup["optional"];
-  /**  */
-  "help-text"?: WCheckboxGroup["helpText"];
-  /**  */
-  helpText?: WCheckboxGroup["helpText"];
-  /** Makes the checkbox group required. */
-  required?: WCheckboxGroup["required"];
-  /** Marks the checkbox group as invalid. */
-  invalid?: WCheckboxGroup["invalid"];
-};
-
-export type WCheckboxGroupSolidJsProps = {
-  /** The group label displayed above the checkboxes. */
-  "prop:label"?: WCheckboxGroup["label"];
-  /** The name applied to child checkboxes when they do not provide one. */
-  "prop:name"?: WCheckboxGroup["name"];
-  /** Whether to show optional text next to the label. */
-  "prop:optional"?: WCheckboxGroup["optional"];
-  /**  */
-  "attr:help-text"?: WCheckboxGroup["helpText"];
-  /**  */
-  "prop:helpText"?: WCheckboxGroup["helpText"];
-  /** Makes the checkbox group required. */
-  "prop:required"?: WCheckboxGroup["required"];
-  /** Marks the checkbox group as invalid. */
-  "prop:invalid"?: WCheckboxGroup["invalid"];
-
-  /** Set the innerHTML of the element */
-  innerHTML?: string;
-  /** Set the textContent of the element */
-  textContent?: string | number;
-};
-
 export type WarpSliderThumbProps = {
   /**  */
   "aria-label"?: WarpSliderThumb["ariaLabel"];
@@ -1695,10 +1557,234 @@ If you need to display HTML, use the `label` slot instead (f. ex. `<legend class
   textContent?: string | number;
 };
 
-export type CustomElements = {
-  /**
-   *
-   *
+export type WarpStepProps = {
+  /**  */
+  active?: WarpStep["active"];
+  /**  */
+  completed?: WarpStep["completed"];
+};
+
+export type WarpStepSolidJsProps = {
+  /**  */
+  "prop:active"?: WarpStep["active"];
+  /**  */
+  "prop:completed"?: WarpStep["completed"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpStepIndicatorProps = {
+  /**  */
+  horizontal?: WarpStepIndicator["horizontal"];
+  /**  */
+  right?: WarpStepIndicator["right"];
+};
+
+export type WarpStepIndicatorSolidJsProps = {
+  /**  */
+  "prop:horizontal"?: WarpStepIndicator["horizontal"];
+  /**  */
+  "prop:right"?: WarpStepIndicator["right"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpSwitchProps = {
+  /**  */
+  name?: WarpSwitch["name"];
+  /**  */
+  value?: WarpSwitch["value"];
+  /**  */
+  checked?: WarpSwitch["checked"];
+  /**  */
+  disabled?: WarpSwitch["disabled"];
+
+  /**  */
+  onchange?: (e: CustomEvent) => void;
+};
+
+export type WarpSwitchSolidJsProps = {
+  /**  */
+  "prop:name"?: WarpSwitch["name"];
+  /**  */
+  "prop:value"?: WarpSwitch["value"];
+  /**  */
+  "prop:checked"?: WarpSwitch["checked"];
+  /**  */
+  "prop:disabled"?: WarpSwitch["disabled"];
+  /**  */
+  "on:change"?: (e: CustomEvent) => void;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpTabProps = {
+  /**  */
+  for?: WarpTab["for"];
+  /**  */
+  active?: WarpTab["active"];
+  /**  */
+  over?: WarpTab["over"];
+};
+
+export type WarpTabSolidJsProps = {
+  /**  */
+  "prop:for"?: WarpTab["for"];
+  /**  */
+  "prop:active"?: WarpTab["active"];
+  /**  */
+  "prop:over"?: WarpTab["over"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpTabPanelProps = {
+  /**  */
+  hidden?: WarpTabPanel["hidden"];
+};
+
+export type WarpTabPanelSolidJsProps = {
+  /**  */
+  "prop:hidden"?: WarpTabPanel["hidden"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpTabsProps = {
+  /**  */
+  active?: WarpTabs["active"];
+
+  /**  */
+  onchange?: (e: CustomEvent) => void;
+};
+
+export type WarpTabsSolidJsProps = {
+  /**  */
+  "prop:active"?: WarpTabs["active"];
+  /**  */
+  "on:change"?: (e: CustomEvent) => void;
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpTextareaProps = {
+  /**  */
+  disabled?: WarpTextarea["disabled"];
+  /**  */
+  invalid?: WarpTextarea["invalid"];
+  /**  */
+  label?: WarpTextarea["label"];
+  /**  */
+  "help-text"?: WarpTextarea["helpText"];
+  /**  */
+  helpText?: WarpTextarea["helpText"];
+  /**  */
+  "maximum-rows"?: WarpTextarea["maxRows"];
+  /**  */
+  maxRows?: WarpTextarea["maxRows"];
+  /**  */
+  "minimum-rows"?: WarpTextarea["minRows"];
+  /**  */
+  minRows?: WarpTextarea["minRows"];
+  /**  */
+  name?: WarpTextarea["name"];
+  /**  */
+  placeholder?: WarpTextarea["placeholder"];
+  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
+  "read-only"?: WarpTextarea["readOnly"];
+  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
+  readOnly?: WarpTextarea["readOnly"];
+  /**  */
+  readonly?: WarpTextarea["readonly"];
+  /**  */
+  required?: WarpTextarea["required"];
+  /**  */
+  value?: WarpTextarea["value"];
+  /**  */
+  optional?: WarpTextarea["optional"];
+  /**  */
+  minHeight?: WarpTextarea["minHeight"];
+  /**  */
+  maxHeight?: WarpTextarea["maxHeight"];
+};
+
+export type WarpTextareaSolidJsProps = {
+  /**  */
+  "prop:disabled"?: WarpTextarea["disabled"];
+  /**  */
+  "prop:invalid"?: WarpTextarea["invalid"];
+  /**  */
+  "prop:label"?: WarpTextarea["label"];
+  /**  */
+  "attr:help-text"?: WarpTextarea["helpText"];
+  /**  */
+  "prop:helpText"?: WarpTextarea["helpText"];
+  /**  */
+  "attr:maximum-rows"?: WarpTextarea["maxRows"];
+  /**  */
+  "prop:maxRows"?: WarpTextarea["maxRows"];
+  /**  */
+  "attr:minimum-rows"?: WarpTextarea["minRows"];
+  /**  */
+  "prop:minRows"?: WarpTextarea["minRows"];
+  /**  */
+  "prop:name"?: WarpTextarea["name"];
+  /**  */
+  "prop:placeholder"?: WarpTextarea["placeholder"];
+  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
+  "bool:read-only"?: WarpTextarea["readOnly"];
+  /** @deprecated Use the native readonly attribute instead. Here for API consistency with `w-textfield`.  */
+  "prop:readOnly"?: WarpTextarea["readOnly"];
+  /**  */
+  "prop:readonly"?: WarpTextarea["readonly"];
+  /**  */
+  "prop:required"?: WarpTextarea["required"];
+  /**  */
+  "prop:value"?: WarpTextarea["value"];
+  /**  */
+  "prop:optional"?: WarpTextarea["optional"];
+  /**  */
+  "prop:minHeight"?: WarpTextarea["minHeight"];
+  /**  */
+  "prop:maxHeight"?: WarpTextarea["maxHeight"];
+
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type WarpToastContainerProps = {};
+
+export type WarpToastContainerSolidJsProps = {
+  /** Set the innerHTML of the element */
+  innerHTML?: string;
+  /** Set the textContent of the element */
+  textContent?: string | number;
+};
+
+export type CustomElements = {
+  /**
+   *
+   *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
@@ -1906,31 +1992,94 @@ export type CustomElements = {
   "w-card": Partial<WarpCardProps & BaseProps<WarpCard> & BaseEvents>;
 
   /**
-   * A combobox element for text input with selectable options.
    *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-combobox--docs)
    *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
-   * - `options`: The available options to select from
-   * - `label`: Label above input
-   * - `placeholder`: Input placeholder
-   * - `value`: The input value
-   * - `open-on-focus`/`openOnFocus`: Whether the popover opens when focus is on the text field
-   * - `select-on-blur`/`selectOnBlur`: Select active option on blur
-   * - `match-text-segments`/`matchTextSegments`: Whether the matching text segments in the options should be highlighted
-   * - `disable-static-filtering`/`disableStaticFiltering`: Disable client-side static filtering
-   * - `invalid`: Renders the input field in an invalid state
-   * - `help-text`/`helpText`: The content to display as the help text
-   * - `disabled`: Whether the element is disabled
-   * - `required`: Whether the element is required
-   * - `optional`: Whether to show optional text
-   * - `name`: Name attribute for form submission
-   * - `autocomplete`: Autocomplete attribute for the input field
+   * - `name`: The name of the checkbox, submitted as a name/value pair with form data.
+   * - `value`: The value of the checkbox, submitted as a name/value pair with form data.
+   * - `indeterminate`: Draws the checkbox in an indeterminate state.
+   * - `checked`: Draws the checkbox in a checked state (reflected to attribute).
+   * - `disabled`: Disables the checkbox.
+   * - `required`: Makes the checkbox a required field.
+   * - `invalid`: Draws the checkbox in an invalid state.
+   * - `input`: undefined (property only)
+   * - `validationMessage`: Returns the validation message if the checkbox is invalid, otherwise an empty string (property only) (readonly)
+   * - `validity`: Returns the validity state of the checkbox (property only) (readonly)
    *
-   * ## Methods
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `change`: undefined
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `click() => void`: undefined
+   * - `focus(options?: FocusOptions) => void`: undefined
+   * - `blur() => void`: undefined
+   * - `checkValidity() => boolean`: Checks whether the checkbox passes constraint validation
+   * - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
+   */
+  "w-checkbox": Partial<WCheckboxProps & BaseProps<WCheckbox> & BaseEvents>;
+
+  /**
+   *
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The group label displayed above the checkboxes.
+   * - `name`: The name applied to child checkboxes when they do not provide one.
+   * - `optional`: Whether to show optional text next to the label.
+   * - `help-text`/`helpText`: undefined
+   * - `required`: Makes the checkbox group required.
+   * - `invalid`: Marks the checkbox group as invalid.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `checkValidity() => boolean`: Checks whether the group passes constraint validation
+   * - `reportValidity() => boolean`: Checks validity and shows the validation message if invalid
+   * - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox group.
+   */
+  "w-checkbox-group": Partial<
+    WCheckboxGroupProps & BaseProps<WCheckboxGroup> & BaseEvents
+  >;
+
+  /**
+   * A combobox element for text input with selectable options.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-combobox--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `options`: The available options to select from
+   * - `label`: Label above input
+   * - `placeholder`: Input placeholder
+   * - `value`: The input value
+   * - `open-on-focus`/`openOnFocus`: Whether the popover opens when focus is on the text field
+   * - `select-on-blur`/`selectOnBlur`: Select active option on blur
+   * - `match-text-segments`/`matchTextSegments`: Whether the matching text segments in the options should be highlighted
+   * - `disable-static-filtering`/`disableStaticFiltering`: Disable client-side static filtering
+   * - `invalid`: Renders the input field in an invalid state
+   * - `help-text`/`helpText`: The content to display as the help text
+   * - `disabled`: Whether the element is disabled
+   * - `required`: Whether the element is required
+   * - `optional`: Whether to show optional text
+   * - `name`: Name attribute for form submission
+   * - `autocomplete`: Autocomplete attribute for the input field
+   *
+   * ## Methods
    *
    * Methods that can be called to access component functionality.
    *
@@ -2185,6 +2334,71 @@ export type CustomElements = {
    */
   "w-pill": Partial<WarpPillProps & BaseProps<WarpPill> & BaseEvents>;
 
+  /**
+   *
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `name`: The name of the radio, submitted as a name/value pair with form data.
+   * - `value`: The radio's value. When selected, the radio group will receive this value.
+   * - `checked`: Draws the radio in a checked state (reflected to attribute).
+   * - `disabled`: Disables the radio.
+   * - `required`: Makes the radio a required field.
+   * - `invalid`: Draws the radio in an invalid state.
+   * - `validationMessage`: Returns the validation message if the radio is invalid, otherwise an empty string (property only) (readonly)
+   * - `validity`: Returns the validity state of the radio (property only) (readonly)
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `checkValidity() => boolean`: Checks whether the radio passes constraint validation
+   * - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
+   */
+  "w-radio": Partial<WRadioProps & BaseProps<WRadio> & BaseEvents>;
+
+  /**
+   *
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
+   * instead.
+   * - `help-text`/`helpText`: The radio group's help text. If you need to display HTML, use the `help-text` slot instead.
+   * - `optional`: Optional indicator for the label.
+   * - `invalid`: Marks the radio group as invalid.
+   * - `name`: The name of the radio group
+   * - `disabled`: Disables the radio group and all child radios.
+   * - `required`: Ensures a child radio is checked before allowing the containing form to submit.
+   * - `hasInteracted`: undefined (property only)
+   * - `validationTarget`: We use the first available radio as the validationTarget similar to native HTML that shows the validation popup on
+   * the first radio element. (property only) (readonly)
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `label`: Alternative to the `label` attribute should you need custom HTML.
+   * - `help-text`: Alternative to the `help-text` attribute should you need custom HTML.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `focus(options?: FocusOptions) => void`: Sets focus on the radio group.
+   * - `checkValidity() => void`: undefined
+   * - `reportValidity() => void`: undefined
+   */
+  "w-radio-group": Partial<
+    WRadioGroupProps & BaseProps<WRadioGroup> & BaseEvents
+  >;
+
   /**
    * A dropdown component for selecting a single value.
    *
@@ -2218,6 +2432,143 @@ export type CustomElements = {
    */
   "w-select": Partial<WarpSelectProps & BaseProps<WarpSelect> & BaseEvents>;
 
+  /**
+   * A single line text input element.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-textfield--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `disabled`: undefined
+   * - `invalid`: undefined
+   * - `id`: undefined
+   * - `label`: undefined
+   * - `help-text`/`helpText`: undefined
+   * - `size`: undefined
+   * - `max`: undefined
+   * - `min`: undefined
+   * - `min-length`/`minLength`: undefined
+   * - `max-length`/`maxLength`: undefined
+   * - `pattern`: undefined
+   * - `placeholder`: undefined
+   * - `read-only`/`readOnly`: undefined
+   * - `readonly`: undefined
+   * - `required`: undefined
+   * - `type`: undefined
+   * - `value`: undefined
+   * - `name`: undefined
+   * - `step`: undefined
+   * - `autocomplete`: undefined
+   * - `formatter`: Function to format value when the input field.
+   *
+   * Only active when the input field does not have focus,
+   * similar to the accessible input masking example from Filament Group
+   *
+   * https://css-tricks.com/input-masking/
+   * https://filamentgroup.github.io/politespace/demo/demo.html (property only)
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `handler(e: Event) => void`: undefined
+   * - `prefixSlotChange() => void`: undefined
+   * - `suffixSlotChange() => void`: undefined
+   */
+  "w-textfield": Partial<
+    WarpTextFieldProps & BaseProps<WarpTextField> & BaseEvents
+  >;
+
+  /**
+   * Component to place inside a `<w-slider>`.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `aria-label`/`ariaLabel`: undefined
+   * - `aria-description`/`ariaDescription`: undefined
+   * - `name`: undefined
+   * - `value`: undefined
+   * - `placeholder`: undefined
+   * - `range`: undefined (property only)
+   * - `tooltipTarget`: undefined (property only)
+   * - `textfield`: undefined (property only)
+   * - `boundaryValue`: undefined (property only) (readonly)
+   * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
+   * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
+   * - `ariaDescriptionText`: undefined (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `slidervalidity`: undefined
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `updateFieldAfterValidation() => void`: undefined
+   */
+  "w-slider-thumb": Partial<
+    WarpSliderThumbProps & BaseProps<WarpSliderThumb> & BaseEvents
+  >;
+
+  /**
+   * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The slider fieldset label. Required for proper accessibility.
+   *
+   * If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
+   * - `disabled`: undefined
+   * - `open-ended`/`openEnded`: Whether or not to allow values outside the range such as "Before 1950" and "2025+".
+   * - `error`: undefined
+   * - `help-text`/`helpText`: undefined
+   * - `invalid`: undefined
+   * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
+   * - `min`: undefined
+   * - `max`: undefined
+   * - `markers`: Pass a value similar to step to create visual markers at that interval
+   * - `step`: undefined
+   * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
+   * - `hidden-textfield`/`hiddenTextfield`: undefined
+   * - `valueFormatter`: Formatter for the tooltip and input mask values. (property only)
+   * - `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)
+   * - `labelFormatter`: Formatter for the min and max labels below the range. (property only)
+   * - `_invalidMessage`: undefined (property only)
+   * - `_hasInternalError`: undefined (property only)
+   * - `_showError`: undefined (property only)
+   * - `_tabbableElements`: undefined (property only)
+   * - `edgeMin`: undefined (property only) (readonly)
+   * - `edgeMax`: undefined (property only) (readonly)
+   * - `componentHasError`: undefined (property only) (readonly)
+   * - `errorText`: undefined (property only) (readonly)
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: For single sliders place a `<w-slider-thumb>` in the default slot.
+   * - `label`: Label for the slider or range slider as a whole.
+   * - `description`: Optional description between the label and slider.
+   * - `from`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
+   * - `to`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
+   */
+  "w-slider": Partial<WarpSliderProps & BaseProps<WarpSlider> & BaseEvents>;
+
   /**
    * Individual step component that shows a single step in a process
    *
@@ -2379,61 +2730,11 @@ export type CustomElements = {
   >;
 
   /**
-   * A single line text input element.
    *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-textfield--docs)
    *
-   * ## Attributes & Properties
+   * ## Methods
    *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `disabled`: undefined
-   * - `invalid`: undefined
-   * - `id`: undefined
-   * - `label`: undefined
-   * - `help-text`/`helpText`: undefined
-   * - `size`: undefined
-   * - `max`: undefined
-   * - `min`: undefined
-   * - `min-length`/`minLength`: undefined
-   * - `max-length`/`maxLength`: undefined
-   * - `pattern`: undefined
-   * - `placeholder`: undefined
-   * - `read-only`/`readOnly`: undefined
-   * - `readonly`: undefined
-   * - `required`: undefined
-   * - `type`: undefined
-   * - `value`: undefined
-   * - `name`: undefined
-   * - `step`: undefined
-   * - `autocomplete`: undefined
-   * - `formatter`: Function to format value when the input field.
-   *
-   * Only active when the input field does not have focus,
-   * similar to the accessible input masking example from Filament Group
-   *
-   * https://css-tricks.com/input-masking/
-   * https://filamentgroup.github.io/politespace/demo/demo.html (property only)
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `resetFormControl() => void`: undefined
-   * - `handler(e: Event) => void`: undefined
-   * - `prefixSlotChange() => void`: undefined
-   * - `suffixSlotChange() => void`: undefined
-   */
-  "w-textfield": Partial<
-    WarpTextFieldProps & BaseProps<WarpTextField> & BaseEvents
-  >;
-
-  /**
-   *
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
+   * Methods that can be called to access component functionality.
    *
    * - `init() => void`: undefined
    * - `get(id: string | number) => ToastInternal | undefined`: undefined
@@ -2443,156 +2744,6 @@ export type CustomElements = {
   "w-toast-container": Partial<
     WarpToastContainerProps & BaseProps<WarpToastContainer> & BaseEvents
   >;
-
-  /**
-   *
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `name`: The name of the checkbox, submitted as a name/value pair with form data.
-   * - `value`: The value of the checkbox, submitted as a name/value pair with form data.
-   * - `indeterminate`: Draws the checkbox in an indeterminate state.
-   * - `checked`: Draws the checkbox in a checked state (reflected to attribute).
-   * - `disabled`: Disables the checkbox.
-   * - `required`: Makes the checkbox a required field.
-   * - `invalid`: Draws the checkbox in an invalid state.
-   * - `input`: undefined (property only)
-   * - `validationMessage`: Returns the validation message if the checkbox is invalid, otherwise an empty string (property only) (readonly)
-   * - `validity`: Returns the validity state of the checkbox (property only) (readonly)
-   *
-   * ## Events
-   *
-   * Events that will be emitted by the component.
-   *
-   * - `change`: undefined
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `resetFormControl() => void`: undefined
-   * - `click() => void`: undefined
-   * - `focus(options?: FocusOptions) => void`: undefined
-   * - `blur() => void`: undefined
-   * - `checkValidity() => boolean`: Checks whether the checkbox passes constraint validation
-   * - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
-   */
-  "w-checkbox": Partial<WCheckboxProps & BaseProps<WCheckbox> & BaseEvents>;
-
-  /**
-   *
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `label`: The group label displayed above the checkboxes.
-   * - `name`: The name applied to child checkboxes when they do not provide one.
-   * - `optional`: Whether to show optional text next to the label.
-   * - `help-text`/`helpText`: undefined
-   * - `required`: Makes the checkbox group required.
-   * - `invalid`: Marks the checkbox group as invalid.
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `checkValidity() => boolean`: Checks whether the group passes constraint validation
-   * - `reportValidity() => boolean`: Checks validity and shows the validation message if invalid
-   * - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox group.
-   */
-  "w-checkbox-group": Partial<
-    WCheckboxGroupProps & BaseProps<WCheckboxGroup> & BaseEvents
-  >;
-
-  /**
-   * Component to place inside a `<w-slider>`.
-   *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `aria-label`/`ariaLabel`: undefined
-   * - `aria-description`/`ariaDescription`: undefined
-   * - `name`: undefined
-   * - `value`: undefined
-   * - `placeholder`: undefined
-   * - `range`: undefined (property only)
-   * - `tooltipTarget`: undefined (property only)
-   * - `textfield`: undefined (property only)
-   * - `boundaryValue`: undefined (property only) (readonly)
-   * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
-   * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
-   * - `ariaDescriptionText`: undefined (property only) (readonly)
-   *
-   * ## Events
-   *
-   * Events that will be emitted by the component.
-   *
-   * - `slidervalidity`: undefined
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `resetFormControl() => void`: undefined
-   * - `updateFieldAfterValidation() => void`: undefined
-   */
-  "w-slider-thumb": Partial<
-    WarpSliderThumbProps & BaseProps<WarpSliderThumb> & BaseEvents
-  >;
-
-  /**
-   * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
-   *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `label`: The slider fieldset label. Required for proper accessibility.
-   *
-   * If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
-   * - `disabled`: undefined
-   * - `open-ended`/`openEnded`: Whether or not to allow values outside the range such as "Before 1950" and "2025+".
-   * - `error`: undefined
-   * - `help-text`/`helpText`: undefined
-   * - `invalid`: undefined
-   * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
-   * - `min`: undefined
-   * - `max`: undefined
-   * - `markers`: Pass a value similar to step to create visual markers at that interval
-   * - `step`: undefined
-   * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
-   * - `hidden-textfield`/`hiddenTextfield`: undefined
-   * - `valueFormatter`: Formatter for the tooltip and input mask values. (property only)
-   * - `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)
-   * - `labelFormatter`: Formatter for the min and max labels below the range. (property only)
-   * - `_invalidMessage`: undefined (property only)
-   * - `_hasInternalError`: undefined (property only)
-   * - `_showError`: undefined (property only)
-   * - `_tabbableElements`: undefined (property only)
-   * - `edgeMin`: undefined (property only) (readonly)
-   * - `edgeMax`: undefined (property only) (readonly)
-   * - `componentHasError`: undefined (property only) (readonly)
-   * - `errorText`: undefined (property only) (readonly)
-   *
-   * ## Slots
-   *
-   * Areas where markup can be added to the component.
-   *
-   * - `(default)`: For single sliders place a `<w-slider-thumb>` in the default slot.
-   * - `label`: Label for the slider or range slider as a whole.
-   * - `description`: Optional description between the label and slider.
-   * - `from`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
-   * - `to`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
-   */
-  "w-slider": Partial<WarpSliderProps & BaseProps<WarpSlider> & BaseEvents>;
 };
 
 export type CustomElementsSolidJs = {
@@ -2831,62 +2982,130 @@ export type CustomElementsSolidJs = {
   >;
 
   /**
-   * A combobox element for text input with selectable options.
    *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-combobox--docs)
    *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
-   * - `options`: The available options to select from
-   * - `label`: Label above input
-   * - `placeholder`: Input placeholder
-   * - `value`: The input value
-   * - `open-on-focus`/`openOnFocus`: Whether the popover opens when focus is on the text field
-   * - `select-on-blur`/`selectOnBlur`: Select active option on blur
-   * - `match-text-segments`/`matchTextSegments`: Whether the matching text segments in the options should be highlighted
-   * - `disable-static-filtering`/`disableStaticFiltering`: Disable client-side static filtering
-   * - `invalid`: Renders the input field in an invalid state
-   * - `help-text`/`helpText`: The content to display as the help text
-   * - `disabled`: Whether the element is disabled
-   * - `required`: Whether the element is required
-   * - `optional`: Whether to show optional text
-   * - `name`: Name attribute for form submission
-   * - `autocomplete`: Autocomplete attribute for the input field
+   * - `name`: The name of the checkbox, submitted as a name/value pair with form data.
+   * - `value`: The value of the checkbox, submitted as a name/value pair with form data.
+   * - `indeterminate`: Draws the checkbox in an indeterminate state.
+   * - `checked`: Draws the checkbox in a checked state (reflected to attribute).
+   * - `disabled`: Disables the checkbox.
+   * - `required`: Makes the checkbox a required field.
+   * - `invalid`: Draws the checkbox in an invalid state.
+   * - `input`: undefined (property only)
+   * - `validationMessage`: Returns the validation message if the checkbox is invalid, otherwise an empty string (property only) (readonly)
+   * - `validity`: Returns the validity state of the checkbox (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `change`: undefined
    *
    * ## Methods
    *
    * Methods that can be called to access component functionality.
    *
    * - `resetFormControl() => void`: undefined
+   * - `click() => void`: undefined
+   * - `focus(options?: FocusOptions) => void`: undefined
+   * - `blur() => void`: undefined
+   * - `checkValidity() => boolean`: Checks whether the checkbox passes constraint validation
+   * - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
    */
-  "w-combobox": Partial<
-    WarpComboboxProps &
-      WarpComboboxSolidJsProps &
-      BaseProps<WarpCombobox> &
-      BaseEvents
+  "w-checkbox": Partial<
+    WCheckboxProps & WCheckboxSolidJsProps & BaseProps<WCheckbox> & BaseEvents
   >;
 
   /**
-   * An input for dates.
-   *
-   * Uses the `lang` attribute on either the element or on `<html>` to determine the locale options.
    *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-datepicker--docs)
    *
    * ## Attributes & Properties
    *
    * Component attributes and properties that can be applied to the element or by using JavaScript.
    *
-   * - `label`: undefined
-   * - `lang`: Takes precedence over the `<html>` lang attribute.
-   * - `name`: undefined
-   * - `value`: undefined
-   * - `header-format`/`headerFormat`: Decides the format of the date as shown in the calendar header.
+   * - `label`: The group label displayed above the checkboxes.
+   * - `name`: The name applied to child checkboxes when they do not provide one.
+   * - `optional`: Whether to show optional text next to the label.
+   * - `help-text`/`helpText`: undefined
+   * - `required`: Makes the checkbox group required.
+   * - `invalid`: Marks the checkbox group as invalid.
    *
-   * The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
-   * - `weekday-format`/`weekdayFormat`: Decides the format of the weekday as shown above the grid of dates in the calendar.
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `checkValidity() => boolean`: Checks whether the group passes constraint validation
+   * - `reportValidity() => boolean`: Checks validity and shows the validation message if invalid
+   * - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox group.
+   */
+  "w-checkbox-group": Partial<
+    WCheckboxGroupProps &
+      WCheckboxGroupSolidJsProps &
+      BaseProps<WCheckboxGroup> &
+      BaseEvents
+  >;
+
+  /**
+   * A combobox element for text input with selectable options.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-combobox--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `options`: The available options to select from
+   * - `label`: Label above input
+   * - `placeholder`: Input placeholder
+   * - `value`: The input value
+   * - `open-on-focus`/`openOnFocus`: Whether the popover opens when focus is on the text field
+   * - `select-on-blur`/`selectOnBlur`: Select active option on blur
+   * - `match-text-segments`/`matchTextSegments`: Whether the matching text segments in the options should be highlighted
+   * - `disable-static-filtering`/`disableStaticFiltering`: Disable client-side static filtering
+   * - `invalid`: Renders the input field in an invalid state
+   * - `help-text`/`helpText`: The content to display as the help text
+   * - `disabled`: Whether the element is disabled
+   * - `required`: Whether the element is required
+   * - `optional`: Whether to show optional text
+   * - `name`: Name attribute for form submission
+   * - `autocomplete`: Autocomplete attribute for the input field
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   */
+  "w-combobox": Partial<
+    WarpComboboxProps &
+      WarpComboboxSolidJsProps &
+      BaseProps<WarpCombobox> &
+      BaseEvents
+  >;
+
+  /**
+   * An input for dates.
+   *
+   * Uses the `lang` attribute on either the element or on `<html>` to determine the locale options.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-datepicker--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: undefined
+   * - `lang`: Takes precedence over the `<html>` lang attribute.
+   * - `name`: undefined
+   * - `value`: undefined
+   * - `header-format`/`headerFormat`: Decides the format of the date as shown in the calendar header.
+   *
+   * The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
+   * - `weekday-format`/`weekdayFormat`: Decides the format of the weekday as shown above the grid of dates in the calendar.
    *
    * The syntax is defined by [date-fns/format](https://date-fns.org/v4.1.0/docs/format).
    * - `day-format`/`dayFormat`: Decides the format of the day in the calendar as read to screen readers.
@@ -3135,6 +3354,76 @@ export type CustomElementsSolidJs = {
     WarpPillProps & WarpPillSolidJsProps & BaseProps<WarpPill> & BaseEvents
   >;
 
+  /**
+   *
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `name`: The name of the radio, submitted as a name/value pair with form data.
+   * - `value`: The radio's value. When selected, the radio group will receive this value.
+   * - `checked`: Draws the radio in a checked state (reflected to attribute).
+   * - `disabled`: Disables the radio.
+   * - `required`: Makes the radio a required field.
+   * - `invalid`: Draws the radio in an invalid state.
+   * - `validationMessage`: Returns the validation message if the radio is invalid, otherwise an empty string (property only) (readonly)
+   * - `validity`: Returns the validity state of the radio (property only) (readonly)
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `checkValidity() => boolean`: Checks whether the radio passes constraint validation
+   * - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
+   */
+  "w-radio": Partial<
+    WRadioProps & WRadioSolidJsProps & BaseProps<WRadio> & BaseEvents
+  >;
+
+  /**
+   *
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The radio group's label. Required for proper accessibility. If you need to display HTML, use the `label` slot
+   * instead.
+   * - `help-text`/`helpText`: The radio group's help text. If you need to display HTML, use the `help-text` slot instead.
+   * - `optional`: Optional indicator for the label.
+   * - `invalid`: Marks the radio group as invalid.
+   * - `name`: The name of the radio group
+   * - `disabled`: Disables the radio group and all child radios.
+   * - `required`: Ensures a child radio is checked before allowing the containing form to submit.
+   * - `hasInteracted`: undefined (property only)
+   * - `validationTarget`: We use the first available radio as the validationTarget similar to native HTML that shows the validation popup on
+   * the first radio element. (property only) (readonly)
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `label`: Alternative to the `label` attribute should you need custom HTML.
+   * - `help-text`: Alternative to the `help-text` attribute should you need custom HTML.
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `focus(options?: FocusOptions) => void`: Sets focus on the radio group.
+   * - `checkValidity() => void`: undefined
+   * - `reportValidity() => void`: undefined
+   */
+  "w-radio-group": Partial<
+    WRadioGroupProps &
+      WRadioGroupSolidJsProps &
+      BaseProps<WRadioGroup> &
+      BaseEvents
+  >;
+
   /**
    * A dropdown component for selecting a single value.
    *
@@ -3173,6 +3462,154 @@ export type CustomElementsSolidJs = {
       BaseEvents
   >;
 
+  /**
+   * A single line text input element.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-textfield--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `disabled`: undefined
+   * - `invalid`: undefined
+   * - `id`: undefined
+   * - `label`: undefined
+   * - `help-text`/`helpText`: undefined
+   * - `size`: undefined
+   * - `max`: undefined
+   * - `min`: undefined
+   * - `min-length`/`minLength`: undefined
+   * - `max-length`/`maxLength`: undefined
+   * - `pattern`: undefined
+   * - `placeholder`: undefined
+   * - `read-only`/`readOnly`: undefined
+   * - `readonly`: undefined
+   * - `required`: undefined
+   * - `type`: undefined
+   * - `value`: undefined
+   * - `name`: undefined
+   * - `step`: undefined
+   * - `autocomplete`: undefined
+   * - `formatter`: Function to format value when the input field.
+   *
+   * Only active when the input field does not have focus,
+   * similar to the accessible input masking example from Filament Group
+   *
+   * https://css-tricks.com/input-masking/
+   * https://filamentgroup.github.io/politespace/demo/demo.html (property only)
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `handler(e: Event) => void`: undefined
+   * - `prefixSlotChange() => void`: undefined
+   * - `suffixSlotChange() => void`: undefined
+   */
+  "w-textfield": Partial<
+    WarpTextFieldProps &
+      WarpTextFieldSolidJsProps &
+      BaseProps<WarpTextField> &
+      BaseEvents
+  >;
+
+  /**
+   * Component to place inside a `<w-slider>`.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `aria-label`/`ariaLabel`: undefined
+   * - `aria-description`/`ariaDescription`: undefined
+   * - `name`: undefined
+   * - `value`: undefined
+   * - `placeholder`: undefined
+   * - `range`: undefined (property only)
+   * - `tooltipTarget`: undefined (property only)
+   * - `textfield`: undefined (property only)
+   * - `boundaryValue`: undefined (property only) (readonly)
+   * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
+   * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
+   * - `ariaDescriptionText`: undefined (property only) (readonly)
+   *
+   * ## Events
+   *
+   * Events that will be emitted by the component.
+   *
+   * - `slidervalidity`: undefined
+   *
+   * ## Methods
+   *
+   * Methods that can be called to access component functionality.
+   *
+   * - `resetFormControl() => void`: undefined
+   * - `updateFieldAfterValidation() => void`: undefined
+   */
+  "w-slider-thumb": Partial<
+    WarpSliderThumbProps &
+      WarpSliderThumbSolidJsProps &
+      BaseProps<WarpSliderThumb> &
+      BaseEvents
+  >;
+
+  /**
+   * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
+   *
+   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
+   *
+   * ## Attributes & Properties
+   *
+   * Component attributes and properties that can be applied to the element or by using JavaScript.
+   *
+   * - `label`: The slider fieldset label. Required for proper accessibility.
+   *
+   * If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
+   * - `disabled`: undefined
+   * - `open-ended`/`openEnded`: Whether or not to allow values outside the range such as "Before 1950" and "2025+".
+   * - `error`: undefined
+   * - `help-text`/`helpText`: undefined
+   * - `invalid`: undefined
+   * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
+   * - `min`: undefined
+   * - `max`: undefined
+   * - `markers`: Pass a value similar to step to create visual markers at that interval
+   * - `step`: undefined
+   * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
+   * - `hidden-textfield`/`hiddenTextfield`: undefined
+   * - `valueFormatter`: Formatter for the tooltip and input mask values. (property only)
+   * - `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)
+   * - `labelFormatter`: Formatter for the min and max labels below the range. (property only)
+   * - `_invalidMessage`: undefined (property only)
+   * - `_hasInternalError`: undefined (property only)
+   * - `_showError`: undefined (property only)
+   * - `_tabbableElements`: undefined (property only)
+   * - `edgeMin`: undefined (property only) (readonly)
+   * - `edgeMax`: undefined (property only) (readonly)
+   * - `componentHasError`: undefined (property only) (readonly)
+   * - `errorText`: undefined (property only) (readonly)
+   *
+   * ## Slots
+   *
+   * Areas where markup can be added to the component.
+   *
+   * - `(default)`: For single sliders place a `<w-slider-thumb>` in the default slot.
+   * - `label`: Label for the slider or range slider as a whole.
+   * - `description`: Optional description between the label and slider.
+   * - `from`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
+   * - `to`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
+   */
+  "w-slider": Partial<
+    WarpSliderProps &
+      WarpSliderSolidJsProps &
+      BaseProps<WarpSlider> &
+      BaseEvents
+  >;
+
   /**
    * Individual step component that shows a single step in a process
    *
@@ -3353,59 +3790,6 @@ export type CustomElementsSolidJs = {
       BaseEvents
   >;
 
-  /**
-   * A single line text input element.
-   *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-textfield--docs)
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `disabled`: undefined
-   * - `invalid`: undefined
-   * - `id`: undefined
-   * - `label`: undefined
-   * - `help-text`/`helpText`: undefined
-   * - `size`: undefined
-   * - `max`: undefined
-   * - `min`: undefined
-   * - `min-length`/`minLength`: undefined
-   * - `max-length`/`maxLength`: undefined
-   * - `pattern`: undefined
-   * - `placeholder`: undefined
-   * - `read-only`/`readOnly`: undefined
-   * - `readonly`: undefined
-   * - `required`: undefined
-   * - `type`: undefined
-   * - `value`: undefined
-   * - `name`: undefined
-   * - `step`: undefined
-   * - `autocomplete`: undefined
-   * - `formatter`: Function to format value when the input field.
-   *
-   * Only active when the input field does not have focus,
-   * similar to the accessible input masking example from Filament Group
-   *
-   * https://css-tricks.com/input-masking/
-   * https://filamentgroup.github.io/politespace/demo/demo.html (property only)
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `resetFormControl() => void`: undefined
-   * - `handler(e: Event) => void`: undefined
-   * - `prefixSlotChange() => void`: undefined
-   * - `suffixSlotChange() => void`: undefined
-   */
-  "w-textfield": Partial<
-    WarpTextFieldProps &
-      WarpTextFieldSolidJsProps &
-      BaseProps<WarpTextField> &
-      BaseEvents
-  >;
-
   /**
    *
    *
@@ -3424,169 +3808,6 @@ export type CustomElementsSolidJs = {
       BaseProps<WarpToastContainer> &
       BaseEvents
   >;
-
-  /**
-   *
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `name`: The name of the checkbox, submitted as a name/value pair with form data.
-   * - `value`: The value of the checkbox, submitted as a name/value pair with form data.
-   * - `indeterminate`: Draws the checkbox in an indeterminate state.
-   * - `checked`: Draws the checkbox in a checked state (reflected to attribute).
-   * - `disabled`: Disables the checkbox.
-   * - `required`: Makes the checkbox a required field.
-   * - `invalid`: Draws the checkbox in an invalid state.
-   * - `input`: undefined (property only)
-   * - `validationMessage`: Returns the validation message if the checkbox is invalid, otherwise an empty string (property only) (readonly)
-   * - `validity`: Returns the validity state of the checkbox (property only) (readonly)
-   *
-   * ## Events
-   *
-   * Events that will be emitted by the component.
-   *
-   * - `change`: undefined
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `resetFormControl() => void`: undefined
-   * - `click() => void`: undefined
-   * - `focus(options?: FocusOptions) => void`: undefined
-   * - `blur() => void`: undefined
-   * - `checkValidity() => boolean`: Checks whether the checkbox passes constraint validation
-   * - `reportValidity() => boolean`: Checks validity and shows the browser's validation message if invalid
-   */
-  "w-checkbox": Partial<
-    WCheckboxProps & WCheckboxSolidJsProps & BaseProps<WCheckbox> & BaseEvents
-  >;
-
-  /**
-   *
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `label`: The group label displayed above the checkboxes.
-   * - `name`: The name applied to child checkboxes when they do not provide one.
-   * - `optional`: Whether to show optional text next to the label.
-   * - `help-text`/`helpText`: undefined
-   * - `required`: Makes the checkbox group required.
-   * - `invalid`: Marks the checkbox group as invalid.
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `checkValidity() => boolean`: Checks whether the group passes constraint validation
-   * - `reportValidity() => boolean`: Checks validity and shows the validation message if invalid
-   * - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox group.
-   */
-  "w-checkbox-group": Partial<
-    WCheckboxGroupProps &
-      WCheckboxGroupSolidJsProps &
-      BaseProps<WCheckboxGroup> &
-      BaseEvents
-  >;
-
-  /**
-   * Component to place inside a `<w-slider>`.
-   *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `aria-label`/`ariaLabel`: undefined
-   * - `aria-description`/`ariaDescription`: undefined
-   * - `name`: undefined
-   * - `value`: undefined
-   * - `placeholder`: undefined
-   * - `range`: undefined (property only)
-   * - `tooltipTarget`: undefined (property only)
-   * - `textfield`: undefined (property only)
-   * - `boundaryValue`: undefined (property only) (readonly)
-   * - `textFieldDisplayValue`: Value to display in the textfield (shows boundary when focused on empty value) (property only) (readonly)
-   * - `tooltipDisplayValue`: Value to display in the tooltip (property only) (readonly)
-   * - `ariaDescriptionText`: undefined (property only) (readonly)
-   *
-   * ## Events
-   *
-   * Events that will be emitted by the component.
-   *
-   * - `slidervalidity`: undefined
-   *
-   * ## Methods
-   *
-   * Methods that can be called to access component functionality.
-   *
-   * - `resetFormControl() => void`: undefined
-   * - `updateFieldAfterValidation() => void`: undefined
-   */
-  "w-slider-thumb": Partial<
-    WarpSliderThumbProps &
-      WarpSliderThumbSolidJsProps &
-      BaseProps<WarpSliderThumb> &
-      BaseEvents
-  >;
-
-  /**
-   * Parent component for sliders (both single and range sliders). Used in combination with a `<w-slider-thumb>`.
-   *
-   * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/forms-slider-and-range-slider--docs)
-   *
-   * ## Attributes & Properties
-   *
-   * Component attributes and properties that can be applied to the element or by using JavaScript.
-   *
-   * - `label`: The slider fieldset label. Required for proper accessibility.
-   *
-   * If you need to display HTML, use the `label` slot instead (f. ex. `<legend class="sr-only" slot="label">Production year</legend>`)
-   * - `disabled`: undefined
-   * - `open-ended`/`openEnded`: Whether or not to allow values outside the range such as "Before 1950" and "2025+".
-   * - `error`: undefined
-   * - `help-text`/`helpText`: undefined
-   * - `invalid`: undefined
-   * - `required`: Ensures a child slider thumb has a value before allowing the containing form to submit.
-   * - `min`: undefined
-   * - `max`: undefined
-   * - `markers`: Pass a value similar to step to create visual markers at that interval
-   * - `step`: undefined
-   * - `suffix`: Suffix used in text input fields and for the min and max values of the slider.
-   * - `hidden-textfield`/`hiddenTextfield`: undefined
-   * - `valueFormatter`: Formatter for the tooltip and input mask values. (property only)
-   * - `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)
-   * - `labelFormatter`: Formatter for the min and max labels below the range. (property only)
-   * - `_invalidMessage`: undefined (property only)
-   * - `_hasInternalError`: undefined (property only)
-   * - `_showError`: undefined (property only)
-   * - `_tabbableElements`: undefined (property only)
-   * - `edgeMin`: undefined (property only) (readonly)
-   * - `edgeMax`: undefined (property only) (readonly)
-   * - `componentHasError`: undefined (property only) (readonly)
-   * - `errorText`: undefined (property only) (readonly)
-   *
-   * ## Slots
-   *
-   * Areas where markup can be added to the component.
-   *
-   * - `(default)`: For single sliders place a `<w-slider-thumb>` in the default slot.
-   * - `label`: Label for the slider or range slider as a whole.
-   * - `description`: Optional description between the label and slider.
-   * - `from`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
-   * - `to`: Range sliders need to place a `<w-slider-thumb>` in the from and to slots.
-   */
-  "w-slider": Partial<
-    WarpSliderProps &
-      WarpSliderSolidJsProps &
-      BaseProps<WarpSlider> &
-      BaseEvents
-  >;
 };
 
 export type CustomCssProperties = {};