@warp-ds/elements 2.3.0-next.24 → 2.3.0-next.25
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 +218 -8
- package/dist/index.d.ts +39 -0
- package/dist/packages/attention/index.js +20 -20
- package/dist/packages/attention/index.js.map +3 -3
- package/dist/packages/button/button.react.stories.d.ts +1 -1
- package/dist/packages/button/button.test.js +30 -1
- package/dist/packages/button/index.d.ts +2 -0
- package/dist/packages/button/index.js +12 -12
- package/dist/packages/button/index.js.map +3 -3
- package/dist/packages/combobox/combobox.react.stories.d.ts +1 -1
- package/dist/packages/combobox/combobox.stories.d.ts +1 -0
- package/dist/packages/combobox/combobox.stories.js +29 -3
- package/dist/packages/combobox/index.d.ts +7 -1
- package/dist/packages/combobox/index.js +19 -19
- package/dist/packages/combobox/index.js.map +4 -4
- package/dist/packages/datepicker/datepicker.d.ts +1 -0
- package/dist/packages/datepicker/datepicker.js +35 -35
- package/dist/packages/datepicker/datepicker.js.map +3 -3
- package/dist/packages/datepicker/datepicker.react.stories.d.ts +1 -1
- package/dist/packages/datepicker/datepicker.test.js +27 -0
- package/dist/packages/link/link.react.stories.d.ts +1 -1
- package/dist/packages/select/index.d.ts +1 -0
- package/dist/packages/select/index.js +15 -15
- package/dist/packages/select/index.js.map +3 -3
- package/dist/packages/select/select.react.stories.d.ts +1 -1
- package/dist/packages/select/select.test.js +30 -0
- package/dist/packages/slider/slider-thumb.d.ts +1 -0
- package/dist/packages/slider/slider-thumb.js +23 -23
- package/dist/packages/slider/slider-thumb.js.map +3 -3
- package/dist/packages/slider/slider.d.ts +1 -2
- package/dist/packages/slider/slider.js +20 -20
- package/dist/packages/slider/slider.js.map +4 -4
- package/dist/packages/slider/slider.stories.js +2 -2
- package/dist/packages/slider/slider.test.js +28 -0
- package/dist/packages/switch/index.d.ts +10 -2
- package/dist/packages/switch/index.js +5 -5
- package/dist/packages/switch/index.js.map +4 -4
- package/dist/packages/switch/switch.react.stories.js +4 -4
- package/dist/packages/switch/switch.stories.js +6 -5
- package/dist/packages/switch/switch.test.d.ts +1 -0
- package/dist/packages/switch/switch.test.js +40 -0
- package/dist/packages/textarea/textarea.d.ts +1 -0
- package/dist/packages/textarea/textarea.js +14 -14
- package/dist/packages/textarea/textarea.js.map +3 -3
- package/dist/packages/textarea/textarea.react.stories.d.ts +1 -1
- package/dist/packages/textarea/textarea.test.js +19 -0
- package/dist/packages/textfield/index.d.ts +3 -0
- package/dist/packages/textfield/index.js +8 -8
- package/dist/packages/textfield/index.js.map +3 -3
- package/dist/packages/textfield/textfield.react.stories.d.ts +1 -1
- package/dist/packages/textfield/textfield.stories.d.ts +1 -0
- package/dist/packages/textfield/textfield.stories.js +17 -0
- package/dist/web-types.json +7 -3
- package/package.json +1 -1
|
@@ -3,7 +3,7 @@ import { StoryObj } from '@storybook/react';
|
|
|
3
3
|
import { Select } from './react';
|
|
4
4
|
declare const _default: {
|
|
5
5
|
title: string;
|
|
6
|
-
render(args: Omit<React.HTMLAttributes<import(".").WarpSelect>, "label" | "onchange" | "autoFocus" | "onChange" | "render" | "renderOptions" | "connectedCallback" | "disconnectedCallback" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "form" | "disabled" | "name" | "value" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "
|
|
6
|
+
render(args: Omit<React.HTMLAttributes<import(".").WarpSelect>, "label" | "onchange" | "autoFocus" | "onChange" | "render" | "renderOptions" | "connectedCallback" | "disconnectedCallback" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "form" | "disabled" | "name" | "value" | "resetFormControl" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "invalid" | "helpText" | "always" | "hint" | "optional" | "readOnly" | "readonly" | "_options" | "_setValue" | "handleKeyDown"> & {
|
|
7
7
|
onChange?: (e: Event) => void;
|
|
8
8
|
onchange?: (e: Event) => void;
|
|
9
9
|
} & Partial<Omit<import(".").WarpSelect, keyof HTMLElement>> & React.RefAttributes<import(".").WarpSelect>): React.JSX.Element;
|
|
@@ -29,3 +29,33 @@ test('works in a form', async () => {
|
|
|
29
29
|
berry: 'raspberries',
|
|
30
30
|
});
|
|
31
31
|
});
|
|
32
|
+
test('can reset select by resetting surrounding form', async () => {
|
|
33
|
+
const label = 'Test label';
|
|
34
|
+
render(html `
|
|
35
|
+
<form>
|
|
36
|
+
<w-select
|
|
37
|
+
label=${label}
|
|
38
|
+
name="test"
|
|
39
|
+
value="strawberries"
|
|
40
|
+
>
|
|
41
|
+
<option value="strawberries">Strawberries</option>
|
|
42
|
+
<option value="raspberries">Raspberries</option>
|
|
43
|
+
<option value="cloudberries">Cloudberries</option>
|
|
44
|
+
</w-select>
|
|
45
|
+
</form>
|
|
46
|
+
`);
|
|
47
|
+
const form = document.querySelector('form');
|
|
48
|
+
const wSelect = document.querySelector('w-select');
|
|
49
|
+
// sanity
|
|
50
|
+
expect(form).not.toBeNull();
|
|
51
|
+
expect(wSelect).not.toBeNull();
|
|
52
|
+
// Initial value is "strawberries"
|
|
53
|
+
expect(wSelect.value).toBe('strawberries');
|
|
54
|
+
// Change the value to "raspberries"
|
|
55
|
+
wSelect.value = 'raspberries';
|
|
56
|
+
expect(wSelect.value).toBe('raspberries');
|
|
57
|
+
// Reset the form
|
|
58
|
+
form.reset();
|
|
59
|
+
// Value should be reset back to "strawberries"
|
|
60
|
+
expect(wSelect.value).toBe('strawberries');
|
|
61
|
+
});
|
|
@@ -44,6 +44,7 @@ declare class WarpSliderThumb extends WarpSliderThumb_base {
|
|
|
44
44
|
_showTooltip: boolean;
|
|
45
45
|
/** @internal */
|
|
46
46
|
_inputHasFocus: boolean;
|
|
47
|
+
resetFormControl(): void;
|
|
47
48
|
/**
|
|
48
49
|
* Reference to the anchor positioning style element used by the polyfill.
|
|
49
50
|
* @internal
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
var
|
|
2
|
-
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function
|
|
1
|
+
var Ue=Object.create;var ae=Object.defineProperty;var me=Object.getOwnPropertyDescriptor;var Xe=Object.getOwnPropertyNames;var He=Object.getPrototypeOf,qe=Object.prototype.hasOwnProperty;var ve=t=>{throw TypeError(t)};var fe=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports);var Ze=(t,e,r,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of Xe(e))!qe.call(t,a)&&a!==r&&ae(t,a,{get:()=>e[a],enumerable:!(o=me(e,a))||o.enumerable});return t};var Be=(t,e,r)=>(r=t!=null?Ue(He(t)):{},Ze(e||!t||!t.__esModule?ae(r,"default",{value:t,enumerable:!0}):r,t));var m=(t,e,r,o)=>{for(var a=o>1?void 0:o?me(e,r):e,n=t.length-1,s;n>=0;n--)(s=t[n])&&(a=(o?s(e,r,a):s(a))||a);return o&&a&&ae(e,r,a),a};var ie=(t,e,r)=>e.has(t)||ve("Cannot "+r);var we=(t,e,r)=>(ie(t,e,"read from private field"),r?r.call(t):e.get(t)),se=(t,e,r)=>e.has(t)?ve("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(t):e.set(t,r),xe=(t,e,r,o)=>(ie(t,e,"write to private field"),o?o.call(t,r):e.set(t,r),r),g=(t,e,r)=>(ie(t,e,"access private method"),r);var Ee=fe(D=>{"use strict";Object.defineProperty(D,"__esModule",{value:!0});D.errorMessages=D.ErrorType=void 0;var A;(function(t){t.MalformedUnicode="MALFORMED_UNICODE",t.MalformedHexadecimal="MALFORMED_HEXADECIMAL",t.CodePointLimit="CODE_POINT_LIMIT",t.OctalDeprecation="OCTAL_DEPRECATION",t.EndOfString="END_OF_STRING"})(A=D.ErrorType||(D.ErrorType={}));D.errorMessages=new Map([[A.MalformedUnicode,"malformed Unicode character escape sequence"],[A.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[A.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[A.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[A.EndOfString,"malformed escape sequence at end of string"]])});var Ve=fe(F=>{"use strict";Object.defineProperty(F,"__esModule",{value:!0});F.unraw=F.errorMessages=F.ErrorType=void 0;var y=Ee();Object.defineProperty(F,"ErrorType",{enumerable:!0,get:function(){return y.ErrorType}});Object.defineProperty(F,"errorMessages",{enumerable:!0,get:function(){return y.errorMessages}});function Je(t){return!t.match(/[^a-f0-9]/i)?parseInt(t,16):NaN}function B(t,e,r){let o=Je(t);if(Number.isNaN(o)||r!==void 0&&r!==t.length)throw new SyntaxError(y.errorMessages.get(e));return o}function We(t){let e=B(t,y.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(e)}function Me(t,e){let r=B(t,y.ErrorType.MalformedUnicode,4);if(e!==void 0){let o=B(e,y.ErrorType.MalformedUnicode,4);return String.fromCharCode(r,o)}return String.fromCharCode(r)}function Qe(t){return t.charAt(0)==="{"&&t.charAt(t.length-1)==="}"}function er(t){if(!Qe(t))throw new SyntaxError(y.errorMessages.get(y.ErrorType.MalformedUnicode));let e=t.slice(1,-1),r=B(e,y.ErrorType.MalformedUnicode);try{return String.fromCodePoint(r)}catch(o){throw o instanceof RangeError?new SyntaxError(y.errorMessages.get(y.ErrorType.CodePointLimit)):o}}function rr(t,e=!1){if(e)throw new SyntaxError(y.errorMessages.get(y.ErrorType.OctalDeprecation));let r=parseInt(t,8);return String.fromCharCode(r)}var tr=new Map([["b","\b"],["f","\f"],["n",`
|
|
2
|
+
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function or(t){return tr.get(t)||t}var ar=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function Fe(t,e=!1){return t.replace(ar,function(r,o,a,n,s,i,d,p,x){if(o!==void 0)return"\\";if(a!==void 0)return We(a);if(n!==void 0)return er(n);if(s!==void 0)return Me(s,i);if(d!==void 0)return Me(d);if(p==="0")return"\0";if(p!==void 0)return rr(p,!e);if(x!==void 0)return or(x);throw new SyntaxError(y.errorMessages.get(y.ErrorType.EndOfString))})}F.unraw=Fe;F.default=Fe});var u=function(t,e,r,o){if(r==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?t!==e||!o:!e.has(t))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?o:r==="a"?o.call(t):o?o.value:e.get(t)},f=function(t,e,r,o,a){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?t!==e||!a:!e.has(t))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?a.call(t,r):a?a.value=r:e.set(t,r),r};function ke(t){var e,r,o,a,n,s,i,d,p,x,z,E,w,O,P,_,L,Y,re;class Ye extends t{constructor(...l){var h,v,k;super(...l),e.add(this),this.internals=this.attachInternals(),r.set(this,!1),o.set(this,!1),a.set(this,!1),n.set(this,void 0),s.set(this,void 0),i.set(this,!0),p.set(this,""),x.set(this,()=>{f(this,a,!0,"f"),f(this,r,!0,"f"),u(this,e,"m",_).call(this)}),z.set(this,()=>{f(this,r,!1,"f"),u(this,e,"m",L).call(this,this.shouldFormValueUpdate()?u(this,p,"f"):""),!this.validity.valid&&u(this,a,"f")&&f(this,o,!0,"f");let M=u(this,e,"m",_).call(this);this.validationMessageCallback&&this.validationMessageCallback(M?this.internals.validationMessage:"")}),E.set(this,()=>{var M;u(this,i,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),f(this,i,!1,"f")),f(this,a,!0,"f"),f(this,o,!0,"f"),u(this,e,"m",_).call(this),(M=this===null||this===void 0?void 0:this.validationMessageCallback)===null||M===void 0||M.call(this,this.showError?this.internals.validationMessage:"")}),w.set(this,void 0),O.set(this,!1),P.set(this,Promise.resolve()),(h=this.addEventListener)===null||h===void 0||h.call(this,"focus",u(this,x,"f")),(v=this.addEventListener)===null||v===void 0||v.call(this,"blur",u(this,z,"f")),(k=this.addEventListener)===null||k===void 0||k.call(this,"invalid",u(this,E,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(k=>k.attribute).flat(),h=super.observedAttributes||[];return[...new Set([...h,...l])]}static getValidator(l){return this.validators.find(h=>h.attribute===l)||null}static getValidators(l){return this.validators.filter(h=>{var v;if(h.attribute===l||!((v=h.attribute)===null||v===void 0)&&v.includes(l))return!0})}get form(){return this.internals.form}get showError(){return u(this,e,"m",_).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,h,v){var k;(k=super.attributeChangedCallback)===null||k===void 0||k.call(this,l,h,v);let X=this.constructor.getValidators(l);X!=null&&X.length&&this.validationTarget&&this.setValue(u(this,p,"f"))}setValue(l){var h;f(this,o,!1,"f"),(h=this.validationMessageCallback)===null||h===void 0||h.call(this,""),f(this,p,l,"f");let k=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(k),u(this,e,"m",L).call(this,k),this.valueChangedCallback&&this.valueChangedCallback(k),u(this,e,"m",_).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(u(this,P,"f")))}formResetCallback(){var l,h;f(this,a,!1,"f"),f(this,o,!1,"f"),u(this,e,"m",_).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(h=this.validationMessageCallback)===null||h===void 0||h.call(this,u(this,e,"m",_).call(this)?this.validationMessage:"")}}return r=new WeakMap,o=new WeakMap,a=new WeakMap,n=new WeakMap,s=new WeakMap,i=new WeakMap,p=new WeakMap,x=new WeakMap,z=new WeakMap,E=new WeakMap,w=new WeakMap,O=new WeakMap,P=new WeakMap,e=new WeakSet,d=function(){let l=this.getRootNode(),h=`${this.localName}[name="${this.getAttribute("name")}"]`;return l.querySelectorAll(h)},_=function(){if(this.hasAttribute("disabled"))return!1;let l=u(this,o,"f")||u(this,a,"f")&&!this.validity.valid&&!u(this,r,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},L=function(l){let h=this.constructor,v={},k=h.validators,M=[],X=k.some(C=>C.isValid instanceof Promise);u(this,O,"f")||(f(this,P,new Promise(C=>{f(this,w,C,"f")}),"f"),f(this,O,!0,"f")),u(this,n,"f")&&(u(this,n,"f").abort(),f(this,s,u(this,n,"f"),"f"));let H=new AbortController;f(this,n,H,"f");let q,ge=!1;k.length&&(k.forEach(C=>{let te=C.key||"customError",R=C.isValid(this,l,H.signal);R instanceof Promise?(M.push(R),R.then(oe=>{oe!=null&&(v[te]=!oe,q=u(this,e,"m",re).call(this,C,l),u(this,e,"m",Y).call(this,v,q))})):(v[te]=!R,this.validity[te]!==!R&&(ge=!0),!R&&!q&&(q=u(this,e,"m",re).call(this,C,l)))}),Promise.allSettled(M).then(()=>{var C;H!=null&&H.signal.aborted||(f(this,O,!1,"f"),(C=u(this,w,"f"))===null||C===void 0||C.call(this))}),(ge||!X)&&u(this,e,"m",Y).call(this,v,q))},Y=function(l,h){if(this.validationTarget)this.internals.setValidity(l,h,this.validationTarget),f(this,i,!1,"f");else{if(this.internals.setValidity(l,h),this.internals.validity.valid)return;f(this,i,!0,"f")}},re=function(l,h){if(this.validityCallback){let v=this.validityCallback(l.key||"customError");if(v)return v}return l.message instanceof Function?l.message(this,h):l.message},Ye}import{html as j,LitElement as De,nothing as V}from"lit";import{property as N,query as Te,state as $}from"lit/decorators.js";import{ifDefined as W}from"lit/directives/if-defined.js";import{css as ye}from"lit";var _e=ye`
|
|
3
3
|
*,
|
|
4
4
|
:before,
|
|
5
5
|
:after {
|
|
@@ -272,7 +272,7 @@ var Ae=Object.create;var oe=Object.defineProperty;var be=Object.getOwnPropertyDe
|
|
|
272
272
|
svg {
|
|
273
273
|
pointer-events: none;
|
|
274
274
|
}
|
|
275
|
-
`,
|
|
275
|
+
`,xr=ye`*, :before, :after {
|
|
276
276
|
--w-rotate: 0;
|
|
277
277
|
--w-rotate-x: 0;
|
|
278
278
|
--w-rotate-y: 0;
|
|
@@ -2438,7 +2438,7 @@ var Ae=Object.create;var oe=Object.defineProperty;var be=Object.getOwnPropertyDe
|
|
|
2438
2438
|
display: none
|
|
2439
2439
|
}
|
|
2440
2440
|
}
|
|
2441
|
-
`;import{css as
|
|
2441
|
+
`;import{css as Ge}from"lit";var Ce=Ge`
|
|
2442
2442
|
.w-slider-thumb {
|
|
2443
2443
|
position: relative;
|
|
2444
2444
|
display: grid;
|
|
@@ -2610,7 +2610,7 @@ var Ae=Object.create;var oe=Object.defineProperty;var be=Object.getOwnPropertyDe
|
|
|
2610
2610
|
:host([name="to"]) .w-slider-thumb__range::-moz-range-thumb {
|
|
2611
2611
|
transform: translateX(calc(var(--w-slider-thumb-size) - 1px));
|
|
2612
2612
|
}
|
|
2613
|
-
`;import{css as
|
|
2613
|
+
`;import{css as Ke}from"lit";var ze=Ke`*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.hidden{display:none}.absolute{position:absolute}.relative{position:relative}.static{position:static}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}`;var Pe=Be(Ve(),1);var S=t=>typeof t=="string",ir=t=>typeof t=="function",$e=new Map,Se="en";function ce(t){return[...Array.isArray(t)?t:[t],Se]}function he(t,e,r){let o=ce(t);r||(r="default");let a;if(typeof r=="string")switch(a={day:"numeric",month:"short",year:"numeric"},r){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=r;return G(()=>K("date",o,r),()=>new Intl.DateTimeFormat(o,a)).format(S(e)?new Date(e):e)}function sr(t,e,r){let o;if(r||(r="default"),typeof r=="string")switch(o={second:"numeric",minute:"numeric",hour:"numeric"},r){case"full":case"long":o.timeZoneName="short";break;case"short":delete o.second}else o=r;return he(t,e,o)}function ne(t,e,r){let o=ce(t);return G(()=>K("number",o,r),()=>new Intl.NumberFormat(o,r)).format(e)}function Oe(t,e,r,{offset:o=0,...a}){var i,d;let n=ce(t),s=e?G(()=>K("plural-ordinal",n),()=>new Intl.PluralRules(n,{type:"ordinal"})):G(()=>K("plural-cardinal",n),()=>new Intl.PluralRules(n,{type:"cardinal"}));return(d=(i=a[r])!=null?i:a[s.select(r-o)])!=null?d:a.other}function G(t,e){let r=t(),o=$e.get(r);return o||(o=e(),$e.set(r,o)),o}function K(t,e,r){let o=e.join("-");return`${t}-${o}-${JSON.stringify(r)}`}var Ne=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,Le="%__lingui_octothorpe__%",nr=(t,e,r={})=>{let o=e||t,a=s=>typeof s=="object"?s:r[s],n=(s,i)=>{let d=Object.keys(r).length?a("number"):void 0,p=ne(o,s,d);return i.replace(new RegExp(Le,"g"),p)};return{plural:(s,i)=>{let{offset:d=0}=i,p=Oe(o,!1,s,i);return n(s-d,p)},selectordinal:(s,i)=>{let{offset:d=0}=i,p=Oe(o,!0,s,i);return n(s-d,p)},select:lr,number:(s,i)=>ne(o,s,a(i)||{style:i}),date:(s,i)=>he(o,s,a(i)||i),time:(s,i)=>sr(o,s,a(i)||i)}},lr=(t,e)=>{var r;return(r=e[t])!=null?r:e.other};function dr(t,e,r){return(o={},a)=>{let n=nr(e,r,a),s=(d,p=!1)=>Array.isArray(d)?d.reduce((x,z)=>{if(z==="#"&&p)return x+Le;if(S(z))return x+z;let[E,w,O]=z,P={};w==="plural"||w==="selectordinal"||w==="select"?Object.entries(O).forEach(([L,Y])=>{P[L]=s(Y,w==="plural"||w==="selectordinal")}):P=O;let _;if(w){let L=n[w];_=L(o[E],P)}else _=o[E];return _==null?x:x+_},""):d,i=s(t);return S(i)&&Ne.test(i)?(0,Pe.unraw)(i):S(i)?i:i?String(i):""}}var cr=Object.defineProperty,hr=(t,e,r)=>e in t?cr(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,ur=(t,e,r)=>(hr(t,typeof e!="symbol"?e+"":e,r),r),le=class{constructor(){ur(this,"_events",{})}on(e,r){var a;var o;return(a=(o=this._events)[e])!=null||(o[e]=[]),this._events[e].push(r),()=>this.removeListener(e,r)}removeListener(e,r){let o=this._getListeners(e);if(!o)return;let a=o.indexOf(r);~a&&o.splice(a,1)}emit(e,...r){let o=this._getListeners(e);o&&o.map(a=>a.apply(this,r))}_getListeners(e){let r=this._events[e];return Array.isArray(r)?r:!1}},br=Object.defineProperty,pr=(t,e,r)=>e in t?br(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,T=(t,e,r)=>(pr(t,typeof e!="symbol"?e+"":e,r),r),de=class extends le{constructor(e){var r;super(),T(this,"_locale",""),T(this,"_locales"),T(this,"_localeData",{}),T(this,"_messages",{}),T(this,"_missing"),T(this,"_messageCompiler"),T(this,"t",this._.bind(this)),e.missing!=null&&(this._missing=e.missing),e.messages!=null&&this.load(e.messages),e.localeData!=null&&this.loadLocaleData(e.localeData),(typeof e.locale=="string"||e.locales)&&this.activate((r=e.locale)!=null?r:Se,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){var e;return(e=this._messages[this._locale])!=null?e:{}}get localeData(){var e;return(e=this._localeData[this._locale])!=null?e:{}}_loadLocaleData(e,r){let o=this._localeData[e];o?Object.assign(o,r):this._localeData[e]=r}setMessagesCompiler(e){return this._messageCompiler=e,this}loadLocaleData(e,r){typeof e=="string"?this._loadLocaleData(e,r):Object.keys(e).forEach(o=>this._loadLocaleData(o,e[o])),this.emit("change")}_load(e,r){let o=this._messages[e];o?Object.assign(o,r):this._messages[e]=r}load(e,r){typeof e=="string"&&typeof r=="object"?this._load(e,r):Object.entries(e).forEach(([o,a])=>this._load(o,a)),this.emit("change")}loadAndActivate({locale:e,locales:r,messages:o}){this._locale=e,this._locales=r||void 0,this._messages[this._locale]=o,this.emit("change")}activate(e,r){this._locale=e,this._locales=r,this.emit("change")}_(e,r,o){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let a=o==null?void 0:o.message;e||(e=""),S(e)||(r=e.values||r,a=e.message,e=e.id);let n=this.messages[e],s=n===void 0,i=this._missing;if(i&&s)return ir(i)?i(this._locale,e):i;s&&this.emit("missing",{id:e,locale:this._locale});let d=n||a||e;return S(d)&&(this._messageCompiler?d=this._messageCompiler(d):console.warn(`Uncompiled message detected! Message:
|
|
2614
2614
|
|
|
2615
2615
|
> ${d}
|
|
2616
2616
|
|
|
@@ -2618,7 +2618,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
|
|
|
2618
2618
|
ICU features such as interpolation and plurals will not work properly for that message.
|
|
2619
2619
|
|
|
2620
2620
|
Please compile your catalog first.
|
|
2621
|
-
`)),S(d)
|
|
2621
|
+
`)),S(d)&&Ne.test(d)?JSON.parse(`"${d}"`):S(d)?d:dr(d,this._locale,this._locales)(r,o==null?void 0:o.formats)}date(e,r){return he(this._locales||this._locale,e,r)}number(e,r){return ne(this._locales||this._locale,e,r)}};function gr(t={}){return new de(t)}var J=gr();var Re={};var Z,c,Q,ee,ue,I,be,pe,Ae,je,Ie,b=class extends ke(De){constructor(){super(...arguments);se(this,c);this.invalid=!1;this.allowValuesOutsideRange=!1;this.suffix="";this._showTooltip=!1;this._inputHasFocus=!1;se(this,Z,null);this.anchorPositioningStyleElement=null}resetFormControl(){this.value=we(this,Z)}async connectedCallback(){if(super.connectedCallback(),xe(this,Z,this.value),this.setValue(this.value),"anchorName"in document.documentElement.style)await this.updateComplete;else{let r=Re.url.substring(0,Re.url.lastIndexOf("/"));try{let[{default:o}]=await Promise.all([import(`${r}/oddbird-css-anchor-positioning.js`),this.updateComplete]);this.anchorPositioningStyleElement||(this.anchorPositioningStyleElement=document.createElement("style"),this.shadowRoot.prepend(this.anchorPositioningStyleElement)),this.anchorPositioningStyleElement.textContent=`
|
|
2622
2622
|
/*
|
|
2623
2623
|
* The polyfill can only anchor to ::before and ::after pseudo elements, not the pseudo element slider thumb.
|
|
2624
2624
|
* We work around that by recreating a transparent version of the active range
|
|
@@ -2667,7 +2667,7 @@ Please compile your catalog first.
|
|
|
2667
2667
|
left: anchor(--polyfilled-thumb left);
|
|
2668
2668
|
margin-left: 38px;
|
|
2669
2669
|
}
|
|
2670
|
-
`,await
|
|
2670
|
+
`,await o({roots:[this.shadowRoot],elements:[this.anchorPositioningStyleElement]})}catch(o){console.error(new Error("Error registering the CSS anchor positioning polyfill. The UI will look broken.",{cause:o}))}}g(this,c,ue).call(this)}get boundaryValue(){return this.slot==="from"?this.min:this.max}get textFieldDisplayValue(){var r;return this._inputHasFocus?this.value!==""?this.value:(r=this.range)!=null&&r.value?Math.min(Math.max(Number(this.range.value),Number(this.min)+1),Number(this.max)-1).toString():"":this.value}get tooltipDisplayValue(){var r,o;return this.formatter?this.formatter(this.value,this.slot):this.value===""?(o=(r=this.range)==null?void 0:r.value)!=null?o:this.boundaryValue:this.value||0}updated(r){r.has("value")&&(this.setValue(this.value),g(this,c,ue).call(this))}render(){return j`
|
|
2671
2671
|
<div class="w-slider-thumb">
|
|
2672
2672
|
<label for="range">${this.label}</label>
|
|
2673
2673
|
${"anchorName"in document.documentElement.style?V:j`<div class="polyfill-range">
|
|
@@ -2676,23 +2676,23 @@ Please compile your catalog first.
|
|
|
2676
2676
|
<input
|
|
2677
2677
|
id="range"
|
|
2678
2678
|
aria-label="${this.ariaLabel}"
|
|
2679
|
-
aria-describedby="${
|
|
2679
|
+
aria-describedby="${W(this.ariaDescription?"aria-description":void 0)}"
|
|
2680
2680
|
class="w-slider-thumb__range"
|
|
2681
2681
|
type="range"
|
|
2682
2682
|
.value="${this.value}"
|
|
2683
2683
|
aria-valuetext="${this.tooltipDisplayValue}"
|
|
2684
2684
|
min="${this.min}"
|
|
2685
2685
|
max="${this.max}"
|
|
2686
|
-
step="${
|
|
2686
|
+
step="${W(!this.allowValuesOutsideRange&&this.step?this.step:void 0)}"
|
|
2687
2687
|
?disabled="${this.disabled}"
|
|
2688
|
-
@mousedown="${g(this,c,
|
|
2689
|
-
@mouseup="${g(this,c,
|
|
2690
|
-
@touchstart="${g(this,c,
|
|
2691
|
-
@touchend="${g(this,c,
|
|
2692
|
-
@focus="${g(this,c,
|
|
2693
|
-
@blur="${g(this,c,
|
|
2694
|
-
@input="${g(this,c,
|
|
2695
|
-
@keydown="${this.allowValuesOutsideRange?g(this,c,
|
|
2688
|
+
@mousedown="${g(this,c,Q)}"
|
|
2689
|
+
@mouseup="${g(this,c,ee)}"
|
|
2690
|
+
@touchstart="${g(this,c,Q)}"
|
|
2691
|
+
@touchend="${g(this,c,ee)}"
|
|
2692
|
+
@focus="${g(this,c,Q)}"
|
|
2693
|
+
@blur="${g(this,c,ee)}"
|
|
2694
|
+
@input="${g(this,c,pe)}"
|
|
2695
|
+
@keydown="${this.allowValuesOutsideRange?g(this,c,Ae):V}"
|
|
2696
2696
|
/>
|
|
2697
2697
|
|
|
2698
2698
|
${this.slot==="from"?j`<span class="w-slider-thumb__from-marker"
|
|
@@ -2706,18 +2706,18 @@ Please compile your catalog first.
|
|
|
2706
2706
|
|
|
2707
2707
|
<w-textfield
|
|
2708
2708
|
aria-label="${this.ariaLabel}"
|
|
2709
|
-
aria-description="${
|
|
2709
|
+
aria-description="${W(this.ariaDescription)}"
|
|
2710
2710
|
class="w-slider-thumb__textfield"
|
|
2711
2711
|
type="number"
|
|
2712
2712
|
.formatter=${this.formatter?r=>this.formatter(r,this.slot):V}
|
|
2713
2713
|
.value="${this.textFieldDisplayValue}"
|
|
2714
2714
|
min="${this.allowValuesOutsideRange?V:this.min}"
|
|
2715
2715
|
max="${this.allowValuesOutsideRange?V:this.max}"
|
|
2716
|
-
step="${
|
|
2716
|
+
step="${W(this.step)}"
|
|
2717
2717
|
?invalid="${!!this.invalid}"
|
|
2718
|
-
@input="${g(this,c,
|
|
2719
|
-
@focus="${g(this,c,
|
|
2720
|
-
@blur="${g(this,c,
|
|
2718
|
+
@input="${g(this,c,pe)}"
|
|
2719
|
+
@focus="${g(this,c,je)}"
|
|
2720
|
+
@blur="${g(this,c,Ie)}"
|
|
2721
2721
|
>
|
|
2722
2722
|
${this.suffix?j`<w-affix slot="suffix" label="${this.suffix}"></w-affix>`:V}
|
|
2723
2723
|
</w-textfield>
|
|
@@ -2744,5 +2744,5 @@ Please compile your catalog first.
|
|
|
2744
2744
|
>${this.ariaDescription}</span
|
|
2745
2745
|
>
|
|
2746
2746
|
</div>
|
|
2747
|
-
`}};c=new WeakSet,
|
|
2747
|
+
`}};Z=new WeakMap,c=new WeakSet,Q=function(){this._showTooltip=!0,this.shadowRoot.querySelector("w-attention").handleDone()},ee=function(){this._showTooltip=!1},ue=function(){this.range&&(this.value===""?this.range.value=this.boundaryValue:this.value&&(this.range.value=this.value))},I=function(r){this.dispatchEvent(new CustomEvent("slidervalidity",{bubbles:!0,detail:{invalid:r,slot:this.slot}}))},be=async function(r,o){let a=Number.parseInt(r);if(this.allowValuesOutsideRange&&!o&&this.step&&!(this.slot==="to"&&a>=Number(this.max)-1||this.slot==="from"&&a<=Number(this.min)+1)){let x=1/this.step;a=Math.round(a*x)/x,r=a.toString()}let n=Number.parseInt(this.max),s=Number.parseInt(this.min);if(!this.allowValuesOutsideRange&&(a>n||a<s))return g(this,c,I).call(this,J.t({id:"slider.error.out_of_bounds",message:"Value must be between {min} and {max}",values:{min:`${this.min} ${this.suffix}`.trim(),max:`${this.max} ${this.suffix}`.trim()}})),{shouldCancel:!0};if(r==="")return this.required&&g(this,c,I).call(this,J.t({id:"slider.error.required",message:"This field is required"})),{shouldCancel:!0};this.value=r;let i=r===this.max||r===this.min,d=!1;if(this.slot){let p=getComputedStyle(this),x=p.getPropertyValue("--to"),z=p.getPropertyValue("--from"),E=J.t({id:"slider.error.overlap",message:"The maximum value cannot be less than the minimum"});if(this.slot==="from"){let w=Math.min(Number.parseInt(x),this.allowValuesOutsideRange?n-1:n);a>w&&(d=!0,this.allowValuesOutsideRange&&i?this.value=String(w):this.value=x,o&&(g(this,c,I).call(this,E),await this.updateComplete,this.textfield.value=r))}else{let w=Math.max(Number.parseInt(z),this.allowValuesOutsideRange?s+1:s);a<w&&(d=!0,this.allowValuesOutsideRange&&i?this.value=String(w):this.value=z,o&&(g(this,c,I).call(this,E),await this.updateComplete,this.textfield.value=r))}}return d?{shouldCancel:!0}:(g(this,c,I).call(this,""),this.range.value=Math.min(Math.max(Number(r),Number(this.min)),Number(this.max)).toString(),this.value=this.allowValuesOutsideRange&&!o&&i?"":r,this.shadowRoot.querySelector("w-attention").handleDone(),{shouldCancel:!1})},pe=async function(r){let o=r.currentTarget.tagName==="W-TEXTFIELD";if(r instanceof CustomEvent)return;let a=r.currentTarget.value;return(await g(this,c,be).call(this,a,o)).shouldCancel?(r.preventDefault(),!1):!0},Ae=async function(r){if(r.key!=="ArrowLeft"&&r.key!=="ArrowRight")return;let o=Number(this.range.value),a=this.step||1,n;r.key==="ArrowLeft"?n=o-a:n=o+a,n=Math.min(Math.max(n,Number(this.min)),Number(this.max)),(await g(this,c,be).call(this,n.toString(),!1)).shouldCancel&&r.preventDefault()},je=function(r){r instanceof CustomEvent&&r.type==="focus"&&(this._inputHasFocus=!0)},Ie=function(r){r instanceof CustomEvent&&r.type==="blur"&&(this._inputHasFocus=!1)},b.shadowRootOptions={...De.shadowRootOptions,delegatesFocus:!0},b.styles=[_e,ze,Ce],m([N({attribute:"aria-label",reflect:!0})],b.prototype,"ariaLabel",2),m([N({attribute:"aria-description",reflect:!0})],b.prototype,"ariaDescription",2),m([N({reflect:!0})],b.prototype,"label",2),m([N({reflect:!0})],b.prototype,"name",2),m([N({reflect:!0})],b.prototype,"value",2),m([N({type:Boolean,reflect:!0})],b.prototype,"disabled",2),m([N({type:Boolean,reflect:!0})],b.prototype,"invalid",2),m([N({attribute:!1,reflect:!1})],b.prototype,"allowValuesOutsideRange",2),m([$()],b.prototype,"markers",2),m([$()],b.prototype,"required",2),m([$()],b.prototype,"step",2),m([$()],b.prototype,"min",2),m([$()],b.prototype,"max",2),m([$()],b.prototype,"suffix",2),m([$()],b.prototype,"formatter",2),m([Te('input[type="range"]')],b.prototype,"range",2),m([Te("w-textfield")],b.prototype,"textfield",2),m([$()],b.prototype,"_showTooltip",2),m([$()],b.prototype,"_inputHasFocus",2);customElements.get("w-slider-thumb")||customElements.define("w-slider-thumb",b);export{b as WarpSliderThumb};
|
|
2748
2748
|
//# sourceMappingURL=slider-thumb.js.map
|