npm - @nordhealth/components - Versions diffs - 2.3.0 → 2.4.0 - Mend

@nordhealth/components 2.3.0 → 2.4.0

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.

Files changed (20) hide show

package/custom-elements.json +818 -818
package/lib/Badge.js +1 -1
package/lib/Badge.js.map +1 -1
package/lib/{Calendar-a0246aa3.js → Calendar-8b36a7e5.js} +2 -2
package/lib/Calendar-8b36a7e5.js.map +1 -0
package/lib/Calendar.js +1 -1
package/lib/Checkbox.js +1 -1
package/lib/Checkbox.js.map +1 -1
package/lib/DatePicker.js +1 -1
package/lib/DatePicker.js.map +1 -1
package/lib/Icon.js +1 -1
package/lib/Icon.js.map +1 -1
package/lib/NavItem.js +1 -1
package/lib/NavItem.js.map +1 -1
package/lib/bundle.js +7 -7
package/lib/bundle.js.map +1 -1
package/lib/index.js +1 -1
package/lib/src/icon/Icon.d.ts +1 -1
package/package.json +5 -5
package/lib/Calendar-a0246aa3.js.map +0 -1

package/lib/Badge.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{_ as e,e as t}from"./query-assigned-elements-e6cbac30.js";import{i as o,s as r,y as s}from"./lit-element-79bc2e0e.js";import{e as a}from"./property-03f59dce.js";import n from"./Icon.js";import{s as l}from"./Component-49a41387.js";import"./state-70f38ceb.js";import"./if-defined-f43b1487.js";import"./unsafe-html-be8023cd.js";import"./directive-de55b00a.js";import"./observe-a9c6dfb6.js";import"./cond-0a8d4554.js";const c="interface-cancelled-small";var i=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m7.80265 23.7423c-2.51458-4.4598-1.87318-10.2181 1.9242-14.01545 3.79735-3.79738 9.55565-4.43878 14.01545-1.9242zm4.45465 4.4548 15.9398-15.9398c2.5149 4.4599 1.8735 10.2184-1.9239 14.0159-3.7975 3.7974-9.556 4.4388-14.0159 1.9239zm-6.98522 2.5308c-7.02944-7.0294-7.02944-18.4264 0-25.45582 7.02942-7.02944 18.42642-7.02944 25.45582 0 7.0295 7.02942 7.0295 18.42642 0 25.45582-7.0294 7.0295-18.4264 7.0295-25.45582 0z" fill="currentColor" fill-rule="evenodd"/></svg>',title:c,tags:"nordicon interface small badge process indicator status cancelled progress"});const p="interface-complete-small";var d=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><circle cx="18" cy="18" fill="currentColor" r="18"/></svg>',title:p,tags:"nordicon interface small badge process indicator status fulfilled complete progress"});const g="interface-incomplete-small";var f=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m18 29.7c6.4617 0 11.7-5.2383 11.7-11.7s-5.2383-11.7-11.7-11.7-11.7 5.2383-11.7 11.7 5.2383 11.7 11.7 11.7zm0 6.3c9.9411 0 18-8.0589 18-18 0-9.94112-8.0589-18-18-18-9.94112 0-18 8.05888-18 18 0 9.9411 8.05888 18 18 18z" fill="currentColor" fill-rule="evenodd"/></svg>',title:g,tags:"nordicon interface small badge process indicator status cancelled unfulfilled incomplete progress"});const m="interface-partially-complete-small";var v=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m6.3 18h23.4c0-6.4617-5.2383-11.7-11.7-11.7s-11.7 5.2383-11.7 11.7zm29.7 0c0 9.9411-8.0589 18-18 18-9.94113 0-18-8.0589-18-18 0-9.94113 8.05887-18 18-18 9.9411 0 18 8.05887 18 18z" fill="currentColor" fill-rule="evenodd"/></svg>',title:m,tags:"nordicon interface small badge process indicator status partially fulfilled complete progress"});const u=o`:host{--_n-badge-color:var(--n-color-text);--_n-badge-chip-color:var(--n-color-status-neutral-weak);display:inline;vertical-align:middle}.n-badge{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;border-radius:var(--n-border-radius-pill);background:var(--_n-badge-chip-color);font-size:var(--n-font-size-s);font-family:var(--n-font-family);font-weight:var(--n-font-weight);font-feature-settings:var(--n-font-features);line-height:var(--n-line-height);letter-spacing:0;padding-block-start:calc(var(--n-space-s)/ 4);padding-block-end:calc(var(--n-space-s)/ 4);padding-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s);color:var(--_n-badge-color);gap:calc(var(--n-space-s)/ 2);align-items:center;display:inline-flex;white-space:nowrap;position:relative}:host([type=success]){--_n-badge-chip-color:var(--n-color-status-success-weak)}:host([type=warning]){--_n-badge-chip-color:var(--n-color-status-warning-weak)}:host([type=highlight]){--_n-badge-chip-color:var(--n-color-status-highlight-weak)}:host([type=info]){--_n-badge-chip-color:var(--n-color-status-info-weak)}:host([type=progress]){--_n-badge-chip-color:var(--n-color-status-progress-weak)}:host([type=danger]){--_n-badge-chip-color:var(--n-color-status-danger);--_n-badge-color:var(--n-color-text-on-accent)}`;n.registerIcon(i),n.registerIcon(d),n.registerIcon(f),n.registerIcon(v);const h={cancelled:c,complete:p,incomplete:g,"partially-complete":m};let b=class extends r{constructor(){super(...arguments),this.type="neutral"}render(){const e=this.progress?h[this.progress]:"";return s`<span class="n-badge"><nord-icon name="${e}" size="xs" ?hidden="${!e}"></nord-icon><slot></slot></span>`}};b.styles=[l,u],e([a({reflect:!0})],b.prototype,"type",void 0),e([a()],b.prototype,"progress",void 0),b=e([t("nord-badge")],b);var w=b;export{w as default};
+import{_ as e,e as t}from"./query-assigned-elements-e6cbac30.js";import{i as o,s as r,y as s}from"./lit-element-79bc2e0e.js";import{e as a}from"./property-03f59dce.js";import n from"./Icon.js";import{s as l}from"./Component-49a41387.js";import"./state-70f38ceb.js";import"./if-defined-f43b1487.js";import"./unsafe-html-be8023cd.js";import"./directive-de55b00a.js";import"./observe-a9c6dfb6.js";import"./cond-0a8d4554.js";const c="interface-cancelled-small";var i=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m7.80265 23.7423c-2.51458-4.4598-1.87318-10.2181 1.9242-14.01545 3.79735-3.79738 9.55565-4.43878 14.01545-1.9242zm4.45465 4.4548 15.9398-15.9398c2.5149 4.4599 1.8735 10.2184-1.9239 14.0159-3.7975 3.7974-9.556 4.4388-14.0159 1.9239zm-6.98522 2.5308c-7.02944-7.0294-7.02944-18.4264 0-25.45582 7.02942-7.02944 18.42642-7.02944 25.45582 0 7.0295 7.02942 7.0295 18.42642 0 25.45582-7.0294 7.0295-18.4264 7.0295-25.45582 0z" fill="currentColor" fill-rule="evenodd"/></svg>',title:c,tags:"nordicon interface small badge process indicator status cancelled progress"});const p="interface-complete-small";var d=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><circle cx="18" cy="18" fill="currentColor" r="18"/></svg>',title:p,tags:"nordicon interface small badge process indicator status fulfilled complete progress"});const g="interface-incomplete-small";var f=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m18 29.7c6.4617 0 11.7-5.2383 11.7-11.7s-5.2383-11.7-11.7-11.7-11.7 5.2383-11.7 11.7 5.2383 11.7 11.7 11.7zm0 6.3c9.9411 0 18-8.0589 18-18 0-9.94112-8.0589-18-18-18-9.94112 0-18 8.05888-18 18 0 9.9411 8.05888 18 18 18z" fill="currentColor" fill-rule="evenodd"/></svg>',title:g,tags:"nordicon interface small badge process indicator status cancelled unfulfilled incomplete progress"});const m="interface-partially-complete-small";var v=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 36 36" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="m6.3 18h23.4c0-6.4617-5.2383-11.7-11.7-11.7s-11.7 5.2383-11.7 11.7zm29.7 0c0 9.9411-8.0589 18-18 18-9.94113 0-18-8.0589-18-18 0-9.94113 8.05887-18 18-18 9.9411 0 18 8.05887 18 18z" fill="currentColor" fill-rule="evenodd"/></svg>',title:m,tags:"nordicon interface small badge process indicator status partially fulfilled complete progress"});const u=o`:host{--_n-badge-color:var(--n-color-text);--_n-badge-chip-color:var(--n-color-status-neutral-weak);display:inline;vertical-align:middle}.n-badge{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;border-radius:var(--n-border-radius-pill);background:var(--_n-badge-chip-color);font-size:var(--n-font-size-s);font-family:var(--n-font-family);font-weight:var(--n-font-weight);font-feature-settings:var(--n-font-features);line-height:var(--n-line-height);letter-spacing:0;padding-block-start:calc(var(--n-space-s)/ 4);padding-block-end:calc(var(--n-space-s)/ 4);padding-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s);color:var(--_n-badge-color);gap:calc(var(--n-space-s)/ 2);align-items:center;display:inline-flex;white-space:nowrap;position:relative}:host([type=success]){--_n-badge-chip-color:var(--n-color-status-success-weak)}:host([type=warning]){--_n-badge-chip-color:var(--n-color-status-warning-weak)}:host([type=highlight]){--_n-badge-chip-color:var(--n-color-status-highlight-weak)}:host([type=info]){--_n-badge-chip-color:var(--n-color-status-info-weak)}:host([type=progress]){--_n-badge-chip-color:var(--n-color-status-progress-weak)}:host([type=danger]){--_n-badge-chip-color:var(--n-color-status-danger);--_n-badge-color:var(--n-color-text-on-accent)}`;n.registerIcon(i),n.registerIcon(d),n.registerIcon(f),n.registerIcon(v);const h={cancelled:c,complete:p,incomplete:g,"partially-complete":m};let b=class extends r{constructor(){super(...arguments),this.type="neutral"}render(){const e=this.progress?h[this.progress]:"";return s`<span class="n-badge"><nord-icon name="${e}" size="xxs" ?hidden="${!e}"></nord-icon><slot></slot></span>`}};b.styles=[l,u],e([a({reflect:!0})],b.prototype,"type",void 0),e([a()],b.prototype,"progress",void 0),b=e([t("nord-badge")],b);var w=b;export{w as default};
 //# sourceMappingURL=Badge.js.map

package/lib/Badge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Badge.js","sources":["../../icons/lib/assets/interface-cancelled-small.js","../../icons/lib/assets/interface-complete-small.js","../../icons/lib/assets/interface-incomplete-small.js","../../icons/lib/assets/interface-partially-complete-small.js","../src/badge/Badge.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><path clip-rule=\"evenodd\" d=\"m7.80265 23.7423c-2.51458-4.4598-1.87318-10.2181 1.9242-14.01545 3.79735-3.79738 9.55565-4.43878 14.01545-1.9242zm4.45465 4.4548 15.9398-15.9398c2.5149 4.4599 1.8735 10.2184-1.9239 14.0159-3.7975 3.7974-9.556 4.4388-14.0159 1.9239zm-6.98522 2.5308c-7.02944-7.0294-7.02944-18.4264 0-25.45582 7.02942-7.02944 18.42642-7.02944 25.45582 0 7.0295 7.02942 7.0295 18.42642 0 25.45582-7.0294 7.0295-18.4264 7.0295-25.45582 0z\" fill=\"currentColor\" fill-rule=\"evenodd\"/></svg>'\nexport const title = \"interface-cancelled-small\"\nexport const tags = \"nordicon interface small badge process indicator status cancelled progress\"\n","export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"18\" cy=\"18\" fill=\"currentColor\" r=\"18\"/></svg>'\nexport const title = \"interface-complete-small\"\nexport const tags = \"nordicon interface small badge process indicator status fulfilled complete progress\"\n","export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><path clip-rule=\"evenodd\" d=\"m18 29.7c6.4617 0 11.7-5.2383 11.7-11.7s-5.2383-11.7-11.7-11.7-11.7 5.2383-11.7 11.7 5.2383 11.7 11.7 11.7zm0 6.3c9.9411 0 18-8.0589 18-18 0-9.94112-8.0589-18-18-18-9.94112 0-18 8.05888-18 18 0 9.9411 8.05888 18 18 18z\" fill=\"currentColor\" fill-rule=\"evenodd\"/></svg>'\nexport const title = \"interface-incomplete-small\"\nexport const tags = \"nordicon interface small badge process indicator status cancelled unfulfilled incomplete progress\"\n","export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><path clip-rule=\"evenodd\" d=\"m6.3 18h23.4c0-6.4617-5.2383-11.7-11.7-11.7s-11.7 5.2383-11.7 11.7zm29.7 0c0 9.9411-8.0589 18-18 18-9.94113 0-18-8.0589-18-18 0-9.94113 8.05887-18 18-18 9.9411 0 18 8.05887 18 18z\" fill=\"currentColor\" fill-rule=\"evenodd\"/></svg>'\nexport const title = \"interface-partially-complete-small\"\nexport const tags = \"nordicon interface small badge process indicator status partially fulfilled complete progress\"\n","import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport * as cancelledIcon from \"@nordhealth/icons/lib/assets/interface-cancelled-small.js\"\nimport * as completeIcon from \"@nordhealth/icons/lib/assets/interface-complete-small.js\"\nimport * as incompleteIcon from \"@nordhealth/icons/lib/assets/interface-incomplete-small.js\"\nimport * as partiallyCompleteIcon from \"@nordhealth/icons/lib/assets/interface-partially-complete-small.js\"\nimport Icon from \"../icon/Icon.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Badge.css\"\n\nIcon.registerIcon(cancelledIcon)\nIcon.registerIcon(completeIcon)\nIcon.registerIcon(incompleteIcon)\nIcon.registerIcon(partiallyCompleteIcon)\n\nconst iconMap: Record<Exclude<Badge[\"progress\"], undefined>, string> = {\n cancelled: cancelledIcon.title,\n complete: completeIcon.title,\n incomplete: incompleteIcon.title,\n \"partially-complete\": partiallyCompleteIcon.title,\n}\n\n/*\n Badges are used to inform users of the status of an object\n * or of an action that’s been taken. Commonly used in tabular\n * data to indicate status.\n \n @status ready\n * @category text\n * @slot - The badge content.\n /\n@customElement(\"nord-badge\")\nexport default class Badge extends LitElement {\n static styles = [componentStyle, style]\n\n /\n The type of badge.\n * Determines the background color of the badge.\n /\n @property({ reflect: true }) type?: \"warning\" \| \"success\" \| \"danger\" \| \"highlight\" \| \"info\" \| \"neutral\" \| \"progress\" =\n \"neutral\"\n\n /\n The progress of the badge. Displays a progress\n * indicator next to the label.\n */\n @property() progress?: \"cancelled\" \| \"complete\" \| \"incomplete\" \| \"partially-complete\"\n\n render() {\n const icon = this.progress ? iconMap[this.progress] : \"\"\n\n return html`\n <span class=\"n-badge\">\n <nord-icon name=${icon} size=\"xs\" ?hidden=${!icon}></nord-icon>\n <slot></slot>\n </span>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-badge\": Badge\n }\n}\n"],"names":["title","Icon","registerIcon","cancelledIcon","completeIcon","incompleteIcon","partiallyCompleteIcon","iconMap","cancelled","cancelledIcon.title","complete","completeIcon.title","incomplete","incompleteIcon.title","partiallyCompleteIcon.title","Badge","LitElement","constructor","this","type","render","icon","progress","html","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"qaACO,MAAMA,EAAQ,wEADN,2jBAEK,+ECDb,MAAMA,EAAQ,uEADN,sIAEK,wFCDb,MAAMA,EAAQ,yEADN,oXAEK,sGCDb,MAAMA,EAAQ,iFADN,6UAEK,q3CCSpBC,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAClBH,EAAKC,aAAaG,GAClBJ,EAAKC,aAAaI,GAElB,MAAMC,EAAiE,CACrEC,UAAWC,EACXC,SAAUC,EACVC,WAAYC,EACZ,qBAAsBC,GAaxB,IAAqBC,EAArB,cAAmCC,EAAnCC,kCAO+BC,KAAIC,KAC/B,SAkBH,CAVCC,SACE,MAAMC,EAAOH,KAAKI,SAAWf,EAAQW,KAAKI,UAAY,GAEtD,OAAOC,CAAI,0CAEWF,~~0BAA2BA~~,~~qCAIlD~~,GAxBMN,EAAAS,OAAS,CAACC,EAAgBC,GAMJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KACVd,EAAAe,UAAA,YAAA,GAMCH,EAAA,CAAXC,KAAoFb,EAAAe,UAAA,gBAAA,GAdlEf,EAAKY,EAAA,CADzBI,EAAc,eACMhB,SAAAA"}
1	+ {"version":3,"file":"Badge.js","sources":["../../icons/lib/assets/interface-cancelled-small.js","../../icons/lib/assets/interface-complete-small.js","../../icons/lib/assets/interface-incomplete-small.js","../../icons/lib/assets/interface-partially-complete-small.js","../src/badge/Badge.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><path clip-rule=\"evenodd\" d=\"m7.80265 23.7423c-2.51458-4.4598-1.87318-10.2181 1.9242-14.01545 3.79735-3.79738 9.55565-4.43878 14.01545-1.9242zm4.45465 4.4548 15.9398-15.9398c2.5149 4.4599 1.8735 10.2184-1.9239 14.0159-3.7975 3.7974-9.556 4.4388-14.0159 1.9239zm-6.98522 2.5308c-7.02944-7.0294-7.02944-18.4264 0-25.45582 7.02942-7.02944 18.42642-7.02944 25.45582 0 7.0295 7.02942 7.0295 18.42642 0 25.45582-7.0294 7.0295-18.4264 7.0295-25.45582 0z\" fill=\"currentColor\" fill-rule=\"evenodd\"/></svg>'\nexport const title = \"interface-cancelled-small\"\nexport const tags = \"nordicon interface small badge process indicator status cancelled progress\"\n","export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"18\" cy=\"18\" fill=\"currentColor\" r=\"18\"/></svg>'\nexport const title = \"interface-complete-small\"\nexport const tags = \"nordicon interface small badge process indicator status fulfilled complete progress\"\n","export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><path clip-rule=\"evenodd\" d=\"m18 29.7c6.4617 0 11.7-5.2383 11.7-11.7s-5.2383-11.7-11.7-11.7-11.7 5.2383-11.7 11.7 5.2383 11.7 11.7 11.7zm0 6.3c9.9411 0 18-8.0589 18-18 0-9.94112-8.0589-18-18-18-9.94112 0-18 8.05888-18 18 0 9.9411 8.05888 18 18 18z\" fill=\"currentColor\" fill-rule=\"evenodd\"/></svg>'\nexport const title = \"interface-incomplete-small\"\nexport const tags = \"nordicon interface small badge process indicator status cancelled unfulfilled incomplete progress\"\n","export default '<svg viewBox=\"0 0 36 36\" xmlns=\"http://www.w3.org/2000/svg\"><path clip-rule=\"evenodd\" d=\"m6.3 18h23.4c0-6.4617-5.2383-11.7-11.7-11.7s-11.7 5.2383-11.7 11.7zm29.7 0c0 9.9411-8.0589 18-18 18-9.94113 0-18-8.0589-18-18 0-9.94113 8.05887-18 18-18 9.9411 0 18 8.05887 18 18z\" fill=\"currentColor\" fill-rule=\"evenodd\"/></svg>'\nexport const title = \"interface-partially-complete-small\"\nexport const tags = \"nordicon interface small badge process indicator status partially fulfilled complete progress\"\n","import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport * as cancelledIcon from \"@nordhealth/icons/lib/assets/interface-cancelled-small.js\"\nimport * as completeIcon from \"@nordhealth/icons/lib/assets/interface-complete-small.js\"\nimport * as incompleteIcon from \"@nordhealth/icons/lib/assets/interface-incomplete-small.js\"\nimport * as partiallyCompleteIcon from \"@nordhealth/icons/lib/assets/interface-partially-complete-small.js\"\nimport Icon from \"../icon/Icon.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Badge.css\"\n\nIcon.registerIcon(cancelledIcon)\nIcon.registerIcon(completeIcon)\nIcon.registerIcon(incompleteIcon)\nIcon.registerIcon(partiallyCompleteIcon)\n\nconst iconMap: Record<Exclude<Badge[\"progress\"], undefined>, string> = {\n cancelled: cancelledIcon.title,\n complete: completeIcon.title,\n incomplete: incompleteIcon.title,\n \"partially-complete\": partiallyCompleteIcon.title,\n}\n\n/*\n Badges are used to inform users of the status of an object\n * or of an action that’s been taken. Commonly used in tabular\n * data to indicate status.\n \n @status ready\n * @category text\n * @slot - The badge content.\n /\n@customElement(\"nord-badge\")\nexport default class Badge extends LitElement {\n static styles = [componentStyle, style]\n\n /\n The type of badge.\n * Determines the background color of the badge.\n /\n @property({ reflect: true }) type?: \"warning\" \| \"success\" \| \"danger\" \| \"highlight\" \| \"info\" \| \"neutral\" \| \"progress\" =\n \"neutral\"\n\n /\n The progress of the badge. Displays a progress\n * indicator next to the label.\n */\n @property() progress?: \"cancelled\" \| \"complete\" \| \"incomplete\" \| \"partially-complete\"\n\n render() {\n const icon = this.progress ? iconMap[this.progress] : \"\"\n\n return html`\n <span class=\"n-badge\">\n <nord-icon name=${icon} size=\"xxs\" ?hidden=${!icon}></nord-icon>\n <slot></slot>\n </span>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-badge\": Badge\n }\n}\n"],"names":["title","Icon","registerIcon","cancelledIcon","completeIcon","incompleteIcon","partiallyCompleteIcon","iconMap","cancelled","cancelledIcon.title","complete","completeIcon.title","incomplete","incompleteIcon.title","partiallyCompleteIcon.title","Badge","LitElement","constructor","this","type","render","icon","progress","html","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"qaACO,MAAMA,EAAQ,wEADN,2jBAEK,+ECDb,MAAMA,EAAQ,uEADN,sIAEK,wFCDb,MAAMA,EAAQ,yEADN,oXAEK,sGCDb,MAAMA,EAAQ,iFADN,6UAEK,q3CCSpBC,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAClBH,EAAKC,aAAaG,GAClBJ,EAAKC,aAAaI,GAElB,MAAMC,EAAiE,CACrEC,UAAWC,EACXC,SAAUC,EACVC,WAAYC,EACZ,qBAAsBC,GAaxB,IAAqBC,EAArB,cAAmCC,EAAnCC,kCAO+BC,KAAIC,KAC/B,SAkBH,CAVCC,SACE,MAAMC,EAAOH,KAAKI,SAAWf,EAAQW,KAAKI,UAAY,GAEtD,OAAOC,CAAI,0CAEWF,2BAA4BA,qCAInD,GAxBMN,EAAAS,OAAS,CAACC,EAAgBC,GAMJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KACVd,EAAAe,UAAA,YAAA,GAMCH,EAAA,CAAXC,KAAoFb,EAAAe,UAAA,gBAAA,GAdlEf,EAAKY,EAAA,CADzBI,EAAc,eACMhB,SAAAA"}

package/lib/{Calendar-a0246aa3.js → Calendar-8b36a7e5.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{_ as e,e as a}from"./query-assigned-elements-e6cbac30.js";import{i as t,s as n,y as o}from"./lit-element-79bc2e0e.js";import{e as s}from"./property-03f59dce.js";import{t as i}from"./state-70f38ceb.js";import{i as r}from"./query-2d22378e.js";import{c as l}from"./repeat-e7acc0bd.js";import{o as d}from"./tinykeys.module-84e6cc41.js";import"./Button.js";import"./VisuallyHidden.js";import c from"./Icon.js";import{E as h}from"./EventController-d99ebeef.js";import{D as u}from"./DirectionController-8b298382.js";import{LocalizeController as p}from"./LocalizeController.js";import{r as v}from"./number-c3ab3e95.js";import{i as m,p as f,a as g,s as y,e as b,b as w,g as x,c as D,d as k,f as z,h as F,j as M,k as S,l as Y}from"./dates-a8de5b83.js";import{o as $}from"./observe-a9c6dfb6.js";import{monthView as j}from"./month-view.js";import{DateSelectEvent as _}from"./DateSelectEvent.js";import{s as C}from"./Component-49a41387.js";var L=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M105 57.4 47.6 2.8a10.566 10.566 0 1 0-14.56 15.316l51.968 49.35a3.486 3.486 0 0 1 0 5.068l-51.968 49.35a10.502 10.502 0 0 0 14.462 15.232l57.638-54.74A17.584 17.584 0 0 0 105 57.4z"/></svg>',title:"arrow-right-small",tags:"nordicon arrow right small caret pointing triangle chevron"});var N=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M99.736 140a10.486 10.486 0 0 1-7.238-2.884L35 82.6a17.598 17.598 0 0 1-.14-24.976l57.638-54.74a10.502 10.502 0 1 1 14.462 15.232l-51.968 49.35a3.486 3.486 0 0 0 0 5.068l51.968 49.35A10.5 10.5 0 0 1 99.736 140z"/></svg>',title:"arrow-left-small",tags:"nordicon arrow left small caret pointing triangle chevron"});var T=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M70 110.236a17.332 17.332 0 0 1-12.306-5.096L2.884 47.502A10.502 10.502 0 1 1 18.116 33.04l49.35 51.968a3.486 3.486 0 0 0 5.068 0l49.35-51.968a10.502 10.502 0 1 1 15.232 14.462L82.6 105a17.766 17.766 0 0 1-12.6 5.236z"/></svg>',title:"arrow-down-small",tags:"nordicon arrow down small caret pointing triangle chevron"});const O=e=>e.preventDefault();class I{constructor(e,a){this.hadFirstUpdate=!1,this.initialTouchX=0,this.initialTouchY=0,this.handleTouchStart=e=>{const[{pageX:a,pageY:t}]=e.changedTouches;this.initialTouchX=a,this.initialTouchY=t},this.handleTouchEnd=e=>{const[{pageX:a,pageY:t}]=e.changedTouches,{matchesGesture:n,onSwipeEnd:o}=this.options,s=a-this.initialTouchX,i=t-this.initialTouchY,r={initialX:this.initialTouchX,initialY:this.initialTouchY,pageX:a,pageY:t,distX:s,distY:i};n(r)&&(e.preventDefault(),o(r))},e.addController(this),this.events=new h(e),this.options={target:()=>e,...a}}hostUpdated(){if(!this.hadFirstUpdate){this.hadFirstUpdate=!0;const e=this.options.target();this.events.listen(e,"touchstart",this.handleTouchStart),this.events.listen(e,"touchmove",O),this.events.listen(e,"touchend",this.handleTouchEnd)}}hostDisconnected(){this.hadFirstUpdate=!1}}const X=({distX:e,distY:a})=>Math.abs(e)>=70&&Math.abs(a)<=70,A=({distX:e,distY:a})=>Math.abs(a)>=70&&Math.abs(e)<=70&&a>0,E=t`:host{--_n-calendar-box-shadow:var(--n-calendar-box-shadow, var(--n-box-shadow-popout));--_n-calendar-border-radius:var(--n-calendar-border-radius, var(--n-border-radius-s));--_n-calendar-padding:var(--n-space-m) var(--n-space-m) calc(var(--n-space-m) * 1.25);--_n-calendar-inline-size:max-content;font-feature-settings:var(--n-font-features-reduced)}.n-calendar{-webkit-user-select:none;user-select:none;background:var(--n-color-surface);box-shadow:var(--_n-calendar-box-shadow);border-radius:var(--_n-calendar-border-radius);inline-size:var(--_n-calendar-inline-size);min-inline-size:min-content;padding:var(--_n-calendar-padding)}:host([expand]){--_n-calendar-inline-size:100%}.n-calendar-table{border-collapse:collapse;border-spacing:0;color:var(--n-color-text);font-size:var(--n-font-size-m);font-weight:var(--n-font-weight);line-height:var(--n-date-picker-line-height);text-align:center;inline-size:100%}.n-calendar-table-header{font-size:var(--n-font-size-s);font-weight:var(--n-font-weight-active);letter-spacing:1px;line-height:var(--n-date-picker-line-height);padding-block-end:8px;text-decoration:none;text-transform:uppercase}.n-calendar-cell{text-align:center;padding:1px}.n-calendar-day{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:0 0;border:0;border-radius:var(--n-border-radius-s);color:var(--n-color-text);cursor:pointer;display:inline-block;font-family:var(--n-font-family);font-size:var(--n-font-size-m);font-variant-numeric:tabular-nums;font-weight:var(--n-font-weight);block-size:36px;padding:0 0 1px;position:relative;text-align:center;vertical-align:middle;inline-size:36px}.n-calendar-day[aria-current=date]{box-shadow:0 0 0 1px var(--n-color-accent);color:var(--n-color-text-link);position:relative}.n-calendar-day:hover{background:var(--n-color-active)}.n-calendar-day:focus,.n-calendar-day[aria-pressed=true]{background:var(--n-color-accent);box-shadow:none;color:var(--n-color-text-on-accent);outline:0}.n-calendar-day:active{background:var(--n-color-accent);box-shadow:none!important;color:var(--n-color-text-on-accent)}.n-calendar-day:focus{box-shadow:0 0 5px var(--n-color-accent)}.n-calendar-day:not(.is-month){box-shadow:none}.n-calendar-day:not(.is-month),.n-calendar-day[aria-disabled=true]{background:0 0;color:var(--n-color-text-weakest);cursor:default}.n-calendar-day[aria-disabled=true]{color:var(--n-color-text-weaker);text-decoration:line-through}.n-calendar-day:not(.is-month)[aria-disabled=true]{color:var(--n-color-text-weakest);text-decoration:none}.n-calendar-day[aria-disabled=true][aria-current=date]{box-shadow:0 0 0 1px var(--n-color-accent);color:var(--n-color-text-link)}.n-calendar-day[aria-disabled=true][aria-current=date]:focus{box-shadow:0 0 5px var(--n-color-accent);background:var(--n-color-accent);color:var(--n-color-text-on-accent)}.n-calendar-day[aria-disabled=true]:not([aria-current=date])::before{display:none}.n-calendar-day.is-outside{background:0 0;box-shadow:none;color:var(--n-color-text-weakest);cursor:default;pointer-events:none}.n-calendar-day.is-outside::before{display:none}.n-calendar-header{align-items:start;display:flex;justify-content:space-between;margin-block-end:16px;inline-size:100%}.n-calendar-nav{white-space:nowrap}.n-calendar-nav nord-button{--_n-button-padding-inline:11px;margin-inline-start:calc(var(--n-space-s)/ 2)}.n-calendar-select{display:inline-flex;margin-block-start:4px;position:relative;line-height:var(--n-line-height)}.n-calendar-select span{margin-inline-end:var(--n-space-s)}.n-calendar-select select{cursor:pointer;font-size:var(--n-font-size-l);block-size:100%;inset-inline-start:0;opacity:0;position:absolute;inset-block-start:0;inline-size:100%}.n-calendar-select select:focus+.n-calendar-select-label{box-shadow:0 0 0 2px var(--n-color-accent)}.n-calendar-select-label{align-items:center;border-radius:var(--n-border-radius-s);color:var(--n-color-text);display:flex;font-size:var(--n-font-size-xl);font-weight:var(--n-font-weight-active);line-height:var(--n-date-picker-line-height);padding:0 4px 0 8px;pointer-events:none;position:relative;inline-size:100%;text-transform:capitalize}`;c.registerIcon(L),c.registerIcon(N),c.registerIcon(T);const W=e=>a=>{a.preventDefault(),e(a)},U=()=>!1;let B=class extends n{constructor(){super(...arguments),this.dialogLabelId="dialog-header",this.direction=new u(this),this.swipe=new I(this,{matchesGesture:X,onSwipeEnd:({distX:e})=>this.addMonths(e<0?1:-1)}),this.shortcuts=d({ArrowRight:W((()=>this.addDays(this.direction.isLTR?1:-1))),ArrowLeft:W((()=>this.addDays(this.direction.isLTR?-1:1))),ArrowDown:W((()=>this.addDays(7))),ArrowUp:W((()=>this.addDays(-7))),Home:W((()=>this.startOfWeek())),End:W((()=>this.endOfWeek())),PageUp:W((()=>this.addMonths(-1))),PageDown:W((()=>this.addMonths(1))),"Shift+PageUp":W((()=>this.addYears(-1))),"Shift+PageDown":W((()=>this.addYears(1)))}),this.localize=new p(this,{onLangChange:()=>this.handleLangChange()}),this.value="",this.firstDayOfWeek=1,this.min="",this.max="",this.expand=!1,this.isDateDisabled=U,this.activeFocus=!1,this.focusedDay=new Date,this.handleDaySelect=e=>{const a=m(e,f(this.min),f(this.max)),t=!this.isDateDisabled(e);a&&t&&(this.value=g(e),this.dispatchEvent(new _("change",e)))},this.handleMonthSelect=e=>{this.setMonth(parseInt(e.target.value,10))},this.handleYearSelect=e=>{this.setYear(parseInt(e.target.value,10))},this.handleNextMonthClick=e=>{e.preventDefault(),this.addMonths(1)},this.handlePreviousMonthClick=e=>{e.preventDefault(),this.addMonths(-1)},this.enableActiveFocus=()=>{this.activeFocus=!0},this.disableActiveFocus=()=>{this.activeFocus=!1}}focus(e){var a;const t=null!==(a=null==e?void 0:e.target)&&void 0!==a?a:"day";"day"===t?this.focusedDayNode.focus():"month"===t&&this.monthSelectNode.focus()}render(){const e=f(this.value),a=this.focusedDay.getMonth(),t=this.focusedDay.getFullYear(),n=f(this.min),s=f(this.max),i=n?y(n):void 0,r=s?b(s):void 0,d=(e||this.focusedDay).getFullYear(),c=n?n.getFullYear():d-10,h=s?s.getFullYear():d+10;return o`<div class="n-calendar"><div class="n-calendar-header"><div><nord-visually-hidden><h2 id="${this.dialogLabelId}" aria-live="polite" aria-atomic="true">${this.monthNames[a]}, ${this.focusedDay.getFullYear()}</h2></nord-visually-hidden><div class="n-calendar-select"><select aria-label="${this.localize.term("monthSelectLabel")}" class="n-calendar-select-month" @input="${this.handleMonthSelect}">${this.monthNames.map(((e,n)=>o`<option value="${n}" ?selected="${n===a}" ?disabled="${!m(new Date(t,n,1),i,r)}">${e}</option>`))}</select><div class="n-calendar-select-label" aria-hidden="true"><span>${this.monthNamesShort[a]}</span><nord-icon color="var(--n-color-icon)" name="arrow-down-small" size="xs"></nord-icon></div></div><div class="n-calendar-select"><select aria-label="${this.localize.term("yearSelectLabel")}" class="n-calendar-select-year" @input="${this.handleYearSelect}">${l(v(c,h),(e=>e),(e=>o`<option ?selected="${e===t}">${e}</option>`))}</select><div class="n-calendar-select-label" aria-hidden="true"><span>${this.focusedDay.getFullYear()}</span><nord-icon color="var(--n-color-icon)" name="arrow-down-small" size="xs"></nord-icon></div></div></div><div class="n-calendar-nav"><nord-button class="n-calendar-prev" @click="${this.handlePreviousMonthClick}" ?disabled="${w(n,this.focusedDay)}" type="button"><nord-visually-hidden>${this.localize.term("prevMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-left-small":"arrow-right-small"}" size="s"></nord-icon></nord-button><nord-button class="n-calendar-next" @click="${this.handleNextMonthClick}" ?disabled="${w(s,this.focusedDay)}" type="button"><nord-visually-hidden>${this.localize.term("nextMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-right-small":"arrow-left-small"}" size="s"></nord-icon></nord-button></div></div>${j({onFocusOut:this.disableActiveFocus,onFocusIn:this.enableActiveFocus,dateFormatter:this.dateFormatShort,selectedDate:e,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.shortcuts,labelledById:this.dialogLabelId,dayNames:this.dayNames,dayNamesShort:this.dayNamesShort,firstDayOfWeek:this.firstDayOfWeek,min:n,max:s,isDateDisabled:this.isDateDisabled})}</div>`}handleValueChange(){this.setFocusedDay(f(this.value)||new Date)}handleFocusedDayChange(){this.activeFocus&&this.focusedDayNode.focus()}handleLangChange(){const e=this.localize.resolvedLang;this.dateFormatShort=new Intl.DateTimeFormat(e,{day:"numeric",month:"long"}),this.monthNames=x(e,"long"),this.monthNamesShort=x(e,"short"),this.dayNames=D(e,"long"),this.dayNamesShort=D(e,"narrow")}addDays(e){this.setFocusedDay(k(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(z(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(F(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const a=M(y(this.focusedDay),e),t=b(a),n=M(this.focusedDay,e);this.setFocusedDay(S(n,a,t))}setYear(e){const a=Y(y(this.focusedDay),e),t=b(a),n=Y(this.focusedDay,e);this.setFocusedDay(S(n,a,t))}setFocusedDay(e){this.focusedDay=S(e,f(this.min),f(this.max)),this.dispatchEvent(new _("nord-focus-date",this.focusedDay))}};B.styles=[C,E],e([r(".n-calendar-select-month",!0)],B.prototype,"monthSelectNode",void 0),e([r('button[tabindex="0"]')],B.prototype,"focusedDayNode",void 0),e([s()],B.prototype,"value",void 0),e([s({type:Number})],B.prototype,"firstDayOfWeek",void 0),e([s()],B.prototype,"min",void 0),e([s()],B.prototype,"max",void 0),e([s({reflect:!0,type:Boolean})],B.prototype,"expand",void 0),e([s({attribute:!1})],B.prototype,"isDateDisabled",void 0),e([i()],B.prototype,"activeFocus",void 0),e([i()],B.prototype,"focusedDay",void 0),e([$("value")],B.prototype,"handleValueChange",null),e([$("focusedDay","updated")],B.prototype,"handleFocusedDayChange",null),B=e([a("nord-calendar")],B);var P=B;export{P as C,I as S,A as i};
-//# sourceMappingURL=Calendar-a0246aa3.js.map
+import{_ as e,e as a}from"./query-assigned-elements-e6cbac30.js";import{i as t,s as n,y as o}from"./lit-element-79bc2e0e.js";import{e as s}from"./property-03f59dce.js";import{t as i}from"./state-70f38ceb.js";import{i as r}from"./query-2d22378e.js";import{c as l}from"./repeat-e7acc0bd.js";import{o as d}from"./tinykeys.module-84e6cc41.js";import"./Button.js";import"./VisuallyHidden.js";import c from"./Icon.js";import{E as h}from"./EventController-d99ebeef.js";import{D as u}from"./DirectionController-8b298382.js";import{LocalizeController as p}from"./LocalizeController.js";import{r as v}from"./number-c3ab3e95.js";import{i as m,p as f,a as g,s as y,e as b,b as w,g as x,c as D,d as k,f as z,h as F,j as M,k as S,l as Y}from"./dates-a8de5b83.js";import{o as $}from"./observe-a9c6dfb6.js";import{monthView as j}from"./month-view.js";import{DateSelectEvent as _}from"./DateSelectEvent.js";import{s as C}from"./Component-49a41387.js";var L=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M105 57.4 47.6 2.8a10.566 10.566 0 1 0-14.56 15.316l51.968 49.35a3.486 3.486 0 0 1 0 5.068l-51.968 49.35a10.502 10.502 0 0 0 14.462 15.232l57.638-54.74A17.584 17.584 0 0 0 105 57.4z"/></svg>',title:"arrow-right-small",tags:"nordicon arrow right small caret pointing triangle chevron"});var N=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M99.736 140a10.486 10.486 0 0 1-7.238-2.884L35 82.6a17.598 17.598 0 0 1-.14-24.976l57.638-54.74a10.502 10.502 0 1 1 14.462 15.232l-51.968 49.35a3.486 3.486 0 0 0 0 5.068l51.968 49.35A10.5 10.5 0 0 1 99.736 140z"/></svg>',title:"arrow-left-small",tags:"nordicon arrow left small caret pointing triangle chevron"});var T=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M70 110.236a17.332 17.332 0 0 1-12.306-5.096L2.884 47.502A10.502 10.502 0 1 1 18.116 33.04l49.35 51.968a3.486 3.486 0 0 0 5.068 0l49.35-51.968a10.502 10.502 0 1 1 15.232 14.462L82.6 105a17.766 17.766 0 0 1-12.6 5.236z"/></svg>',title:"arrow-down-small",tags:"nordicon arrow down small caret pointing triangle chevron"});const O=e=>e.preventDefault();class I{constructor(e,a){this.hadFirstUpdate=!1,this.initialTouchX=0,this.initialTouchY=0,this.handleTouchStart=e=>{const[{pageX:a,pageY:t}]=e.changedTouches;this.initialTouchX=a,this.initialTouchY=t},this.handleTouchEnd=e=>{const[{pageX:a,pageY:t}]=e.changedTouches,{matchesGesture:n,onSwipeEnd:o}=this.options,s=a-this.initialTouchX,i=t-this.initialTouchY,r={initialX:this.initialTouchX,initialY:this.initialTouchY,pageX:a,pageY:t,distX:s,distY:i};n(r)&&(e.preventDefault(),o(r))},e.addController(this),this.events=new h(e),this.options={target:()=>e,...a}}hostUpdated(){if(!this.hadFirstUpdate){this.hadFirstUpdate=!0;const e=this.options.target();this.events.listen(e,"touchstart",this.handleTouchStart),this.events.listen(e,"touchmove",O),this.events.listen(e,"touchend",this.handleTouchEnd)}}hostDisconnected(){this.hadFirstUpdate=!1}}const X=({distX:e,distY:a})=>Math.abs(e)>=70&&Math.abs(a)<=70,A=({distX:e,distY:a})=>Math.abs(a)>=70&&Math.abs(e)<=70&&a>0,E=t`:host{--_n-calendar-box-shadow:var(--n-calendar-box-shadow, var(--n-box-shadow-popout));--_n-calendar-border-radius:var(--n-calendar-border-radius, var(--n-border-radius-s));--_n-calendar-padding:var(--n-space-m) var(--n-space-m) calc(var(--n-space-m) * 1.25);--_n-calendar-inline-size:max-content;font-feature-settings:var(--n-font-features-reduced)}.n-calendar{-webkit-user-select:none;user-select:none;background:var(--n-color-surface);box-shadow:var(--_n-calendar-box-shadow);border-radius:var(--_n-calendar-border-radius);inline-size:var(--_n-calendar-inline-size);min-inline-size:min-content;padding:var(--_n-calendar-padding)}:host([expand]){--_n-calendar-inline-size:100%}.n-calendar-table{border-collapse:collapse;border-spacing:0;color:var(--n-color-text);font-size:var(--n-font-size-m);font-weight:var(--n-font-weight);line-height:var(--n-date-picker-line-height);text-align:center;inline-size:100%}.n-calendar-table-header{font-size:var(--n-font-size-s);font-weight:var(--n-font-weight-active);letter-spacing:1px;line-height:var(--n-date-picker-line-height);padding-block-end:8px;text-decoration:none;text-transform:uppercase}.n-calendar-cell{text-align:center;padding:1px}.n-calendar-day{-moz-appearance:none;-webkit-appearance:none;appearance:none;background:0 0;border:0;border-radius:var(--n-border-radius-s);color:var(--n-color-text);cursor:pointer;display:inline-block;font-family:var(--n-font-family);font-size:var(--n-font-size-m);font-variant-numeric:tabular-nums;font-weight:var(--n-font-weight);block-size:36px;padding:0 0 1px;position:relative;text-align:center;vertical-align:middle;inline-size:36px}.n-calendar-day[aria-current=date]{box-shadow:0 0 0 1px var(--n-color-accent);color:var(--n-color-text-link);position:relative}.n-calendar-day:hover{background:var(--n-color-active)}.n-calendar-day:focus,.n-calendar-day[aria-pressed=true]{background:var(--n-color-accent);box-shadow:none;color:var(--n-color-text-on-accent);outline:0}.n-calendar-day:active{background:var(--n-color-accent);box-shadow:none!important;color:var(--n-color-text-on-accent)}.n-calendar-day:focus{box-shadow:0 0 5px var(--n-color-accent)}.n-calendar-day:not(.is-month){box-shadow:none}.n-calendar-day:not(.is-month),.n-calendar-day[aria-disabled=true]{background:0 0;color:var(--n-color-text-weakest);cursor:default}.n-calendar-day[aria-disabled=true]{color:var(--n-color-text-weaker);text-decoration:line-through}.n-calendar-day:not(.is-month)[aria-disabled=true]{color:var(--n-color-text-weakest);text-decoration:none}.n-calendar-day[aria-disabled=true][aria-current=date]{box-shadow:0 0 0 1px var(--n-color-accent);color:var(--n-color-text-link)}.n-calendar-day[aria-disabled=true][aria-current=date]:focus{box-shadow:0 0 5px var(--n-color-accent);background:var(--n-color-accent);color:var(--n-color-text-on-accent)}.n-calendar-day[aria-disabled=true]:not([aria-current=date])::before{display:none}.n-calendar-day.is-outside{background:0 0;box-shadow:none;color:var(--n-color-text-weakest);cursor:default;pointer-events:none}.n-calendar-day.is-outside::before{display:none}.n-calendar-header{align-items:start;display:flex;justify-content:space-between;margin-block-end:16px;inline-size:100%}.n-calendar-nav{white-space:nowrap}.n-calendar-nav nord-button{--_n-button-padding-inline:11px;margin-inline-start:calc(var(--n-space-s)/ 2)}.n-calendar-select{display:inline-flex;margin-block-start:4px;position:relative;line-height:var(--n-line-height)}.n-calendar-select span{margin-inline-end:var(--n-space-s)}.n-calendar-select select{cursor:pointer;font-size:var(--n-font-size-l);block-size:100%;inset-inline-start:0;opacity:0;position:absolute;inset-block-start:0;inline-size:100%}.n-calendar-select select:focus+.n-calendar-select-label{box-shadow:0 0 0 2px var(--n-color-accent)}.n-calendar-select-label{align-items:center;border-radius:var(--n-border-radius-s);color:var(--n-color-text);display:flex;font-size:var(--n-font-size-xl);font-weight:var(--n-font-weight-active);line-height:var(--n-date-picker-line-height);padding:0 4px 0 8px;pointer-events:none;position:relative;inline-size:100%;text-transform:capitalize}`;c.registerIcon(L),c.registerIcon(N),c.registerIcon(T);const W=e=>a=>{a.preventDefault(),e(a)},U=()=>!1;let B=class extends n{constructor(){super(...arguments),this.dialogLabelId="dialog-header",this.direction=new u(this),this.swipe=new I(this,{matchesGesture:X,onSwipeEnd:({distX:e})=>this.addMonths(e<0?1:-1)}),this.shortcuts=d({ArrowRight:W((()=>this.addDays(this.direction.isLTR?1:-1))),ArrowLeft:W((()=>this.addDays(this.direction.isLTR?-1:1))),ArrowDown:W((()=>this.addDays(7))),ArrowUp:W((()=>this.addDays(-7))),Home:W((()=>this.startOfWeek())),End:W((()=>this.endOfWeek())),PageUp:W((()=>this.addMonths(-1))),PageDown:W((()=>this.addMonths(1))),"Shift+PageUp":W((()=>this.addYears(-1))),"Shift+PageDown":W((()=>this.addYears(1)))}),this.localize=new p(this,{onLangChange:()=>this.handleLangChange()}),this.value="",this.firstDayOfWeek=1,this.min="",this.max="",this.expand=!1,this.isDateDisabled=U,this.activeFocus=!1,this.focusedDay=new Date,this.handleDaySelect=e=>{const a=m(e,f(this.min),f(this.max)),t=!this.isDateDisabled(e);a&&t&&(this.value=g(e),this.dispatchEvent(new _("change",e)))},this.handleMonthSelect=e=>{this.setMonth(parseInt(e.target.value,10))},this.handleYearSelect=e=>{this.setYear(parseInt(e.target.value,10))},this.handleNextMonthClick=e=>{e.preventDefault(),this.addMonths(1)},this.handlePreviousMonthClick=e=>{e.preventDefault(),this.addMonths(-1)},this.enableActiveFocus=()=>{this.activeFocus=!0},this.disableActiveFocus=()=>{this.activeFocus=!1}}focus(e){var a;const t=null!==(a=null==e?void 0:e.target)&&void 0!==a?a:"day";"day"===t?this.focusedDayNode.focus():"month"===t&&this.monthSelectNode.focus()}render(){const e=f(this.value),a=this.focusedDay.getMonth(),t=this.focusedDay.getFullYear(),n=f(this.min),s=f(this.max),i=n?y(n):void 0,r=s?b(s):void 0,d=(e||this.focusedDay).getFullYear(),c=n?n.getFullYear():d-10,h=s?s.getFullYear():d+10;return o`<div class="n-calendar"><div class="n-calendar-header"><div><nord-visually-hidden><h2 id="${this.dialogLabelId}" aria-live="polite" aria-atomic="true">${this.monthNames[a]}, ${this.focusedDay.getFullYear()}</h2></nord-visually-hidden><div class="n-calendar-select"><select aria-label="${this.localize.term("monthSelectLabel")}" class="n-calendar-select-month" @input="${this.handleMonthSelect}">${this.monthNames.map(((e,n)=>o`<option value="${n}" ?selected="${n===a}" ?disabled="${!m(new Date(t,n,1),i,r)}">${e}</option>`))}</select><div class="n-calendar-select-label" aria-hidden="true"><span>${this.monthNamesShort[a]}</span><nord-icon color="var(--n-color-icon)" name="arrow-down-small" size="xxs"></nord-icon></div></div><div class="n-calendar-select"><select aria-label="${this.localize.term("yearSelectLabel")}" class="n-calendar-select-year" @input="${this.handleYearSelect}">${l(v(c,h),(e=>e),(e=>o`<option ?selected="${e===t}">${e}</option>`))}</select><div class="n-calendar-select-label" aria-hidden="true"><span>${this.focusedDay.getFullYear()}</span><nord-icon color="var(--n-color-icon)" name="arrow-down-small" size="xxs"></nord-icon></div></div></div><div class="n-calendar-nav"><nord-button class="n-calendar-prev" @click="${this.handlePreviousMonthClick}" ?disabled="${w(n,this.focusedDay)}" type="button"><nord-visually-hidden>${this.localize.term("prevMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-left-small":"arrow-right-small"}" size="s"></nord-icon></nord-button><nord-button class="n-calendar-next" @click="${this.handleNextMonthClick}" ?disabled="${w(s,this.focusedDay)}" type="button"><nord-visually-hidden>${this.localize.term("nextMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-right-small":"arrow-left-small"}" size="s"></nord-icon></nord-button></div></div>${j({onFocusOut:this.disableActiveFocus,onFocusIn:this.enableActiveFocus,dateFormatter:this.dateFormatShort,selectedDate:e,focusedDate:this.focusedDay,onDateSelect:this.handleDaySelect,onKeyboardNavigation:this.shortcuts,labelledById:this.dialogLabelId,dayNames:this.dayNames,dayNamesShort:this.dayNamesShort,firstDayOfWeek:this.firstDayOfWeek,min:n,max:s,isDateDisabled:this.isDateDisabled})}</div>`}handleValueChange(){this.setFocusedDay(f(this.value)||new Date)}handleFocusedDayChange(){this.activeFocus&&this.focusedDayNode.focus()}handleLangChange(){const e=this.localize.resolvedLang;this.dateFormatShort=new Intl.DateTimeFormat(e,{day:"numeric",month:"long"}),this.monthNames=x(e,"long"),this.monthNamesShort=x(e,"short"),this.dayNames=D(e,"long"),this.dayNamesShort=D(e,"narrow")}addDays(e){this.setFocusedDay(k(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(z(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(F(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const a=M(y(this.focusedDay),e),t=b(a),n=M(this.focusedDay,e);this.setFocusedDay(S(n,a,t))}setYear(e){const a=Y(y(this.focusedDay),e),t=b(a),n=Y(this.focusedDay,e);this.setFocusedDay(S(n,a,t))}setFocusedDay(e){this.focusedDay=S(e,f(this.min),f(this.max)),this.dispatchEvent(new _("nord-focus-date",this.focusedDay))}};B.styles=[C,E],e([r(".n-calendar-select-month",!0)],B.prototype,"monthSelectNode",void 0),e([r('button[tabindex="0"]')],B.prototype,"focusedDayNode",void 0),e([s()],B.prototype,"value",void 0),e([s({type:Number})],B.prototype,"firstDayOfWeek",void 0),e([s()],B.prototype,"min",void 0),e([s()],B.prototype,"max",void 0),e([s({reflect:!0,type:Boolean})],B.prototype,"expand",void 0),e([s({attribute:!1})],B.prototype,"isDateDisabled",void 0),e([i()],B.prototype,"activeFocus",void 0),e([i()],B.prototype,"focusedDay",void 0),e([$("value")],B.prototype,"handleValueChange",null),e([$("focusedDay","updated")],B.prototype,"handleFocusedDayChange",null),B=e([a("nord-calendar")],B);var P=B;export{P as C,I as S,A as i};
+//# sourceMappingURL=Calendar-8b36a7e5.js.map

package/lib/Calendar-8b36a7e5.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Calendar-8b36a7e5.js","sources":["../../icons/lib/assets/arrow-right-small.js","../../icons/lib/assets/arrow-left-small.js","../../icons/lib/assets/arrow-down-small.js","../src/common/controllers/SwipeController.ts","../src/calendar/Calendar.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M105 57.4 47.6 2.8a10.566 10.566 0 1 0-14.56 15.316l51.968 49.35a3.486 3.486 0 0 1 0 5.068l-51.968 49.35a10.502 10.502 0 0 0 14.462 15.232l57.638-54.74A17.584 17.584 0 0 0 105 57.4z\"/></svg>'\nexport const title = \"arrow-right-small\"\nexport const tags = \"nordicon arrow right small caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M99.736 140a10.486 10.486 0 0 1-7.238-2.884L35 82.6a17.598 17.598 0 0 1-.14-24.976l57.638-54.74a10.502 10.502 0 1 1 14.462 15.232l-51.968 49.35a3.486 3.486 0 0 0 0 5.068l51.968 49.35A10.5 10.5 0 0 1 99.736 140z\"/></svg>'\nexport const title = \"arrow-left-small\"\nexport const tags = \"nordicon arrow left small caret pointing triangle chevron\"\n","export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M70 110.236a17.332 17.332 0 0 1-12.306-5.096L2.884 47.502A10.502 10.502 0 1 1 18.116 33.04l49.35 51.968a3.486 3.486 0 0 0 5.068 0l49.35-51.968a10.502 10.502 0 1 1 15.232 14.462L82.6 105a17.766 17.766 0 0 1-12.6 5.236z\"/></svg>'\nexport const title = \"arrow-down-small\"\nexport const tags = \"nordicon arrow down small caret pointing triangle chevron\"\n","import { ReactiveController, ReactiveElement } from \"lit\"\nimport { EventController } from \"./EventController.js\"\n\nexport type SwipeDetails = {\n initialX: number\n initialY: number\n pageX: number\n pageY: number\n distX: number\n distY: number\n}\n\nconst preventDefault = (e: Event) => e.preventDefault()\n\ntype SetRequired<T, K extends keyof T> = T & { [Property in K]-?: T[K] }\ntype SwipeControllerOptions = {\n target?: () => HTMLElement\n matchesGesture: (details: SwipeDetails) => boolean\n onSwipeEnd: (details: SwipeDetails) => void\n}\n\nexport class SwipeController implements ReactiveController {\n private events: EventController\n private hadFirstUpdate = false\n\n private initialTouchX: number = 0\n private initialTouchY: number = 0\n private options: SetRequired<SwipeControllerOptions, \"target\">\n\n constructor(host: ReactiveElement, options: SwipeControllerOptions) {\n host.addController(this)\n this.events = new EventController(host)\n\n this.options = {\n target: () => host,\n ...options,\n }\n }\n\n hostUpdated() {\n if (!this.hadFirstUpdate) {\n this.hadFirstUpdate = true\n\n const target = this.options.target()\n this.events.listen(target, \"touchstart\", this.handleTouchStart)\n this.events.listen(target, \"touchmove\", preventDefault)\n this.events.listen(target, \"touchend\", this.handleTouchEnd)\n }\n }\n\n hostDisconnected() {\n this.hadFirstUpdate = false\n }\n\n private handleTouchStart = (event: TouchEvent) => {\n const [{ pageX, pageY }] = event.changedTouches\n this.initialTouchX = pageX\n this.initialTouchY = pageY\n }\n\n private handleTouchEnd = (event: TouchEvent) => {\n const [{ pageX, pageY }] = event.changedTouches\n const { matchesGesture, onSwipeEnd } = this.options\n\n const distX = pageX - this.initialTouchX\n const distY = pageY - this.initialTouchY\n const details = { initialX: this.initialTouchX, initialY: this.initialTouchY, pageX, pageY, distX, distY }\n\n if (matchesGesture(details)) {\n event.preventDefault()\n onSwipeEnd(details)\n }\n }\n}\n\nconst THRESHOLD = 70\n\nexport const isHorizontalSwipe = ({ distX, distY }: SwipeDetails) =>\n Math.abs(distX) >= THRESHOLD && Math.abs(distY) <= THRESHOLD\n\nexport const isDownwardsSwipe = ({ distX, distY }: SwipeDetails) =>\n Math.abs(distY) >= THRESHOLD && Math.abs(distX) <= THRESHOLD && distY > 0\n","import { html, LitElement } from \"lit\"\nimport { customElement, property, query, state } from \"lit/decorators.js\"\nimport { repeat } from \"lit/directives/repeat.js\"\nimport { createKeybindingsHandler } from \"tinykeys\"\nimport * as arrowRightIcon from \"@nordhealth/icons/lib/assets/arrow-right-small.js\"\nimport * as arrowLeftIcon from \"@nordhealth/icons/lib/assets/arrow-left-small.js\"\nimport * as arrowDownIcon from \"@nordhealth/icons/lib/assets/arrow-down-small.js\"\n\nimport \"../button/Button.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\nimport Icon from \"../icon/Icon.js\"\n\nimport { isHorizontalSwipe, SwipeController } from \"../common/controllers/SwipeController.js\"\nimport { DirectionController } from \"../common/controllers/DirectionController.js\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\n\nimport { range } from \"../common/number.js\"\nimport {\n addDays,\n clamp,\n DaysOfWeek,\n endOfMonth,\n endOfWeek,\n getDayNames,\n getMonthNames,\n inRange,\n isEqualMonth,\n parseISODate,\n printISODate,\n setMonth,\n setYear,\n startOfMonth,\n startOfWeek,\n} from \"../common/dates.js\"\nimport { observe } from \"../common/decorators/observe.js\"\n\nimport { monthView } from \"./month-view.js\"\nimport { DateSelectEvent } from \"./DateSelectEvent.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Calendar.css\"\n\nexport type DateDisabledPredicate = (date: Date) => boolean\n\nIcon.registerIcon(arrowRightIcon)\nIcon.registerIcon(arrowLeftIcon)\nIcon.registerIcon(arrowDownIcon)\n\nconst preventDefault = (fn: EventListener) => (e: Event) => {\n e.preventDefault()\n fn(e)\n}\n\nconst isDateDisabled: DateDisabledPredicate = () => false\n\n/**\n * Calendar allows user to pick a date. It comes with built-in\n * functionality that allows you to set a minimum and a maximum allowed date.\n * Please note that the date must be passed in ISO-8601 format.\n *\n * @status ready\n * @category list\n * @fires {DateSelectEvent} change - Dispatched when a date is selected and the value changes.\n * @fires {DateSelectEvent} nord-focus-date - Dispatched when the calendar's focused date changes.\n *\n * @cssprop [--n-calendar-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-calendar-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n */\n@customElement(\"nord-calendar\")\nexport default class Calendar extends LitElement {\n static styles = [componentStyle, style]\n\n private dialogLabelId = \"dialog-header\"\n\n @query(\".n-calendar-select-month\", true) private monthSelectNode!: HTMLElement\n @query(`button[tabindex=\"0\"]`) private focusedDayNode!: HTMLButtonElement\n\n private direction = new DirectionController(this)\n private swipe = new SwipeController(this, {\n matchesGesture: isHorizontalSwipe,\n onSwipeEnd: ({ distX }) => this.addMonths(distX < 0 ? 1 : -1),\n })\n\n private shortcuts = createKeybindingsHandler({\n ArrowRight: preventDefault(() => this.addDays(this.direction.isLTR ? 1 : -1)),\n ArrowLeft: preventDefault(() => this.addDays(this.direction.isLTR ? -1 : 1)),\n ArrowDown: preventDefault(() => this.addDays(7)),\n ArrowUp: preventDefault(() => this.addDays(-7)),\n Home: preventDefault(() => this.startOfWeek()),\n End: preventDefault(() => this.endOfWeek()),\n PageUp: preventDefault(() => this.addMonths(-1)),\n PageDown: preventDefault(() => this.addMonths(1)),\n \"Shift+PageUp\": preventDefault(() => this.addYears(-1)),\n \"Shift+PageDown\": preventDefault(() => this.addYears(1)),\n })\n\n private localize = new LocalizeController<\"nord-calendar\">(this, {\n onLangChange: () => this.handleLangChange(),\n })\n\n /**\n * Whilst dateAdapter is used for handling the formatting/parsing dates in the input,\n * these are used to format dates exclusively for the benefit of screen readers.\n *\n * We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n * better performance when formatting large number of dates. See:\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n */\n private dateFormatShort!: Intl.DateTimeFormat\n private monthNames!: string[]\n private monthNamesShort!: string[]\n private dayNames!: string[]\n private dayNamesShort!: string[]\n\n /**\n * The selected date on the calendar. Must be in IS0-8601 format: YYYY-MM-DD.\n */\n @property() value: string = \"\"\n\n /**\n * Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday.\n */\n @property({ type: Number }) firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n\n /**\n * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n */\n @property() min: string = \"\"\n\n /**\n * Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n */\n @property() max: string = \"\"\n\n /**\n * Controls whether the calendar expands to fill the width of its container.\n */\n @property({ reflect: true, type: Boolean }) expand = false\n\n /**\n * Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n */\n @property({ attribute: false }) isDateDisabled: DateDisabledPredicate = isDateDisabled\n\n @state() private activeFocus = false\n @state() private focusedDay = new Date()\n\n /**\n * Programmatically move focus to the calendar.\n * @param options An object which controls aspects of the focusing process.\n */\n focus(options?: FocusOptions & { target: \"day\" | \"month\" }) {\n const target = options?.target ?? \"day\"\n\n if (target === \"day\") {\n this.focusedDayNode.focus()\n } else if (target === \"month\") {\n this.monthSelectNode.focus()\n }\n }\n\n render() {\n const valueAsDate = parseISODate(this.value)\n const focusedMonth = this.focusedDay.getMonth()\n const focusedYear = this.focusedDay.getFullYear()\n\n const minDate = parseISODate(this.min)\n const maxDate = parseISODate(this.max)\n const minDateStartOfMonth = minDate ? startOfMonth(minDate) : undefined\n const maxDateEndOfMonth = maxDate ? endOfMonth(maxDate) : undefined\n\n const selectedYear = (valueAsDate || this.focusedDay).getFullYear()\n const minYear = minDate ? minDate.getFullYear() : selectedYear - 10\n const maxYear = maxDate ? maxDate.getFullYear() : selectedYear + 10\n\n return html`\n <div class=\"n-calendar\">\n <div class=\"n-calendar-header\">\n <div>\n <nord-visually-hidden>\n <h2 id=${this.dialogLabelId} aria-live=\"polite\" aria-atomic=\"true\">\n ${this.monthNames[focusedMonth]}, ${this.focusedDay.getFullYear()}\n </h2>\n </nord-visually-hidden>\n\n <div class=\"n-calendar-select\">\n <select\n aria-label=${this.localize.term(\"monthSelectLabel\")}\n class=\"n-calendar-select-month\"\n @input=${this.handleMonthSelect}\n >\n ${this.monthNames.map(\n (month, i) =>\n html`\n <option\n value=${i}\n ?selected=${i === focusedMonth}\n ?disabled=${!inRange(new Date(focusedYear, i, 1), minDateStartOfMonth, maxDateEndOfMonth)}\n >\n ${month}\n </option>\n `\n )}\n </select>\n <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n <span>${this.monthNamesShort[focusedMonth]}</span>\n <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n </div>\n </div>\n\n <div class=\"n-calendar-select\">\n <select\n aria-label=${this.localize.term(\"yearSelectLabel\")}\n class=\"n-calendar-select-year\"\n @input=${this.handleYearSelect}\n >\n ${repeat(\n range(minYear, maxYear),\n year => year,\n year => html`<option ?selected=${year === focusedYear}>${year}</option>`\n )}\n </select>\n <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n <span>${this.focusedDay.getFullYear()}</span>\n <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n </div>\n </div>\n </div>\n\n <div class=\"n-calendar-nav\">\n <nord-button\n class=\"n-calendar-prev\"\n @click=${this.handlePreviousMonthClick}\n ?disabled=${isEqualMonth(minDate, this.focusedDay)}\n type=\"button\"\n >\n <nord-visually-hidden>${this.localize.term(\"prevMonthLabel\")}</nord-visually-hidden>\n <nord-icon name=${this.direction.isLTR ? \"arrow-left-small\" : \"arrow-right-small\"} size=\"s\"></nord-icon>\n </nord-button>\n\n <nord-button\n class=\"n-calendar-next\"\n @click=${this.handleNextMonthClick}\n ?disabled=${isEqualMonth(maxDate, this.focusedDay)}\n type=\"button\"\n >\n <nord-visually-hidden>${this.localize.term(\"nextMonthLabel\")}</nord-visually-hidden>\n <nord-icon name=${this.direction.isLTR ? \"arrow-right-small\" : \"arrow-left-small\"} size=\"s\"></nord-icon>\n </nord-button>\n </div>\n </div>\n\n ${monthView({\n onFocusOut: this.disableActiveFocus,\n onFocusIn: this.enableActiveFocus,\n dateFormatter: this.dateFormatShort,\n selectedDate: valueAsDate,\n focusedDate: this.focusedDay,\n onDateSelect: this.handleDaySelect,\n onKeyboardNavigation: this.shortcuts,\n labelledById: this.dialogLabelId,\n dayNames: this.dayNames,\n dayNamesShort: this.dayNamesShort,\n firstDayOfWeek: this.firstDayOfWeek,\n min: minDate,\n max: maxDate,\n isDateDisabled: this.isDateDisabled,\n })}\n </div>\n `\n }\n\n @observe(\"value\")\n protected handleValueChange() {\n this.setFocusedDay(parseISODate(this.value) || new Date())\n }\n\n @observe(\"focusedDay\", \"updated\")\n protected handleFocusedDayChange() {\n if (this.activeFocus) {\n this.focusedDayNode.focus()\n }\n }\n\n private handleLangChange() {\n const lang = this.localize.resolvedLang\n this.dateFormatShort = new Intl.DateTimeFormat(lang, { day: \"numeric\", month: \"long\" })\n this.monthNames = getMonthNames(lang, \"long\")\n this.monthNamesShort = getMonthNames(lang, \"short\")\n this.dayNames = getDayNames(lang, \"long\")\n this.dayNamesShort = getDayNames(lang, \"narrow\")\n }\n\n private handleDaySelect = (day: Date) => {\n const isInRange = inRange(day, parseISODate(this.min), parseISODate(this.max))\n const isAllowed = !this.isDateDisabled(day)\n\n if (isInRange && isAllowed) {\n this.value = printISODate(day)\n this.dispatchEvent(new DateSelectEvent(\"change\", day))\n }\n }\n\n private addDays(days: number) {\n this.setFocusedDay(addDays(this.focusedDay, days))\n }\n\n private addMonths(months: number) {\n this.setMonth(this.focusedDay.getMonth() + months)\n }\n\n private addYears(years: number) {\n this.setYear(this.focusedDay.getFullYear() + years)\n }\n\n private startOfWeek() {\n this.setFocusedDay(startOfWeek(this.focusedDay, this.firstDayOfWeek))\n }\n\n private endOfWeek() {\n this.setFocusedDay(endOfWeek(this.focusedDay, this.firstDayOfWeek))\n }\n\n private setMonth(month: number) {\n const min = setMonth(startOfMonth(this.focusedDay), month)\n const max = endOfMonth(min)\n const date = setMonth(this.focusedDay, month)\n\n this.setFocusedDay(clamp(date, min, max))\n }\n\n private setYear(year: number) {\n const min = setYear(startOfMonth(this.focusedDay), year)\n const max = endOfMonth(min)\n const date = setYear(this.focusedDay, year)\n\n this.setFocusedDay(clamp(date, min, max))\n }\n\n private setFocusedDay(day: Date) {\n this.focusedDay = clamp(day, parseISODate(this.min), parseISODate(this.max))\n this.dispatchEvent(new DateSelectEvent(\"nord-focus-date\", this.focusedDay))\n }\n\n private handleMonthSelect = (e: any) => {\n this.setMonth(parseInt(e.target.value, 10))\n }\n\n private handleYearSelect = (e: any) => {\n this.setYear(parseInt(e.target.value, 10))\n }\n\n private handleNextMonthClick = (event: MouseEvent) => {\n event.preventDefault()\n this.addMonths(1)\n }\n\n private handlePreviousMonthClick = (event: MouseEvent) => {\n event.preventDefault()\n this.addMonths(-1)\n }\n\n private enableActiveFocus = () => {\n this.activeFocus = true\n }\n\n private disableActiveFocus = () => {\n this.activeFocus = false\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-calendar\": Calendar\n }\n}\n"],"names":["preventDefault","e","SwipeController","constructor","host","options","this","hadFirstUpdate","initialTouchX","initialTouchY","handleTouchStart","event","pageX","pageY","changedTouches","handleTouchEnd","matchesGesture","onSwipeEnd","distX","distY","details","initialX","initialY","addController","events","EventController","target","hostUpdated","listen","hostDisconnected","isHorizontalSwipe","Math","abs","isDownwardsSwipe","Icon","registerIcon","arrowRightIcon","arrowLeftIcon","arrowDownIcon","fn","isDateDisabled","Calendar","LitElement","dialogLabelId","direction","DirectionController","swipe","addMonths","shortcuts","createKeybindingsHandler","ArrowRight","addDays","isLTR","ArrowLeft","ArrowDown","ArrowUp","Home","startOfWeek","End","endOfWeek","PageUp","PageDown","addYears","localize","LocalizeController","onLangChange","handleLangChange","value","firstDayOfWeek","min","max","expand","activeFocus","focusedDay","Date","handleDaySelect","day","isInRange","inRange","parseISODate","isAllowed","printISODate","dispatchEvent","DateSelectEvent","handleMonthSelect","setMonth","parseInt","handleYearSelect","setYear","handleNextMonthClick","handlePreviousMonthClick","enableActiveFocus","disableActiveFocus","focus","_a","focusedDayNode","monthSelectNode","render","valueAsDate","focusedMonth","getMonth","focusedYear","getFullYear","minDate","maxDate","minDateStartOfMonth","startOfMonth","undefined","maxDateEndOfMonth","endOfMonth","selectedYear","minYear","maxYear","html","monthNames","term","map","month","i","monthNamesShort","repeat","range","year","isEqualMonth","monthView","onFocusOut","onFocusIn","dateFormatter","dateFormatShort","selectedDate","focusedDate","onDateSelect","onKeyboardNavigation","labelledById","dayNames","dayNamesShort","handleValueChange","setFocusedDay","handleFocusedDayChange","lang","resolvedLang","Intl","DateTimeFormat","getMonthNames","getDayNames","days","months","years","date","clamp","styles","componentStyle","style","__decorate","query","prototype","property","type","Number","reflect","Boolean","attribute","state","observe","customElement"],"mappings":"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"}

package/lib/Calendar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import"./query-assigned-elements-e6cbac30.js";import"./lit-element-79bc2e0e.js";import"./property-03f59dce.js";import"./state-70f38ceb.js";import"./query-2d22378e.js";import"./repeat-e7acc0bd.js";import"./tinykeys.module-84e6cc41.js";export{C as default}from"./Calendar-a0246aa3.js";import"./Button.js";import"./VisuallyHidden.js";import"./Icon.js";import"./DirectionController-8b298382.js";import"./LocalizeController.js";import"./number-c3ab3e95.js";import"./dates-a8de5b83.js";import"./observe-a9c6dfb6.js";import"./month-view.js";import"./DateSelectEvent.js";import"./Component-49a41387.js";import"./directive-de55b00a.js";import"./ref-697b28b5.js";import"./EventController-d99ebeef.js";import"./LightDomController-9a6e398f.js";import"./cond-0a8d4554.js";import"./Spinner.js";import"./if-defined-f43b1487.js";import"./FocusableMixin-99db12c1.js";import"./InputMixin-158f63fb.js";import"./unsafe-html-be8023cd.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./class-map-cd6c8cbd.js";import"./collection-800f5002.js";import"./events-731d0007.js";
+import"./query-assigned-elements-e6cbac30.js";import"./lit-element-79bc2e0e.js";import"./property-03f59dce.js";import"./state-70f38ceb.js";import"./query-2d22378e.js";import"./repeat-e7acc0bd.js";import"./tinykeys.module-84e6cc41.js";export{C as default}from"./Calendar-8b36a7e5.js";import"./Button.js";import"./VisuallyHidden.js";import"./Icon.js";import"./DirectionController-8b298382.js";import"./LocalizeController.js";import"./number-c3ab3e95.js";import"./dates-a8de5b83.js";import"./observe-a9c6dfb6.js";import"./month-view.js";import"./DateSelectEvent.js";import"./Component-49a41387.js";import"./directive-de55b00a.js";import"./ref-697b28b5.js";import"./EventController-d99ebeef.js";import"./LightDomController-9a6e398f.js";import"./cond-0a8d4554.js";import"./Spinner.js";import"./if-defined-f43b1487.js";import"./FocusableMixin-99db12c1.js";import"./InputMixin-158f63fb.js";import"./unsafe-html-be8023cd.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./class-map-cd6c8cbd.js";import"./collection-800f5002.js";import"./events-731d0007.js";
 //# sourceMappingURL=Calendar.js.map

package/lib/Checkbox.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{_ as e,e as n}from"./query-assigned-elements-e6cbac30.js";import{i as o,y as r,s as i}from"./lit-element-79bc2e0e.js";import{e as t}from"./property-03f59dce.js";import{l as a}from"./if-defined-f43b1487.js";import{n as c}from"./ref-697b28b5.js";import s from"./Icon.js";import{F as l}from"./FocusableMixin-99db12c1.js";import{F as d}from"./FormAssociatedMixin-f6e5b3cd.js";import{I as p}from"./InputMixin-158f63fb.js";import{S as h,i as m}from"./SizeMixin-4559b224.js";import{s as b}from"./Component-49a41387.js";import{s as v}from"./FormField-72062bf1.js";import"./directive-de55b00a.js";import"./state-70f38ceb.js";import"./unsafe-html-be8023cd.js";import"./observe-a9c6dfb6.js";import"./cond-0a8d4554.js";import"./EventController-d99ebeef.js";import"./SlotController-ea6eff46.js";import"./events-731d0007.js";import"./VisuallyHidden.js";var u=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M41.86 131.25a23.982 23.982 0 0 1-18.494-8.666L2.254 95.746a10.5 10.5 0 1 1 16.492-12.992l21 26.6a2.24 2.24 0 0 0 2.212.882 3.038 3.038 0 0 0 2.38-1.148l76.958-96.39a10.5 10.5 0 1 1 16.408 13.104L60.606 122.29A24.038 24.038 0 0 1 42 131.25z"/></svg>',title:"interface-checked-small",tags:"nordicon interface checked small symbol checkmark done ready"});var f=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M129.5 80.5h-119a10.5 10.5 0 0 1 0-21h119a10.5 10.5 0 0 1 0 21z"/></svg>',title:"interface-remove-small",tags:"nordicon interface remove small delete erase minimize line"});const k=o`:host{--_n-checkbox-size:calc(var(--n-space-m) * 1.25);--_n-checkbox-accent-color:var(--n-color-accent);--_n-checkbox-border-color:var(--n-color-border-hover);display:inline-block}.n-flex{display:flex}.n-expand{flex:1}.n-input-container{position:relative}input{-moz-appearance:none;-webkit-appearance:none;appearance:none;border:1px solid var(--_n-checkbox-border-color);border-radius:var(--n-border-radius-s);display:block;inline-size:var(--_n-checkbox-size);block-size:var(--_n-checkbox-size);cursor:pointer}input:checked,input:indeterminate{--_n-checkbox-border-color:var(--n-color-accent);background:var(--_n-checkbox-accent-color)}input[aria-invalid]{--_n-checkbox-accent-color:var(--n-color-status-danger);--_n-checkbox-border-color:var(--_n-checkbox-accent-color)}input:focus-visible{outline:0!important}input:focus{outline:0!important;box-shadow:0 0 0 1px var(--n-color-surface),0 0 0 3px var(--n-color-accent)}input:active{opacity:.8}:host([disabled]) label{color:var(--n-color-text-weaker);cursor:default}:host([disabled]) input{--_n-checkbox-accent-color:var(--n-color-border-strong);--_n-checkbox-border-color:var(--_n-checkbox-accent-color);background:var(--_n-checkbox-accent-color);cursor:default;opacity:1}nord-icon{display:none;position:absolute;color:var(--n-color-text-on-accent);inset:calc(var(--n-space-s)/ 2);z-index:var(--n-index-default);pointer-events:none}input:checked~.icon-checked,input:indeterminate~.icon-indeterminate{display:block}.n-label-container{padding-block-end:0}label{-webkit-user-select:none;user-select:none;font-weight:var(--n-font-weight)!important;line-height:var(--n-line-height-form);padding-inline-start:var(--n-space-s);cursor:pointer}.n-hint{padding-inline-start:var(--n-space-s)}.n-error{margin-block-start:calc(var(--n-space-s)/ 2);padding-inline-start:var(--n-space-s)}:host([size="s"]){--_n-checkbox-size:var(--n-space-m)}:host([size="s"]) .n-label-container{transform:translateY(-2px)}:host([size="l"]){--_n-checkbox-size:var(--n-space-l)}`;s.registerIcon(u),s.registerIcon(f);let x=class extends(h(d(p(l(i))))){constructor(){super(...arguments),this.indeterminate=!1,this.checked=!1}get formValue(){return this.checked?this.value||"on":void 0}render(){const e=m[this.size]||m.m;return r`<div class="n-flex"><div class="n-input-container"><input ${c(this.focusableRef)} class="n-input" id="${this.inputId}" type="checkbox" name="${a(this.name)}" .value="${this.value}" .checked="${this.checked}" .indeterminate="${this.indeterminate}" ?disabled="${this.disabled}" ?required="${this.required}" aria-describedby="${a(this.getDescribedBy())}" aria-invalid="${a(this.getInvalid())}" @change="${this.handleChange}"><nord-icon class="icon-checked" name="interface-checked-small" size="${e}"></nord-icon><nord-icon class="icon-indeterminate" name="interface-remove-small" size="${e}"></nord-icon></div><div class="n-expand">${this.renderLabel()} ${this.renderError()}</div></div>`}handleChange(e){const n=e.target;this.checked=n.checked,super.handleChange(e)}};x.styles=[b,v,k],e([t({type:Boolean})],x.prototype,"indeterminate",void 0),e([t({type:Boolean})],x.prototype,"checked",void 0),x=e([n("nord-checkbox")],x);var g=x;export{g as default};
+import{_ as e,e as n}from"./query-assigned-elements-e6cbac30.js";import{i as o,y as r,s as i}from"./lit-element-79bc2e0e.js";import{e as t}from"./property-03f59dce.js";import{l as c}from"./if-defined-f43b1487.js";import{n as a}from"./ref-697b28b5.js";import s from"./Icon.js";import{F as l}from"./FocusableMixin-99db12c1.js";import{F as d}from"./FormAssociatedMixin-f6e5b3cd.js";import{I as p}from"./InputMixin-158f63fb.js";import{S as h,i as m}from"./SizeMixin-4559b224.js";import{s as b}from"./Component-49a41387.js";import{s as v}from"./FormField-72062bf1.js";import"./directive-de55b00a.js";import"./state-70f38ceb.js";import"./unsafe-html-be8023cd.js";import"./observe-a9c6dfb6.js";import"./cond-0a8d4554.js";import"./EventController-d99ebeef.js";import"./SlotController-ea6eff46.js";import"./events-731d0007.js";import"./VisuallyHidden.js";var u=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M41.86 131.25a23.982 23.982 0 0 1-18.494-8.666L2.254 95.746a10.5 10.5 0 1 1 16.492-12.992l21 26.6a2.24 2.24 0 0 0 2.212.882 3.038 3.038 0 0 0 2.38-1.148l76.958-96.39a10.5 10.5 0 1 1 16.408 13.104L60.606 122.29A24.038 24.038 0 0 1 42 131.25z"/></svg>',title:"interface-checked-small",tags:"nordicon interface checked small symbol checkmark done ready"});var f=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path fill="currentColor" d="M129.5 80.5h-119a10.5 10.5 0 0 1 0-21h119a10.5 10.5 0 0 1 0 21z"/></svg>',title:"interface-remove-small",tags:"nordicon interface remove small delete erase minimize line"});const k=o`:host{--_n-checkbox-size:calc(var(--n-space-m) * 1.25);--_n-checkbox-accent-color:var(--n-color-accent);--_n-checkbox-border-color:var(--n-color-border-hover);display:inline-block}.n-flex{display:flex}.n-expand{flex:1}.n-input-container{position:relative}input{-moz-appearance:none;-webkit-appearance:none;appearance:none;border:1px solid var(--_n-checkbox-border-color);border-radius:var(--n-border-radius-s);display:block;inline-size:var(--_n-checkbox-size);block-size:var(--_n-checkbox-size);cursor:pointer}input:checked,input:indeterminate{--_n-checkbox-border-color:var(--n-color-accent);background:var(--_n-checkbox-accent-color)}input[aria-invalid]{--_n-checkbox-accent-color:var(--n-color-status-danger);--_n-checkbox-border-color:var(--_n-checkbox-accent-color)}input:focus-visible{outline:0!important}input:focus{outline:0!important;box-shadow:0 0 0 1px var(--n-color-surface),0 0 0 3px var(--n-color-accent)}input:active{opacity:.8}:host([disabled]) label{color:var(--n-color-text-weaker);cursor:default}:host([disabled]) input{--_n-checkbox-accent-color:var(--n-color-border-strong);--_n-checkbox-border-color:var(--_n-checkbox-accent-color);background:var(--_n-checkbox-accent-color);cursor:default;opacity:1}nord-icon{display:none;position:absolute;color:var(--n-color-text-on-accent);inset:calc(var(--n-space-s)/ 2);z-index:var(--n-index-default);pointer-events:none}input:checked~.icon-checked,input:indeterminate~.icon-indeterminate{display:block}.n-label-container{padding-block-end:0}label{-webkit-user-select:none;user-select:none;font-weight:var(--n-font-weight)!important;line-height:var(--n-line-height-form);padding-inline-start:var(--n-space-s);cursor:pointer}.n-hint{padding-inline-start:var(--n-space-s)}.n-error{margin-block-start:calc(var(--n-space-s)/ 2);padding-inline-start:var(--n-space-s)}:host([size="s"]){--_n-checkbox-size:var(--n-space-m)}:host([size="s"]) nord-icon{inset:calc(var(--n-space-s)/ 2.6)}:host([size="s"]) .n-label-container{transform:translateY(-2px)}:host([size="l"]){--_n-checkbox-size:var(--n-space-l)}`;s.registerIcon(u),s.registerIcon(f);let x=class extends(h(d(p(l(i))))){constructor(){super(...arguments),this.indeterminate=!1,this.checked=!1}get formValue(){return this.checked?this.value||"on":void 0}render(){const e=m[this.size]||m.m;return r`<div class="n-flex"><div class="n-input-container"><input ${a(this.focusableRef)} class="n-input" id="${this.inputId}" type="checkbox" name="${c(this.name)}" .value="${this.value}" .checked="${this.checked}" .indeterminate="${this.indeterminate}" ?disabled="${this.disabled}" ?required="${this.required}" aria-describedby="${c(this.getDescribedBy())}" aria-invalid="${c(this.getInvalid())}" @change="${this.handleChange}"><nord-icon class="icon-checked" name="interface-checked-small" size="${e}"></nord-icon><nord-icon class="icon-indeterminate" name="interface-remove-small" size="${e}"></nord-icon></div><div class="n-expand">${this.renderLabel()} ${this.renderError()}</div></div>`}handleChange(e){const n=e.target;this.checked=n.checked,super.handleChange(e)}};x.styles=[b,v,k],e([t({type:Boolean})],x.prototype,"indeterminate",void 0),e([t({type:Boolean})],x.prototype,"checked",void 0),x=e([n("nord-checkbox")],x);var g=x;export{g as default};
 //# sourceMappingURL=Checkbox.js.map

package/lib/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","sources":["../../icons/lib/assets/interface-checked-small.js","../../icons/lib/assets/interface-remove-small.js","../src/checkbox/Checkbox.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M41.86 131.25a23.982 23.982 0 0 1-18.494-8.666L2.254 95.746a10.5 10.5 0 1 1 16.492-12.992l21 26.6a2.24 2.24 0 0 0 2.212.882 3.038 3.038 0 0 0 2.38-1.148l76.958-96.39a10.5 10.5 0 1 1 16.408 13.104L60.606 122.29A24.038 24.038 0 0 1 42 131.25z\"/></svg>'\nexport const title = \"interface-checked-small\"\nexport const tags = \"nordicon interface checked small symbol checkmark done ready\"\n","export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M129.5 80.5h-119a10.5 10.5 0 0 1 0-21h119a10.5 10.5 0 0 1 0 21z\"/></svg>'\nexport const title = \"interface-remove-small\"\nexport const tags = \"nordicon interface remove small delete erase minimize line\"\n","import { html, LitElement } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { ref } from \"lit/directives/ref.js\"\nimport * as checkedIcon from \"@nordhealth/icons/lib/assets/interface-checked-small.js\"\nimport * as indeterminateIcon from \"@nordhealth/icons/lib/assets/interface-remove-small.js\"\n\nimport Icon from \"../icon/Icon.js\"\nimport { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { FormAssociatedMixin } from \"../common/mixins/FormAssociatedMixin.js\"\nimport { InputMixin } from \"../common/mixins/InputMixin.js\"\nimport { SizeMixin, iconSizeMap } from \"../common/mixins/SizeMixin.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport style from \"./Checkbox.css\"\n\nIcon.registerIcon(checkedIcon)\nIcon.registerIcon(indeterminateIcon)\n\n/*\n Checkboxes allow user to choose one or more options from a limited set of options.\n * If you have more than 10 options, please use Select component instead.\n \n @status ready\n * @category form\n * @slot label - Use when a label requires more than plain text.\n * @slot hint - Optional slot that holds hint text for the input.\n * @slot error - Optional slot that holds error text for the input.\n /\n@customElement(\"nord-checkbox\")\nexport default class Checkbox extends SizeMixin(FormAssociatedMixin(InputMixin(FocusableMixin(LitElement)))) {\n static styles = [componentStyle, formFieldStyle, style]\n\n protected override get formValue() {\n return this.checked ? this.value \|\| \"on\" : undefined\n }\n\n /\n Controls whether the checkbox is in an indeterminate state.\n /\n @property({ type: Boolean }) indeterminate = false\n\n /\n Controls whether the checkbox is checked or not.\n */\n @property({ type: Boolean }) checked: boolean = false\n\n render() {\n const iconSize = iconSizeMap[this.size] \|\| iconSizeMap.m\n\n return html`\n <div class=\"n-flex\">\n <div class=\"n-input-container\">\n <input\n ${ref(this.focusableRef)}\n class=\"n-input\"\n id=${this.inputId}\n type=\"checkbox\"\n name=${ifDefined(this.name)}\n .value=${this.value}\n .checked=${this.checked}\n .indeterminate=${this.indeterminate}\n ?disabled=${this.disabled}\n ?required=${this.required}\n aria-describedby=${ifDefined(this.getDescribedBy())}\n aria-invalid=${ifDefined(this.getInvalid())}\n @change=${this.handleChange}\n />\n <nord-icon class=\"icon-checked\" name=\"interface-checked-small\" size=${iconSize}></nord-icon>\n <nord-icon class=\"icon-indeterminate\" name=\"interface-remove-small\" size=${iconSize}></nord-icon>\n </div>\n <div class=\"n-expand\">${this.renderLabel()} ${this.renderError()}</div>\n </div>\n `\n }\n\n protected handleChange(e: Event): void {\n const target = e.target as HTMLInputElement\n this.checked = target.checked\n super.handleChange(e)\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-checkbox\": Checkbox\n }\n}\n"],"names":["Icon","registerIcon","checkedIcon","indeterminateIcon","Checkbox","SizeMixin","FormAssociatedMixin","InputMixin","FocusableMixin","LitElement","constructor","this","indeterminate","checked","formValue","value","undefined","render","iconSize","iconSizeMap","size","m","html","ref","focusableRef","inputId","ifDefined","name","disabled","required","getDescribedBy","getInvalid","handleChange","renderLabel","renderError","e","target","super","styles","componentStyle","formFieldStyle","style","__decorate","property","type","Boolean","prototype","customElement"],"mappings":"03BAAe,6VACM,+BACD,6GCFL,4KACM,8BACD,~~shECepBA~~,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAalB,IAAqBC,EAArB,cAAsCC,EAAUC,EAAoBC,EAAWC,EAAeC,OAA9FC,kCAU+BC,KAAaC,eAAG,EAKhBD,KAAOE,SAAY,CAoCjD,CAhDwBC,gBACrB,OAAOH,KAAKE,QAAUF,KAAKI,OAAS,UAAOC,CAC5C,CAYDC,SACE,MAAMC,EAAWC,EAAYR,KAAKS,OAASD,EAAYE,EAEvD,OAAOC,CAAI,6DAIDC,EAAIZ,KAAKa,qCAENb,KAAKc,kCAEHC,EAAUf,KAAKgB,kBACbhB,KAAKI,oBACHJ,KAAKE,4BACCF,KAAKC,6BACVD,KAAKiB,wBACLjB,KAAKkB,+BACEH,EAAUf,KAAKmB,oCACnBJ,EAAUf,KAAKoB,2BACpBpB,KAAKqB,sFAEqDd,4FACKA,8CAErDP,KAAKsB,iBAAiBtB,KAAKuB,2BAGxD,CAESF,aAAaG,GACrB,MAAMC,EAASD,EAAEC,OACjBzB,KAAKE,QAAUuB,EAAOvB,QACtBwB,MAAML,aAAaG,EACpB,GAjDM/B,EAAMkC,OAAG,CAACC,EAAgBC,EAAgBC,GASpBC,EAAA,CAA5BC,EAAS,CAAEC,KAAMC,WAAgCzC,EAAA0C,UAAA,qBAAA,GAKrBJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMC,WAAmCzC,EAAA0C,UAAA,eAAA,GAflC1C,EAAQsC,EAAA,CAD5BK,EAAc,kBACM3C,SAAAA"}
1	+ {"version":3,"file":"Checkbox.js","sources":["../../icons/lib/assets/interface-checked-small.js","../../icons/lib/assets/interface-remove-small.js","../src/checkbox/Checkbox.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M41.86 131.25a23.982 23.982 0 0 1-18.494-8.666L2.254 95.746a10.5 10.5 0 1 1 16.492-12.992l21 26.6a2.24 2.24 0 0 0 2.212.882 3.038 3.038 0 0 0 2.38-1.148l76.958-96.39a10.5 10.5 0 1 1 16.408 13.104L60.606 122.29A24.038 24.038 0 0 1 42 131.25z\"/></svg>'\nexport const title = \"interface-checked-small\"\nexport const tags = \"nordicon interface checked small symbol checkmark done ready\"\n","export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path fill=\"currentColor\" d=\"M129.5 80.5h-119a10.5 10.5 0 0 1 0-21h119a10.5 10.5 0 0 1 0 21z\"/></svg>'\nexport const title = \"interface-remove-small\"\nexport const tags = \"nordicon interface remove small delete erase minimize line\"\n","import { html, LitElement } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { ref } from \"lit/directives/ref.js\"\nimport * as checkedIcon from \"@nordhealth/icons/lib/assets/interface-checked-small.js\"\nimport * as indeterminateIcon from \"@nordhealth/icons/lib/assets/interface-remove-small.js\"\n\nimport Icon from \"../icon/Icon.js\"\nimport { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { FormAssociatedMixin } from \"../common/mixins/FormAssociatedMixin.js\"\nimport { InputMixin } from \"../common/mixins/InputMixin.js\"\nimport { SizeMixin, iconSizeMap } from \"../common/mixins/SizeMixin.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport style from \"./Checkbox.css\"\n\nIcon.registerIcon(checkedIcon)\nIcon.registerIcon(indeterminateIcon)\n\n/*\n Checkboxes allow user to choose one or more options from a limited set of options.\n * If you have more than 10 options, please use Select component instead.\n \n @status ready\n * @category form\n * @slot label - Use when a label requires more than plain text.\n * @slot hint - Optional slot that holds hint text for the input.\n * @slot error - Optional slot that holds error text for the input.\n /\n@customElement(\"nord-checkbox\")\nexport default class Checkbox extends SizeMixin(FormAssociatedMixin(InputMixin(FocusableMixin(LitElement)))) {\n static styles = [componentStyle, formFieldStyle, style]\n\n protected override get formValue() {\n return this.checked ? this.value \|\| \"on\" : undefined\n }\n\n /\n Controls whether the checkbox is in an indeterminate state.\n /\n @property({ type: Boolean }) indeterminate = false\n\n /\n Controls whether the checkbox is checked or not.\n */\n @property({ type: Boolean }) checked: boolean = false\n\n render() {\n const iconSize = iconSizeMap[this.size] \|\| iconSizeMap.m\n\n return html`\n <div class=\"n-flex\">\n <div class=\"n-input-container\">\n <input\n ${ref(this.focusableRef)}\n class=\"n-input\"\n id=${this.inputId}\n type=\"checkbox\"\n name=${ifDefined(this.name)}\n .value=${this.value}\n .checked=${this.checked}\n .indeterminate=${this.indeterminate}\n ?disabled=${this.disabled}\n ?required=${this.required}\n aria-describedby=${ifDefined(this.getDescribedBy())}\n aria-invalid=${ifDefined(this.getInvalid())}\n @change=${this.handleChange}\n />\n <nord-icon class=\"icon-checked\" name=\"interface-checked-small\" size=${iconSize}></nord-icon>\n <nord-icon class=\"icon-indeterminate\" name=\"interface-remove-small\" size=${iconSize}></nord-icon>\n </div>\n <div class=\"n-expand\">${this.renderLabel()} ${this.renderError()}</div>\n </div>\n `\n }\n\n protected handleChange(e: Event): void {\n const target = e.target as HTMLInputElement\n this.checked = target.checked\n super.handleChange(e)\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-checkbox\": Checkbox\n }\n}\n"],"names":["Icon","registerIcon","checkedIcon","indeterminateIcon","Checkbox","SizeMixin","FormAssociatedMixin","InputMixin","FocusableMixin","LitElement","constructor","this","indeterminate","checked","formValue","value","undefined","render","iconSize","iconSizeMap","size","m","html","ref","focusableRef","inputId","ifDefined","name","disabled","required","getDescribedBy","getInvalid","handleChange","renderLabel","renderError","e","target","super","styles","componentStyle","formFieldStyle","style","__decorate","property","type","Boolean","prototype","customElement"],"mappings":"03BAAe,6VACM,+BACD,6GCFL,4KACM,8BACD,olECepBA,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAalB,IAAqBC,EAArB,cAAsCC,EAAUC,EAAoBC,EAAWC,EAAeC,OAA9FC,kCAU+BC,KAAaC,eAAG,EAKhBD,KAAOE,SAAY,CAoCjD,CAhDwBC,gBACrB,OAAOH,KAAKE,QAAUF,KAAKI,OAAS,UAAOC,CAC5C,CAYDC,SACE,MAAMC,EAAWC,EAAYR,KAAKS,OAASD,EAAYE,EAEvD,OAAOC,CAAI,6DAIDC,EAAIZ,KAAKa,qCAENb,KAAKc,kCAEHC,EAAUf,KAAKgB,kBACbhB,KAAKI,oBACHJ,KAAKE,4BACCF,KAAKC,6BACVD,KAAKiB,wBACLjB,KAAKkB,+BACEH,EAAUf,KAAKmB,oCACnBJ,EAAUf,KAAKoB,2BACpBpB,KAAKqB,sFAEqDd,4FACKA,8CAErDP,KAAKsB,iBAAiBtB,KAAKuB,2BAGxD,CAESF,aAAaG,GACrB,MAAMC,EAASD,EAAEC,OACjBzB,KAAKE,QAAUuB,EAAOvB,QACtBwB,MAAML,aAAaG,EACpB,GAjDM/B,EAAMkC,OAAG,CAACC,EAAgBC,EAAgBC,GASpBC,EAAA,CAA5BC,EAAS,CAAEC,KAAMC,WAAgCzC,EAAA0C,UAAA,qBAAA,GAKrBJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMC,WAAmCzC,EAAA0C,UAAA,eAAA,GAflC1C,EAAQsC,EAAA,CAD5BK,EAAc,kBACM3C,SAAAA"}

package/lib/DatePicker.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{_ as e,e as t}from"./query-assigned-elements-e6cbac30.js";import{i,y as a,b as o,s as n}from"./lit-element-79bc2e0e.js";import{e as r}from"./property-03f59dce.js";import{t as s}from"./state-70f38ceb.js";import{i as l}from"./query-2d22378e.js";import{o as d}from"./class-map-cd6c8cbd.js";import{n as c}from"./ref-697b28b5.js";import{l as p}from"./if-defined-f43b1487.js";import{c as m}from"./interface-close-small-44ababc3.js";import{F as h}from"./FocusableMixin-99db12c1.js";import{F as u}from"./FormAssociatedMixin-f6e5b3cd.js";import{I as b}from"./InputMixin-158f63fb.js";import{m as v,p as g,a as f}from"./dates-a8de5b83.js";import{N as y}from"./events-731d0007.js";import{S as x,i as w}from"./Calendar-a0246aa3.js";import{L as j}from"./LightDismissController-a2645ae6.js";import{LocalizeController as k}from"./LocalizeController.js";import"./Button.js";import z from"./Icon.js";import"./VisuallyHidden.js";import{s as $}from"./Component-49a41387.js";import{s as D}from"./FormField-72062bf1.js";import{R as F,s as C}from"./TextField-94b0839b.js";import{isoAdapter as L}from"./date-adapter.js";import{c as S}from"./cond-0a8d4554.js";import{S as A,i as E}from"./SizeMixin-4559b224.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";import"./SlotController-ea6eff46.js";import"./repeat-e7acc0bd.js";import"./tinykeys.module-84e6cc41.js";import"./DirectionController-8b298382.js";import"./number-c3ab3e95.js";import"./observe-a9c6dfb6.js";import"./month-view.js";import"./collection-800f5002.js";import"./DateSelectEvent.js";import"./ShortcutController-87615e31.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./LightDomController-9a6e398f.js";import"./Spinner.js";import"./unsafe-html-be8023cd.js";var B=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path d="M7 21h126v112H7zM35 7v28m70-28v28M7 63h126" stroke-width="14" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>',title:"interface-calendar",tags:"nordicon interface calendar date time day week month year"});const I=i`:host{--_n-date-picker-toggle-block-size:calc(100% - 2px);color:var(--n-color-text);position:relative}.n-date-toggle{-webkit-appearance:none;appearance:none;min-block-size:var(--_n-date-picker-toggle-block-size);border-start-end-radius:var(--n-border-radius-s);border-end-end-radius:var(--n-border-radius-s);box-shadow:var(--n-box-shadow),var(--n-box-shadow);padding:1px calc(var(--n-space-m)/ 1.5) 0;color:var(--n-color-icon);cursor:pointer;background:var(--n-color-button);position:absolute;inset-inline-end:1px;inset-block-start:1px;border:0;border-inline-start:1px solid var(--n-color-border-strong);transition:color var(--n-transition-slowly),background var(--n-transition-slowly)}@media (max-width:35.9375em){.n-date-toggle{padding-block-start:0}}.n-date-toggle:hover{color:var(--n-color-icon-hover)}.n-date-toggle:focus{border:0;box-shadow:0 0 0 2px var(--n-color-accent);outline:0}.n-date-toggle:active{opacity:.8}.n-date-toggle:disabled{box-shadow:none;background:0 0;border:0;color:var(--n-color-text-weakest);cursor:default}.n-date-toggle::after{content:"";position:absolute;background:0 0;background-image:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,.013) 100%);background-repeat:repeat-x;inline-size:100%;inset-inline:0;block-size:100%;inset-block-start:0}.n-input-container .n-input{padding-inline-end:calc(var(--n-space-xl) * 1.25)}[role=dialog]{display:flex;font-feature-settings:var(--n-font-features-reduced);opacity:0;position:absolute;inset-block-start:100%;inset-inline-start:0;transform:scale(.98) translateZ(0) translateY(-10px);transform-origin:top right;transition:transform var(--n-transition-slowly),opacity var(--n-transition-slowly),visibility var(--n-transition-slowly);visibility:hidden;will-change:transform,opacity,visibility;z-index:var(--n-index-popout)}@media (max-width:35.9375em){[role=dialog]{inset-block:0;position:fixed;inline-size:100%;inset-inline-end:0;min-inline-size:320px;transform:translateZ(0);transform-origin:bottom center}.n-date-dialog-content{box-shadow:var(--n-box-shadow-modal)}}[role=dialog].is-left{inset-inline:auto 0;inline-size:auto}[role=dialog][aria-hidden=false]{transition-property:transform,opacity;opacity:1;transform:scale(1.0001) translateZ(0) translateY(0);visibility:visible}.n-date-dialog-content{margin-inline-start:auto;margin-block-start:8px;position:relative;transform:none;z-index:var(--n-index-popout)}nord-calendar{--n-calendar-box-shadow:var(--n-box-shadow-popup)}@media (max-width:35.9375em){.n-date-dialog-content{background:var(--n-color-background);border:0;border-radius:0;border-start-start-radius:var(--n-border-radius-s);border-start-end-radius:var(--n-border-radius-s);inset-block-end:0;inset-inline-start:0;inline-size:100%;margin:0;max-inline-size:none;min-block-size:26em;opacity:0;padding:0 8% 20px;position:absolute;transform:translateZ(0) translateY(100%);transition:transform var(--n-transition-mobile),opacity var(--n-transition-mobile),visibility var(--n-transition-mobile);visibility:hidden;will-change:transform,opacity,visibility}[role=dialog][aria-hidden=false] .n-date-dialog-content{opacity:1;transform:translateZ(0) translateY(0);visibility:visible}nord-calendar{--n-calendar-box-shadow:none;--_n-calendar-padding:0;--_n-calendar-inline-size:100%}}.n-date-header{align-items:center;display:flex;justify-content:space-between;margin-block-end:16px;inline-size:100%}.n-date-mobile{align-items:center;border-block-end:1px solid rgba(0,0,0,.12);display:flex;justify-content:space-between;margin-block-end:20px;margin-inline-start:-10%;overflow:hidden;padding:12px 20px;position:relative;text-overflow:ellipsis;white-space:nowrap;inline-size:120%}@media (min-width:36em){.n-date-mobile{border:0;margin:0;overflow:visible;padding:0;position:absolute;inset-inline-end:-8px;inset-block-start:-8px;inline-size:auto}}.n-date-mobile-heading{display:inline-block;font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-active);max-inline-size:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width:36em){.n-date-mobile-heading{display:none}}.n-date-close{-webkit-appearance:none;align-items:center;appearance:none;background:var(--n-color-background);border:0;border-radius:var(--n-border-radius);color:var(--n-color-text);cursor:pointer;display:flex;block-size:var(--n-size-icon-l);inline-size:var(--n-size-icon-l);justify-content:center;padding:0}@media (min-width:36em){.n-date-close{opacity:0}}.n-date-close:focus{box-shadow:0 0 0 2px var(--n-color-accent);outline:0}@media (min-width:36em){.n-date-close:focus{opacity:1}}.n-date-close svg{margin:0 auto}:host([size="s"]) .n-date-toggle nord-icon{transform:translateY(-1px)}:host([size="s"]) .n-input-container .n-input{padding-inline-end:var(--n-space-xl)}:host([size="l"]) .n-date-toggle{padding-inline-start:var(--n-space-m);padding-inline-end:var(--n-space-m)}:host([size="l"]) .n-input-container .n-input{padding-inline-end:var(--n-space-xxl)}`;z.registerIcon(B),z.registerIcon(m);const _=/[^0-9./-]+/g,M=()=>!1;let O=class extends(A(u(F(b(h(n)))))){constructor(){super(...arguments),this.dismiss=new j(this,{isOpen:()=>this.open,onDismiss:e=>this.hide("click"!==e.type),isDismissible:e=>e!==this.calendar&&e!==this.toggleButton}),this.swipe=new x(this,{target:()=>this.dialog,matchesGesture:w,onSwipeEnd:()=>this.hide(!1)}),this.localize=new k(this,{onLangChange:()=>this.createDateFormatters()}),this.open=!1,this.value="",this.min="",this.max="",this.direction="right",this.firstDayOfWeek=1,this.dateAdapter=L,this.isDateDisabled=M,this.handleDaySelect=e=>{e.stopPropagation(),this.setValue(e.date),this.hide()},this.toggleOpen=e=>{e.preventDefault(),this.open?this.hide(!1):this.show()},this.handleBlur=e=>{e.stopPropagation(),this.dispatchEvent(new y("blur"))},this.handleFocus=e=>{e.stopPropagation(),this.dispatchEvent(new y("focus"))},this.handleInputChange=e=>{const t=e.target;!function(e,t){const{value:i}=e,a=e.selectionStart,o=i.slice(0,a),n=i.slice(a,i.length),r=o.replace(t,""),s=r+n.replace(t,""),l=r.length;e.value=s,e.selectionStart=l,e.selectionEnd=l}(t,_),this.dispatchEvent(new y("input"));const i=this.dateAdapter.parse(t.value,v);(i||""===t.value)&&this.setValue(i)}}get valueAsDate(){return g(this.value)}set valueAsDate(e){this.value=e?f(e):""}get valueAsNumber(){var e,t;return null!==(t=null===(e=this.valueAsDate)||void 0===e?void 0:e.getTime())&&void 0!==t?t:NaN}set valueAsNumber(e){this.value=e?f(new Date(e)):""}show(){this.open=!0,this.dispatchEvent(new y("open")),this.updateComplete.then((()=>this.calendar.focus({target:"month"})))}hide(e=!0){this.open=!1,this.dispatchEvent(new y("close")),e&&this.toggleButton.focus()}render(){const{valueAsDate:e}=this,t=e?this.dateAdapter.format(e):"",i=E[this.size]||E.m;return a`${this.renderLabel()}<div class="n-input-container"><input class="n-input" name="${p(this.name)}" .value="${t}" placeholder="${p(this.placeholder)}" id="${this.inputId}" ?disabled="${this.disabled}" ?required="${this.required}" aria-autocomplete="none" @input="${this.handleInputChange}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" autocomplete="off" ${c(this.focusableRef)} aria-invalid="${S(this.error,"true")}" aria-describedby="${p(this.getDescribedBy())}" ?readonly="${this.readonly}"> <button class="n-date-toggle" @click="${this.toggleOpen}" ?disabled="${this.disabled||this.readonly}" type="button"><nord-icon name="interface-calendar" size="${i}"></nord-icon><nord-visually-hidden>${this.localize.term("buttonLabel")} ${e?a`<span>, ${this.localize.term("selectedDateMessage")} ${this.dateFormatLong.format(e)}</span>`:o}</nord-visually-hidden></button></div>${this.renderError()}<div class="${d({"is-left":"left"===this.direction,"is-active":this.open})}" role="dialog" aria-modal="true" aria-hidden="${this.open?"false":"true"}" aria-labelledby="dialog-header"><div class="n-date-dialog-content"><div aria-hidden="true" tabindex="0" @focus="${this.focusLast}"></div><div class="n-date-mobile"><div class="n-date-mobile-heading" id="dialog-header">${this.localize.term("modalHeading")}</div><button class="n-date-close" @click="${this.hide}" type="button"><nord-icon color="var(--n-color-icon)" name="interface-close-small" size="xs"></nord-icon><nord-visually-hidden>${this.localize.term("closeLabel")}</nord-visually-hidden></button></div><nord-calendar value="${this.value}" min="${this.min}" max="${this.max}" .firstDayOfWeek="${this.firstDayOfWeek}" .isDateDisabled="${this.isDateDisabled}" @change="${this.handleDaySelect}"></nord-calendar><div aria-hidden="true" tabindex="0" @focus="${this.focusFirst}"></div></div></div>`}createDateFormatters(){this.dateFormatLong=new Intl.DateTimeFormat(this.localize.resolvedLang,{day:"numeric",month:"long",year:"numeric"})}focusFirst(){this.closeButton.focus()}focusLast(){this.calendar.focus({target:"day"})}setValue(e){this.value=e?f(e):"",this.dispatchEvent(new y("change"))}};O.styles=[$,D,C,I],e([l(".n-date-toggle",!0)],O.prototype,"toggleButton",void 0),e([l(".n-date-close",!0)],O.prototype,"closeButton",void 0),e([l("nord-calendar",!0)],O.prototype,"calendar",void 0),e([l('[role="dialog"]',!0)],O.prototype,"dialog",void 0),e([s()],O.prototype,"open",void 0),e([r()],O.prototype,"value",void 0),e([r()],O.prototype,"min",void 0),e([r()],O.prototype,"max",void 0),e([r()],O.prototype,"direction",void 0),e([r({attribute:"first-day-of-week",type:Number})],O.prototype,"firstDayOfWeek",void 0),e([r({attribute:!1})],O.prototype,"dateAdapter",void 0),e([r({attribute:!1})],O.prototype,"isDateDisabled",void 0),O=e([t("nord-date-picker")],O);var N=O;export{N as default};
+import{_ as e,e as t}from"./query-assigned-elements-e6cbac30.js";import{i,y as a,b as o,s as n}from"./lit-element-79bc2e0e.js";import{e as r}from"./property-03f59dce.js";import{t as s}from"./state-70f38ceb.js";import{i as l}from"./query-2d22378e.js";import{o as d}from"./class-map-cd6c8cbd.js";import{n as c}from"./ref-697b28b5.js";import{l as p}from"./if-defined-f43b1487.js";import{c as m}from"./interface-close-small-44ababc3.js";import{F as h}from"./FocusableMixin-99db12c1.js";import{F as u}from"./FormAssociatedMixin-f6e5b3cd.js";import{I as b}from"./InputMixin-158f63fb.js";import{m as v,p as g,a as f}from"./dates-a8de5b83.js";import{N as y}from"./events-731d0007.js";import{S as x,i as w}from"./Calendar-8b36a7e5.js";import{L as j}from"./LightDismissController-a2645ae6.js";import{LocalizeController as k}from"./LocalizeController.js";import"./Button.js";import z from"./Icon.js";import"./VisuallyHidden.js";import{s as $}from"./Component-49a41387.js";import{s as D}from"./FormField-72062bf1.js";import{R as F,s as C}from"./TextField-94b0839b.js";import{isoAdapter as L}from"./date-adapter.js";import{c as S}from"./cond-0a8d4554.js";import{S as A,i as E}from"./SizeMixin-4559b224.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";import"./SlotController-ea6eff46.js";import"./repeat-e7acc0bd.js";import"./tinykeys.module-84e6cc41.js";import"./DirectionController-8b298382.js";import"./number-c3ab3e95.js";import"./observe-a9c6dfb6.js";import"./month-view.js";import"./collection-800f5002.js";import"./DateSelectEvent.js";import"./ShortcutController-87615e31.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./LightDomController-9a6e398f.js";import"./Spinner.js";import"./unsafe-html-be8023cd.js";var B=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 140 140" xmlns="http://www.w3.org/2000/svg"><path d="M7 21h126v112H7zM35 7v28m70-28v28M7 63h126" stroke-width="14" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/></svg>',title:"interface-calendar",tags:"nordicon interface calendar date time day week month year"});const I=i`:host{--_n-date-picker-toggle-block-size:calc(100% - 2px);color:var(--n-color-text);position:relative}.n-date-toggle{-webkit-appearance:none;appearance:none;min-block-size:var(--_n-date-picker-toggle-block-size);border-start-end-radius:var(--n-border-radius-s);border-end-end-radius:var(--n-border-radius-s);box-shadow:var(--n-box-shadow),var(--n-box-shadow);padding:1px calc(var(--n-space-m)/ 1.5) 0;color:var(--n-color-icon);cursor:pointer;background:var(--n-color-button);position:absolute;inset-inline-end:1px;inset-block-start:1px;border:0;border-inline-start:1px solid var(--n-color-border-strong);transition:color var(--n-transition-slowly),background var(--n-transition-slowly)}@media (max-width:35.9375em){.n-date-toggle{padding-block-start:0}}.n-date-toggle:hover{color:var(--n-color-icon-hover)}.n-date-toggle:focus{border:0;box-shadow:0 0 0 2px var(--n-color-accent);outline:0}.n-date-toggle:active{opacity:.8}.n-date-toggle:disabled{box-shadow:none;background:0 0;border:0;color:var(--n-color-text-weakest);cursor:default}.n-date-toggle::after{content:"";position:absolute;background:0 0;background-image:linear-gradient(to bottom,rgba(0,0,0,0) 50%,rgba(0,0,0,.013) 100%);background-repeat:repeat-x;inline-size:100%;inset-inline:0;block-size:100%;inset-block-start:0}.n-input-container .n-input{padding-inline-end:calc(var(--n-space-xl) * 1.25)}[role=dialog]{display:flex;font-feature-settings:var(--n-font-features-reduced);opacity:0;position:absolute;inset-block-start:100%;inset-inline-start:0;transform:scale(.98) translateZ(0) translateY(-10px);transform-origin:top right;transition:transform var(--n-transition-slowly),opacity var(--n-transition-slowly),visibility var(--n-transition-slowly);visibility:hidden;will-change:transform,opacity,visibility;z-index:var(--n-index-popout)}@media (max-width:35.9375em){[role=dialog]{inset-block:0;position:fixed;inline-size:100%;inset-inline-end:0;min-inline-size:320px;transform:translateZ(0);transform-origin:bottom center}.n-date-dialog-content{box-shadow:var(--n-box-shadow-modal)}}[role=dialog].is-left{inset-inline:auto 0;inline-size:auto}[role=dialog][aria-hidden=false]{transition-property:transform,opacity;opacity:1;transform:scale(1.0001) translateZ(0) translateY(0);visibility:visible}.n-date-dialog-content{margin-inline-start:auto;margin-block-start:8px;position:relative;transform:none;z-index:var(--n-index-popout)}nord-calendar{--n-calendar-box-shadow:var(--n-box-shadow-popup)}@media (max-width:35.9375em){.n-date-dialog-content{background:var(--n-color-background);border:0;border-radius:0;border-start-start-radius:var(--n-border-radius-s);border-start-end-radius:var(--n-border-radius-s);inset-block-end:0;inset-inline-start:0;inline-size:100%;margin:0;max-inline-size:none;min-block-size:26em;opacity:0;padding:0 8% 20px;position:absolute;transform:translateZ(0) translateY(100%);transition:transform var(--n-transition-mobile),opacity var(--n-transition-mobile),visibility var(--n-transition-mobile);visibility:hidden;will-change:transform,opacity,visibility}[role=dialog][aria-hidden=false] .n-date-dialog-content{opacity:1;transform:translateZ(0) translateY(0);visibility:visible}nord-calendar{--n-calendar-box-shadow:none;--_n-calendar-padding:0;--_n-calendar-inline-size:100%}}.n-date-header{align-items:center;display:flex;justify-content:space-between;margin-block-end:16px;inline-size:100%}.n-date-mobile{align-items:center;border-block-end:1px solid rgba(0,0,0,.12);display:flex;justify-content:space-between;margin-block-end:20px;margin-inline-start:-10%;overflow:hidden;padding:12px 20px;position:relative;text-overflow:ellipsis;white-space:nowrap;inline-size:120%}@media (min-width:36em){.n-date-mobile{border:0;margin:0;overflow:visible;padding:0;position:absolute;inset-inline-end:-8px;inset-block-start:-8px;inline-size:auto}}.n-date-mobile-heading{display:inline-block;font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-active);max-inline-size:84%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width:36em){.n-date-mobile-heading{display:none}}.n-date-close{-webkit-appearance:none;align-items:center;appearance:none;background:var(--n-color-background);border:0;border-radius:var(--n-border-radius);color:var(--n-color-text);cursor:pointer;display:flex;block-size:var(--n-size-icon-l);inline-size:var(--n-size-icon-l);justify-content:center;padding:0}@media (min-width:36em){.n-date-close{opacity:0}}.n-date-close:focus{box-shadow:0 0 0 2px var(--n-color-accent);outline:0}@media (min-width:36em){.n-date-close:focus{opacity:1}}.n-date-close svg{margin:0 auto}:host([size="s"]) .n-input-container .n-input{padding-inline-end:var(--n-space-xl)}:host([size="l"]) .n-date-toggle{padding-inline-start:var(--n-space-m);padding-inline-end:var(--n-space-m)}:host([size="l"]) .n-input-container .n-input{padding-inline-end:var(--n-space-xxl)}`;z.registerIcon(B),z.registerIcon(m);const _=/[^0-9./-]+/g,M=()=>!1;let O=class extends(A(u(F(b(h(n)))))){constructor(){super(...arguments),this.dismiss=new j(this,{isOpen:()=>this.open,onDismiss:e=>this.hide("click"!==e.type),isDismissible:e=>e!==this.calendar&&e!==this.toggleButton}),this.swipe=new x(this,{target:()=>this.dialog,matchesGesture:w,onSwipeEnd:()=>this.hide(!1)}),this.localize=new k(this,{onLangChange:()=>this.createDateFormatters()}),this.open=!1,this.value="",this.min="",this.max="",this.direction="right",this.firstDayOfWeek=1,this.dateAdapter=L,this.isDateDisabled=M,this.handleDaySelect=e=>{e.stopPropagation(),this.setValue(e.date),this.hide()},this.toggleOpen=e=>{e.preventDefault(),this.open?this.hide(!1):this.show()},this.handleBlur=e=>{e.stopPropagation(),this.dispatchEvent(new y("blur"))},this.handleFocus=e=>{e.stopPropagation(),this.dispatchEvent(new y("focus"))},this.handleInputChange=e=>{const t=e.target;!function(e,t){const{value:i}=e,a=e.selectionStart,o=i.slice(0,a),n=i.slice(a,i.length),r=o.replace(t,""),s=r+n.replace(t,""),l=r.length;e.value=s,e.selectionStart=l,e.selectionEnd=l}(t,_),this.dispatchEvent(new y("input"));const i=this.dateAdapter.parse(t.value,v);(i||""===t.value)&&this.setValue(i)}}get valueAsDate(){return g(this.value)}set valueAsDate(e){this.value=e?f(e):""}get valueAsNumber(){var e,t;return null!==(t=null===(e=this.valueAsDate)||void 0===e?void 0:e.getTime())&&void 0!==t?t:NaN}set valueAsNumber(e){this.value=e?f(new Date(e)):""}show(){this.open=!0,this.dispatchEvent(new y("open")),this.updateComplete.then((()=>this.calendar.focus({target:"month"})))}hide(e=!0){this.open=!1,this.dispatchEvent(new y("close")),e&&this.toggleButton.focus()}render(){const{valueAsDate:e}=this,t=e?this.dateAdapter.format(e):"",i=E[this.size]||E.m;return a`${this.renderLabel()}<div class="n-input-container"><input class="n-input" name="${p(this.name)}" .value="${t}" placeholder="${p(this.placeholder)}" id="${this.inputId}" ?disabled="${this.disabled}" ?required="${this.required}" aria-autocomplete="none" @input="${this.handleInputChange}" @focus="${this.handleFocus}" @blur="${this.handleBlur}" autocomplete="off" ${c(this.focusableRef)} aria-invalid="${S(this.error,"true")}" aria-describedby="${p(this.getDescribedBy())}" ?readonly="${this.readonly}"> <button class="n-date-toggle" @click="${this.toggleOpen}" ?disabled="${this.disabled||this.readonly}" type="button"><nord-icon name="interface-calendar" size="${i}"></nord-icon><nord-visually-hidden>${this.localize.term("buttonLabel")} ${e?a`<span>, ${this.localize.term("selectedDateMessage")} ${this.dateFormatLong.format(e)}</span>`:o}</nord-visually-hidden></button></div>${this.renderError()}<div class="${d({"is-left":"left"===this.direction,"is-active":this.open})}" role="dialog" aria-modal="true" aria-hidden="${this.open?"false":"true"}" aria-labelledby="dialog-header"><div class="n-date-dialog-content"><div aria-hidden="true" tabindex="0" @focus="${this.focusLast}"></div><div class="n-date-mobile"><div class="n-date-mobile-heading" id="dialog-header">${this.localize.term("modalHeading")}</div><button class="n-date-close" @click="${this.hide}" type="button"><nord-icon color="var(--n-color-icon)" name="interface-close-small" size="xs"></nord-icon><nord-visually-hidden>${this.localize.term("closeLabel")}</nord-visually-hidden></button></div><nord-calendar value="${this.value}" min="${this.min}" max="${this.max}" .firstDayOfWeek="${this.firstDayOfWeek}" .isDateDisabled="${this.isDateDisabled}" @change="${this.handleDaySelect}"></nord-calendar><div aria-hidden="true" tabindex="0" @focus="${this.focusFirst}"></div></div></div>`}createDateFormatters(){this.dateFormatLong=new Intl.DateTimeFormat(this.localize.resolvedLang,{day:"numeric",month:"long",year:"numeric"})}focusFirst(){this.closeButton.focus()}focusLast(){this.calendar.focus({target:"day"})}setValue(e){this.value=e?f(e):"",this.dispatchEvent(new y("change"))}};O.styles=[$,D,C,I],e([l(".n-date-toggle",!0)],O.prototype,"toggleButton",void 0),e([l(".n-date-close",!0)],O.prototype,"closeButton",void 0),e([l("nord-calendar",!0)],O.prototype,"calendar",void 0),e([l('[role="dialog"]',!0)],O.prototype,"dialog",void 0),e([s()],O.prototype,"open",void 0),e([r()],O.prototype,"value",void 0),e([r()],O.prototype,"min",void 0),e([r()],O.prototype,"max",void 0),e([r()],O.prototype,"direction",void 0),e([r({attribute:"first-day-of-week",type:Number})],O.prototype,"firstDayOfWeek",void 0),e([r({attribute:!1})],O.prototype,"dateAdapter",void 0),e([r({attribute:!1})],O.prototype,"isDateDisabled",void 0),O=e([t("nord-date-picker")],O);var N=O;export{N as default};
 //# sourceMappingURL=DatePicker.js.map

package/lib/DatePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePicker.js","sources":["../../icons/lib/assets/interface-calendar.js","../src/date-picker/DatePicker.ts","../src/common/input.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 21h126v112H7zM35 7v28m70-28v28M7 63h126\" stroke-width=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>'\nexport const title = \"interface-calendar\"\nexport const tags = \"nordicon interface calendar date time day week month year\"\n","import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property, query, state } from \"lit/decorators.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport { ref } from \"lit/directives/ref.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport * as calendarIcon from \"@nordhealth/icons/lib/assets/interface-calendar.js\"\nimport * as closeIcon from \"@nordhealth/icons/lib/assets/interface-close-small.js\"\n\nimport { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { FormAssociatedMixin } from \"../common/mixins/FormAssociatedMixin.js\"\nimport { InputMixin } from \"../common/mixins/InputMixin.js\"\n\nimport { createDate, DaysOfWeek, parseISODate, printISODate } from \"../common/dates.js\"\nimport { NordEvent } from \"../common/events.js\"\nimport { cleanValue } from \"../common/input.js\"\nimport { isDownwardsSwipe, SwipeController } from \"../common/controllers/SwipeController.js\"\nimport { LightDismissController } from \"../common/controllers/LightDismissController.js\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\n\nimport \"../button/Button.js\"\nimport type Button from \"../button/Button.js\"\nimport Icon from \"../icon/Icon.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\n\nimport \"../calendar/Calendar.js\"\nimport { DateSelectEvent } from \"../calendar/DateSelectEvent.js\"\nimport type Calendar from \"../calendar/Calendar.js\"\nimport type { DateDisabledPredicate } from \"../calendar/Calendar.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport textFieldStyle from \"../common/styles/TextField.css\"\nimport style from \"./DatePicker.css\"\n\nimport { DateAdapter, isoAdapter } from \"./date-adapter.js\"\nimport { cond } from \"../common/directives/cond.js\"\nimport { ReadonlyMixin } from \"../common/mixins/ReadonlyMixin.js\"\nimport { SizeMixin, iconSizeMap } from \"../common/mixins/SizeMixin.js\"\n\nIcon.registerIcon(calendarIcon)\nIcon.registerIcon(closeIcon)\n\nconst DISALLOWED_CHARACTERS = /[^0-9./-]+/g\nconst isDateDisabled = () => false\n\n/*\n \n * Date Picker allows user to enter a date either through text input,\n * or by choosing a date from the calendar. Please note that the date\n * must be passed in ISO-8601 format: YYYY-MM-DD.\n \n @status ready\n * @category form\n /\n@customElement(\"nord-date-picker\")\nexport default class DatePicker extends SizeMixin(\n FormAssociatedMixin(ReadonlyMixin(InputMixin(FocusableMixin(LitElement))))\n) {\n static styles = [componentStyle, formFieldStyle, textFieldStyle, style]\n\n @query(`.n-date-toggle`, true) private toggleButton!: Button\n @query(`.n-date-close`, true) private closeButton!: HTMLButtonElement\n @query(`nord-calendar`, true) private calendar!: Calendar\n @query(`[role=\"dialog\"]`, true) private dialog!: HTMLElement\n\n private dismiss = new LightDismissController(this, {\n isOpen: () => this.open,\n onDismiss: e => this.hide(e.type !== \"click\"),\n isDismissible: node => node !== this.calendar && node !== this.toggleButton,\n })\n\n private swipe = new SwipeController(this, {\n target: () => this.dialog,\n matchesGesture: isDownwardsSwipe,\n onSwipeEnd: () => this.hide(false),\n })\n\n private localize = new LocalizeController<\"nord-date-picker\">(this, {\n onLangChange: () => this.createDateFormatters(),\n })\n\n /\n Whilst dateAdapter is used for handling the formatting/parsing dates in the input,\n * these are used to format dates exclusively for the benefit of screen readers.\n \n We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n * better performance when formatting large number of dates. See:\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n /\n private dateFormatLong!: Intl.DateTimeFormat\n\n @state() private open = false\n\n /\n Date value. Must be in IS0-8601 format: YYYY-MM-DD.\n /\n @property() value: string = \"\"\n\n get valueAsDate(): Date \| undefined {\n return parseISODate(this.value)\n }\n\n /\n Get/set the value of the picker as a Date object.\n /\n set valueAsDate(date: Date \| undefined) {\n this.value = date ? printISODate(date) : \"\"\n }\n\n get valueAsNumber(): number {\n return this.valueAsDate?.getTime() ?? NaN\n }\n\n /\n Get/set the value of the picker as the number of milliseconds elapsed since the UNIX epoch.\n /\n set valueAsNumber(date: number) {\n this.value = date ? printISODate(new Date(date)) : \"\"\n }\n\n /\n Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n /\n @property() min: string = \"\"\n\n /\n Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n /\n @property() max: string = \"\"\n\n /\n Forces the opening direction of the calendar modal to be always left or right.\n * This setting can be useful when the input is smaller than the opening date picker\n * would be as by default the picker always opens towards right.\n /\n @property() direction: \"left\" \| \"right\" = \"right\"\n\n /\n Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday.\n /\n @property({ attribute: \"first-day-of-week\", type: Number }) firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n\n /\n Date adapter, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n * Default is IS0-8601 parsing and formatting.\n /\n @property({ attribute: false }) dateAdapter: DateAdapter = isoAdapter\n\n /\n Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n /\n @property({ attribute: false }) isDateDisabled: DateDisabledPredicate = isDateDisabled\n\n /\n Show the calendar modal, moving focus to the calendar inside.\n /\n show() {\n this.open = true\n /\n Dispatched when the calendar is toggled open.\n /\n this.dispatchEvent(new NordEvent(\"open\"))\n\n // we should only focus once the calendar is visible after render is complete\n this.updateComplete.then(() => this.calendar.focus({ target: \"month\" }))\n }\n\n /\n Hide the calendar modal.\n * @param {boolean} moveFocusToButton controls whether focus should be returned to the date picker's button.\n /\n hide(moveFocusToButton = true) {\n this.open = false\n /\n Dispatched when the calendar is closed.\n */\n this.dispatchEvent(new NordEvent(\"close\"))\n\n if (moveFocusToButton) {\n this.toggleButton.focus()\n }\n }\n\n render() {\n const { valueAsDate } = this\n const formattedDate = valueAsDate ? this.dateAdapter.format(valueAsDate) : \"\"\n const iconSize = iconSizeMap[this.size] \|\| iconSizeMap.m\n\n return html`\n ${this.renderLabel()}\n\n <div class=\"n-input-container\">\n <input\n class=\"n-input\"\n name=${ifDefined(this.name)}\n .value=${formattedDate}\n placeholder=${ifDefined(this.placeholder)}\n id=${this.inputId}\n ?disabled=${this.disabled}\n ?required=${this.required}\n aria-autocomplete=\"none\"\n @input=${this.handleInputChange}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n autocomplete=\"off\"\n ${ref(this.focusableRef)}\n aria-invalid=${cond(this.error, \"true\")}\n aria-describedby=${ifDefined(this.getDescribedBy())}\n ?readonly=${this.readonly}\n />\n <button\n class=\"n-date-toggle\"\n @click=${this.toggleOpen}\n ?disabled=${this.disabled \|\| this.readonly}\n type=\"button\"\n >\n <nord-icon name=\"interface-calendar\" size=${iconSize}></nord-icon>\n <nord-visually-hidden>\n ${this.localize.term(\"buttonLabel\")}\n ${valueAsDate\n ? html`\n <span>\n , ${this.localize.term(\"selectedDateMessage\")} ${this.dateFormatLong.format(valueAsDate)}\n </span>\n `\n : nothing}\n </nord-visually-hidden>\n </button>\n </div>\n\n ${this.renderError()}\n\n <div\n class=${classMap({\n \"is-left\": this.direction === \"left\",\n \"is-active\": this.open,\n })}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden=${this.open ? \"false\" : \"true\"}\n aria-labelledby=\"dialog-header\"\n >\n <div class=\"n-date-dialog-content\">\n <div aria-hidden=\"true\" tabindex=\"0\" @focus=${this.focusLast}></div>\n\n <div class=\"n-date-mobile\">\n <div class=\"n-date-mobile-heading\" id=\"dialog-header\">${this.localize.term(\"modalHeading\")}</div>\n <button class=\"n-date-close\" @click=${this.hide} type=\"button\">\n <nord-icon color=\"var(--n-color-icon)\" name=\"interface-close-small\" size=\"xs\"></nord-icon>\n <nord-visually-hidden>${this.localize.term(\"closeLabel\")}</nord-visually-hidden>\n </button>\n </div>\n <nord-calendar\n value=${this.value}\n min=${this.min}\n max=${this.max}\n .firstDayOfWeek=${this.firstDayOfWeek}\n .isDateDisabled=${this.isDateDisabled}\n @change=${this.handleDaySelect}\n ></nord-calendar>\n\n <div aria-hidden=\"true\" tabindex=\"0\" @focus=${this.focusFirst}></div>\n </div>\n </div>\n `\n }\n\n private createDateFormatters() {\n this.dateFormatLong = new Intl.DateTimeFormat(this.localize.resolvedLang, {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n })\n }\n\n private focusFirst() {\n this.closeButton.focus()\n }\n\n private focusLast() {\n this.calendar.focus({ target: \"day\" })\n }\n\n private handleDaySelect = (e: DateSelectEvent) => {\n e.stopPropagation()\n this.setValue(e.date)\n this.hide()\n }\n\n private toggleOpen = (e: Event) => {\n e.preventDefault()\n\n if (this.open) {\n this.hide(false)\n } else {\n this.show()\n }\n }\n\n private handleBlur = (event: Event) => {\n event.stopPropagation()\n this.dispatchEvent(new NordEvent(\"blur\"))\n }\n\n private handleFocus = (event: Event) => {\n event.stopPropagation()\n this.dispatchEvent(new NordEvent(\"focus\"))\n }\n\n private handleInputChange = (e: Event) => {\n const target = e.target as HTMLInputElement\n\n // clean up any invalid characters\n cleanValue(target, DISALLOWED_CHARACTERS)\n this.dispatchEvent(new NordEvent(\"input\"))\n\n const parsed = this.dateAdapter.parse(target.value, createDate)\n if (parsed \|\| target.value === \"\") {\n this.setValue(parsed)\n }\n }\n\n private setValue(date?: Date) {\n this.value = date ? printISODate(date) : \"\"\n this.dispatchEvent(new NordEvent(\"change\"))\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-date-picker\": DatePicker\n }\n}\n","export function cleanValue(inputEl: HTMLInputElement, regex: RegExp): string {\n const { value } = inputEl\n const cursor = inputEl.selectionStart as number\n\n const beforeCursor = value.slice(0, cursor)\n const afterCursor = value.slice(cursor, value.length)\n\n const filteredBeforeCursor = beforeCursor.replace(regex, \"\")\n const filterAfterCursor = afterCursor.replace(regex, \"\")\n\n const newValue = filteredBeforeCursor + filterAfterCursor\n const newCursor = filteredBeforeCursor.length\n\n inputEl.value = newValue\n inputEl.selectionStart = newCursor\n inputEl.selectionEnd = newCursor\n\n return newValue\n}\n"],"names":["Icon","registerIcon","calendarIcon","closeIcon","DISALLOWED_CHARACTERS","isDateDisabled","DatePicker","SizeMixin","FormAssociatedMixin","ReadonlyMixin","InputMixin","FocusableMixin","LitElement","constructor","this","dismiss","LightDismissController","isOpen","open","onDismiss","e","hide","type","isDismissible","node","calendar","toggleButton","swipe","SwipeController","target","dialog","matchesGesture","isDownwardsSwipe","onSwipeEnd","localize","LocalizeController","onLangChange","createDateFormatters","value","min","max","direction","firstDayOfWeek","dateAdapter","isoAdapter","handleDaySelect","stopPropagation","setValue","date","toggleOpen","preventDefault","show","handleBlur","event","dispatchEvent","NordEvent","handleFocus","handleInputChange","inputEl","regex","cursor","selectionStart","beforeCursor","slice","afterCursor","length","filteredBeforeCursor","replace","newValue","newCursor","selectionEnd","cleanValue","parsed","parse","createDate","valueAsDate","parseISODate","printISODate","valueAsNumber","_b","_a","getTime","NaN","Date","updateComplete","then","focus","moveFocusToButton","render","formattedDate","format","iconSize","iconSizeMap","size","m","html","renderLabel","ifDefined","name","placeholder","inputId","disabled","required","ref","focusableRef","cond","error","getDescribedBy","readonly","term","dateFormatLong","nothing","renderError","classMap","focusLast","focusFirst","Intl","DateTimeFormat","resolvedLang","day","month","year","closeButton","styles","componentStyle","formFieldStyle","textFieldStyle","style","__decorate","query","prototype","state","property","attribute","Number","customElement"],"mappings":"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"}
1	+ {"version":3,"file":"DatePicker.js","sources":["../../icons/lib/assets/interface-calendar.js","../src/date-picker/DatePicker.ts","../src/common/input.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 140 140\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M7 21h126v112H7zM35 7v28m70-28v28M7 63h126\" stroke-width=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>'\nexport const title = \"interface-calendar\"\nexport const tags = \"nordicon interface calendar date time day week month year\"\n","import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property, query, state } from \"lit/decorators.js\"\nimport { classMap } from \"lit/directives/class-map.js\"\nimport { ref } from \"lit/directives/ref.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport * as calendarIcon from \"@nordhealth/icons/lib/assets/interface-calendar.js\"\nimport * as closeIcon from \"@nordhealth/icons/lib/assets/interface-close-small.js\"\n\nimport { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { FormAssociatedMixin } from \"../common/mixins/FormAssociatedMixin.js\"\nimport { InputMixin } from \"../common/mixins/InputMixin.js\"\n\nimport { createDate, DaysOfWeek, parseISODate, printISODate } from \"../common/dates.js\"\nimport { NordEvent } from \"../common/events.js\"\nimport { cleanValue } from \"../common/input.js\"\nimport { isDownwardsSwipe, SwipeController } from \"../common/controllers/SwipeController.js\"\nimport { LightDismissController } from \"../common/controllers/LightDismissController.js\"\nimport { LocalizeController } from \"../localization/LocalizeController.js\"\n\nimport \"../button/Button.js\"\nimport type Button from \"../button/Button.js\"\nimport Icon from \"../icon/Icon.js\"\nimport \"../visually-hidden/VisuallyHidden.js\"\n\nimport \"../calendar/Calendar.js\"\nimport { DateSelectEvent } from \"../calendar/DateSelectEvent.js\"\nimport type Calendar from \"../calendar/Calendar.js\"\nimport type { DateDisabledPredicate } from \"../calendar/Calendar.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport textFieldStyle from \"../common/styles/TextField.css\"\nimport style from \"./DatePicker.css\"\n\nimport { DateAdapter, isoAdapter } from \"./date-adapter.js\"\nimport { cond } from \"../common/directives/cond.js\"\nimport { ReadonlyMixin } from \"../common/mixins/ReadonlyMixin.js\"\nimport { SizeMixin, iconSizeMap } from \"../common/mixins/SizeMixin.js\"\n\nIcon.registerIcon(calendarIcon)\nIcon.registerIcon(closeIcon)\n\nconst DISALLOWED_CHARACTERS = /[^0-9./-]+/g\nconst isDateDisabled = () => false\n\n/*\n \n * Date Picker allows user to enter a date either through text input,\n * or by choosing a date from the calendar. Please note that the date\n * must be passed in ISO-8601 format: YYYY-MM-DD.\n \n @status ready\n * @category form\n /\n@customElement(\"nord-date-picker\")\nexport default class DatePicker extends SizeMixin(\n FormAssociatedMixin(ReadonlyMixin(InputMixin(FocusableMixin(LitElement))))\n) {\n static styles = [componentStyle, formFieldStyle, textFieldStyle, style]\n\n @query(`.n-date-toggle`, true) private toggleButton!: Button\n @query(`.n-date-close`, true) private closeButton!: HTMLButtonElement\n @query(`nord-calendar`, true) private calendar!: Calendar\n @query(`[role=\"dialog\"]`, true) private dialog!: HTMLElement\n\n private dismiss = new LightDismissController(this, {\n isOpen: () => this.open,\n onDismiss: e => this.hide(e.type !== \"click\"),\n isDismissible: node => node !== this.calendar && node !== this.toggleButton,\n })\n\n private swipe = new SwipeController(this, {\n target: () => this.dialog,\n matchesGesture: isDownwardsSwipe,\n onSwipeEnd: () => this.hide(false),\n })\n\n private localize = new LocalizeController<\"nord-date-picker\">(this, {\n onLangChange: () => this.createDateFormatters(),\n })\n\n /\n Whilst dateAdapter is used for handling the formatting/parsing dates in the input,\n * these are used to format dates exclusively for the benefit of screen readers.\n \n We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n * better performance when formatting large number of dates. See:\n * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n /\n private dateFormatLong!: Intl.DateTimeFormat\n\n @state() private open = false\n\n /\n Date value. Must be in IS0-8601 format: YYYY-MM-DD.\n /\n @property() value: string = \"\"\n\n get valueAsDate(): Date \| undefined {\n return parseISODate(this.value)\n }\n\n /\n Get/set the value of the picker as a Date object.\n /\n set valueAsDate(date: Date \| undefined) {\n this.value = date ? printISODate(date) : \"\"\n }\n\n get valueAsNumber(): number {\n return this.valueAsDate?.getTime() ?? NaN\n }\n\n /\n Get/set the value of the picker as the number of milliseconds elapsed since the UNIX epoch.\n /\n set valueAsNumber(date: number) {\n this.value = date ? printISODate(new Date(date)) : \"\"\n }\n\n /\n Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the max property.\n /\n @property() min: string = \"\"\n\n /\n Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n * This setting can be used alone or together with the min property.\n /\n @property() max: string = \"\"\n\n /\n Forces the opening direction of the calendar modal to be always left or right.\n * This setting can be useful when the input is smaller than the opening date picker\n * would be as by default the picker always opens towards right.\n /\n @property() direction: \"left\" \| \"right\" = \"right\"\n\n /\n Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n * Default is Monday.\n /\n @property({ attribute: \"first-day-of-week\", type: Number }) firstDayOfWeek: DaysOfWeek = DaysOfWeek.Monday\n\n /\n Date adapter, for custom parsing/formatting.\n * Must be object with a `parse` function which accepts a `string` and returns a `Date`,\n * and a `format` function which accepts a `Date` and returns a `string`.\n * Default is IS0-8601 parsing and formatting.\n /\n @property({ attribute: false }) dateAdapter: DateAdapter = isoAdapter\n\n /\n Controls which days are disabled and therefore disallowed.\n * For example, this can be used to disallow selection of weekends.\n /\n @property({ attribute: false }) isDateDisabled: DateDisabledPredicate = isDateDisabled\n\n /\n Show the calendar modal, moving focus to the calendar inside.\n /\n show() {\n this.open = true\n /\n Dispatched when the calendar is toggled open.\n /\n this.dispatchEvent(new NordEvent(\"open\"))\n\n // we should only focus once the calendar is visible after render is complete\n this.updateComplete.then(() => this.calendar.focus({ target: \"month\" }))\n }\n\n /\n Hide the calendar modal.\n * @param {boolean} moveFocusToButton controls whether focus should be returned to the date picker's button.\n /\n hide(moveFocusToButton = true) {\n this.open = false\n /\n Dispatched when the calendar is closed.\n */\n this.dispatchEvent(new NordEvent(\"close\"))\n\n if (moveFocusToButton) {\n this.toggleButton.focus()\n }\n }\n\n render() {\n const { valueAsDate } = this\n const formattedDate = valueAsDate ? this.dateAdapter.format(valueAsDate) : \"\"\n const iconSize = iconSizeMap[this.size] \|\| iconSizeMap.m\n\n return html`\n ${this.renderLabel()}\n\n <div class=\"n-input-container\">\n <input\n class=\"n-input\"\n name=${ifDefined(this.name)}\n .value=${formattedDate}\n placeholder=${ifDefined(this.placeholder)}\n id=${this.inputId}\n ?disabled=${this.disabled}\n ?required=${this.required}\n aria-autocomplete=\"none\"\n @input=${this.handleInputChange}\n @focus=${this.handleFocus}\n @blur=${this.handleBlur}\n autocomplete=\"off\"\n ${ref(this.focusableRef)}\n aria-invalid=${cond(this.error, \"true\")}\n aria-describedby=${ifDefined(this.getDescribedBy())}\n ?readonly=${this.readonly}\n />\n <button\n class=\"n-date-toggle\"\n @click=${this.toggleOpen}\n ?disabled=${this.disabled \|\| this.readonly}\n type=\"button\"\n >\n <nord-icon name=\"interface-calendar\" size=${iconSize}></nord-icon>\n <nord-visually-hidden>\n ${this.localize.term(\"buttonLabel\")}\n ${valueAsDate\n ? html`\n <span>\n , ${this.localize.term(\"selectedDateMessage\")} ${this.dateFormatLong.format(valueAsDate)}\n </span>\n `\n : nothing}\n </nord-visually-hidden>\n </button>\n </div>\n\n ${this.renderError()}\n\n <div\n class=${classMap({\n \"is-left\": this.direction === \"left\",\n \"is-active\": this.open,\n })}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-hidden=${this.open ? \"false\" : \"true\"}\n aria-labelledby=\"dialog-header\"\n >\n <div class=\"n-date-dialog-content\">\n <div aria-hidden=\"true\" tabindex=\"0\" @focus=${this.focusLast}></div>\n\n <div class=\"n-date-mobile\">\n <div class=\"n-date-mobile-heading\" id=\"dialog-header\">${this.localize.term(\"modalHeading\")}</div>\n <button class=\"n-date-close\" @click=${this.hide} type=\"button\">\n <nord-icon color=\"var(--n-color-icon)\" name=\"interface-close-small\" size=\"xs\"></nord-icon>\n <nord-visually-hidden>${this.localize.term(\"closeLabel\")}</nord-visually-hidden>\n </button>\n </div>\n <nord-calendar\n value=${this.value}\n min=${this.min}\n max=${this.max}\n .firstDayOfWeek=${this.firstDayOfWeek}\n .isDateDisabled=${this.isDateDisabled}\n @change=${this.handleDaySelect}\n ></nord-calendar>\n\n <div aria-hidden=\"true\" tabindex=\"0\" @focus=${this.focusFirst}></div>\n </div>\n </div>\n `\n }\n\n private createDateFormatters() {\n this.dateFormatLong = new Intl.DateTimeFormat(this.localize.resolvedLang, {\n day: \"numeric\",\n month: \"long\",\n year: \"numeric\",\n })\n }\n\n private focusFirst() {\n this.closeButton.focus()\n }\n\n private focusLast() {\n this.calendar.focus({ target: \"day\" })\n }\n\n private handleDaySelect = (e: DateSelectEvent) => {\n e.stopPropagation()\n this.setValue(e.date)\n this.hide()\n }\n\n private toggleOpen = (e: Event) => {\n e.preventDefault()\n\n if (this.open) {\n this.hide(false)\n } else {\n this.show()\n }\n }\n\n private handleBlur = (event: Event) => {\n event.stopPropagation()\n this.dispatchEvent(new NordEvent(\"blur\"))\n }\n\n private handleFocus = (event: Event) => {\n event.stopPropagation()\n this.dispatchEvent(new NordEvent(\"focus\"))\n }\n\n private handleInputChange = (e: Event) => {\n const target = e.target as HTMLInputElement\n\n // clean up any invalid characters\n cleanValue(target, DISALLOWED_CHARACTERS)\n this.dispatchEvent(new NordEvent(\"input\"))\n\n const parsed = this.dateAdapter.parse(target.value, createDate)\n if (parsed \|\| target.value === \"\") {\n this.setValue(parsed)\n }\n }\n\n private setValue(date?: Date) {\n this.value = date ? printISODate(date) : \"\"\n this.dispatchEvent(new NordEvent(\"change\"))\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-date-picker\": DatePicker\n }\n}\n","export function cleanValue(inputEl: HTMLInputElement, regex: RegExp): string {\n const { value } = inputEl\n const cursor = inputEl.selectionStart as number\n\n const beforeCursor = value.slice(0, cursor)\n const afterCursor = value.slice(cursor, value.length)\n\n const filteredBeforeCursor = beforeCursor.replace(regex, \"\")\n const filterAfterCursor = afterCursor.replace(regex, \"\")\n\n const newValue = filteredBeforeCursor + filterAfterCursor\n const newCursor = filteredBeforeCursor.length\n\n inputEl.value = newValue\n inputEl.selectionStart = newCursor\n inputEl.selectionEnd = newCursor\n\n return newValue\n}\n"],"names":["Icon","registerIcon","calendarIcon","closeIcon","DISALLOWED_CHARACTERS","isDateDisabled","DatePicker","SizeMixin","FormAssociatedMixin","ReadonlyMixin","InputMixin","FocusableMixin","LitElement","constructor","this","dismiss","LightDismissController","isOpen","open","onDismiss","e","hide","type","isDismissible","node","calendar","toggleButton","swipe","SwipeController","target","dialog","matchesGesture","isDownwardsSwipe","onSwipeEnd","localize","LocalizeController","onLangChange","createDateFormatters","value","min","max","direction","firstDayOfWeek","dateAdapter","isoAdapter","handleDaySelect","stopPropagation","setValue","date","toggleOpen","preventDefault","show","handleBlur","event","dispatchEvent","NordEvent","handleFocus","handleInputChange","inputEl","regex","cursor","selectionStart","beforeCursor","slice","afterCursor","length","filteredBeforeCursor","replace","newValue","newCursor","selectionEnd","cleanValue","parsed","parse","createDate","valueAsDate","parseISODate","printISODate","valueAsNumber","_b","_a","getTime","NaN","Date","updateComplete","then","focus","moveFocusToButton","render","formattedDate","format","iconSize","iconSizeMap","size","m","html","renderLabel","ifDefined","name","placeholder","inputId","disabled","required","ref","focusableRef","cond","error","getDescribedBy","readonly","term","dateFormatLong","nothing","renderError","classMap","focusLast","focusFirst","Intl","DateTimeFormat","resolvedLang","day","month","year","closeButton","styles","componentStyle","formFieldStyle","textFieldStyle","style","__decorate","query","prototype","state","property","attribute","Number","customElement"],"mappings":"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"}

package/lib/Icon.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{_ as e,e as s}from"./query-assigned-elements-e6cbac30.js";import{i,s as o,y as t}from"./lit-element-79bc2e0e.js";import{e as r}from"./property-03f59dce.js";import{t as n}from"./state-70f38ceb.js";import{l as a}from"./if-defined-f43b1487.js";import{o as c}from"./unsafe-html-be8023cd.js";import{o as l}from"./observe-a9c6dfb6.js";import{c as d}from"./cond-0a8d4554.js";import{s as h}from"./Component-49a41387.js";import"./directive-de55b00a.js";const m=i`:host{--_n-icon-size:var(--n-size-icon-m);display:inline-block;block-size:var(--_n-icon-size);inline-size:var(--_n-icon-size);min-inline-size:var(--_n-icon-size)}:host([size=xs]){--_n-icon-size:var(--n-size-icon-xs)}:host([size="s"]){--_n-icon-size:var(--n-size-icon-s)}: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 p;let v=p=class extends o{constructor(){super(...arguments),this.name="",this.size="m",this.svg=""}static registerResolver(e){p.resolver=e}static registerIcon(e,s){let i,o;if("string"==typeof e?(i=e,o=s):(i=e.title,o=e.default),!i)throw new Error("name is required when registering an icon");if(!o)throw new Error("icon must not be empty");p.registeredIcons.has(i)||p.registeredIcons.set(i,o)}render(){return t`<div role="${d(this.label,"img")}" style="${d(this.color,`color:${this.color}`)}" aria-label="${a(this.label)}"><slot aria-hidden="true"></slot><div aria-hidden="true">${c(this.svg)}</div></div>`}handleNameChange(){this.name?p.registeredIcons.has(this.name)?this.svg=p.registeredIcons.get(this.name):p.resolver(this.name).then((e=>{this.svg=e})).catch((()=>{this.svg=""})):this.svg=""}};v.styles=[h,m],v.resolver=e=>fetch(`https://nordcdn.net/ds/icons/1.7.0/assets/${e}.svg`).then((s=>{if(!s.ok)throw new TypeError(`NORD: unknown icon '${e}'`);return s.text()})),v.registeredIcons=new Map,e([r({reflect:!0})],v.prototype,"name",void 0),e([r({reflect:!0})],v.prototype,"size",void 0),e([r({reflect:!0})],v.prototype,"color",void 0),e([r({reflect:!0})],v.prototype,"label",void 0),e([n()],v.prototype,"svg",void 0),e([l("name")],v.prototype,"handleNameChange",null),v=p=e([s("nord-icon")],v);var f=v;export{f as default};
+import{_ as e,e as s}from"./query-assigned-elements-e6cbac30.js";import{i,s as o,y as t}from"./lit-element-79bc2e0e.js";import{e as r}from"./property-03f59dce.js";import{t as n}from"./state-70f38ceb.js";import{l as a}from"./if-defined-f43b1487.js";import{o as c}from"./unsafe-html-be8023cd.js";import{o as l}from"./observe-a9c6dfb6.js";import{c as d}from"./cond-0a8d4554.js";import{s as h}from"./Component-49a41387.js";import"./directive-de55b00a.js";const m=i`:host{--_n-icon-size:var(--n-size-icon-m);display:inline-block;block-size:var(--_n-icon-size);inline-size:var(--_n-icon-size);min-inline-size:var(--_n-icon-size)}:host([size=xxs]){--_n-icon-size:var(--n-size-icon-xxs)}:host([size=xs]){--_n-icon-size:var(--n-size-icon-xs)}:host([size="s"]){--_n-icon-size:var(--n-size-icon-s)}: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 v;let p=v=class extends o{constructor(){super(...arguments),this.name="",this.size="m",this.svg=""}static registerResolver(e){v.resolver=e}static registerIcon(e,s){let i,o;if("string"==typeof e?(i=e,o=s):(i=e.title,o=e.default),!i)throw new Error("name is required when registering an icon");if(!o)throw new Error("icon must not be empty");v.registeredIcons.has(i)||v.registeredIcons.set(i,o)}render(){return t`<div role="${d(this.label,"img")}" style="${d(this.color,`color:${this.color}`)}" aria-label="${a(this.label)}"><slot aria-hidden="true"></slot><div aria-hidden="true">${c(this.svg)}</div></div>`}handleNameChange(){this.name?v.registeredIcons.has(this.name)?this.svg=v.registeredIcons.get(this.name):v.resolver(this.name).then((e=>{this.svg=e})).catch((()=>{this.svg=""})):this.svg=""}};p.styles=[h,m],p.resolver=e=>fetch(`https://nordcdn.net/ds/icons/1.7.0/assets/${e}.svg`).then((s=>{if(!s.ok)throw new TypeError(`NORD: unknown icon '${e}'`);return s.text()})),p.registeredIcons=new Map,e([r({reflect:!0})],p.prototype,"name",void 0),e([r({reflect:!0})],p.prototype,"size",void 0),e([r({reflect:!0})],p.prototype,"color",void 0),e([r({reflect:!0})],p.prototype,"label",void 0),e([n()],p.prototype,"svg",void 0),e([l("name")],p.prototype,"handleNameChange",null),p=v=e([s("nord-icon")],p);var z=p;export{z as default};
 //# sourceMappingURL=Icon.js.map

package/lib/Icon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Icon.js","sources":["../src/icon/Icon.ts"],"sourcesContent":["import { html, LitElement } from \"lit\"\nimport { customElement, property, state } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { unsafeHTML } from \"lit/directives/unsafe-html.js\"\nimport { observe } from \"../common/decorators/observe.js\"\nimport { cond } from \"../common/directives/cond.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Icon.css\"\n\nexport type IconResolver = (iconName: string) => Promise<string>\n\n// in dev we should just load from node_modules\nconst loadIcon: IconResolver = (name: string) =>\n import(`@nordhealth/icons/lib/assets/${name}.js`).then(({ default: svg }) => svg)\n\n// in prod we should load from the CDN, as a sensible default\nconst loadIconCdn: IconResolver = (name: string) =>\n fetch(`https://nordcdn.net/ds/icons/${process.env.ICON_VERSION}/assets/${name}.svg`).then(response => {\n if (!response.ok) {\n throw new TypeError(`NORD: unknown icon '${name}'`)\n }\n\n return response.text()\n })\n\n/*\n Icons are used to provide additional meaning or in places where text label doesn’t fit.\n * Icon component allows you to display an icon from the Nordicons library.\n \n @status ready\n * @category image\n * @slot - The default slot used for placing a custom SVG icon.\n /\n@customElement(\"nord-icon\")\nexport default class Icon extends LitElement {\n static styles = [componentStyle, style]\n\n private static resolver: IconResolver = process.env.NODE_ENV === \"development\" ? loadIcon : loadIconCdn\n private static registeredIcons = new Map<string, string>()\n\n /\n Register a custom icon resolver, which accepts the icon name as an parameter, and returns an SVG string.\n * Can return a string synchronously, or a promise of a string.\n * By default, will load icons from the Nord CDN.\n * @param resolver The resolver function to register.\n /\n static registerResolver(resolver: IconResolver) {\n Icon.resolver = resolver\n }\n\n /\n Register an individual icon so it can be rendered synchronously, to avoid loading over the network.\n * @param icon An object representing the icon to be registered, where \"title\" is the icon's name, and \"default\" is the SVG string.\n * This is intended to be used in cases where you import an icon's entire ES module and register it directly.\n /\n static registerIcon(icon: { title: string; default: string }): void\n\n /\n Register an individual icon so it can be rendered synchronously, to avoid loading over the network.\n * @param name The name of the icon to be registered.\n * @param icon The SVG string for the icon.\n /\n static registerIcon(name: string, icon: string): void\n\n /\n Register an individual icon so it can be rendered synchronously, to avoid loading over the network.\n * @param iconOrName The name of the icon to be registered or an object representing the icon to be registered, where \"title\" is the icon's name, and \"default\" is the SVG string.\n * @param icon The SVG string for the icon.\n /\n static registerIcon(iconOrName: string \| { title: string; default: string }, icon?: string) {\n let name: string \| undefined\n let svg: string \| undefined\n\n if (typeof iconOrName === \"string\") {\n name = iconOrName\n svg = icon\n } else {\n name = iconOrName.title\n svg = iconOrName.default\n }\n\n // handle errors\n if (!name) {\n throw new Error(\"name is required when registering an icon\")\n }\n if (!svg) {\n throw new Error(\"icon must not be empty\")\n }\n\n if (!Icon.registeredIcons.has(name)) {\n Icon.registeredIcons.set(name, svg)\n }\n }\n\n /\n The name of the icon to display, as defined by [nordicons](/nordicons/).\n /\n @property({ reflect: true }) name: string = \"\"\n\n /\n The size of the icon.\n /\n @property({ reflect: true }) size: \"xs\" \| \"s\" \| \"m\" \| \"l\" \| \"xl\" \| \"xxl\" = \"m\"\n\n /\n The color of the icon.\n * Can accept any valid CSS color value, including custom properties.\n /\n @property({ reflect: true }) color?: string\n\n /\n An accessible label for the icon.\n * If no label is supplied, the icon is hidden from assistive technology.\n */\n @property({ reflect: true }) label?: string\n\n @state() private svg: string = \"\"\n\n render() {\n // if a label is supplied, we give the div a role of img.\n // without this we could not use aria-label, since it is only valid on elements of certain roles.\n // we always hide the inner svg, since the svg does not have any text/title/label itself.\n return html`\n <div\n role=${cond(this.label, \"img\")}\n style=${cond(this.color, `color:${this.color}`)}\n aria-label=${ifDefined(this.label)}\n >\n <slot aria-hidden=\"true\"></slot>\n <div aria-hidden=\"true\">${unsafeHTML(this.svg)}</div>\n </div>\n `\n }\n\n @observe(\"name\")\n protected handleNameChange() {\n if (!this.name) {\n this.svg = \"\"\n return\n }\n\n if (Icon.registeredIcons.has(this.name)) {\n this.svg = Icon.registeredIcons.get(this.name) as string\n return\n }\n\n Icon.resolver(this.name)\n .then(svg => {\n this.svg = svg\n })\n .catch(() => {\n this.svg = \"\"\n })\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-icon\": Icon\n }\n}\n"],"names":["Icon","Icon_1","LitElement","constructor","this","name","size","svg","static","resolver","iconOrName","icon","title","default","Error","registeredIcons","has","set","render","html","cond","label","color","ifDefined","unsafeHTML","handleNameChange","get","then","catch","styles","componentStyle","style","fetch","response","ok","TypeError","text","Map","__decorate","property","reflect","prototype","state","observe","customElement"],"mappings":"+~~6BAmCA~~,IAAqBA,EAAIC,EAAzB,cAAkCC,EAAlCC,kCA+D+BC,KAAIC,KAAW,GAKfD,KAAIE,~~KAA0C~~,~~IAc1DF~~,KAAGG,IAAW,EAsChC,CA5GCC,wBAAwBC,GACtBR,EAAKQ,SAAWA,CACjB,CAqBDD,oBAAoBE,EAAyDC,GAC3E,IAAIN,EACAE,EAWJ,GAT0B,iBAAfG,GACTL,EAAOK,EACPH,EAAMI,IAENN,EAAOK,EAAWE,MAClBL,EAAMG,EAAWG,UAIdR,EACH,MAAM,IAAIS,MAAM,6CAElB,IAAKP,EACH,MAAM,IAAIO,MAAM,0BAGbb,EAAKc,gBAAgBC,IAAIX,IAC5BJ,EAAKc,gBAAgBE,IAAIZ,EAAME,EAElC,CA0BDW,SAIE,OAAOC,CAAI,cAEAC,EAAKhB,KAAKiB,MAAO,kBAChBD,EAAKhB,KAAKkB,MAAO,SAASlB,KAAKkB,yBAC1BC,EAAUnB,KAAKiB,mEAGFG,EAAWpB,KAAKG,kBAG/C,CAGSkB,mBACHrB,KAAKC,KAKNJ,EAAKc,gBAAgBC,IAAIZ,KAAKC,MAChCD,KAAKG,IAAMN,EAAKc,gBAAgBW,IAAItB,KAAKC,MAI3CJ,EAAKQ,SAASL,KAAKC,MAChBsB,MAAKpB,IACJH,KAAKG,IAAMA,CAAG,IAEfqB,OAAM,KACLxB,KAAKG,IAAM,EAAE,IAdfH,KAAKG,IAAM,EAgBd,GAtHMP,EAAA6B,OAAS,CAACC,EAAgBC,GAElB/B,EAAAS,SArBkBJ,GACjC2B,MAAM,6CAAmE3B,SAAYsB,MAAKM,IACxF,IAAKA,EAASC,GACZ,MAAM,IAAIC,UAAU,uBAAuB9B,MAG7C,OAAO4B,EAASG,MAAM,IAgBTpC,EAAAe,gBAAkB,IAAIsB,IA2DRC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyBxC,EAAAyC,UAAA,YAAA,GAKjBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,~~KAAyDxC~~,EAAAyC,UAAA,YAAA,~~GAMjDH~~,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsBxC,EAAAyC,UAAA,aAAA,GAMdH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsBxC,EAAAyC,UAAA,aAAA,GAElCH,EAAA,CAARI,KAAgC1C,EAAAyC,UAAA,WAAA,GAmBjCH,EAAA,CADCK,EAAQ,SAmBR3C,EAAAyC,UAAA,mBAAA,MAvHkBzC,EAAIC,EAAAqC,EAAA,CADxBM,EAAc,cACM5C,SAAAA"}
1	+ {"version":3,"file":"Icon.js","sources":["../src/icon/Icon.ts"],"sourcesContent":["import { html, LitElement } from \"lit\"\nimport { customElement, property, state } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { unsafeHTML } from \"lit/directives/unsafe-html.js\"\nimport { observe } from \"../common/decorators/observe.js\"\nimport { cond } from \"../common/directives/cond.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Icon.css\"\n\nexport type IconResolver = (iconName: string) => Promise<string>\n\n// in dev we should just load from node_modules\nconst loadIcon: IconResolver = (name: string) =>\n import(`@nordhealth/icons/lib/assets/${name}.js`).then(({ default: svg }) => svg)\n\n// in prod we should load from the CDN, as a sensible default\nconst loadIconCdn: IconResolver = (name: string) =>\n fetch(`https://nordcdn.net/ds/icons/${process.env.ICON_VERSION}/assets/${name}.svg`).then(response => {\n if (!response.ok) {\n throw new TypeError(`NORD: unknown icon '${name}'`)\n }\n\n return response.text()\n })\n\n/*\n Icons are used to provide additional meaning or in places where text label doesn’t fit.\n * Icon component allows you to display an icon from the Nordicons library.\n \n @status ready\n * @category image\n * @slot - The default slot used for placing a custom SVG icon.\n /\n@customElement(\"nord-icon\")\nexport default class Icon extends LitElement {\n static styles = [componentStyle, style]\n\n private static resolver: IconResolver = process.env.NODE_ENV === \"development\" ? loadIcon : loadIconCdn\n private static registeredIcons = new Map<string, string>()\n\n /\n Register a custom icon resolver, which accepts the icon name as an parameter, and returns an SVG string.\n * Can return a string synchronously, or a promise of a string.\n * By default, will load icons from the Nord CDN.\n * @param resolver The resolver function to register.\n /\n static registerResolver(resolver: IconResolver) {\n Icon.resolver = resolver\n }\n\n /\n Register an individual icon so it can be rendered synchronously, to avoid loading over the network.\n * @param icon An object representing the icon to be registered, where \"title\" is the icon's name, and \"default\" is the SVG string.\n * This is intended to be used in cases where you import an icon's entire ES module and register it directly.\n /\n static registerIcon(icon: { title: string; default: string }): void\n\n /\n Register an individual icon so it can be rendered synchronously, to avoid loading over the network.\n * @param name The name of the icon to be registered.\n * @param icon The SVG string for the icon.\n /\n static registerIcon(name: string, icon: string): void\n\n /\n Register an individual icon so it can be rendered synchronously, to avoid loading over the network.\n * @param iconOrName The name of the icon to be registered or an object representing the icon to be registered, where \"title\" is the icon's name, and \"default\" is the SVG string.\n * @param icon The SVG string for the icon.\n /\n static registerIcon(iconOrName: string \| { title: string; default: string }, icon?: string) {\n let name: string \| undefined\n let svg: string \| undefined\n\n if (typeof iconOrName === \"string\") {\n name = iconOrName\n svg = icon\n } else {\n name = iconOrName.title\n svg = iconOrName.default\n }\n\n // handle errors\n if (!name) {\n throw new Error(\"name is required when registering an icon\")\n }\n if (!svg) {\n throw new Error(\"icon must not be empty\")\n }\n\n if (!Icon.registeredIcons.has(name)) {\n Icon.registeredIcons.set(name, svg)\n }\n }\n\n /\n The name of the icon to display, as defined by [nordicons](/nordicons/).\n /\n @property({ reflect: true }) name: string = \"\"\n\n /\n The size of the icon.\n /\n @property({ reflect: true }) size: \"xxs\" \| \"xs\" \| \"s\" \| \"m\" \| \"l\" \| \"xl\" \| \"xxl\" = \"m\"\n\n /\n The color of the icon.\n * Can accept any valid CSS color value, including custom properties.\n /\n @property({ reflect: true }) color?: string\n\n /\n An accessible label for the icon.\n * If no label is supplied, the icon is hidden from assistive technology.\n */\n @property({ reflect: true }) label?: string\n\n @state() private svg: string = \"\"\n\n render() {\n // if a label is supplied, we give the div a role of img.\n // without this we could not use aria-label, since it is only valid on elements of certain roles.\n // we always hide the inner svg, since the svg does not have any text/title/label itself.\n return html`\n <div\n role=${cond(this.label, \"img\")}\n style=${cond(this.color, `color:${this.color}`)}\n aria-label=${ifDefined(this.label)}\n >\n <slot aria-hidden=\"true\"></slot>\n <div aria-hidden=\"true\">${unsafeHTML(this.svg)}</div>\n </div>\n `\n }\n\n @observe(\"name\")\n protected handleNameChange() {\n if (!this.name) {\n this.svg = \"\"\n return\n }\n\n if (Icon.registeredIcons.has(this.name)) {\n this.svg = Icon.registeredIcons.get(this.name) as string\n return\n }\n\n Icon.resolver(this.name)\n .then(svg => {\n this.svg = svg\n })\n .catch(() => {\n this.svg = \"\"\n })\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-icon\": Icon\n }\n}\n"],"names":["Icon","Icon_1","LitElement","constructor","this","name","size","svg","static","resolver","iconOrName","icon","title","default","Error","registeredIcons","has","set","render","html","cond","label","color","ifDefined","unsafeHTML","handleNameChange","get","then","catch","styles","componentStyle","style","fetch","response","ok","TypeError","text","Map","__decorate","property","reflect","prototype","state","observe","customElement"],"mappings":"u+BAmCA,IAAqBA,EAAIC,EAAzB,cAAkCC,EAAlCC,kCA+D+BC,KAAIC,KAAW,GAKfD,KAAIE,KAAkD,IAclEF,KAAGG,IAAW,EAsChC,CA5GCC,wBAAwBC,GACtBR,EAAKQ,SAAWA,CACjB,CAqBDD,oBAAoBE,EAAyDC,GAC3E,IAAIN,EACAE,EAWJ,GAT0B,iBAAfG,GACTL,EAAOK,EACPH,EAAMI,IAENN,EAAOK,EAAWE,MAClBL,EAAMG,EAAWG,UAIdR,EACH,MAAM,IAAIS,MAAM,6CAElB,IAAKP,EACH,MAAM,IAAIO,MAAM,0BAGbb,EAAKc,gBAAgBC,IAAIX,IAC5BJ,EAAKc,gBAAgBE,IAAIZ,EAAME,EAElC,CA0BDW,SAIE,OAAOC,CAAI,cAEAC,EAAKhB,KAAKiB,MAAO,kBAChBD,EAAKhB,KAAKkB,MAAO,SAASlB,KAAKkB,yBAC1BC,EAAUnB,KAAKiB,mEAGFG,EAAWpB,KAAKG,kBAG/C,CAGSkB,mBACHrB,KAAKC,KAKNJ,EAAKc,gBAAgBC,IAAIZ,KAAKC,MAChCD,KAAKG,IAAMN,EAAKc,gBAAgBW,IAAItB,KAAKC,MAI3CJ,EAAKQ,SAASL,KAAKC,MAChBsB,MAAKpB,IACJH,KAAKG,IAAMA,CAAG,IAEfqB,OAAM,KACLxB,KAAKG,IAAM,EAAE,IAdfH,KAAKG,IAAM,EAgBd,GAtHMP,EAAA6B,OAAS,CAACC,EAAgBC,GAElB/B,EAAAS,SArBkBJ,GACjC2B,MAAM,6CAAmE3B,SAAYsB,MAAKM,IACxF,IAAKA,EAASC,GACZ,MAAM,IAAIC,UAAU,uBAAuB9B,MAG7C,OAAO4B,EAASG,MAAM,IAgBTpC,EAAAe,gBAAkB,IAAIsB,IA2DRC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyBxC,EAAAyC,UAAA,YAAA,GAKjBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAiExC,EAAAyC,UAAA,YAAA,GAMzDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsBxC,EAAAyC,UAAA,aAAA,GAMdH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsBxC,EAAAyC,UAAA,aAAA,GAElCH,EAAA,CAARI,KAAgC1C,EAAAyC,UAAA,WAAA,GAmBjCH,EAAA,CADCK,EAAQ,SAmBR3C,EAAAyC,UAAA,mBAAA,MAvHkBzC,EAAIC,EAAAqC,EAAA,CADxBM,EAAc,cACM5C,SAAAA"}

package/lib/NavItem.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{_ as e,e as n}from"./query-assigned-elements-e6cbac30.js";import{i as o,y as t,b as a,s as i}from"./lit-element-79bc2e0e.js";import{e as r}from"./property-03f59dce.js";import{o as s}from"./class-map-cd6c8cbd.js";import{n as c}from"./ref-697b28b5.js";import{D as l}from"./DirectionController-8b298382.js";import{S as d}from"./SlotController-ea6eff46.js";import{c as v}from"./cond-0a8d4554.js";import{N as p}from"./events-731d0007.js";import{F as m}from"./FocusableMixin-99db12c1.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";const h=o`:host{--_n-nav-item-box-shadow:none;all:unset;display:block;font-feature-settings:var(--n-font-features);font-family:var(--n-font-family)}*,::after,::before{box-sizing:border-box}.n-nav-item{-webkit-user-select:none;user-select:none;display:flex;align-items:center;font-family:inherit;font-size:inherit;line-height:var(--n-line-height-tight);-webkit-appearance:none;appearance:none;color:var(--n-color-text-weak);padding:var(--n-space-s);min-block-size:28px;margin-block-end:1px;border-radius:var(--n-border-radius-s);text-decoration:none;inline-size:100%;max-inline-size:100%;background:0 0;cursor:pointer;border:0;text-align:start;box-shadow:var(--_n-nav-item-box-shadow);position:relative}.n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent);outline:0;position:relative;z-index:var(--n-index-masked)}@supports selector(:focus-visible){.n-nav-item:focus{--_n-nav-item-box-shadow:none}.n-nav-item:focus-visible{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent)}}.n-nav-item:hover{background:var(--n-color-nav-hover);color:var(--n-color-text)}.n-nav-item:active{opacity:.7}.n-nav-content{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([badge]) .n-nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-inline-size:calc(100% - calc(var(--n-space-m) + var(--n-space-m)));margin-block-end:-3px}:host([active]) .n-nav-item{--_n-nav-item-box-shadow:var(--n-box-shadow);background:var(--n-color-accent);color:var(--n-color-text-on-accent);font-weight:var(--n-font-weight-active)}:host([active]) .n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 1px var(--n-color-nav-surface),0 0 0 3px var(--n-color-accent)}:host([active]) nord-icon{color:currentColor}.n-toggle-icon{color:var(--n-color-icon);margin-inline-end:var(--n-space-s);margin-inline-start:var(--n-space-s)}.n-toggle-icon.n-rtl{transform:rotate(-180deg)}[aria-expanded=true] .n-toggle-icon{transform:rotate(90deg)}.n-nav-icon{margin-inline-end:calc(var(--n-space-s) * 1.4);flex-shrink:0}::slotted(nord-nav-group){margin-inline-start:calc(var(--n-space-m) + calc(var(--n-space-s) * 1.3))}.n-nav-badge{border-radius:var(--n-border-radius-pill);background:var(--n-color-status-warning);color:rgba(0,0,0,.8);font-weight:var(--n-font-weight);font-feature-settings:var(--n-font-features-reduced);padding:4px 6px;text-align:center;min-inline-size:20px;position:absolute;margin-block-start:-2px;margin-inline-start:calc(var(--n-space-s)/ 1.5);font-size:var(--n-font-size-xs);display:inline-block}`;let b=class extends(m(i)){constructor(){super(...arguments),this.subnavSlot=new d(this,"subnav"),this.direction=new l(this),this.active=!1,this.open=!1}connectedCallback(){super.connectedCallback(),this.querySelector("nord-nav-item[active]")&&(this.open=!0)}render(){const e=t`${this.icon?t`<nord-icon class="n-nav-icon" name="${this.icon}" size="m"></nord-icon>`:a}<div class="n-nav-content"><span class="n-nav-label"><slot></slot></span>${this.badge?t`<span class="n-nav-badge">${this.badge}</span>`:a}</div>`;let n;return n=this.subnavSlot.hasContent?this.renderToggle(e):this.href?this.renderLink(e):this.renderButton(e),t`<div role="listitem">${n}<slot name="${this.subnavSlot.slotName}" ?hidden="${!this.open}"></slot></div>`}renderLink(e){return t`<a class="n-nav-item" ${c(this.focusableRef)} aria-current="${v(this.active,"page")}" href="${this.href||""}">${e}</a>`}renderToggle(e){return t`<button class="n-nav-item" @click="${this.toggleOpen}" aria-expanded="${this.open?"true":"false"}" ${c(this.focusableRef)}>${e}<nord-icon size="xs" class="${s({"n-toggle-icon":!0,"n-rtl":this.direction.isRTL})}" name="arrow-expand-right-small"></nord-icon></button>`}renderButton(e){return t`<button class="n-nav-item" ${c(this.focusableRef)}>${e}</button>`}toggleOpen(){this.open=!this.open,this.dispatchEvent(new p("toggle"))}};b.styles=h,e([r({type:Boolean,reflect:!0})],b.prototype,"active",void 0),e([r()],b.prototype,"icon",void 0),e([r()],b.prototype,"href",void 0),e([r()],b.prototype,"badge",void 0),e([r({type:Boolean})],b.prototype,"open",void 0),b=e([n("nord-nav-item")],b);var f=b;export{f as default};
+import{_ as e,e as n}from"./query-assigned-elements-e6cbac30.js";import{i as o,y as t,b as a,s as i}from"./lit-element-79bc2e0e.js";import{e as r}from"./property-03f59dce.js";import{o as s}from"./class-map-cd6c8cbd.js";import{n as c}from"./ref-697b28b5.js";import{D as l}from"./DirectionController-8b298382.js";import{S as d}from"./SlotController-ea6eff46.js";import{c as v}from"./cond-0a8d4554.js";import{N as p}from"./events-731d0007.js";import{F as m}from"./FocusableMixin-99db12c1.js";import"./directive-de55b00a.js";import"./EventController-d99ebeef.js";const h=o`:host{--_n-nav-item-box-shadow:none;all:unset;display:block;font-feature-settings:var(--n-font-features);font-family:var(--n-font-family)}*,::after,::before{box-sizing:border-box}.n-nav-item{-webkit-user-select:none;user-select:none;display:flex;align-items:center;font-family:inherit;font-size:inherit;line-height:var(--n-line-height-tight);-webkit-appearance:none;appearance:none;color:var(--n-color-text-weak);padding:var(--n-space-s);min-block-size:28px;margin-block-end:1px;border-radius:var(--n-border-radius-s);text-decoration:none;inline-size:100%;max-inline-size:100%;background:0 0;cursor:pointer;border:0;text-align:start;box-shadow:var(--_n-nav-item-box-shadow);position:relative}.n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent);outline:0;position:relative;z-index:var(--n-index-masked)}@supports selector(:focus-visible){.n-nav-item:focus{--_n-nav-item-box-shadow:none}.n-nav-item:focus-visible{--_n-nav-item-box-shadow:0 0 0 2px var(--n-color-accent)}}.n-nav-item:hover{background:var(--n-color-nav-hover);color:var(--n-color-text)}.n-nav-item:active{opacity:.7}.n-nav-content{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([badge]) .n-nav-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-inline-size:calc(100% - calc(var(--n-space-m) + var(--n-space-m)));margin-block-end:-3px}:host([active]) .n-nav-item{--_n-nav-item-box-shadow:var(--n-box-shadow);background:var(--n-color-accent);color:var(--n-color-text-on-accent);font-weight:var(--n-font-weight-active)}:host([active]) .n-nav-item:focus{--_n-nav-item-box-shadow:0 0 0 1px var(--n-color-nav-surface),0 0 0 3px var(--n-color-accent)}:host([active]) nord-icon{color:currentColor}.n-toggle-icon{color:var(--n-color-icon);margin-inline-end:var(--n-space-s);margin-inline-start:var(--n-space-s)}.n-toggle-icon.n-rtl{transform:rotate(-180deg)}[aria-expanded=true] .n-toggle-icon{transform:rotate(90deg)}.n-nav-icon{margin-inline-end:calc(var(--n-space-s) * 1.4);flex-shrink:0}::slotted(nord-nav-group){margin-inline-start:calc(var(--n-space-m) + calc(var(--n-space-s) * 1.3))}.n-nav-badge{border-radius:var(--n-border-radius-pill);background:var(--n-color-status-warning);color:rgba(0,0,0,.8);font-weight:var(--n-font-weight);font-feature-settings:var(--n-font-features-reduced);padding:4px 6px;text-align:center;min-inline-size:20px;position:absolute;margin-block-start:-2px;margin-inline-start:calc(var(--n-space-s)/ 1.5);font-size:var(--n-font-size-xs);display:inline-block}`;let b=class extends(m(i)){constructor(){super(...arguments),this.subnavSlot=new d(this,"subnav"),this.direction=new l(this),this.active=!1,this.open=!1}connectedCallback(){super.connectedCallback(),this.querySelector("nord-nav-item[active]")&&(this.open=!0)}render(){const e=t`${this.icon?t`<nord-icon class="n-nav-icon" name="${this.icon}" size="m"></nord-icon>`:a}<div class="n-nav-content"><span class="n-nav-label"><slot></slot></span>${this.badge?t`<span class="n-nav-badge">${this.badge}</span>`:a}</div>`;let n;return n=this.subnavSlot.hasContent?this.renderToggle(e):this.href?this.renderLink(e):this.renderButton(e),t`<div role="listitem">${n}<slot name="${this.subnavSlot.slotName}" ?hidden="${!this.open}"></slot></div>`}renderLink(e){return t`<a class="n-nav-item" ${c(this.focusableRef)} aria-current="${v(this.active,"page")}" href="${this.href||""}">${e}</a>`}renderToggle(e){return t`<button class="n-nav-item" @click="${this.toggleOpen}" aria-expanded="${this.open?"true":"false"}" ${c(this.focusableRef)}>${e}<nord-icon size="xxs" class="${s({"n-toggle-icon":!0,"n-rtl":this.direction.isRTL})}" name="arrow-expand-right-small"></nord-icon></button>`}renderButton(e){return t`<button class="n-nav-item" ${c(this.focusableRef)}>${e}</button>`}toggleOpen(){this.open=!this.open,this.dispatchEvent(new p("toggle"))}};b.styles=h,e([r({type:Boolean,reflect:!0})],b.prototype,"active",void 0),e([r()],b.prototype,"icon",void 0),e([r()],b.prototype,"href",void 0),e([r()],b.prototype,"badge",void 0),e([r({type:Boolean})],b.prototype,"open",void 0),b=e([n("nord-nav-item")],b);var f=b;export{f as default};
 //# sourceMappingURL=NavItem.js.map