@nordhealth/components - npm Package Compare versions

Comparing version 1.0.0-alpha.33 to 1.0.0-alpha.34

lib/CommandMenu.js

@@ -6,3 +6,3 @@ import{b as e,r as t,D as o,p as s,T as n,_ as i,n as r,s as a}from"./DraftComponentMixin-4bb26f5d.js";import{e as l}from"./property-03f59dce.js";import{t as d}from"./state-70f38ceb.js";import{o as c}from"./unsafe-html-21f62902.js";import{e as p,i as h,t as m}from"./directive-e9ce14b4.js";import{a as v,c as u,u as f,m as x,s as g,e as b,n as w}from"./ref-65ef7607.js";import{o as y}from"./CommandMenuAction-97598b47.js";import{l as k}from"./if-defined-617ae549.js";import{groupBy as C}from"./collection.js";import{wrap as z}from"./number.js";import{NordEvent as $}from"./events.js";import{getFocusedElement as j}from"./focus.js";import{S as I,K as L}from"./KeyboardController-9a1b558b.js";import"./VisuallyHidden.js";import{SelectEvent as E}from"./events2.js";
  * SPDX-License-Identifier: BSD-3-Clause
- */const M=(e,t,o)=>{const s=new Map;for(let n=t;n<=o;n++)s.set(e[n],n);return s},S=p(class extends h{constructor(e){if(super(e),e.type!==m.CHILD)throw Error("repeat() can only be used in text expressions")}dt(e,t,o){let s;void 0===o?o=t:void 0!==t&&(s=t);const n=[],i=[];let r=0;for(const t of e)n[r]=s?s(t,r):r,i[r]=o(t,r),r++;return{values:i,keys:n}}render(e,t,o){return this.dt(e,t,o).values}update(t,[o,s,n]){var i;const r=v(t),{values:a,keys:l}=this.dt(o,s,n);if(!Array.isArray(r))return this.ct=l,a;const d=null!==(i=this.ct)&&void 0!==i?i:this.ct=[],c=[];let p,h,m=0,b=r.length-1,w=0,y=a.length-1;for(;m<=b&&w<=y;)if(null===r[m])m++;else if(null===r[b])b--;else if(d[m]===l[w])c[w]=u(r[m],a[w]),m++,w++;else if(d[b]===l[y])c[y]=u(r[b],a[y]),b--,y--;else if(d[m]===l[y])c[y]=u(r[m],a[y]),f(t,c[y+1],r[m]),m++,y--;else if(d[b]===l[w])c[w]=u(r[b],a[w]),f(t,r[m],r[b]),b--,w++;else if(void 0===p&&(p=M(l,w,y),h=M(d,m,b)),p.has(d[m]))if(p.has(d[b])){const e=h.get(l[w]),o=void 0!==e?r[e]:null;if(null===o){const e=f(t,r[m]);u(e,a[w]),c[w]=e}else c[w]=u(o,a[w]),f(t,r[m],o),r[e]=null;w++}else x(r[b]),b--;else x(r[m]),m++;for(;w<=y;){const e=f(t,c[y+1]);u(e,a[w]),c[w++]=e}for(;m<=b;){const e=r[m++];null!==e&&x(e)}return this.ct=l,g(t,c),e}});class A{constructor(e,t){this.handleFocusOut=e=>{const t=e.relatedTarget;!this.host.contains(t)&&this.onDismiss(e)},this.host=e,e.addController(this),this.onDismiss=t,this.shortcut=new I(this.host,{Escape:t})}hostConnected(){this.host.addEventListener("focusout",this.handleFocusOut)}hostDisconnected(){this.host.removeEventListener("focusout",this.handleFocusOut)}}const B=t`:host{--n-command-menu-width:640px;--n-command-menu-top:16%;--n-command-menu-height:290px;all:initial;font-family:var(--n-font-family);line-height:var(--n-line-height);font-feature-settings:var(--n-font-features)}.n-modal{display:none;position:fixed;z-index:var(--n-index-modal);inset-inline-start:0;inset-block-start:0;inline-size:100%;block-size:100%;overflow:auto}.n-modal.n-visible{display:block}.n-modal-content{position:relative;inset-block-start:var(--n-command-menu-top);margin:auto;display:flex;flex-direction:column;min-inline-size:0;background:var(--n-color-surface);border-radius:var(--n-border-radius);box-shadow:var(--n-box-shadow-modal);max-inline-size:var(--n-command-menu-width);overflow:hidden}.n-bump{animation:zoom-in-zoom-out var(--n-transition-slowly)}@keyframes zoom-in-zoom-out{0%{transform:translateY(-10px) scale(.97);opacity:0}100%{transform:translateY(0) scale(1.0001);opacity:1}}.n-modal-footer{display:flex;gap:var(--n-space-s);padding:var(--n-space-s) var(--n-space-m);font-size:calc(var(--n-font-size-s) - 1px);color:var(--n-color-text-weaker)}.n-help{display:flex;align-items:center;gap:2px}.n-help+.n-help{padding-inline-start:var(--n-space-s);border-inline-start:1px solid var(--n-color-border-strong)}.n-help svg{padding:3px 4px;inline-size:10px}.n-help.n-backspace svg{inline-size:12px}.n-search-wrapper{display:flex;border-block-end:1px solid var(--n-color-border)}[role=combobox]{flex:1;font-size:var(--n-font-size-l);font-weight:var(--n-font-weight);font-family:inherit;background:0 0;color:var(--n-color-text);border:none;border-radius:0;appearance:none;outline:0;margin:0;padding:var(--n-space-m)}[role=combobox]::-webkit-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]::-moz-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]:-ms-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=listbox]{max-block-size:var(--n-command-menu-height);overflow:auto;scroll-behavior:smooth;margin:0;padding:0}.n-group-header{line-height:var(--n-line-height);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-s)/ 1.4) var(--n-space-m);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:var(--n-font-size-s);background:var(--n-color-surface-raised);font-weight:var(--n-font-weight-active);color:var(--n-color-text-weaker)}.n-command-empty{display:flex;flex:1;flex-direction:column;border-inline-start:2px solid transparent;align-items:flex-start;color:var(--n-color-text);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-command-empty .n-title{flex:1;margin-block-start:var(--n-space-s);margin-inline-end:calc(var(--n-space-s)/ 2);max-inline-size:100%;font-size:var(--n-font-size-m);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.n-command-empty .n-tip{flex:1;margin-block-start:var(--n-space-s);margin-block-end:var(--n-space-m);font-size:var(--n-font-size-s);color:var(--n-color-text-weaker)}`;let D=class extends(o(a)){constructor(){super(...arguments),this.inputRef=b(),this.dismissController=new A(this,(()=>this.close())),this.keyboardController=new L(this,{trigger:()=>this.select(),goBack:()=>this.goBack(),end:()=>this.end(),start:()=>this.start(),next:()=>this.next(),previous:()=>this.previous(),toggleOpen:()=>this.toggleOpen()}),this.open=!1,this.placeholder="Type a command or search...",this.commands=[],this.search="",this.bump=!0,this.selectedIndex=0,this.filteredCommands=[]}get selected(){return this.filteredCommands[this.selectedIndex]}show(e={}){this.open=!0,this.setParent(e.parent),this.dispatchEvent(new $("open"))}close(){var e;this.open=!1,this.dispatchEvent(new $("close")),null===(e=this.previousFocus)||void 0===e||e.focus(),this.previousFocus=void 0}toggleOpen(){this.open?this.close():this.show()}focus(){var e;null===(e=this.inputRef.value)||void 0===e||e.focus()}willUpdate(e){e.has("commands")&&this.keyboardController.registerCommandShortcuts(),e.has("open")&&this.open&&(this.bump=!0),(e.has("search")||e.has("parent")||e.has("commands"))&&this.filterCommands()}updated(e){e.has("open")&&this.open&&(this.previousFocus=j(document),this.focus()),super.updated(e)}render(){var e;const t=C(this.filteredCommands,"section"),o=0===this.filteredCommands.length?"no-results":null===(e=this.selected)||void 0===e?void 0:e.id;return s`<div class="${y({"n-visible":this.open,"n-modal":!0})}"><div @animationend="${this.handleAnimationEnd}" class="${y({"n-bump":this.bump,"n-modal-content":!0})}"><div class="n-search-wrapper"><nord-visually-hidden id="instructions">Press 'Enter' to confirm your input or 'Escape' to cancel</nord-visually-hidden><input type="text" id="search" @input="${this.handleInput}" ${w(this.inputRef)} placeholder="${this.placeholder}" .value="${this.search}" spellcheck="false" autocomplete="off" autocapitalize="off" aria-label="Type the name of a command to run." aria-autocomplete="list" aria-haspopup="listbox" role="combobox" aria-controls="list" aria-expanded="true" aria-activedescendant="${k(o)}" aria-describedby="instructions"></div><div class="n-modal-body"><div id="list" role="listbox" aria-label="Commands" tabindex="0">${0===this.filteredCommands.length?s`<div id="no-results" class="n-command-empty" role="option" aria-selected="true"><div class="n-title">No results for “${this.search}”</div><div class="n-tip">Search tips: some search terms require exact match. Try typing the entire command name, or use a different word or phrase.</div></div>`:Array.from(t,(([e,t])=>this.renderSection(e,t)))}</div></div><slot name="footer"><div class="n-modal-footer" slot="footer"><span class="n-help">${c('<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path d="M105.833 24v93m0-93L80 49.833M105.833 24l25.834 25.833M34.167 117V24m0 93L60 91.167M34.167 117 8.333 91.167" fill="none" stroke="currentColor" stroke-width="14" stroke-linecap="round" stroke-linejoin="round"/></svg>')} Navigate</span> <span class="n-help">${c('<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="14"><path d="M35 133 7 105l28-28"/><path d="M7 105h112a14 14 0 0 0 14-14V21a14 14 0 0 0-14-14H77"/></g></svg>')} Select</span> <span class="n-help">Esc to dismiss</span> <span class="n-help n-backspace">${c('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="currentColor" fill-rule="evenodd" d="M6.707 4.879A3 3 0 0 1 8.828 4H15a3 3 0 0 1 3 3v6a3 3 0 0 1-3 3H8.828a3 3 0 0 1-2.12-.879l-4.415-4.414a1 1 0 0 1 0-1.414l4.414-4.414zm4 2.414a1 1 0 0 0-1.414 1.414L10.586 10l-1.293 1.293a1 1 0 1 0 1.414 1.414L12 11.414l1.293 1.293a1 1 0 0 0 1.414-1.414L13.414 10l1.293-1.293a1 1 0 0 0-1.414-1.414L12 8.586l-1.293-1.293z" clip-rule="evenodd"/></svg>')} Move to parent</span></div></slot></div></div>`}renderSection(e,t){const o=`section-${e}`;return s`<div role="group" aria-labelledby="${k(e?o:void 0)}">${e?s`<div class="n-group-header" role="presentation" id="${k(o)}">${e}</div>`:n} ${S(t,(e=>e.id),(e=>{var t,o;return s`<nord-command-menu-action id="${e.id}" .command="${e}" ?selected="${e.id===(null===(t=this.selected)||void 0===t?void 0:t.id)}" @click="${()=>this.select(e)}" role="option" aria-selected="${k(e.id===(null===(o=this.selected)||void 0===o?void 0:o.id)||void 0)}"></nord-command-menu-action>`}))}</div>`}handleAnimationEnd(){this.bump=!1}async handleInput(e){const t=e.target;this.setSearch(t.value)}select(e=this.selected){var t;this.commands.some((t=>t.parent===e.id))?(this.setParent(e.id),this.bump=!0,this.focus()):this.close(),this.setSearch(""),null===(t=e.handler)||void 0===t||t.call(e,this),this.dispatchEvent(new E(e))}start(){this.selectedIndex=0}end(){this.selectedIndex=this.filteredCommands.length-1}next(){this.selectedIndex=z(this.selectedIndex+1,0,this.filteredCommands.length-1)}previous(){this.selectedIndex=z(this.selectedIndex-1,0,this.filteredCommands.length-1)}goBack(){if(!this.search&&this.parent){const e=this.commands.find((e=>e.id===this.parent));this.setParent(null==e?void 0:e.parent)}}setParent(e){this.parent=e,this.setSearch("")}setSearch(e){this.search=e,this.selectedIndex=0}filterCommands(){const e=this.search.toLocaleLowerCase().split(/\s+/);this.filteredCommands=this.commands.filter((({title:t,keywords:o="",parent:s})=>{const n=`${t} ${o}`.toLocaleLowerCase(),i=e.every((e=>n.includes(e)));return(!this.parent&&this.search||s===this.parent)&&i}))}};D.styles=B,i([l({type:Boolean})],D.prototype,"open",void 0),i([l({type:String})],D.prototype,"placeholder",void 0),i([l({type:Array})],D.prototype,"commands",void 0),i([d()],D.prototype,"parent",void 0),i([d()],D.prototype,"search",void 0),i([d()],D.prototype,"bump",void 0),i([d()],D.prototype,"selectedIndex",void 0),i([d()],D.prototype,"filteredCommands",void 0),D=i([r("nord-command-menu")],D);var F=D;export{F as default};
+ */const M=(e,t,o)=>{const s=new Map;for(let n=t;n<=o;n++)s.set(e[n],n);return s},S=p(class extends h{constructor(e){if(super(e),e.type!==m.CHILD)throw Error("repeat() can only be used in text expressions")}dt(e,t,o){let s;void 0===o?o=t:void 0!==t&&(s=t);const n=[],i=[];let r=0;for(const t of e)n[r]=s?s(t,r):r,i[r]=o(t,r),r++;return{values:i,keys:n}}render(e,t,o){return this.dt(e,t,o).values}update(t,[o,s,n]){var i;const r=v(t),{values:a,keys:l}=this.dt(o,s,n);if(!Array.isArray(r))return this.ct=l,a;const d=null!==(i=this.ct)&&void 0!==i?i:this.ct=[],c=[];let p,h,m=0,b=r.length-1,w=0,y=a.length-1;for(;m<=b&&w<=y;)if(null===r[m])m++;else if(null===r[b])b--;else if(d[m]===l[w])c[w]=u(r[m],a[w]),m++,w++;else if(d[b]===l[y])c[y]=u(r[b],a[y]),b--,y--;else if(d[m]===l[y])c[y]=u(r[m],a[y]),f(t,c[y+1],r[m]),m++,y--;else if(d[b]===l[w])c[w]=u(r[b],a[w]),f(t,r[m],r[b]),b--,w++;else if(void 0===p&&(p=M(l,w,y),h=M(d,m,b)),p.has(d[m]))if(p.has(d[b])){const e=h.get(l[w]),o=void 0!==e?r[e]:null;if(null===o){const e=f(t,r[m]);u(e,a[w]),c[w]=e}else c[w]=u(o,a[w]),f(t,r[m],o),r[e]=null;w++}else x(r[b]),b--;else x(r[m]),m++;for(;w<=y;){const e=f(t,c[y+1]);u(e,a[w]),c[w++]=e}for(;m<=b;){const e=r[m++];null!==e&&x(e)}return this.ct=l,g(t,c),e}});class A{constructor(e,t){this.handleClickOut=e=>{const t=e.target;!this.host.contains(t)&&this.onDismiss(e)},this.host=e,e.addController(this),this.onDismiss=t,this.shortcut=new I(this.host,{Escape:t})}hostConnected(){document.addEventListener("click",this.handleClickOut,!0)}hostDisconnected(){document.removeEventListener("click",this.handleClickOut,!0)}}const B=t`:host{--n-command-menu-width:640px;--n-command-menu-top:16%;--n-command-menu-height:290px;all:initial;font-family:var(--n-font-family);line-height:var(--n-line-height);font-feature-settings:var(--n-font-features)}.n-modal{display:none;position:fixed;pointer-events:none;z-index:var(--n-index-modal);inset-inline-start:0;inset-block-start:0;inline-size:100%;block-size:100%;overflow:auto}.n-modal.n-visible{display:block}.n-modal-content{position:relative;pointer-events:all;inset-block-start:var(--n-command-menu-top);margin:auto;display:flex;flex-direction:column;min-inline-size:0;background:var(--n-color-surface);border-radius:var(--n-border-radius);box-shadow:var(--n-box-shadow-modal);max-inline-size:var(--n-command-menu-width);overflow:hidden}.n-bump{animation:zoom-in-zoom-out var(--n-transition-slowly)}@keyframes zoom-in-zoom-out{0%{transform:translateY(-10px) scale(.97);opacity:0}100%{transform:translateY(0) scale(1.0001);opacity:1}}.n-modal-footer{display:flex;gap:var(--n-space-s);padding:var(--n-space-s) var(--n-space-m);font-size:calc(var(--n-font-size-s) - 1px);color:var(--n-color-text-weaker)}.n-help{display:flex;align-items:center;gap:2px}.n-help+.n-help{padding-inline-start:var(--n-space-s);border-inline-start:1px solid var(--n-color-border-strong)}.n-help svg{padding:3px 4px;inline-size:10px}.n-help.n-backspace svg{inline-size:12px}.n-search-wrapper{display:flex;border-block-end:1px solid var(--n-color-border)}[role=combobox]{flex:1;font-size:var(--n-font-size-l);font-weight:var(--n-font-weight);font-family:inherit;background:0 0;color:var(--n-color-text);border:none;border-radius:0;appearance:none;outline:0;margin:0;padding:var(--n-space-m)}[role=combobox]::-webkit-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]::-moz-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=combobox]:-ms-input-placeholder{color:var(--n-color-text-weaker);opacity:.6!important}[role=listbox]{max-block-size:var(--n-command-menu-height);overflow:auto;margin:0;padding:0}.n-group-header{line-height:var(--n-line-height);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-s)/ 1.4) var(--n-space-m);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:var(--n-font-size-s);background:var(--n-color-surface-raised);font-weight:var(--n-font-weight-active);color:var(--n-color-text-weaker)}.n-command-empty{display:flex;flex:1;flex-direction:column;border-inline-start:2px solid transparent;align-items:flex-start;color:var(--n-color-text);border-block-end:1px solid var(--n-color-border);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-command-empty .n-title{flex:1;margin-block-start:var(--n-space-s);margin-inline-end:calc(var(--n-space-s)/ 2);max-inline-size:100%;font-size:var(--n-font-size-m);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.n-command-empty .n-tip{flex:1;margin-block-start:var(--n-space-s);margin-block-end:var(--n-space-m);font-size:var(--n-font-size-s);color:var(--n-color-text-weaker)}`;let D=class extends(o(a)){constructor(){super(...arguments),this.inputRef=b(),this.listRef=b(),this.dismissController=new A(this,(()=>this.close())),this.keyboardController=new L(this,{trigger:()=>this.select(),goBack:()=>this.goBack(),end:()=>this.end(),start:()=>this.start(),next:()=>this.next(),previous:()=>this.previous(),toggleOpen:()=>this.toggleOpen()}),this.open=!1,this.placeholder="Type a command or search...",this.commands=[],this.search="",this.bump=!0,this.selectedIndex=0,this.filteredCommands=[]}get selected(){return this.filteredCommands[this.selectedIndex]}show(e={}){const t=this.listRef.value;this.open=!0,this.setParent(e.parent),setTimeout((()=>{t.scrollTop=0}),0),this.dispatchEvent(new $("open"))}close(){var e;this.open=!1,this.dispatchEvent(new $("close")),null===(e=this.previousFocus)||void 0===e||e.focus(),this.previousFocus=void 0}toggleOpen(){this.open?this.close():this.show()}focus(){var e;null===(e=this.inputRef.value)||void 0===e||e.focus()}willUpdate(e){e.has("commands")&&this.keyboardController.registerCommandShortcuts(),e.has("open")&&this.open&&(this.bump=!0),(e.has("search")||e.has("parent")||e.has("commands"))&&this.filterCommands()}updated(e){e.has("open")&&this.open&&(this.previousFocus=j(document),this.focus()),super.updated(e)}render(){var e;const t=C(this.filteredCommands,"section"),o=0===this.filteredCommands.length?"no-results":null===(e=this.selected)||void 0===e?void 0:e.id;return s`<div class="${y({"n-visible":this.open,"n-modal":!0})}"><div @animationend="${this.handleAnimationEnd}" class="${y({"n-bump":this.bump,"n-modal-content":!0})}"><div class="n-search-wrapper"><nord-visually-hidden id="instructions">Press 'Enter' to confirm your input or 'Escape' to cancel</nord-visually-hidden><input type="text" id="search" @input="${this.handleInput}" ${w(this.inputRef)} placeholder="${this.placeholder}" .value="${this.search}" spellcheck="false" autocomplete="off" autocapitalize="off" aria-label="Type the name of a command to run." aria-autocomplete="list" aria-haspopup="listbox" role="combobox" aria-controls="list" aria-expanded="true" aria-activedescendant="${k(o)}" aria-describedby="instructions"></div><div class="n-modal-body"><div id="list" ${w(this.listRef)} role="listbox" aria-label="Commands" tabindex="0">${0===this.filteredCommands.length?s`<div id="no-results" class="n-command-empty" role="option" aria-selected="true"><div class="n-title">No results for “${this.search}”</div><div class="n-tip">Search tips: some search terms require exact match. Try typing the entire command name, or use a different word or phrase.</div></div>`:Array.from(t,(([e,t])=>this.renderSection(e,t)))}</div></div><slot name="footer"><div class="n-modal-footer" slot="footer"><span class="n-help">${c('<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path d="M105.833 24v93m0-93L80 49.833M105.833 24l25.834 25.833M34.167 117V24m0 93L60 91.167M34.167 117 8.333 91.167" fill="none" stroke="currentColor" stroke-width="14" stroke-linecap="round" stroke-linejoin="round"/></svg>')} Navigate</span> <span class="n-help">${c('<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><g fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="14"><path d="M35 133 7 105l28-28"/><path d="M7 105h112a14 14 0 0 0 14-14V21a14 14 0 0 0-14-14H77"/></g></svg>')} Select</span> <span class="n-help">Esc to dismiss</span> <span class="n-help n-backspace">${c('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill="currentColor" fill-rule="evenodd" d="M6.707 4.879A3 3 0 0 1 8.828 4H15a3 3 0 0 1 3 3v6a3 3 0 0 1-3 3H8.828a3 3 0 0 1-2.12-.879l-4.415-4.414a1 1 0 0 1 0-1.414l4.414-4.414zm4 2.414a1 1 0 0 0-1.414 1.414L10.586 10l-1.293 1.293a1 1 0 1 0 1.414 1.414L12 11.414l1.293 1.293a1 1 0 0 0 1.414-1.414L13.414 10l1.293-1.293a1 1 0 0 0-1.414-1.414L12 8.586l-1.293-1.293z" clip-rule="evenodd"/></svg>')} Move to parent</span></div></slot></div></div>`}renderSection(e,t){const o=`section-${e}`;return s`<div role="group" aria-labelledby="${k(e?o:void 0)}">${e?s`<div class="n-group-header" role="presentation" id="${k(o)}">${e}</div>`:n} ${S(t,(e=>e.id),(e=>{var t,o;return s`<nord-command-menu-action id="${e.id}" .command="${e}" ?selected="${e.id===(null===(t=this.selected)||void 0===t?void 0:t.id)}" @click="${()=>this.select(e)}" role="option" aria-selected="${k(e.id===(null===(o=this.selected)||void 0===o?void 0:o.id)||void 0)}"></nord-command-menu-action>`}))}</div>`}handleAnimationEnd(){this.bump=!1}async handleInput(e){const t=e.target;this.setSearch(t.value)}select(e=this.selected){var t;this.commands.some((t=>t.parent===e.id))?(this.setParent(e.id),this.bump=!0,this.focus()):this.close(),this.setSearch(""),null===(t=e.handler)||void 0===t||t.call(e,this),this.dispatchEvent(new E(e))}start(){this.selectedIndex=0}end(){this.selectedIndex=this.filteredCommands.length-1}next(){this.selectedIndex=z(this.selectedIndex+1,0,this.filteredCommands.length-1)}previous(){this.selectedIndex=z(this.selectedIndex-1,0,this.filteredCommands.length-1)}goBack(){if(!this.search&&this.parent){const e=this.commands.find((e=>e.id===this.parent));this.setParent(null==e?void 0:e.parent)}}setParent(e){this.parent=e,this.setSearch("")}setSearch(e){this.search=e,this.selectedIndex=0}filterCommands(){const e=this.search.toLocaleLowerCase().split(/\s+/);this.filteredCommands=this.commands.filter((({title:t,keywords:o="",parent:s})=>{const n=`${t} ${o}`.toLocaleLowerCase(),i=e.every((e=>n.includes(e)));return(!this.parent&&this.search||s===this.parent)&&i}))}};D.styles=B,i([l({type:Boolean})],D.prototype,"open",void 0),i([l({type:String})],D.prototype,"placeholder",void 0),i([l({type:Array})],D.prototype,"commands",void 0),i([d()],D.prototype,"parent",void 0),i([d()],D.prototype,"search",void 0),i([d()],D.prototype,"bump",void 0),i([d()],D.prototype,"selectedIndex",void 0),i([d()],D.prototype,"filteredCommands",void 0),D=i([r("nord-command-menu")],D);var O=D;export{O as default};
 //# sourceMappingURL=CommandMenu.js.map

lib/Icon.js

@@ -1,2 +0,2 @@
-import{r as e,D as i,p as s,_ as t,n as o,s as r}from"./DraftComponentMixin-4bb26f5d.js";import{e as n}from"./property-03f59dce.js";import{t as l}from"./state-70f38ceb.js";import{l as a}from"./if-defined-617ae549.js";import{o as c}from"./unsafe-html-21f62902.js";import"./directive-e9ce14b4.js";const h=e`:host{all:initial;display:inline-block;block-size:var(--n-icon-size);inline-size:var(--n-icon-size);line-height:var(--n-line-height);color:var(--n-color-text)}*,::after,::before{box-sizing:border-box;margin:0;padding:0}:host([size=xs]){--n-icon-size:var(--n-size-icon-xs)}:host([size="s"]){--n-icon-size:var(--n-size-icon-s)}:host([size="m"]){--n-icon-size:var(--n-size-icon-m)}:host([size="l"]){--n-icon-size:var(--n-size-icon-l)}:host([size=xl]){--n-icon-size:var(--n-size-icon-xl)}:host([size=xxl]){--n-icon-size:var(--n-size-icon-xxl)}.n-icon{display:block}svg{display:block}`;var d;let v=d=class extends(i(r)){constructor(){super(...arguments),this.name="",this.size="m",this.svg=""}static registerResolver(e){d.resolver=e}static registerIcon(e,i){let s,t;if("string"==typeof e?(s=e,t=i):(s=e.title,t=e.default),!s)throw new Error("name is required when registering an icon");if(!t)throw new Error("icon must not be empty");d.registeredIcons.has(s)||d.registeredIcons.set(s,t)}willUpdate(e){if(!e.has("name"))return;const i=this.resolve();"string"==typeof i?this.svg=i:i.then((e=>{this.svg=e})).catch((()=>{this.svg=""}))}render(){return s`<div role="${a(this.label?"img":void 0)}" aria-label="${a(this.label)}"><slot style="${a(this.color?`color:${this.color}`:void 0)}" aria-hidden="true">${c(this.svg)}</slot></div>`}resolve(){return this.name?d.registeredIcons.has(this.name)?d.registeredIcons.get(this.name):d.resolver(this.name):""}};v.styles=h,v.resolver=e=>fetch(`https://nordcdn.net/ds/icons/1.2.2/assets/${e}.svg`).then((e=>e.text())),v.registeredIcons=new Map,t([n({reflect:!0})],v.prototype,"name",void 0),t([n({reflect:!0})],v.prototype,"size",void 0),t([n({reflect:!0})],v.prototype,"color",void 0),t([n({reflect:!0})],v.prototype,"label",void 0),t([l()],v.prototype,"svg",void 0),v=d=t([o("nord-icon")],v);var p=v;export{p as default};
+import{r as e,D as i,p as s,_ as t,n as o,s as r}from"./DraftComponentMixin-4bb26f5d.js";import{e as n}from"./property-03f59dce.js";import{t as l}from"./state-70f38ceb.js";import{l as a}from"./if-defined-617ae549.js";import{o as c}from"./unsafe-html-21f62902.js";import"./directive-e9ce14b4.js";const h=e`:host{all:initial;display:inline-block;block-size:var(--n-icon-size);inline-size:var(--n-icon-size);line-height:var(--n-line-height);color:var(--n-color-text)}*,::after,::before{box-sizing:border-box;margin:0;padding:0}:host([size=xs]){--n-icon-size:var(--n-size-icon-xs)}:host([size="s"]){--n-icon-size:var(--n-size-icon-s)}:host([size="m"]){--n-icon-size:var(--n-size-icon-m)}:host([size="l"]){--n-icon-size:var(--n-size-icon-l)}:host([size=xl]){--n-icon-size:var(--n-size-icon-xl)}:host([size=xxl]){--n-icon-size:var(--n-size-icon-xxl)}.n-icon{display:block}svg{display:block}`;var d;let v=d=class extends(i(r)){constructor(){super(...arguments),this.name="",this.size="m",this.svg=""}static registerResolver(e){d.resolver=e}static registerIcon(e,i){let s,t;if("string"==typeof e?(s=e,t=i):(s=e.title,t=e.default),!s)throw new Error("name is required when registering an icon");if(!t)throw new Error("icon must not be empty");d.registeredIcons.has(s)||d.registeredIcons.set(s,t)}willUpdate(e){if(!e.has("name"))return;const i=this.resolve();"string"==typeof i?this.svg=i:i.then((e=>{this.svg=e})).catch((()=>{this.svg=""}))}render(){return s`<div role="${a(this.label?"img":void 0)}" aria-label="${a(this.label)}"><slot style="${a(this.color?`color:${this.color}`:void 0)}" aria-hidden="true">${c(this.svg)}</slot></div>`}resolve(){return this.name?d.registeredIcons.has(this.name)?d.registeredIcons.get(this.name):d.resolver(this.name):""}};v.styles=h,v.resolver=e=>fetch(`https://nordcdn.net/ds/icons/1.3.1/assets/${e}.svg`).then((e=>e.text())),v.registeredIcons=new Map,t([n({reflect:!0})],v.prototype,"name",void 0),t([n({reflect:!0})],v.prototype,"size",void 0),t([n({reflect:!0})],v.prototype,"color",void 0),t([n({reflect:!0})],v.prototype,"label",void 0),t([l()],v.prototype,"svg",void 0),v=d=t([o("nord-icon")],v);var p=v;export{p as default};
 //# sourceMappingURL=Icon.js.map

lib/src/command-menu/CommandMenu.d.ts

@@ -16,2 +16,3 @@ import { LitElement, PropertyValues } from "lit";
     private inputRef;
+    private listRef;
     private previousFocus?;
@@ -18,0 +19,0 @@ private dismissController;

lib/src/common/controllers/LightDismissController.d.ts

@@ -9,3 +9,3 @@ import { LitElement, ReactiveController } from "lit";
     hostDisconnected(): void;
-    private handleFocusOut;
+    private handleClickOut;
 }

package.json

 {
   "name": "@nordhealth/components",
-  "version": "1.0.0-alpha.33",
+  "version": "1.0.0-alpha.34",
   "description": "This package includes Nord Design System web components",
@@ -140,3 +140,3 @@ "author": "Nordhealth <[e-mail]>",
   },
-  "gitHead": "caaaa4a2da28d765571fb1c4aea2c903c9055de0"
+  "gitHead": "24bb9fcb8d5f3cd40fbcfb6b4ad48ce9b831fd84"
 }

No alert changes

Improved metrics

Total package byte prevSize

364024

increased by0.2%

Lines of code

4540

increased by0.15%

No dependency changes