@warp-ds/elements 2.10.0-next.18 → 2.10.0-next.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/custom-elements.json +179 -159
- package/dist/docs/affix/affix.md +117 -0
- package/dist/docs/affix/styling.md +107 -0
- package/dist/docs/breadcrumbs/breadcrumbs.md +67 -4
- package/dist/docs/breadcrumbs/styling.md +67 -4
- package/dist/docs/index.md +1 -1
- package/dist/docs/select/select.md +91 -0
- package/dist/docs/select/styling.md +91 -0
- package/dist/docs/textarea/styling.md +91 -0
- package/dist/docs/textarea/textarea.md +91 -0
- package/dist/docs/textfield/api.md +8 -0
- package/dist/docs/textfield/styling.md +95 -0
- package/dist/docs/textfield/textfield.md +103 -0
- package/dist/index.d.ts +90 -64
- package/dist/packages/affix/affix-styles.d.ts +8 -0
- package/dist/packages/affix/affix-styles.js +108 -0
- package/dist/packages/affix/affix.d.ts +11 -8
- package/dist/packages/affix/affix.js +118 -17
- package/dist/packages/affix/affix.js.map +4 -4
- package/dist/packages/affix/affix.react.stories.d.ts +1 -1
- package/dist/packages/affix/react.d.ts +1 -1
- package/dist/packages/alert/alert.js.map +1 -1
- package/dist/packages/attention/attention.js.map +1 -1
- package/dist/packages/breadcrumb-item/breadcrumb-item.js +16 -7
- package/dist/packages/breadcrumb-item/breadcrumb-item.js.map +2 -2
- package/dist/packages/breadcrumb-item/styles.js +14 -5
- package/dist/packages/button/button.react.stories.d.ts +2 -2
- package/dist/packages/button/react.d.ts +1 -1
- package/dist/packages/checkbox-group/react.d.ts +1 -1
- package/dist/packages/combobox/combobox.react.stories.d.ts +2 -2
- package/dist/packages/combobox/react.d.ts +1 -1
- package/dist/packages/datepicker/datepicker.js.map +1 -1
- package/dist/packages/datepicker/datepicker.react.stories.d.ts +2 -2
- package/dist/packages/datepicker/react.d.ts +1 -1
- package/dist/packages/expandable/expandable.js.map +1 -1
- package/dist/packages/icon/icon.js +2 -2
- package/dist/packages/icon/icon.js.map +1 -1
- package/dist/packages/icon/icon.react.stories.d.ts +2 -1
- package/dist/packages/icon/icon.react.stories.js +1 -1
- package/dist/packages/modal-header/modal-header.js.map +1 -1
- package/dist/packages/pagination/pagination.js.map +1 -1
- package/dist/packages/pill/pill.js.map +1 -1
- package/dist/packages/radio-group/react.d.ts +1 -1
- package/dist/packages/select/input-styles.d.ts +11 -0
- package/dist/packages/select/input-styles.js +88 -0
- package/dist/packages/select/react.d.ts +1 -1
- package/dist/packages/select/select.js +96 -19
- package/dist/packages/select/select.js.map +4 -4
- package/dist/packages/select/select.react.stories.d.ts +2 -2
- package/dist/packages/slider/react.d.ts +1 -1
- package/dist/packages/slider/slider.react.stories.d.ts +1 -1
- package/dist/packages/slider-thumb/react.d.ts +1 -1
- package/dist/packages/snackbar/snackbar.d.ts +2 -2
- package/dist/packages/snackbar/snackbar.js +1 -1
- package/dist/packages/snackbar/snackbar.js.map +2 -2
- package/dist/packages/step/step.js.map +1 -1
- package/dist/packages/textarea/input-styles.d.ts +11 -0
- package/dist/packages/textarea/input-styles.js +88 -0
- package/dist/packages/textarea/react.d.ts +1 -1
- package/dist/packages/textarea/textarea.js +99 -20
- package/dist/packages/textarea/textarea.js.map +4 -4
- package/dist/packages/textarea/textarea.react.stories.d.ts +2 -2
- package/dist/packages/textfield/input-styles.d.ts +11 -0
- package/dist/packages/textfield/input-styles.js +88 -0
- package/dist/packages/textfield/locales/da/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/da/messages.mjs +1 -0
- package/dist/packages/textfield/locales/en/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/en/messages.mjs +1 -0
- package/dist/packages/textfield/locales/fi/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/fi/messages.mjs +1 -0
- package/dist/packages/textfield/locales/nb/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/nb/messages.mjs +1 -0
- package/dist/packages/textfield/locales/sv/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/sv/messages.mjs +1 -0
- package/dist/packages/textfield/react.d.ts +1 -1
- package/dist/packages/textfield/textfield.d.ts +11 -1
- package/dist/packages/textfield/textfield.js +111 -24
- package/dist/packages/textfield/textfield.js.map +4 -4
- package/dist/packages/textfield/textfield.react.stories.d.ts +2 -2
- package/dist/packages/toast/toast.js.map +1 -1
- package/dist/web-types.json +60 -50
- package/eik/index.js +20 -20
- package/package.json +1 -1
|
@@ -3,7 +3,7 @@ import React from "react";
|
|
|
3
3
|
import { Select } from "./react";
|
|
4
4
|
declare const _default: {
|
|
5
5
|
title: string;
|
|
6
|
-
render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./select").WarpSelect>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "readOnly" | "readonly" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "autoFocus" | "onChange" | "hint" | "
|
|
6
|
+
render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./select").WarpSelect>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "readOnly" | "readonly" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "autoFocus" | "onChange" | "hint" | "willUpdate" | "formStateRestoreCallback" | "always" | "_setValue" | "handleKeyDown"> & {
|
|
7
7
|
onChange?: ((e: CustomEvent<any>) => void) | undefined;
|
|
8
8
|
onchange?: ((e: CustomEvent<any>) => void) | undefined;
|
|
9
9
|
} & Partial<Omit<import("./select").WarpSelect, keyof HTMLElement>> & React.RefAttributes<import("./select").WarpSelect>, "ref">, "help-text" | "read-only" | "auto-focus"> & {
|
|
@@ -11,7 +11,7 @@ declare const _default: {
|
|
|
11
11
|
helpText?: string;
|
|
12
12
|
readOnly?: boolean;
|
|
13
13
|
} & React.RefAttributes<import("./select").WarpSelect>): React.JSX.Element;
|
|
14
|
-
component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./select").WarpSelect>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "readOnly" | "readonly" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "autoFocus" | "onChange" | "hint" | "
|
|
14
|
+
component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./select").WarpSelect>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "readOnly" | "readonly" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "autoFocus" | "onChange" | "hint" | "willUpdate" | "formStateRestoreCallback" | "always" | "_setValue" | "handleKeyDown"> & {
|
|
15
15
|
onChange?: ((e: CustomEvent<any>) => void) | undefined;
|
|
16
16
|
onchange?: ((e: CustomEvent<any>) => void) | undefined;
|
|
17
17
|
} & Partial<Omit<import("./select").WarpSelect, keyof HTMLElement>> & React.RefAttributes<import("./select").WarpSelect>, "ref">, "help-text" | "read-only" | "auto-focus"> & {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { WarpSlider } from "./slider.js";
|
|
3
3
|
export { SliderThumb } from "../slider-thumb/react.js";
|
|
4
|
-
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" | "
|
|
4
|
+
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" | "error" | "openEnded" | "markers" | "suffix" | "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"> & {
|
|
5
5
|
openEnded?: boolean;
|
|
6
6
|
helpText?: string;
|
|
7
7
|
hiddenTextfield?: boolean;
|
|
@@ -3,7 +3,7 @@ import React from "react";
|
|
|
3
3
|
import { Slider } from "./react";
|
|
4
4
|
declare const _default: {
|
|
5
5
|
title: string;
|
|
6
|
-
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" | "
|
|
6
|
+
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" | "error" | "openEnded" | "markers" | "suffix" | "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"> & {
|
|
7
7
|
openEnded?: boolean;
|
|
8
8
|
helpText?: string;
|
|
9
9
|
hiddenTextfield?: boolean;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { WarpSliderThumb } from "./slider-thumb.js";
|
|
3
|
-
export declare const SliderThumb: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpSliderThumb>, "value" | "form" | "
|
|
3
|
+
export declare const SliderThumb: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpSliderThumb>, "value" | "form" | "textfield" | "name" | "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" | "range" | "openEnded" | "markers" | "suffix" | "valueFormatter" | "tooltipFormatter" | "labelFormatter" | "tooltipTarget" | "_showTooltip" | "_inputHasFocus" | "_hiddenTextfield" | "anchorPositioningStyleElement" | "updateFieldAfterValidation" | "boundaryValue" | "textFieldDisplayValue" | "tooltipDisplayValue" | "ariaDescriptionText" | "onSliderValidity" | "onslider-validity"> & {
|
|
4
4
|
onSliderValidity?: ((e: CustomEvent<any>) => void) | undefined;
|
|
5
5
|
"onslider-validity"?: ((e: CustomEvent<any>) => void) | undefined;
|
|
6
6
|
} & Partial<Omit<WarpSliderThumb, keyof HTMLElement>> & React.RefAttributes<WarpSliderThumb>, "ref">, "aria-description" | "aria-label"> & {
|
|
@@ -11,7 +11,7 @@ export type CreateSnackbarOptions = {
|
|
|
11
11
|
*
|
|
12
12
|
* @default true
|
|
13
13
|
*/
|
|
14
|
-
canClose?: boolean | ((this: GlobalEventHandlers, ev: PointerEvent) =>
|
|
14
|
+
canClose?: boolean | ((this: GlobalEventHandlers, ev: PointerEvent) => void);
|
|
15
15
|
/**
|
|
16
16
|
* Duration until the message hides automatically.
|
|
17
17
|
*
|
|
@@ -40,7 +40,7 @@ export type CreateSnackbarOptions = {
|
|
|
40
40
|
/**
|
|
41
41
|
* The action button's `onclick` property.
|
|
42
42
|
*/
|
|
43
|
-
onclick: (this: GlobalEventHandlers, ev: PointerEvent) =>
|
|
43
|
+
onclick: (this: GlobalEventHandlers, ev: PointerEvent) => void;
|
|
44
44
|
/**
|
|
45
45
|
* Overrides the default placement of the action button.
|
|
46
46
|
*
|
|
@@ -2657,7 +2657,7 @@ Please compile your catalog first.
|
|
|
2657
2657
|
::slotted(*) {
|
|
2658
2658
|
pointer-events: initial;
|
|
2659
2659
|
}
|
|
2660
|
-
`;var er={canClose:!0,duration:4e3,variant:"neutral"};me(fe,xe,ke,we,ye);var rr=/\s/,D=class extends We{constructor(){super(),this.internals=this.attachInternals(),this.internals.ariaLive="polite",this.internals.role="log",this._onKeydown=this._onKeydown.bind(this)}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this._onKeydown)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this._onKeydown)}_onKeydown(e){if(e.key==="Escape"){let r=this.shadowRoot?.host.querySelector("w-snackbar-item:last-of-type");r&&r.close()}else if(e.altKey&&e.key==="Enter"){e.preventDefault();let r=this.shadowRoot?.host.querySelector("w-snackbar-item:last-of-type");if(console.log("Found item!"),r){let t=r.querySelector('w-button[slot="action"]');console.log("Found action!"),t&&(t.click(),console.log("Clicked!"))}}}create(e,r={}){let t={...er,...r},a=document.createElement("w-snackbar-item");if(t.duration&&(a.duration=t.duration),a.innerText=e,t.variant!=="neutral"){let i=document.createElement("w-icon");switch(i.slot="icon",t.variant){case"positive":i.name="SuccessFilled";break;case"warning":i.name="WarningFilled";break;case"negative":i.name="ErrorFilled";break;case"info":i.name="InfoFilled";break}a.prepend(i)}if(t.action){a.duration<1e4&&(a.duration=1e4);let i=document.createElement("w-button");i.slot="action",i.variant="utilityQuiet",i.small=!0;let{label:n,onclick:s,placement:c}=t.action;i.innerText=n;let b=document.createElement("span");b.classList.add("sr-only");let _=window.navigator.userAgent.includes("Macintosh")?"Option":"Alt";b.innerHTML=`<kbd>${_}</kbd> + <kbd>Enter</kbd>`,i.append(b),i.onclick=h=>{let C=s.call(i,h);return h.defaultPrevented||a.close(),C},c?a.actionPlacement=c:rr.test(n)&&(a.actionPlacement="block"),a.append(i)}if(a.duration>1e4&&(t.canClose=!0),t.canClose){let i=document.createElement("w-button");i.slot="close",i.variant="utilityQuiet",i.small=!0,i.iconOnly=!0,typeof t.canClose=="function"?i.onclick=s=>{
|
|
2660
|
+
`;var er={canClose:!0,duration:4e3,variant:"neutral"};me(fe,xe,ke,we,ye);var rr=/\s/,D=class extends We{constructor(){super(),this.internals=this.attachInternals(),this.internals.ariaLive="polite",this.internals.role="log",this._onKeydown=this._onKeydown.bind(this)}connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this._onKeydown)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this._onKeydown)}_onKeydown(e){if(e.key==="Escape"){let r=this.shadowRoot?.host.querySelector("w-snackbar-item:last-of-type");r&&r.close()}else if(e.altKey&&e.key==="Enter"){e.preventDefault();let r=this.shadowRoot?.host.querySelector("w-snackbar-item:last-of-type");if(console.log("Found item!"),r){let t=r.querySelector('w-button[slot="action"]');console.log("Found action!"),t&&(t.click(),console.log("Clicked!"))}}}create(e,r={}){let t={...er,...r},a=document.createElement("w-snackbar-item");if(t.duration&&(a.duration=t.duration),a.innerText=e,t.variant!=="neutral"){let i=document.createElement("w-icon");switch(i.slot="icon",t.variant){case"positive":i.name="SuccessFilled";break;case"warning":i.name="WarningFilled";break;case"negative":i.name="ErrorFilled";break;case"info":i.name="InfoFilled";break}a.prepend(i)}if(t.action){a.duration<1e4&&(a.duration=1e4);let i=document.createElement("w-button");i.slot="action",i.variant="utilityQuiet",i.small=!0;let{label:n,onclick:s,placement:c}=t.action;i.innerText=n;let b=document.createElement("span");b.classList.add("sr-only");let _=window.navigator.userAgent.includes("Macintosh")?"Option":"Alt";b.innerHTML=`<kbd>${_}</kbd> + <kbd>Enter</kbd>`,i.append(b),i.onclick=h=>{let C=s.call(i,h);return h.defaultPrevented||a.close(),C},c?a.actionPlacement=c:rr.test(n)&&(a.actionPlacement="block"),a.append(i)}if(a.duration>1e4&&(t.canClose=!0),t.canClose){let i=document.createElement("w-button");i.slot="close",i.variant="utilityQuiet",i.small=!0,i.iconOnly=!0,typeof t.canClose=="function"?i.onclick=s=>{t.canClose.call(i,s),s.defaultPrevented||a.close()}:i.onclick=a.close.bind(a);let n=document.createElement("w-icon");n.name="Close",n.size="small",n.ariaLabel=u.t({id:"snackbar.aria.close",message:"Dismiss message",comment:"Accessibility label for the button that closes the snackbar/toast popup"}),i.append(n),a.append(i)}return this.shadowRoot?.host.prepend(a),a}render(){return Qe`
|
|
2661
2661
|
<aside part="container">
|
|
2662
2662
|
<slot></slot>
|
|
2663
2663
|
</aside>
|