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

package/dist/packages/slider/react.d.ts

@@ -1,3 +1,8 @@
+import React from 'react';
 import { WarpSlider } from './slider.js';
 export { SliderThumb } from '../slider-thumb/react.js';
-export declare const Slider: import("@lit/react").ReactWebComponent<WarpSlider, {}>;
+export declare const Slider: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpSlider>, "fieldset" | "label" | "disabled" | "invalid" | "helpText" | "max" | "min" | "required" | "step" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "render" | "renderOptions" | "suffix" | "error" | "openEnded" | "markers" | "valueFormatter" | "tooltipFormatter" | "labelFormatter" | "hiddenTextfield" | "_invalidMessage" | "_hasInternalError" | "_showError" | "_tabbableElements" | "edgeMin" | "edgeMax" | "componentHasError" | "errorText"> & {} & Partial<Omit<WarpSlider, keyof HTMLElement>> & React.RefAttributes<WarpSlider>, "ref">, "help-text" | "open-ended" | "hidden-textfield"> & {
+    openEnded?: boolean;
+    helpText?: string;
+    hiddenTextfield?: boolean;
+} & React.RefAttributes<WarpSlider>>;

package/dist/packages/slider/react.js

@@ -6,8 +6,16 @@ export { SliderThumb } from '../slider-thumb/react.js';
 // decouple from CDN by providing a dummy class
 class Component extends LitElement {
 }
-export const Slider = createComponent({
+const BaseSlider = createComponent({
     tagName: 'w-slider',
     elementClass: Component,
     react: React,
 });
+export const Slider = React.forwardRef(({ openEnded, helpText, hiddenTextfield, ...props }, ref) => React.createElement(BaseSlider, {
+    ...props,
+    ...(openEnded ? { 'open-ended': true } : {}),
+    ...(helpText !== undefined ? { 'help-text': helpText } : {}),
+    ...(hiddenTextfield ? { 'hidden-textfield': true } : {}),
+    ref,
+}));
+Slider.displayName = 'Slider';

package/dist/packages/slider/slider.react.stories.d.ts

@@ -1,8 +1,13 @@
 import { StoryObj } from '@storybook/react';
+import React from 'react';
 import { Slider } from './react';
 declare const _default: {
     title: string;
-    component: import("@lit/react").ReactWebComponent<import("./slider").WarpSlider, {}>;
+    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./slider").WarpSlider>, "fieldset" | "label" | "disabled" | "invalid" | "helpText" | "max" | "min" | "required" | "step" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "render" | "renderOptions" | "suffix" | "error" | "openEnded" | "markers" | "valueFormatter" | "tooltipFormatter" | "labelFormatter" | "hiddenTextfield" | "_invalidMessage" | "_hasInternalError" | "_showError" | "_tabbableElements" | "edgeMin" | "edgeMax" | "componentHasError" | "errorText"> & {} & Partial<Omit<import("./slider").WarpSlider, keyof HTMLElement>> & React.RefAttributes<import("./slider").WarpSlider>, "ref">, "help-text" | "open-ended" | "hidden-textfield"> & {
+        openEnded?: boolean;
+        helpText?: string;
+        hiddenTextfield?: boolean;
+    } & React.RefAttributes<import("./slider").WarpSlider>>;
 };
 export default _default;
 export type Story = StoryObj<typeof Slider>;

package/dist/packages/slider/slider.react.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/packages/slider/slider.react.test.js

@@ -0,0 +1,7 @@
+import { describeReactSsrAttributeMapping } from '../../tests/react-ssr-attributes';
+import { Slider } from './react.js';
+describeReactSsrAttributeMapping('Slider', Slider, [
+    { propName: 'openEnded', attrName: 'open-ended' },
+    { propName: 'helpText', attrName: 'help-text', value: 'Help text' },
+    { propName: 'hiddenTextfield', attrName: 'hidden-textfield' },
+]);

package/dist/packages/slider-thumb/react.d.ts

@@ -1,6 +1,9 @@
-import { EventName } from '@lit/react';
+import React from 'react';
 import { WarpSliderThumb } from './slider-thumb.js';
-export declare const SliderThumb: import("@lit/react").ReactWebComponent<WarpSliderThumb, {
-    onSliderValidity: EventName<CustomEvent>;
-    'onslider-validity': EventName<CustomEvent>;
-}>;
+export declare const SliderThumb: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpSliderThumb>, "value" | "form" | "name" | "textfield" | "disabled" | "invalid" | "max" | "min" | "placeholder" | "required" | "step" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "suffix" | "range" | "openEnded" | "markers" | "valueFormatter" | "tooltipFormatter" | "labelFormatter" | "tooltipTarget" | "_showTooltip" | "_inputHasFocus" | "_hiddenTextfield" | "anchorPositioningStyleElement" | "updateFieldAfterValidation" | "boundaryValue" | "textFieldDisplayValue" | "tooltipDisplayValue" | "ariaDescriptionText" | "onSliderValidity" | "onslider-validity"> & {
+    onSliderValidity?: (e: CustomEvent<any>) => void;
+    'onslider-validity'?: (e: CustomEvent<any>) => void;
+} & Partial<Omit<WarpSliderThumb, keyof HTMLElement>> & React.RefAttributes<WarpSliderThumb>, "ref">, "aria-description" | "aria-label"> & {
+    ariaLabel?: string;
+    ariaDescription?: string;
+} & React.RefAttributes<WarpSliderThumb>>;

package/dist/packages/slider-thumb/react.js

@@ -4,7 +4,7 @@ import React from 'react';
 // decouple from CDN by providing a dummy class
 class Component extends LitElement {
 }
-export const SliderThumb = createComponent({
+const BaseSliderThumb = createComponent({
     tagName: 'w-slider-thumb',
     elementClass: Component,
     react: React,
@@ -13,3 +13,10 @@ export const SliderThumb = createComponent({
         'onslider-validity': 'slidervalidity', // should be slider-validity
     },
 });
+export const SliderThumb = React.forwardRef(({ ariaLabel, ariaDescription, ...props }, ref) => React.createElement(BaseSliderThumb, {
+    ...props,
+    ...(ariaLabel !== undefined ? { 'aria-label': ariaLabel } : {}),
+    ...(ariaDescription !== undefined ? { 'aria-description': ariaDescription } : {}),
+    ref,
+}));
+SliderThumb.displayName = 'SliderThumb';

package/dist/packages/slider-thumb/slider-thumb.react.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/packages/slider-thumb/slider-thumb.react.test.js

@@ -0,0 +1,6 @@
+import { describeReactSsrAttributeMapping } from '../../tests/react-ssr-attributes';
+import { SliderThumb } from './react.js';
+describeReactSsrAttributeMapping('SliderThumb', SliderThumb, [
+    { propName: 'ariaLabel', attrName: 'aria-label', value: 'Value' },
+    { propName: 'ariaDescription', attrName: 'aria-description', value: 'Description' },
+]);

package/dist/packages/step/step.d.ts

@@ -8,16 +8,20 @@ export interface StepsContext {
 }
 /**
  * Individual step component that shows a single step in a process
+ *
+ * @parent w-step-indicator
  */
 export declare class WarpStep extends LitElement {
     /**
-     * @summary
-     * @description
+     * Whether this step is active.
+     *
+     * The active step displays a filled indicator.
      */
     active: boolean;
     /**
-     * @summary
-     * @description
+     * Whether this step is completed.
+     *
+     * Completed steps display a checkmark icon and a filled indicator.
      */
     completed: boolean;
     private _context;