@warp-ds/elements 2.5.0 → 2.5.1-next.1
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 +8 -0
- package/dist/packages/combobox/combobox.d.ts +5 -0
- package/dist/packages/combobox/combobox.js +12 -12
- package/dist/packages/combobox/combobox.js.map +3 -3
- package/dist/packages/combobox/combobox.stories.js +7 -7
- package/dist/packages/combobox/combobox.test.js +90 -0
- package/dist/web-types.json +1 -1
- package/package.json +1 -1
|
@@ -3912,10 +3912,18 @@
|
|
|
3912
3912
|
"privacy": "private",
|
|
3913
3913
|
"readonly": true
|
|
3914
3914
|
},
|
|
3915
|
+
{
|
|
3916
|
+
"kind": "field",
|
|
3917
|
+
"name": "_navigationLabelOrDisplayValue",
|
|
3918
|
+
"privacy": "private",
|
|
3919
|
+
"description": "Get the display text for the navigation option or current display value",
|
|
3920
|
+
"readonly": true
|
|
3921
|
+
},
|
|
3915
3922
|
{
|
|
3916
3923
|
"kind": "field",
|
|
3917
3924
|
"name": "_navigationValueOrInputValue",
|
|
3918
3925
|
"privacy": "private",
|
|
3926
|
+
"description": "Get the actual value for the navigation option or current value",
|
|
3919
3927
|
"readonly": true
|
|
3920
3928
|
},
|
|
3921
3929
|
{
|
|
@@ -50,6 +50,8 @@ export declare class WarpCombobox extends WarpCombobox_base {
|
|
|
50
50
|
private _currentOptions;
|
|
51
51
|
/** @internal Unique identifier counter for options */
|
|
52
52
|
private _optionIdCounter;
|
|
53
|
+
/** @internal The text displayed in the input field (may differ from value when option has label) */
|
|
54
|
+
private _displayValue;
|
|
53
55
|
static styles: import("lit").CSSResult[];
|
|
54
56
|
constructor();
|
|
55
57
|
firstUpdated(changedProps: Map<string, unknown>): void;
|
|
@@ -58,6 +60,9 @@ export declare class WarpCombobox extends WarpCombobox_base {
|
|
|
58
60
|
private get _listboxId();
|
|
59
61
|
private get _id();
|
|
60
62
|
private get _helpId();
|
|
63
|
+
/** Get the display text for the navigation option or current display value */
|
|
64
|
+
private get _navigationLabelOrDisplayValue();
|
|
65
|
+
/** Get the actual value for the navigation option or current value */
|
|
61
66
|
private get _navigationValueOrInputValue();
|
|
62
67
|
/** Generate options with unique IDs and match information */
|
|
63
68
|
private _createOptionsWithIdAndMatch;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
var
|
|
2
|
-
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function Ze(o){return He.get(o)||o}var Ke=/\\(?:(\\)|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 ge(o,r=!1){return o.replace(Ke,function(e,t,a,n,
|
|
1
|
+
var $e=Object.create;var W=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var Re=Object.getOwnPropertyNames;var De=Object.getPrototypeOf,Pe=Object.prototype.hasOwnProperty;var ne=o=>{throw TypeError(o)};var le=(o,r)=>()=>(r||o((r={exports:{}}).exports,r),r.exports);var Ne=(o,r,e,t)=>{if(r&&typeof r=="object"||typeof r=="function")for(let a of Re(r))!Pe.call(o,a)&&a!==e&&W(o,a,{get:()=>r[a],enumerable:!(t=se(r,a))||t.enumerable});return o};var je=(o,r,e)=>(e=o!=null?$e(De(o)):{},Ne(r||!o||!o.__esModule?W(e,"default",{value:o,enumerable:!0}):e,o));var p=(o,r,e,t)=>{for(var a=t>1?void 0:t?se(r,e):r,s=o.length-1,n;s>=0;s--)(n=o[s])&&(a=(t?n(r,e,a):n(a))||a);return t&&a&&W(r,e,a),a};var ce=(o,r,e)=>r.has(o)||ne("Cannot "+e);var de=(o,r,e)=>(ce(o,r,"read from private field"),e?e.call(o):r.get(o)),ue=(o,r,e)=>r.has(o)?ne("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(o):r.set(o,e),he=(o,r,e,t)=>(ce(o,r,"write to private field"),t?t.call(o,e):r.set(o,e),e);var pe=le(I=>{"use strict";Object.defineProperty(I,"__esModule",{value:!0});I.errorMessages=I.ErrorType=void 0;var R;(function(o){o.MalformedUnicode="MALFORMED_UNICODE",o.MalformedHexadecimal="MALFORMED_HEXADECIMAL",o.CodePointLimit="CODE_POINT_LIMIT",o.OctalDeprecation="OCTAL_DEPRECATION",o.EndOfString="END_OF_STRING"})(R=I.ErrorType||(I.ErrorType={}));I.errorMessages=new Map([[R.MalformedUnicode,"malformed Unicode character escape sequence"],[R.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[R.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[R.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[R.EndOfString,"malformed escape sequence at end of string"]])});var ve=le(M=>{"use strict";Object.defineProperty(M,"__esModule",{value:!0});M.unraw=M.errorMessages=M.ErrorType=void 0;var f=pe();Object.defineProperty(M,"ErrorType",{enumerable:!0,get:function(){return f.ErrorType}});Object.defineProperty(M,"errorMessages",{enumerable:!0,get:function(){return f.errorMessages}});function Ue(o){return!o.match(/[^a-f0-9]/i)?parseInt(o,16):NaN}function X(o,r,e){let t=Ue(o);if(Number.isNaN(t)||e!==void 0&&e!==o.length)throw new SyntaxError(f.errorMessages.get(r));return t}function Ye(o){let r=X(o,f.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(r)}function be(o,r){let e=X(o,f.ErrorType.MalformedUnicode,4);if(r!==void 0){let t=X(r,f.ErrorType.MalformedUnicode,4);return String.fromCharCode(e,t)}return String.fromCharCode(e)}function Be(o){return o.charAt(0)==="{"&&o.charAt(o.length-1)==="}"}function qe(o){if(!Be(o))throw new SyntaxError(f.errorMessages.get(f.ErrorType.MalformedUnicode));let r=o.slice(1,-1),e=X(r,f.ErrorType.MalformedUnicode);try{return String.fromCodePoint(e)}catch(t){throw t instanceof RangeError?new SyntaxError(f.errorMessages.get(f.ErrorType.CodePointLimit)):t}}function Xe(o,r=!1){if(r)throw new SyntaxError(f.errorMessages.get(f.ErrorType.OctalDeprecation));let e=parseInt(o,8);return String.fromCharCode(e)}var He=new Map([["b","\b"],["f","\f"],["n",`
|
|
2
|
+
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function Ze(o){return He.get(o)||o}var Ke=/\\(?:(\\)|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 ge(o,r=!1){return o.replace(Ke,function(e,t,a,s,n,i,c,v,_){if(t!==void 0)return"\\";if(a!==void 0)return Ye(a);if(s!==void 0)return qe(s);if(n!==void 0)return be(n,i);if(c!==void 0)return be(c);if(v==="0")return"\0";if(v!==void 0)return Xe(v,!r);if(_!==void 0)return Ze(_);throw new SyntaxError(f.errorMessages.get(f.ErrorType.EndOfString))})}M.unraw=ge;M.default=ge});var Y=function(){for(var o=[],r=arguments.length;r--;)o[r]=arguments[r];return o.reduce(function(e,t){return e.concat(typeof t=="string"?t:Array.isArray(t)?Y.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var we=je(ve(),1);var S=o=>typeof o=="string",Ge=o=>typeof o=="function",me=new Map,xe="en";function te(o){return[...Array.isArray(o)?o:[o],xe]}function oe(o,r,e){let t=te(o);e||(e="default");let a;if(typeof e=="string")switch(a={day:"numeric",month:"short",year:"numeric"},e){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=e;return H(()=>Z("date",t,e),()=>new Intl.DateTimeFormat(t,a)).format(S(r)?new Date(r):r)}function Je(o,r,e){let t;if(e||(e="default"),typeof e=="string")switch(t={second:"numeric",minute:"numeric",hour:"numeric"},e){case"full":case"long":t.timeZoneName="short";break;case"short":delete t.second}else t=e;return oe(o,r,t)}function Q(o,r,e){let t=te(o);return H(()=>Z("number",t,e),()=>new Intl.NumberFormat(t,e)).format(r)}function fe(o,r,e,{offset:t=0,...a}){var i,c;let s=te(o),n=r?H(()=>Z("plural-ordinal",s),()=>new Intl.PluralRules(s,{type:"ordinal"})):H(()=>Z("plural-cardinal",s),()=>new Intl.PluralRules(s,{type:"cardinal"}));return(c=(i=a[e])!=null?i:a[n.select(e-t)])!=null?c:a.other}function H(o,r){let e=o(),t=me.get(e);return t||(t=r(),me.set(e,t)),t}function Z(o,r,e){let t=r.join("-");return`${o}-${t}-${JSON.stringify(e)}`}var ke=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,ye="%__lingui_octothorpe__%",We=(o,r,e={})=>{let t=r||o,a=n=>typeof n=="object"?n:e[n],s=(n,i)=>{let c=Object.keys(e).length?a("number"):void 0,v=Q(t,n,c);return i.replace(new RegExp(ye,"g"),v)};return{plural:(n,i)=>{let{offset:c=0}=i,v=fe(t,!1,n,i);return s(n-c,v)},selectordinal:(n,i)=>{let{offset:c=0}=i,v=fe(t,!0,n,i);return s(n-c,v)},select:Qe,number:(n,i)=>Q(t,n,a(i)||{style:i}),date:(n,i)=>oe(t,n,a(i)||i),time:(n,i)=>Je(t,n,a(i)||i)}},Qe=(o,r)=>{var e;return(e=r[o])!=null?e:r.other};function er(o,r,e){return(t={},a)=>{let s=We(r,e,a),n=(c,v=!1)=>Array.isArray(c)?c.reduce((_,z)=>{if(z==="#"&&v)return _+ye;if(S(z))return _+z;let[T,k,E]=z,F={};k==="plural"||k==="selectordinal"||k==="select"?Object.entries(E).forEach(([V,D])=>{F[V]=n(D,k==="plural"||k==="selectordinal")}):F=E;let x;if(k){let V=s[k];x=V(t[T],F)}else x=t[T];return x==null?_:_+x},""):c,i=n(o);return S(i)&&ke.test(i)?(0,we.unraw)(i):S(i)?i:i?String(i):""}}var rr=Object.defineProperty,tr=(o,r,e)=>r in o?rr(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,or=(o,r,e)=>(tr(o,typeof r!="symbol"?r+"":r,e),e),ee=class{constructor(){or(this,"_events",{})}on(r,e){var a;var t;return(a=(t=this._events)[r])!=null||(t[r]=[]),this._events[r].push(e),()=>this.removeListener(r,e)}removeListener(r,e){let t=this._getListeners(r);if(!t)return;let a=t.indexOf(e);~a&&t.splice(a,1)}emit(r,...e){let t=this._getListeners(r);t&&t.map(a=>a.apply(this,e))}_getListeners(r){let e=this._events[r];return Array.isArray(e)?e:!1}},ar=Object.defineProperty,ir=(o,r,e)=>r in o?ar(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,L=(o,r,e)=>(ir(o,typeof r!="symbol"?r+"":r,e),e),re=class extends ee{constructor(r){var e;super(),L(this,"_locale",""),L(this,"_locales"),L(this,"_localeData",{}),L(this,"_messages",{}),L(this,"_missing"),L(this,"_messageCompiler"),L(this,"t",this._.bind(this)),r.missing!=null&&(this._missing=r.missing),r.messages!=null&&this.load(r.messages),r.localeData!=null&&this.loadLocaleData(r.localeData),(typeof r.locale=="string"||r.locales)&&this.activate((e=r.locale)!=null?e:xe,r.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){var r;return(r=this._messages[this._locale])!=null?r:{}}get localeData(){var r;return(r=this._localeData[this._locale])!=null?r:{}}_loadLocaleData(r,e){let t=this._localeData[r];t?Object.assign(t,e):this._localeData[r]=e}setMessagesCompiler(r){return this._messageCompiler=r,this}loadLocaleData(r,e){typeof r=="string"?this._loadLocaleData(r,e):Object.keys(r).forEach(t=>this._loadLocaleData(t,r[t])),this.emit("change")}_load(r,e){let t=this._messages[r];t?Object.assign(t,e):this._messages[r]=e}load(r,e){typeof r=="string"&&typeof e=="object"?this._load(r,e):Object.entries(r).forEach(([t,a])=>this._load(t,a)),this.emit("change")}loadAndActivate({locale:r,locales:e,messages:t}){this._locale=r,this._locales=e||void 0,this._messages[this._locale]=t,this.emit("change")}activate(r,e){this._locale=r,this._locales=e,this.emit("change")}_(r,e,t){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=t==null?void 0:t.message;r||(r=""),S(r)||(e=r.values||e,a=r.message,r=r.id);let s=this.messages[r],n=s===void 0,i=this._missing;if(i&&n)return Ge(i)?i(this._locale,r):i;n&&this.emit("missing",{id:r,locale:this._locale});let c=s||a||r;return S(c)&&(this._messageCompiler?c=this._messageCompiler(c):console.warn(`Uncompiled message detected! Message:
|
|
3
3
|
|
|
4
4
|
> ${c}
|
|
5
5
|
|
|
@@ -7,7 +7,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
|
|
|
7
7
|
ICU features such as interpolation and plurals will not work properly for that message.
|
|
8
8
|
|
|
9
9
|
Please compile your catalog first.
|
|
10
|
-
`)),S(c)&&ke.test(c)?JSON.parse(`"${c}"`):S(c)?c:er(c,this._locale,this._locales)(e,t==null?void 0:t.formats)}date(r,e){return oe(this._locales||this._locale,r,e)}number(r,e){return Q(this._locales||this._locale,r,e)}};function
|
|
10
|
+
`)),S(c)&&ke.test(c)?JSON.parse(`"${c}"`):S(c)?c:er(c,this._locale,this._locales)(e,t==null?void 0:t.formats)}date(r,e){return oe(this._locales||this._locale,r,e)}number(r,e){return Q(this._locales||this._locale,r,e)}};function sr(o={}){return new re(o)}var O=sr();var u=function(o,r,e,t){if(e==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?o!==r||!t:!r.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?t:e==="a"?t.call(o):t?t.value:r.get(o)},g=function(o,r,e,t,a){if(t==="m")throw new TypeError("Private method is not writable");if(t==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof r=="function"?o!==r||!a:!r.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,e):a?a.value=e:r.set(o,e),e};function _e(o){var r,e,t,a,s,n,i,c,v,_,z,T,k,E,F,x,V,D,K;class Te extends o{constructor(...l){var d,b,m;super(...l),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),t.set(this,!1),a.set(this,!1),s.set(this,void 0),n.set(this,void 0),i.set(this,!0),v.set(this,""),_.set(this,()=>{g(this,a,!0,"f"),g(this,e,!0,"f"),u(this,r,"m",x).call(this)}),z.set(this,()=>{g(this,e,!1,"f"),u(this,r,"m",V).call(this,this.shouldFormValueUpdate()?u(this,v,"f"):""),!this.validity.valid&&u(this,a,"f")&&g(this,t,!0,"f");let C=u(this,r,"m",x).call(this);this.validationMessageCallback&&this.validationMessageCallback(C?this.internals.validationMessage:"")}),T.set(this,()=>{var C;u(this,i,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),g(this,i,!1,"f")),g(this,a,!0,"f"),g(this,t,!0,"f"),u(this,r,"m",x).call(this),(C=this===null||this===void 0?void 0:this.validationMessageCallback)===null||C===void 0||C.call(this,this.showError?this.internals.validationMessage:"")}),k.set(this,void 0),E.set(this,!1),F.set(this,Promise.resolve()),(d=this.addEventListener)===null||d===void 0||d.call(this,"focus",u(this,_,"f")),(b=this.addEventListener)===null||b===void 0||b.call(this,"blur",u(this,z,"f")),(m=this.addEventListener)===null||m===void 0||m.call(this,"invalid",u(this,T,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let l=this.validators.map(m=>m.attribute).flat(),d=super.observedAttributes||[];return[...new Set([...d,...l])]}static getValidator(l){return this.validators.find(d=>d.attribute===l)||null}static getValidators(l){return this.validators.filter(d=>{var b;if(d.attribute===l||!((b=d.attribute)===null||b===void 0)&&b.includes(l))return!0})}get form(){return this.internals.form}get showError(){return u(this,r,"m",x).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(l,d,b){var m;(m=super.attributeChangedCallback)===null||m===void 0||m.call(this,l,d,b);let N=this.constructor.getValidators(l);N!=null&&N.length&&this.validationTarget&&this.setValue(u(this,v,"f"))}setValue(l){var d;g(this,t,!1,"f"),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,""),g(this,v,l,"f");let m=this.shouldFormValueUpdate()?l:null;this.internals.setFormValue(m),u(this,r,"m",V).call(this,m),this.valueChangedCallback&&this.valueChangedCallback(m),u(this,r,"m",x).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(l=>l(u(this,F,"f")))}formResetCallback(){var l,d;g(this,a,!1,"f"),g(this,t,!1,"f"),u(this,r,"m",x).call(this),(l=this.resetFormControl)===null||l===void 0||l.call(this),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,u(this,r,"m",x).call(this)?this.validationMessage:"")}}return e=new WeakMap,t=new WeakMap,a=new WeakMap,s=new WeakMap,n=new WeakMap,i=new WeakMap,v=new WeakMap,_=new WeakMap,z=new WeakMap,T=new WeakMap,k=new WeakMap,E=new WeakMap,F=new WeakMap,r=new WeakSet,c=function(){let l=this.getRootNode(),d=`${this.localName}[name="${this.getAttribute("name")}"]`;return l.querySelectorAll(d)},x=function(){if(this.hasAttribute("disabled"))return!1;let l=u(this,t,"f")||u(this,a,"f")&&!this.validity.valid&&!u(this,e,"f");return l&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),l},V=function(l){let d=this.constructor,b={},m=d.validators,C=[],N=m.some(y=>y.isValid instanceof Promise);u(this,E,"f")||(g(this,F,new Promise(y=>{g(this,k,y,"f")}),"f"),g(this,E,!0,"f")),u(this,s,"f")&&(u(this,s,"f").abort(),g(this,n,u(this,s,"f"),"f"));let j=new AbortController;g(this,s,j,"f");let U,ie=!1;m.length&&(m.forEach(y=>{let G=y.key||"customError",$=y.isValid(this,l,j.signal);$ instanceof Promise?(C.push($),$.then(J=>{J!=null&&(b[G]=!J,U=u(this,r,"m",K).call(this,y,l),u(this,r,"m",D).call(this,b,U))})):(b[G]=!$,this.validity[G]!==!$&&(ie=!0),!$&&!U&&(U=u(this,r,"m",K).call(this,y,l)))}),Promise.allSettled(C).then(()=>{var y;j!=null&&j.signal.aborted||(g(this,E,!1,"f"),(y=u(this,k,"f"))===null||y===void 0||y.call(this))}),(ie||!N)&&u(this,r,"m",D).call(this,b,U))},D=function(l,d){if(this.validationTarget)this.internals.setValidity(l,d,this.validationTarget),g(this,i,!1,"f");else{if(this.internals.setValidity(l,d),this.internals.validity.valid)return;g(this,i,!0,"f")}},K=function(l,d){if(this.validityCallback){let b=this.validityCallback(l.key||"customError");if(b)return b}return l.message instanceof Function?l.message(this,d):l.message},Te}import{html as ae,LitElement as dr}from"lit";import{property as w,state as B}from"lit/decorators.js";import{repeat as ur}from"lit/directives/repeat.js";var nr=["en","nb","fi","da","sv"],Ce="en",Oe=o=>nr.find(r=>o===r||o.toLowerCase().includes(r))||Ce;function lr(){if(typeof window=="undefined"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return Oe(o)}try{let o=document.documentElement.lang;return Oe(o)}catch(o){return console.warn("could not detect locale, falling back to source locale",o),Ce}}var Me=(o,r,e,t,a)=>{O.load("en",o),O.load("nb",r),O.load("fi",e),O.load("da",t),O.load("sv",a);let s=lr();O.activate(s)};import{css as ze}from"lit";var Ee=ze`
|
|
11
11
|
*,
|
|
12
12
|
:before,
|
|
13
13
|
:after {
|
|
@@ -2446,13 +2446,13 @@ Please compile your catalog first.
|
|
|
2446
2446
|
display: none
|
|
2447
2447
|
}
|
|
2448
2448
|
}
|
|
2449
|
-
`;var Fe=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultater"]}]],"combobox.aria.noResults":["Ingen resultater"]}');var Se=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," result"],"other":["#"," results"]}]],"combobox.aria.noResults":["No results"]}');var Ae=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," tulos"],"other":["#"," tulosta"]}]],"combobox.aria.noResults":["Ei tuloksia"]}');var
|
|
2450
|
-
.z-0{z-index:0;}.z-20{z-index:20;}`;var A={wrapper:"relative z-0",base:"absolute z-20 left-0 right-0 s-bg pb-4 rounded-8 overflow-hidden shadow-m",listbox:"m-0 p-0 select-none list-none",option:"block cursor-pointer p-8",optionUnselected:"hover:s-bg-hover",optionSelected:"s-bg-selected hover:s-bg-selected-hover",textMatch:"font-bold",a11y:"sr-only"},
|
|
2451
|
-
>${e.substring(
|
|
2449
|
+
`;var Fe=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultater"]}]],"combobox.aria.noResults":["Ingen resultater"]}');var Se=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," result"],"other":["#"," results"]}]],"combobox.aria.noResults":["No results"]}');var Ae=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," tulos"],"other":["#"," tulosta"]}]],"combobox.aria.noResults":["Ei tuloksia"]}');var Ve=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultater"]}]],"combobox.aria.noResults":["Ingen resultater"]}');var Ie=JSON.parse('{"combobox.aria.pluralResults":[["numResults","plural",{"one":["#"," resultat"],"other":["#"," resultat"]}]],"combobox.aria.noResults":["Inga resultat"]}');import{css as cr}from"lit";var Le=cr`*,: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}.rounded-8{border-radius:8px}.block{display:block}.overflow-hidden{overflow:hidden}.list-none{list-style-type:none}.left-0{left:0}.right-0{right:0}.absolute{position:absolute}.relative{position:relative}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-selected{background-color:var(--w-s-color-background-selected)}.hover\\:s-bg-hover:hover{background-color:var(--w-s-color-background-hover)}.hover\\:s-bg-selected-hover:hover{background-color:var(--w-s-color-background-selected-hover)}.shadow-m{box-shadow:var(--w-shadow-m)}.m-0{margin:0}.p-0{padding:0}.p-8{padding:.8rem}.pb-4{padding-bottom:.4rem}.cursor-pointer{cursor:pointer}.font-bold{font-weight:700}.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}.select-none{-webkit-user-select:none;user-select:none};
|
|
2450
|
+
.z-0{z-index:0;}.z-20{z-index:20;}`;var A={wrapper:"relative z-0",base:"absolute z-20 left-0 right-0 s-bg pb-4 rounded-8 overflow-hidden shadow-m",listbox:"m-0 p-0 select-none list-none",option:"block cursor-pointer p-8",optionUnselected:"hover:s-bg-hover",optionSelected:"s-bg-selected hover:s-bg-selected-hover",textMatch:"font-bold",a11y:"sr-only"},q,h=class extends _e(dr){constructor(){super();this.options=[];this.value="";this.openOnFocus=!1;this.selectOnBlur=!0;this.matchTextSegments=!1;this.disableStaticFiltering=!1;this.invalid=!1;this.disabled=!1;this.required=!1;this.optional=!1;this.autocomplete="off";this._isOpen=!1;this._navigationOption=null;this._currentOptions=[];this._optionIdCounter=0;this._displayValue="";ue(this,q,null);Me(Se,Ve,Ae,Fe,Ie)}firstUpdated(e){he(this,q,this.value)}updated(e){e.has("value")&&this.setValue(this.value)}resetFormControl(){this.value=de(this,q)}get _listboxId(){return`${this._id}-listbox`}get _id(){return"combobox"}get _helpId(){return this.helpText?`${this._id}__hint`:void 0}get _navigationLabelOrDisplayValue(){return this._navigationOption?this._navigationOption.label||this._navigationOption.value:this._displayValue}get _navigationValueOrInputValue(){var e;return((e=this._navigationOption)==null?void 0:e.value)||this.value}_createOptionsWithIdAndMatch(e,t){return e.map((a,s)=>({...a,id:`${this._id}-option-${this._optionIdCounter+s}`,key:a.key||a.value,currentInputValue:t}))}_getAriaText(e,t){if(!e||!t)return"";let a=e.filter(i=>(i.label||i.value).toLowerCase().includes(t.toLowerCase())),s=O._({id:"combobox.aria.pluralResults",message:"{numResults, plural, one {# result} other {# results}}",comment:"Aria text for combobox when one or more results",values:{numResults:a.length}}),n=O._({id:"combobox.aria.noResults",message:"No results",comment:"Aria text for combobox when no results"});return a.length?s:n}_getOptionClasses(e){var t;return Y(A.option,((t=this._navigationOption)==null?void 0:t.id)===(e==null?void 0:e.id)?A.optionSelected:A.optionUnselected)}_handleKeyDown(e){let t=["ArrowDown","ArrowUp","PageUp","PageDown","Home","End"].includes(e.key),a=["ArrowDown","ArrowLeft","ArrowUp","ArrowRight"];if(t&&!this._isOpen){this._isOpen=!0;return}if(t&&this._isOpen){this._findAndSetActiveOption(e);return}if(!(e.altKey||e.ctrlKey||e.metaKey||e.shiftKey))switch(e.key){case"Enter":this._navigationOption&&(e.preventDefault(),this._handleSelect(this._navigationOption),requestAnimationFrame(()=>{var i,c;let s=(i=this.shadowRoot)==null?void 0:i.querySelector("w-textfield"),n=(c=s==null?void 0:s.shadowRoot)==null?void 0:c.querySelector("input");n&&(n.value=this._displayValue)})),this._isOpen=!1;break;case"Tab":case"Delete":this._isOpen=!1;break;case"Escape":this._isOpen?this._isOpen=!1:this._handleChange(""),this._navigationOption=null;break;case"Backspace":this._handleChange(this._navigationLabelOrDisplayValue),this._navigationOption=null,this._isOpen=!0;break;default:if(a.includes(e.key))break;this._isOpen=!0,this._navigationOption?(this._handleChange(this._navigationOption.value),this._navigationOption=null):this._handleChange(this.value);break}}_findAndSetActiveOption(e){e.preventDefault();let t=this._currentOptions.findIndex(n=>{var i;return n.id===((i=this._navigationOption)==null?void 0:i.id)}),a=t+1,s=t-1;switch(e.key){case"ArrowDown":this._navigationOption=a>this._currentOptions.length-1?null:this._currentOptions[a];break;case"ArrowUp":this._navigationOption=s===-2?this._currentOptions[this._currentOptions.length-1]:s<0?null:this._currentOptions[s];break;case"PageUp":this._navigationOption=t-10<0?this._currentOptions[0]:this._currentOptions[t-10];break;case"PageDown":this._navigationOption=t+10>this._currentOptions.length-1?this._currentOptions[this._currentOptions.length-1]:this._currentOptions[t+10];break;case"Home":this._navigationOption=this._currentOptions[0];break;case"End":this._navigationOption=this._currentOptions[this._currentOptions.length-1];break}}_handleSelect(e){this.value=e.value,this._displayValue=e.label||e.value,this.setValue(this.value);let t=new CustomEvent("select",{detail:{value:e.value},bubbles:!0,composed:!0});this.dispatchEvent(t),this._isOpen=!1,this._navigationOption=null,this.disableStaticFiltering&&(this._currentOptions=[])}_handleChange(e){if(e===void 0)return;this.value=e,this._displayValue=e;let t=new CustomEvent("change",{detail:{value:e},bubbles:!0,composed:!0});this.dispatchEvent(t)}_handleFocus(){if(!this.openOnFocus)return;let e=new CustomEvent("focus",{bubbles:!0,composed:!0});this.dispatchEvent(e),this._isOpen=!0}_handleBlur(e){var s,n;let t=e.relatedTarget;if(t&&((s=this.shadowRoot)!=null&&s.contains(t)))return;if(this._isOpen=!1,this.selectOnBlur&&(this._navigationOption||!this._navigationOption&&this._currentOptions.findIndex(i=>i.value===this.value)!==-1)){let i=((n=this._navigationOption)==null?void 0:n.value)||this.value;this.value=i;let c=new CustomEvent("select",{detail:{value:i},bubbles:!0,composed:!0});this.dispatchEvent(c)}this._navigationOption=null;let a=new CustomEvent("blur",{detail:{value:this._navigationValueOrInputValue},bubbles:!0,composed:!0});this.dispatchEvent(a)}_handleOptionClick(e,t){this._handleSelect(t),requestAnimationFrame(()=>{var n,i;let a=(n=this.shadowRoot)==null?void 0:n.querySelector("w-textfield"),s=(i=a==null?void 0:a.shadowRoot)==null?void 0:i.querySelector("input");s&&(s.value=t.label||t.value)})}_handleContainerBlur(e){(!e.currentTarget||!e.currentTarget.contains(e.relatedTarget))&&(this._isOpen=!1)}_renderTextMatch(e,t){if(!this.matchTextSegments)return e;let a=e.toLowerCase().indexOf(t.currentInputValue.toLowerCase());if(a!==-1){let s=a+t.currentInputValue.length;return ae`${e.substring(0,a)}<span class="${A.textMatch}">${e.substring(a,s)}</span
|
|
2451
|
+
>${e.substring(s)}`}return e}willUpdate(e){if(e.has("value")||e.has("options")){let t=this.options.find(s=>s.value===this.value),a=t?t.label||t.value:this.value;this._displayValue!==a&&this._displayValue!==this.value&&(this._displayValue=a),!this._displayValue&&this.value&&(this._displayValue=a)}(e.has("options")||e.has("value")||e.has("disableStaticFiltering")||e.has("_displayValue"))&&(this._optionIdCounter+=this.options.length,this._currentOptions=this._createOptionsWithIdAndMatch(this.options,this._displayValue).filter(t=>this.disableStaticFiltering?!0:(t.label||t.value).toLowerCase().includes(this._displayValue.toLowerCase()))),this.disableStaticFiltering&&this._currentOptions.length&&this._currentOptions.length===1&&!this._currentOptions.some(t=>t.value===this.value)&&!this._isOpen&&(this._isOpen=!0)}render(){var e;return ae`
|
|
2452
2452
|
<div class=${Y(A.wrapper)} @blur=${this._handleContainerBlur}>
|
|
2453
2453
|
<w-textfield
|
|
2454
2454
|
class="w-combobox-textfield"
|
|
2455
|
-
.value=${this.
|
|
2455
|
+
.value=${this._navigationLabelOrDisplayValue}
|
|
2456
2456
|
.label=${this.label}
|
|
2457
2457
|
.placeholder=${this.placeholder}
|
|
2458
2458
|
.invalid=${this.invalid}
|
|
@@ -2472,23 +2472,23 @@ Please compile your catalog first.
|
|
|
2472
2472
|
@blur=${this._handleBlur}
|
|
2473
2473
|
@keydown=${this._handleKeyDown}></w-textfield>
|
|
2474
2474
|
|
|
2475
|
-
<span class="${A.a11y}" role="status"> ${this._getAriaText(this._currentOptions,this.
|
|
2475
|
+
<span class="${A.a11y}" role="status"> ${this._getAriaText(this._currentOptions,this._displayValue)} </span>
|
|
2476
2476
|
|
|
2477
2477
|
<div ?hidden=${!this._isOpen||!this._currentOptions.length} class=${Y(A.base)}>
|
|
2478
2478
|
<ul id=${this._listboxId} role="listbox" class="${A.listbox}">
|
|
2479
|
-
${ur(this._currentOptions,t=>t.key,t=>{var
|
|
2479
|
+
${ur(this._currentOptions,t=>t.key,t=>{var s;let a=t.label||t.value;return ae`
|
|
2480
2480
|
<li
|
|
2481
2481
|
id=${t.id}
|
|
2482
2482
|
role="option"
|
|
2483
|
-
aria-selected=${((
|
|
2483
|
+
aria-selected=${((s=this._navigationOption)==null?void 0:s.id)===t.id}
|
|
2484
2484
|
tabindex="-1"
|
|
2485
2485
|
class=${this._getOptionClasses(t)}
|
|
2486
|
-
@mousedown=${
|
|
2486
|
+
@mousedown=${n=>this._handleOptionClick(n,t)}>
|
|
2487
2487
|
${this._renderTextMatch(a,t)}
|
|
2488
2488
|
</li>
|
|
2489
2489
|
`})}
|
|
2490
2490
|
</ul>
|
|
2491
2491
|
</div>
|
|
2492
2492
|
</div>
|
|
2493
|
-
`}};
|
|
2493
|
+
`}};q=new WeakMap,h.styles=[Ee,Le],p([w({type:Array})],h.prototype,"options",2),p([w({type:String,reflect:!0})],h.prototype,"label",2),p([w({type:String,reflect:!0})],h.prototype,"placeholder",2),p([w({type:String,reflect:!0})],h.prototype,"value",2),p([w({type:Boolean,attribute:"open-on-focus"})],h.prototype,"openOnFocus",2),p([w({type:Boolean,attribute:"select-on-blur"})],h.prototype,"selectOnBlur",2),p([w({type:Boolean,attribute:"match-text-segments"})],h.prototype,"matchTextSegments",2),p([w({type:Boolean,attribute:"disable-static-filtering"})],h.prototype,"disableStaticFiltering",2),p([w({type:Boolean,reflect:!0})],h.prototype,"invalid",2),p([w({type:String,attribute:"help-text",reflect:!0})],h.prototype,"helpText",2),p([w({type:Boolean,reflect:!0})],h.prototype,"disabled",2),p([w({type:Boolean,reflect:!0})],h.prototype,"required",2),p([w({type:Boolean,reflect:!0})],h.prototype,"optional",2),p([w({type:String,reflect:!0})],h.prototype,"name",2),p([w({type:String,reflect:!0})],h.prototype,"autocomplete",2),p([B()],h.prototype,"_isOpen",2),p([B()],h.prototype,"_navigationOption",2),p([B()],h.prototype,"_currentOptions",2),p([B()],h.prototype,"_optionIdCounter",2),p([B()],h.prototype,"_displayValue",2);customElements.get("w-combobox")||customElements.define("w-combobox",h);export{h as WarpCombobox};
|
|
2494
2494
|
//# sourceMappingURL=combobox.js.map
|