@warp-ds/elements 2.3.0-next.24 → 2.3.0-next.26

package/dist/index.d.ts

@@ -21,6 +21,9 @@ import type { WarpDatepicker } from "./packages/datepicker/datepicker.ts";
 import type { WarpDeadToggle } from "./packages/deadtoggle/index.ts";
 import type { WarpPageIndicator } from "./packages/pageindicator/index.ts";
 import type { WarpPagination } from "./packages/pagination/index.ts";
+import type { WRadio } from "./packages/radio/radio.ts";
+import type { WRadioGroup } from "./packages/radio/radio-group.ts";
+import type { WCheckbox } from "./packages/checkbox/checkbox.ts";
 import type { WCheckboxGroup } from "./packages/checkbox/checkbox-group.ts";
 import type { WarpSliderThumb } from "./packages/slider/slider-thumb.ts";
 import type { WarpSlider } from "./packages/slider/slider.ts";
@@ -697,6 +700,104 @@ export type WarpPaginationProps = {
 }
 
 
+export type WRadioProps = {
+  /** The string pointing to a form's id. */
+  "form"?: WRadio['form'];
+  /** The radio's value. When selected, the radio group will receive this value. */
+  "value"?: WRadio['value'];
+  /** The radio's value. When selected, the radio group will receive this value. */
+  "appearance"?: WRadio['appearance'];
+  /** The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
+attribute can typically be omitted. */
+  "size"?: WRadio['size'];
+  /** Disables the radio. */
+  "disabled"?: WRadio['disabled'];
+  /**  */
+  "checked"?: WRadio['checked'];
+
+
+}
+
+
+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 groups's hint. If you need to display HTML, use the `hint` slot instead. */
+  "hint"?: WRadioGroup['hint'];
+  /** The name of the radio group, submitted as a name/value pair with form data. */
+  "name"?: WRadioGroup['name'];
+  /** Disables the radio group and all child radios. */
+  "disabled"?: WRadioGroup['disabled'];
+  /** The orientation in which to show radio items. */
+  "orientation"?: WRadioGroup['orientation'];
+  /** The default value of the form control. Primarily used for resetting the form control. */
+  "value"?: WRadioGroup['defaultValue'];
+  /** The default value of the form control. Primarily used for resetting the form control. */
+  "defaultValue"?: WRadioGroup['defaultValue'];
+  /** The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overridden. */
+  "size"?: WRadioGroup['size'];
+  /** Ensures a child radio is checked before allowing the containing form to submit. */
+  "required"?: WRadioGroup['required'];
+  /** Used for SSR. if true, will show slotted label on initial render. */
+  "with-label"?: WRadioGroup['withLabel'];
+  /** Used for SSR. if true, will show slotted label on initial render. */
+  "withLabel"?: WRadioGroup['withLabel'];
+  /** Used for SSR. if true, will show slotted hint on initial render. */
+  "with-hint"?: WRadioGroup['withHint'];
+  /** Used for SSR. if true, will show slotted hint on initial render. */
+  "withHint"?: WRadioGroup['withHint'];
+  /**  */
+  "hasRadioButtons"?: WRadioGroup['hasRadioButtons'];
+  /**  */
+  "defaultSlot"?: WRadioGroup['defaultSlot'];
+
+  /**  */
+  "oninput"?: (e: CustomEvent<InputEvent>) => void;
+  /**  */
+  "onchange"?: (e: CustomEvent<Event>) => void;
+}
+
+
+export type WCheckboxProps = {
+  /**  */
+  "title"?: WCheckbox['title'];
+  /** 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'];
+  /** The checkbox's size. */
+  "size"?: WCheckbox['size'];
+  /** Disables the checkbox. */
+  "disabled"?: WCheckbox['disabled'];
+  /** Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+all/none" behavior when associated checkboxes have a mix of checked and unchecked states. */
+  "indeterminate"?: WCheckbox['indeterminate'];
+  /** The default value of the form control. Primarily used for resetting the form control. */
+  "checked"?: WCheckbox['defaultChecked'];
+  /** The default value of the form control. Primarily used for resetting the form control. */
+  "defaultChecked"?: WCheckbox['defaultChecked'];
+  /** By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+the same document or shadow root for this to work. */
+  "form"?: WCheckbox['form'];
+  /** Makes the checkbox a required field. */
+  "required"?: WCheckbox['required'];
+  /** The checkbox's hint. If you need to display HTML, use the `hint` slot instead. */
+  "hint"?: WCheckbox['hint'];
+  /**  */
+  "input"?: WCheckbox['input'];
+
+  /**  */
+  "onchange"?: (e: CustomEvent<Event>) => void;
+}
+
+
+export type WCheckboxGroupProps = {
+
+
+}
+
 
 export type WarpSliderThumbProps = {
   /**  */
@@ -806,9 +907,13 @@ export type WarpStepProps = {
 
 
 export type WarpSwitchProps = {
+  /**  */
+  "name"?: WarpSwitch['name'];
   /**  */
   "value"?: WarpSwitch['value'];
   /**  */
+  "checked"?: WarpSwitch['checked'];
+  /**  */
   "disabled"?: WarpSwitch['disabled'];
 
   /**  */
@@ -980,6 +1085,12 @@ export type WarpTextareaProps = {
  * - `name`: undefined 
  * - `value`: undefined 
  * - `ariaValueTextLoading`: undefined (property only)
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `resetFormControl() => void`: undefined
   */
     "w-button": Partial<WarpButtonProps & BaseProps<WarpButton> & BaseEvents>;
 
@@ -1177,6 +1288,7 @@ export type WarpTextareaProps = {
  * 
  * Methods that can be called to access component functionality.
  * 
+ * - `resetFormControl() => void`: undefined
  * - `handleKeyDown(event: KeyboardEvent) => void`: undefined
  * - `onChange({ target }) => void`: undefined
   */
@@ -1223,6 +1335,7 @@ export type WarpTextareaProps = {
  * 
  * Methods that can be called to access component functionality.
  * 
+ * - `resetFormControl() => void`: undefined
  * - `handler(e: Event) => void`: undefined
  * - `prefixSlotChange() => void`: undefined
  * - `suffixSlotChange() => void`: undefined
@@ -1363,6 +1476,12 @@ export type WarpTextareaProps = {
  * - `class-name`/`containerClassName`: Additional container styling 
  * - `list-class-name`/`listClassName`: Additional list styling 
  * - `name`: Name attribute for form submission 
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `resetFormControl() => void`: undefined
   */
     "w-combobox": Partial<WarpComboboxProps & BaseProps<WarpCombobox> & BaseEvents>;
 
@@ -1410,6 +1529,12 @@ export type WarpTextareaProps = {
  * the query will point to an element that doesn't exist anymore. (property only)
  * - `todayCell`: undefined (property only)
  * - `selectedCell`: undefined (property only)
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `resetFormControl() => void`: undefined
   */
     "w-datepicker": Partial<WarpDatepickerProps & BaseProps<WarpDatepicker> & BaseEvents>;
 
@@ -1468,6 +1593,127 @@ export type WarpTextareaProps = {
     "w-pagination": Partial<WarpPaginationProps & BaseProps<WarpPagination> & BaseEvents>;
 
 
+  /**
+     * 
+ * 
+ * ## Attributes & Properties
+ * 
+ * Component attributes and properties that can be applied to the element or by using JavaScript.
+ * 
+ * - `form`: The string pointing to a form's id. 
+ * - `value`: The radio's value. When selected, the radio group will receive this value. 
+ * - `appearance`: The radio's value. When selected, the radio group will receive this value. 
+ * - `size`: The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
+ * attribute can typically be omitted. 
+ * - `disabled`: Disables the radio. 
+ * - `checked`: undefined (property only)
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `setValue() => void`: undefined
+  */
+    "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. 
+ * - `hint`: The radio groups's hint. If you need to display HTML, use the `hint` slot instead. 
+ * - `name`: The name of the radio group, submitted as a name/value pair with form data. 
+ * - `disabled`: Disables the radio group and all child radios. 
+ * - `orientation`: The orientation in which to show radio items. 
+ * - `value`/`defaultValue`: The default value of the form control. Primarily used for resetting the form control. 
+ * - `size`: The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overridden. 
+ * - `required`: Ensures a child radio is checked before allowing the containing form to submit. 
+ * - `with-label`/`withLabel`: Used for SSR. if true, will show slotted label on initial render. 
+ * - `with-hint`/`withHint`: Used for SSR. if true, will show slotted hint on initial render. 
+ * - `hasRadioButtons`: undefined (property only)
+ * - `defaultSlot`: undefined (property only)
+ * - `value`: The current value of the radio group, submitted as a name/value pair with form data. (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)
+ * 
+ * ## Events
+ * 
+ * Events that will be emitted by the component.
+ * 
+ * - `input`: undefined
+ * - `change`: undefined
+ * 
+ * ## Slots
+ * 
+ * Areas where markup can be added to the component.
+ * 
+ * - `label`: Alternative to the `label` attribute should you need custom HTML.
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `formResetCallback(args: Parameters<BaseFormAssociatedElement['formResetCallback']>) => void`: undefined
+ * - `focus(options?: FocusOptions) => void`: Sets focus on the radio group.
+  */
+    "w-radio-group": Partial<WRadioGroupProps & BaseProps<WRadioGroup> & BaseEvents>;
+
+
+  /**
+     * 
+ * 
+ * ## Attributes & Properties
+ * 
+ * Component attributes and properties that can be applied to the element or by using JavaScript.
+ * 
+ * - `title`: undefined 
+ * - `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. 
+ * - `size`: The checkbox's size. 
+ * - `disabled`: Disables the checkbox. 
+ * - `indeterminate`: Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+ * all/none" behavior when associated checkboxes have a mix of checked and unchecked states. 
+ * - `checked`/`defaultChecked`: The default value of the form control. Primarily used for resetting the form control. 
+ * - `form`: By default, form controls are associated with the nearest containing `<form>` element. This attribute allows you
+ * to place the form control outside of a form and associate it with the form that has this `id`. The form must be in
+ * the same document or shadow root for this to work. 
+ * - `required`: Makes the checkbox a required field. 
+ * - `hint`: The checkbox's hint. If you need to display HTML, use the `hint` slot instead. 
+ * - `input`: undefined (property only)
+ * - `checked`: Draws the checkbox in a checked state. (property only)
+ * 
+ * ## Events
+ * 
+ * Events that will be emitted by the component.
+ * 
+ * - `change`: undefined
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `handleDefaultCheckedChange() => void`: undefined
+ * - `handleValueOrCheckedChange() => void`: undefined
+ * - `handleStateChange() => void`: undefined
+ * - `handleDisabledChange() => void`: undefined
+ * - `formResetCallback() => void`: undefined
+ * - `click() => void`: Simulates a click on the checkbox.
+ * - `focus(options?: FocusOptions) => void`: Sets focus on the checkbox.
+ * - `blur() => void`: Removes focus from the checkbox.
+  */
+    "w-checkbox": Partial<WCheckboxProps & BaseProps<WCheckbox> & BaseEvents>;
+
+
+  /**
+     * 
+  */
+    "w-checkbox-group": Partial<WCheckboxGroupProps & BaseProps<WCheckboxGroup> & BaseEvents>;
+
 
   /**
      * Component to place inside a `<w-slider>`.
@@ -1504,6 +1750,12 @@ export type WarpTextareaProps = {
  * Events that will be emitted by the component.
  * 
  * - `slidervalidity`: undefined
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `resetFormControl() => void`: undefined
   */
     "w-slider-thumb": Partial<WarpSliderThumbProps & BaseProps<WarpSliderThumb> & BaseEvents>;
 
@@ -1600,7 +1852,9 @@ export type WarpTextareaProps = {
  * 
  * Component attributes and properties that can be applied to the element or by using JavaScript.
  * 
+ * - `name`: undefined 
  * - `value`: undefined 
+ * - `checked`: undefined 
  * - `disabled`: undefined 
  * 
  * ## Events
@@ -1608,6 +1862,12 @@ export type WarpTextareaProps = {
  * Events that will be emitted by the component.
  * 
  * - `change`: undefined
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `resetFormControl() => void`: undefined
   */
     "w-switch": Partial<WarpSwitchProps & BaseProps<WarpSwitch> & BaseEvents>;
 
@@ -1682,6 +1942,7 @@ export type WarpTextareaProps = {
  * 
  * Methods that can be called to access component functionality.
  * 
+ * - `resetFormControl() => void`: undefined
  * - `handler(e: InputEvent) => void`: undefined
   */
     "w-textarea": Partial<WarpTextareaProps & BaseProps<WarpTextarea> & BaseEvents>;