@warp-ds/elements 2.3.0-next.2 → 2.3.0-next.20

package/dist/index.d.ts

@@ -21,12 +21,14 @@ import type { WarpDatepicker } from "./packages/datepicker/datepicker.ts";
 import type { WarpDeadToggle } from "./packages/dead-toggle/index.ts";
 import type { WarpPageIndicator } from "./packages/pageindicator/index.ts";
 import type { WarpPagination } from "./packages/pagination/index.ts";
+import type { WCheckboxGroup } from "./packages/rip-and-tear-checkbox/checkbox-group.ts";
 import type { WarpSliderThumb } from "./packages/slider/slider-thumb.ts";
 import type { WarpSlider } from "./packages/slider/slider.ts";
-import type { WarpSteps, WarpStep } from "./packages/steps/index.ts";
+import type { WarpStepIndicator, WarpStep } from "./packages/steps/index.ts";
 import type { WarpSwitch } from "./packages/switch/index.ts";
 import type { WarpTab } from "./packages/tabs/tab.ts";
 import type { WarpTabs } from "./packages/tabs/tabs.ts";
+import type { WarpTextarea } from "./packages/textarea/textarea.ts";
 
 /**
  * This type can be used to create scoped tags for your components.
@@ -377,15 +379,21 @@ export type WarpPillProps = {
 
 
 export type WarpSelectProps = {
-  /** Whether the element should receive focus on render */
+  /** @deprecated Use the native `autofocus` attribute instead. - Whether the element should receive focus on render. */
   "auto-focus"?: WarpSelect['autoFocus'];
-  /** Whether the element should receive focus on render */
+  /** @deprecated Use the native `autofocus` attribute instead. - Whether the element should receive focus on render. */
   "autoFocus"?: WarpSelect['autoFocus'];
-  /** Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error */
+  /** Whether the element should receive focus on render */
+  "autofocus"?: WarpSelect['autofocus'];
+  /** The content displayed as the help text. Paired with `invalid` to show the text as a validation error. */
+  "help-text"?: WarpSelect['helpText'];
+  /** The content displayed as the help text. Paired with `invalid` to show the text as a validation error. */
+  "helpText"?: WarpSelect['helpText'];
+  /** Renders the field in an invalid state. Paired with `help-text` to provide feedback about the error. */
   "invalid"?: WarpSelect['invalid'];
-  /** Whether to always show a hint */
+  /** @deprecated Use `help-text` instead and only set it if you want to display the help text. - Whether to always show a hint. */
   "always"?: WarpSelect['always'];
-  /** The content displayed as the help text */
+  /** @deprecated Use `help-text` instead. - The content displayed as the help text. */
   "hint"?: WarpSelect['hint'];
   /** The content to disply as the label */
   "label"?: WarpSelect['label'];
@@ -393,10 +401,12 @@ export type WarpSelectProps = {
   "optional"?: WarpSelect['optional'];
   /** Renders the field in a disabled state. */
   "disabled"?: WarpSelect['disabled'];
-  /** Renders the field in a readonly state. */
+  /** @deprecated Use the native readonly attribute instead. - Renders the field in a readonly state. */
   "read-only"?: WarpSelect['readOnly'];
-  /** Renders the field in a readonly state. */
+  /** @deprecated Use the native readonly attribute instead. - Renders the field in a readonly state. */
   "readOnly"?: WarpSelect['readOnly'];
+  /** Renders the field in a readonly state. */
+  "readonly"?: WarpSelect['readonly'];
   /**  */
   "name"?: WarpSelect['name'];
   /**  */
@@ -437,11 +447,13 @@ export type WarpTextFieldProps = {
   "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'];
@@ -449,6 +461,8 @@ export type WarpTextFieldProps = {
   "value"?: WarpTextField['value'];
   /**  */
   "name"?: WarpTextField['name'];
+  /**  */
+  "step"?: WarpTextField['step'];
   /** Function to format value when the input field.
 
 Only active when the input field does not have focus,
@@ -683,6 +697,7 @@ export type WarpPaginationProps = {
 }
 
 
+
 export type WarpSliderThumbProps = {
   /**  */
   "aria-label"?: WarpSliderThumb['ariaLabel'];
@@ -700,6 +715,10 @@ export type WarpSliderThumbProps = {
   "value"?: WarpSliderThumb['value'];
   /**  */
   "disabled"?: WarpSliderThumb['disabled'];
+  /**  */
+  "invalid"?: WarpSliderThumb['invalid'];
+  /** Set by `<w-slider>` */
+  "allowValuesOutsideRange"?: WarpSliderThumb['allowValuesOutsideRange'];
   /** Set by `<w-slider>` */
   "markers"?: WarpSliderThumb['markers'];
   /** Set by `<w-slider>` */
@@ -732,6 +751,16 @@ If you need to display HTML, use the `label` slot instead. */
   /**  */
   "disabled"?: WarpSlider['disabled'];
   /**  */
+  "allow-values-outside-range"?: WarpSlider['allowValuesOutsideRange'];
+  /**  */
+  "allowValuesOutsideRange"?: WarpSlider['allowValuesOutsideRange'];
+  /**  */
+  "error"?: WarpSlider['error'];
+  /**  */
+  "help-text"?: WarpSlider['helpText'];
+  /**  */
+  "helpText"?: WarpSlider['helpText'];
+  /**  */
   "invalid"?: WarpSlider['invalid'];
   /** Ensures a child slider thumb has a value before allowing the containing form to submit. */
   "required"?: WarpSlider['required'];
@@ -747,16 +776,20 @@ If you need to display HTML, use the `label` slot instead. */
   "suffix"?: WarpSlider['suffix'];
   /** Function to format the to- and from labels and value in the slider thumb tooltip. */
   "formatter"?: WarpSlider['formatter'];
+  /**  */
+  "_invalidMessage"?: WarpSlider['_invalidMessage'];
+  /**  */
+  "_hasInternalError"?: WarpSlider['_hasInternalError'];
 
 
 }
 
 
-export type WarpStepsProps = {
+export type WarpStepIndicatorProps = {
   /**  */
-  "horizontal"?: WarpSteps['horizontal'];
+  "horizontal"?: WarpStepIndicator['horizontal'];
   /**  */
-  "right"?: WarpSteps['right'];
+  "right"?: WarpStepIndicator['right'];
 
 
 }
@@ -811,6 +844,50 @@ export type WarpTabsProps = {
 
   /**  */
   "onchange"?: (e: CustomEvent<CustomEvent>) => void;
+}
+
+
+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 CustomElements = {
@@ -1082,14 +1159,17 @@ export type WarpTabsProps = {
  * 
  * Component attributes and properties that can be applied to the element or by using JavaScript.
  * 
- * - `auto-focus`/`autoFocus`: Whether the element should receive focus on render 
- * - `invalid`: Renders the field in an invalid state. Often paired with `hint` to provide feedback about the error 
- * - `always`: Whether to always show a hint 
- * - `hint`: The content displayed as the help text 
+ * - `auto-focus`/`autoFocus`: Whether the element should receive focus on render. 
+ * - `autofocus`: Whether the element should receive focus on render 
+ * - `help-text`/`helpText`: The content displayed as the help text. Paired with `invalid` to show the text as a validation error. 
+ * - `invalid`: Renders the field in an invalid state. Paired with `help-text` to provide feedback about the error. 
+ * - `always`: Whether to always show a hint. 
+ * - `hint`: The content displayed as the help text. 
  * - `label`: The content to disply as the label 
  * - `optional`: Whether to show optional text 
  * - `disabled`: Renders the field in a disabled state. 
  * - `read-only`/`readOnly`: Renders the field in a readonly state. 
+ * - `readonly`: Renders the field in a readonly state. 
  * - `name`: undefined 
  * - `value`: undefined 
  * 
@@ -1125,10 +1205,12 @@ export type WarpTabsProps = {
  * - `pattern`: undefined 
  * - `placeholder`: undefined 
  * - `read-only`/`readOnly`: undefined 
+ * - `readonly`: undefined 
  * - `required`: undefined 
  * - `type`: undefined 
  * - `value`: undefined 
  * - `name`: undefined 
+ * - `step`: undefined 
  * - `formatter`: Function to format value when the input field.
  * 
  * Only active when the input field does not have focus,
@@ -1386,6 +1468,7 @@ export type WarpTabsProps = {
     "w-pagination": Partial<WarpPaginationProps & BaseProps<WarpPagination> & BaseEvents>;
 
 
+
   /**
      * Component to place inside a `<w-slider>`.
  * 
@@ -1401,6 +1484,8 @@ export type WarpTabsProps = {
  * - `name`: undefined 
  * - `value`: undefined 
  * - `disabled`: undefined 
+ * - `invalid`: undefined 
+ * - `allowValuesOutsideRange`: Set by `<w-slider>` (property only)
  * - `markers`: Set by `<w-slider>` (property only)
  * - `required`: Set by `<w-slider>` (property only)
  * - `step`: Set by `<w-slider>` (property only)
@@ -1410,6 +1495,9 @@ export type WarpTabsProps = {
  * - `formatter`: JS hook to help you format the numeric value how you want. (property only)
  * - `range`: 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)
  * 
  * ## Events
  * 
@@ -1433,6 +1521,9 @@ export type WarpTabsProps = {
  * 
  * If you need to display HTML, use the `label` slot instead. 
  * - `disabled`: undefined 
+ * - `allow-values-outside-range`/`allowValuesOutsideRange`: undefined 
+ * - `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 
@@ -1441,6 +1532,12 @@ export type WarpTabsProps = {
  * - `step`: undefined 
  * - `suffix`: Suffix used in text input fields and for the min and max values of the slider. 
  * - `formatter`: Function to format the to- and from labels and value in the slider thumb tooltip. (property only)
+ * - `_invalidMessage`: undefined (property only)
+ * - `_hasInternalError`: undefined (property only)
+ * - `edgeMin`: undefined (property only) (readonly)
+ * - `edgeMax`: undefined (property only) (readonly)
+ * - `componentHasError`: undefined (property only) (readonly)
+ * - `errorText`: undefined (property only) (readonly)
  * 
  * ## Slots
  * 
@@ -1473,7 +1570,7 @@ export type WarpTabsProps = {
  * 
  * - `updateStepsContext() => void`: undefined
   */
-    "w-steps": Partial<WarpStepsProps & BaseProps<WarpSteps> & BaseEvents>;
+    "w-step-indicator": Partial<WarpStepIndicatorProps & BaseProps<WarpStepIndicator> & BaseEvents>;
 
 
   /**
@@ -1554,6 +1651,40 @@ export type WarpTabsProps = {
  * - `change`: undefined
   */
     "w-tabs": Partial<WarpTabsProps & BaseProps<WarpTabs> & 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 
+ * - `label`: undefined 
+ * - `help-text`/`helpText`: undefined 
+ * - `maximum-rows`/`maxRows`: undefined 
+ * - `minimum-rows`/`minRows`: undefined 
+ * - `name`: undefined 
+ * - `placeholder`: undefined 
+ * - `read-only`/`readOnly`: undefined 
+ * - `readonly`: undefined 
+ * - `required`: undefined 
+ * - `value`: undefined 
+ * - `optional`: undefined 
+ * - `minHeight`: undefined (property only)
+ * - `maxHeight`: undefined (property only)
+ * 
+ * ## Methods
+ * 
+ * Methods that can be called to access component functionality.
+ * 
+ * - `handler(e: InputEvent) => void`: undefined
+  */
+    "w-textarea": Partial<WarpTextareaProps & BaseProps<WarpTextarea> & BaseEvents>;
   }
 
 export type CustomCssProperties = {
@@ -1589,7 +1720,7 @@ declare module '@stencil/core' {
   export interface CSSProperties extends CustomCssProperties {}
 }
 
-declare module 'hono' {
+declare module 'hono/jsx' {
   namespace JSX {
     interface IntrinsicElements extends CustomElements {}
   }