@nordhealth/components 4.8.1 → 4.10.0-alpha.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.
- package/custom-elements.json +5560 -5555
- package/lib/Badge.js +1 -1
- package/lib/Badge.js.map +1 -1
- package/lib/Card.js +1 -1
- package/lib/Card.js.map +1 -1
- package/lib/IconManager.js +1 -1
- package/lib/IconManager.js.map +1 -1
- package/lib/bundle.js +3 -3
- package/lib/bundle.js.map +1 -1
- package/lib/src/card/Card.d.ts +1 -0
- package/package.json +4 -4
package/lib/Badge.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as n,html as a}from"lit";import{property as t,customElement as e}from"lit/decorators.js";import{s}from"./Component-DSU3Qp0O.js";const c=r`:host{--_n-badge-background-color:var(--n-color-text-neutral);--_n-badge-chip-color:var(--n-color-status-neutral-weak);--_n-badge-border-color:var(--n-color-border-neutral);display:inline;vertical-align:middle}.n-badge{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;border-radius:var(--n-border-radius-pill);border:1px solid var(--_n-badge-border-color);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-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s);color:var(--_n-badge-background-color);gap:var(--n-space-xs);align-items:center;display:inline-flex;white-space:nowrap;position:relative}:host(:is([variant=success],[type=success])){--_n-badge-chip-color:var(--n-color-status-success-weak);--_n-badge-border-color:var(--n-color-border-success);--_n-badge-background-color:var(--n-color-text-success)}:host(:is([variant=warning],[type=warning])){--_n-badge-chip-color:var(--n-color-status-warning-weak);--_n-badge-border-color:var(--n-color-border-warning);--_n-badge-background-color:var(--n-color-text-warning)}:host(:is([variant=highlight],[type=highlight])){--_n-badge-chip-color:var(--n-color-status-highlight-weak);--_n-badge-border-color:var(--n-color-border-highlight);--_n-badge-background-color:var(--n-color-text-highlight)}:host(:is([variant=info],[type=info],[type=progress])){--_n-badge-chip-color:var(--n-color-status-info-weak);--_n-badge-border-color:var(--n-color-border-info);--_n-badge-background-color:var(--n-color-text-info)}:host(:is([variant=danger],[type=danger])){--_n-badge-chip-color:var(--n-color-status-danger-weak);--_n-badge-border-color:var(--n-color-border-danger);--_n-badge-background-color:var(--n-color-text-danger)}:host([strong]){--_n-badge-chip-color:var(--n-color-status-neutral);--_n-badge-border-color:var(--n-color-border-neutral);--_n-badge-background-color:var(--n-color-text-neutral-strong)}:host(:is([variant=success],[type=success])[strong]){--_n-badge-chip-color:var(--n-color-status-success);--_n-badge-border-color:var(--n-color-status-success);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=warning],[type=warning])[strong]){--_n-badge-chip-color:var(--n-color-status-warning);--_n-badge-border-color:var(--n-color-status-warning);--_n-badge-background-color:var(--n-color-text-warning-strong)}:host(:is([variant=highlight],[type=highlight])[strong]){--_n-badge-chip-color:var(--n-color-status-highlight);--_n-badge-border-color:var(--n-color-status-highlight);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=info],[type=info],[type=progress])[strong]){--_n-badge-chip-color:var(--n-color-status-info);--_n-badge-border-color:var(--n-color-status-info);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=danger],[type=danger])[strong]){--_n-badge-chip-color:var(--n-color-status-danger);--_n-badge-border-color:var(--n-color-status-danger);--_n-badge-background-color:var(--n-color-text-on-accent)}::slotted(nord-icon:not([size])){--_n-icon-size:var(--n-size-icon-xxs);transform:translateY(-.5px)}`;let i=class extends n{constructor(){super(...arguments),this.strong=!1}render(){return a`<span class="n-badge"><slot name="icon"></slot><slot></slot></span>`}};i.styles=[s,c],o([t({reflect:!0})],i.prototype,"type",void 0),o([t({reflect:!0})],i.prototype,"variant",void 0),o([t({reflect:!0,type:Boolean})],i.prototype,"strong",void 0),i=o([e("nord-badge")],i);var l=i;export{l as default};
|
|
1
|
+
import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as n,html as a}from"lit";import{property as t,customElement as e}from"lit/decorators.js";import{s}from"./Component-DSU3Qp0O.js";const c=r`:host{--_n-badge-background-color:var(--n-color-text-neutral);--_n-badge-chip-color:var(--n-color-status-neutral-weak);--_n-badge-border-color:var(--n-color-border-neutral);display:inline;vertical-align:middle;line-height:var(--n-line-height-tight)}.n-badge{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;border-radius:var(--n-border-radius-pill);border:1px solid var(--_n-badge-border-color);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-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s);color:var(--_n-badge-background-color);gap:var(--n-space-xs);align-items:center;display:inline-flex;white-space:nowrap;position:relative}:host(:is([variant=success],[type=success])){--_n-badge-chip-color:var(--n-color-status-success-weak);--_n-badge-border-color:var(--n-color-border-success);--_n-badge-background-color:var(--n-color-text-success)}:host(:is([variant=warning],[type=warning])){--_n-badge-chip-color:var(--n-color-status-warning-weak);--_n-badge-border-color:var(--n-color-border-warning);--_n-badge-background-color:var(--n-color-text-warning)}:host(:is([variant=highlight],[type=highlight])){--_n-badge-chip-color:var(--n-color-status-highlight-weak);--_n-badge-border-color:var(--n-color-border-highlight);--_n-badge-background-color:var(--n-color-text-highlight)}:host(:is([variant=info],[type=info],[type=progress])){--_n-badge-chip-color:var(--n-color-status-info-weak);--_n-badge-border-color:var(--n-color-border-info);--_n-badge-background-color:var(--n-color-text-info)}:host(:is([variant=danger],[type=danger])){--_n-badge-chip-color:var(--n-color-status-danger-weak);--_n-badge-border-color:var(--n-color-border-danger);--_n-badge-background-color:var(--n-color-text-danger)}:host([strong]){--_n-badge-chip-color:var(--n-color-status-neutral);--_n-badge-border-color:var(--n-color-border-neutral);--_n-badge-background-color:var(--n-color-text-neutral-strong)}:host(:is([variant=success],[type=success])[strong]){--_n-badge-chip-color:var(--n-color-status-success);--_n-badge-border-color:var(--n-color-status-success);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=warning],[type=warning])[strong]){--_n-badge-chip-color:var(--n-color-status-warning);--_n-badge-border-color:var(--n-color-status-warning);--_n-badge-background-color:var(--n-color-text-warning-strong)}:host(:is([variant=highlight],[type=highlight])[strong]){--_n-badge-chip-color:var(--n-color-status-highlight);--_n-badge-border-color:var(--n-color-status-highlight);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=info],[type=info],[type=progress])[strong]){--_n-badge-chip-color:var(--n-color-status-info);--_n-badge-border-color:var(--n-color-status-info);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=danger],[type=danger])[strong]){--_n-badge-chip-color:var(--n-color-status-danger);--_n-badge-border-color:var(--n-color-status-danger);--_n-badge-background-color:var(--n-color-text-on-accent)}::slotted(nord-icon:not([size])){--_n-icon-size:var(--n-size-icon-xxs);transform:translateY(-.5px)}`;let i=class extends n{constructor(){super(...arguments),this.strong=!1}render(){return a`<span class="n-badge"><slot name="icon"></slot><slot></slot></span>`}};i.styles=[s,c],o([t({reflect:!0})],i.prototype,"type",void 0),o([t({reflect:!0})],i.prototype,"variant",void 0),o([t({reflect:!0,type:Boolean})],i.prototype,"strong",void 0),i=o([e("nord-badge")],i);var l=i;export{l as default};
|
|
2
2
|
//# sourceMappingURL=Badge.js.map
|
package/lib/Badge.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sources":["../src/badge/Badge.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Badge.css\"\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 * @slot icon - Used to place an icon at the start of badge.\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 * @deprecated Use `variant` instead. If you previously used `\"progress\"`, use `\"info\"` instead.\n * @default \"neutral\"\n */\n @property({ reflect: true }) type?: \"warning\" | \"success\" | \"danger\" | \"highlight\" | \"info\" | \"neutral\" | \"progress\"\n\n /**\n * The style variant of the badge.\n * Determines the background color of the badge.\n * @default \"neutral\"\n */\n @property({ reflect: true }) variant?: \"warning\" | \"success\" | \"danger\" | \"highlight\" | \"neutral\" | \"info\"\n\n /**\n * Strong badges are a secondary style for badges.\n * They provide more visual prominence and emphasize them.\n */\n @property({ reflect: true, type: Boolean }) strong = false\n\n render() {\n return html`\n <span class=\"n-badge\">\n <slot name=\"icon\"></slot>\n <slot></slot>\n </span>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-badge\": Badge\n }\n}\n"],"names":["Badge","LitElement","constructor","this","strong","render","html","styles","componentStyle","style","__decorate","property","reflect","prototype","type","Boolean","customElement"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Badge.js","sources":["../src/badge/Badge.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Badge.css\"\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 * @slot icon - Used to place an icon at the start of badge.\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 * @deprecated Use `variant` instead. If you previously used `\"progress\"`, use `\"info\"` instead.\n * @default \"neutral\"\n */\n @property({ reflect: true }) type?: \"warning\" | \"success\" | \"danger\" | \"highlight\" | \"info\" | \"neutral\" | \"progress\"\n\n /**\n * The style variant of the badge.\n * Determines the background color of the badge.\n * @default \"neutral\"\n */\n @property({ reflect: true }) variant?: \"warning\" | \"success\" | \"danger\" | \"highlight\" | \"neutral\" | \"info\"\n\n /**\n * Strong badges are a secondary style for badges.\n * They provide more visual prominence and emphasize them.\n */\n @property({ reflect: true, type: Boolean }) strong = false\n\n render() {\n return html`\n <span class=\"n-badge\">\n <slot name=\"icon\"></slot>\n <slot></slot>\n </span>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-badge\": Badge\n }\n}\n"],"names":["Badge","LitElement","constructor","this","strong","render","html","styles","componentStyle","style","__decorate","property","reflect","prototype","type","Boolean","customElement"],"mappings":"+6GAiBe,IAAMA,EAAN,cAAoBC,EAApB,WAAAC,uBAsB+BC,KAAMC,QAAG,CAUtD,CARC,MAAAC,GACE,OAAOC,CAAI,qEAMZ,GA9BMN,EAAAO,OAAS,CAACC,EAAgBC,GAQJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA+FZ,EAAAa,UAAA,YAAA,GAOvFH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqFZ,EAAAa,UAAA,eAAA,GAM9DH,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAME,KAAMC,WAAyBf,EAAAa,UAAA,cAAA,GAtBvCb,EAAKU,EAAA,CADzBM,EAAc,eACMhB,SAAAA"}
|
package/lib/Card.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{_ as a}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as
|
|
1
|
+
import{_ as a}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as d,html as o}from"lit";import{property as e,customElement as t}from"lit/decorators.js";import{S as n}from"./SlotController-Z6eG7LSZ.js";import{s}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";const i=r`:host{--_n-card-padding:var(--n-card-padding, var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-m));--_n-card-box-shadow:var(--n-card-box-shadow, var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius, var(--n-border-radius));--_n-card-header-background:var(--n-card-header-background, transparent);color:var(--n-color-text);display:block;inline-size:100%}.n-card{background:var(--n-color-surface);border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);block-size:100%;display:flex;flex-direction:column}.header{background-color:var(--_n-card-header-background);border-block-end:1px solid var(--n-color-border);border-start-start-radius:var(--_n-card-border-radius);border-start-end-radius:var(--_n-card-border-radius);padding:var(--n-space-m) var(--_n-card-slot-padding);display:flex;gap:var(--n-space-s);align-items:center;justify-content:space-between;flex-wrap:wrap}:host([padding="l"]){--_n-card-padding:var(--n-card-padding, var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding, 0)}slot{display:block}slot:not([name]){padding:var(--_n-card-padding);flex:1}slot[name=footer]{padding:var(--_n-card-slot-padding);padding-block-start:0;white-space:nowrap}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);display:flex;gap:var(--n-stack-gap);align-items:center;flex-wrap:wrap;margin-block-start:calc(var(--n-space-xs) * -1)!important;margin-block-end:calc(var(--n-space-xs) * -1)!important}::slotted([slot=header]){font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading);margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let l=class extends d{constructor(){super(...arguments),this.headerSlot=new n(this,"header"),this.headerEndSlot=new n(this,"header-end"),this.footerSlot=new n(this,"footer"),this.padding="m"}render(){return o`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};l.styles=[s,i],a([e({reflect:!0})],l.prototype,"padding",void 0),l=a([t("nord-card")],l);var c=l;export{c as default};
|
|
2
2
|
//# sourceMappingURL=Card.js.map
|
package/lib/Card.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","sources":["../src/card/Card.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Card.css\"\n\n/**\n * Cards are shadowed surfaces that display content and actions on a\n * single topic. They should be easy to scan for relevant and\n * actionable information.\n *\n * @status ready\n * @category structure\n * @slot - The card content.\n * @slot header - Optional slot that holds a header for the card.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n * @slot footer - Optional slot that holds footer content for the card.\n *\n * @cssprop [--n-card-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-card-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-card-padding=var(--n-space-m)] - Controls the padding on all sides of the card.\n * @cssprop [--n-card-slot-padding=var(--n-space-m)] - Controls the padding of items slotted within the card. This does not affect the block padding of items slotted into the header.\n */\n@customElement(\"nord-card\")\nexport default class Card extends LitElement {\n static styles = [componentStyle, style]\n\n private headerSlot = new SlotController(this, \"header\")\n private headerEndSlot = new SlotController(this, \"header-end\")\n private footerSlot = new SlotController(this, \"footer\")\n\n /**\n * Controls the padding of the card component. When set to “none”,\n * the header and footer slots will still have padding.\n */\n @property({ reflect: true }) padding: \"m\" | \"l\" | \"none\" = \"m\"\n\n render() {\n return html`\n <div class=\"n-card\">\n <div class=\"header\" ?hidden=${this.headerSlot.isEmpty && this.headerEndSlot.isEmpty}>\n <slot name=${this.headerSlot.slotName}></slot>\n <slot name=${this.headerEndSlot.slotName}></slot>\n </div>\n <slot></slot>\n <slot name=${this.footerSlot.slotName} ?hidden=${this.footerSlot.isEmpty}></slot>\n </div>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-card\": Card\n }\n}\n"],"names":["Card","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","footerSlot","padding","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Card.js","sources":["../src/card/Card.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Card.css\"\n\n/**\n * Cards are shadowed surfaces that display content and actions on a\n * single topic. They should be easy to scan for relevant and\n * actionable information.\n *\n * @status ready\n * @category structure\n * @slot - The card content.\n * @slot header - Optional slot that holds a header for the card.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n * @slot footer - Optional slot that holds footer content for the card.\n *\n * @cssprop [--n-card-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-card-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-card-padding=var(--n-space-m)] - Controls the padding on all sides of the card.\n * @cssprop [--n-card-slot-padding=var(--n-space-m)] - Controls the padding of items slotted within the card. This does not affect the block padding of items slotted into the header.\n * @cssprop [--n-card-header-background=transparent] - Controls the background color of the card header.\n */\n@customElement(\"nord-card\")\nexport default class Card extends LitElement {\n static styles = [componentStyle, style]\n\n private headerSlot = new SlotController(this, \"header\")\n private headerEndSlot = new SlotController(this, \"header-end\")\n private footerSlot = new SlotController(this, \"footer\")\n\n /**\n * Controls the padding of the card component. When set to “none”,\n * the header and footer slots will still have padding.\n */\n @property({ reflect: true }) padding: \"m\" | \"l\" | \"none\" = \"m\"\n\n render() {\n return html`\n <div class=\"n-card\">\n <div class=\"header\" ?hidden=${this.headerSlot.isEmpty && this.headerEndSlot.isEmpty}>\n <slot name=${this.headerSlot.slotName}></slot>\n <slot name=${this.headerEndSlot.slotName}></slot>\n </div>\n <slot></slot>\n <slot name=${this.footerSlot.slotName} ?hidden=${this.footerSlot.isEmpty}></slot>\n </div>\n `\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n \"nord-card\": Card\n }\n}\n"],"names":["Card","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","footerSlot","padding","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"wiEAyBe,IAAMA,EAAN,cAAmBC,EAAnB,WAAAC,uBAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cACzCA,KAAUI,WAAG,IAAIF,EAAeF,KAAM,UAMjBA,KAAOK,QAAuB,GAc5D,CAZC,MAAAC,GACE,OAAOC,CAAI,oDAEuBP,KAAKC,WAAWO,SAAWR,KAAKG,cAAcK,wBAC7DR,KAAKC,WAAWQ,gCAChBT,KAAKG,cAAcM,mDAGrBT,KAAKI,WAAWK,sBAAoBT,KAAKI,WAAWI,wBAGtE,GAvBMX,EAAAa,OAAS,CAACC,EAAgBC,GAUJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyClB,EAAAmB,UAAA,eAAA,GAX3CnB,EAAIgB,EAAA,CADxBI,EAAc,cACMpB,SAAAA"}
|
package/lib/IconManager.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const e=e=>fetch(`https://nordcdn.net/ds/icons/3.
|
|
1
|
+
const e=e=>fetch(`https://nordcdn.net/ds/icons/3.12.0-alpha.0/assets/${e}.svg`).then((t=>{if(!t.ok)throw new TypeError(`NORD: unknown icon: '${e}'`);return t.text()}));class t{constructor(){this.cache=new Map,this.resolver=e}resolve(e,t){let r=this.cache.get(e);"string"!=typeof r?(r||(r=this.resolver(e).catch((()=>"")).then((t=>(this.cache.set(e,t),t))),this.cache.set(e,r)),r.then(t)):t(r)}registerIcon(e,t){let r,s;if("string"==typeof e?(r=e,s=t):(r=e.title,s=e.default),!r)throw new Error("name is required when registering an icon");if(!s)throw new Error("icon must not be empty");this.cache.set(r,s)}clear(){this.cache.clear()}}export{t as IconManager};
|
|
2
2
|
//# sourceMappingURL=IconManager.js.map
|
package/lib/IconManager.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconManager.js","sources":["../src/icon/IconManager.ts"],"sourcesContent":["export 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\nexport class IconManager {\n private cache = new Map<string, string | Promise<string>>()\n resolver: IconResolver = process.env.NODE_ENV === \"development\" ? loadIcon : loadIconCdn\n\n resolve(name: string, onResolved: (svg: string) => void) {\n let cached = this.cache.get(name)\n\n // if it's a string, we can resolve immediately\n if (typeof cached === \"string\") {\n onResolved(cached)\n return\n }\n\n // if it's null, then we should initiate a fetch\n if (!cached) {\n cached = this.resolver(name)\n .catch(() => \"\")\n .then(svg => {\n // replace the promise with the resolved value, for faster resolution next time\n this.cache.set(name, svg)\n return svg\n })\n\n // store the promise so that duplicate icons do not make separate requests\n this.cache.set(name, cached)\n }\n\n cached.then(onResolved)\n }\n\n 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 this.cache.set(name, svg)\n }\n\n clear() {\n this.cache.clear()\n }\n}\n"],"names":["loadIconCdn","name","fetch","then","response","ok","TypeError","text","IconManager","constructor","this","cache","Map","resolver","resolve","onResolved","cached","get","catch","svg","set","registerIcon","iconOrName","icon","title","default","Error","clear"],"mappings":"AAOA,MAAMA,EAA6BC,GACjCC,MAAM,
|
|
1
|
+
{"version":3,"file":"IconManager.js","sources":["../src/icon/IconManager.ts"],"sourcesContent":["export 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\nexport class IconManager {\n private cache = new Map<string, string | Promise<string>>()\n resolver: IconResolver = process.env.NODE_ENV === \"development\" ? loadIcon : loadIconCdn\n\n resolve(name: string, onResolved: (svg: string) => void) {\n let cached = this.cache.get(name)\n\n // if it's a string, we can resolve immediately\n if (typeof cached === \"string\") {\n onResolved(cached)\n return\n }\n\n // if it's null, then we should initiate a fetch\n if (!cached) {\n cached = this.resolver(name)\n .catch(() => \"\")\n .then(svg => {\n // replace the promise with the resolved value, for faster resolution next time\n this.cache.set(name, svg)\n return svg\n })\n\n // store the promise so that duplicate icons do not make separate requests\n this.cache.set(name, cached)\n }\n\n cached.then(onResolved)\n }\n\n 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 this.cache.set(name, svg)\n }\n\n clear() {\n this.cache.clear()\n }\n}\n"],"names":["loadIconCdn","name","fetch","then","response","ok","TypeError","text","IconManager","constructor","this","cache","Map","resolver","resolve","onResolved","cached","get","catch","svg","set","registerIcon","iconOrName","icon","title","default","Error","clear"],"mappings":"AAOA,MAAMA,EAA6BC,GACjCC,MAAM,sDAAmED,SAAYE,MAAKC,IACxF,IAAKA,EAASC,GACZ,MAAM,IAAIC,UAAU,wBAAwBL,MAG9C,OAAOG,EAASG,MAAM,UAGbC,EAAb,WAAAC,GACUC,KAAAC,MAAQ,IAAIC,IACpBF,KAAAG,SAA6Eb,CAsD9E,CApDC,OAAAc,CAAQb,EAAcc,GACpB,IAAIC,EAASN,KAAKC,MAAMM,IAAIhB,GAGN,iBAAXe,GAMNA,IACHA,EAASN,KAAKG,SAASZ,GACpBiB,OAAM,IAAM,KACZf,MAAKgB,IAEJT,KAAKC,MAAMS,IAAInB,EAAMkB,GACdA,KAIXT,KAAKC,MAAMS,IAAInB,EAAMe,IAGvBA,EAAOb,KAAKY,IAlBVA,EAAWC,EAmBd,CAED,YAAAK,CAAaC,EAAyDC,GACpE,IAAItB,EACAkB,EAWJ,GAT0B,iBAAfG,GACTrB,EAAOqB,EACPH,EAAMI,IAENtB,EAAOqB,EAAWE,MAClBL,EAAMG,EAAWG,UAIdxB,EACH,MAAM,IAAIyB,MAAM,6CAElB,IAAKP,EACH,MAAM,IAAIO,MAAM,0BAGlBhB,KAAKC,MAAMS,IAAInB,EAAMkB,EACtB,CAED,KAAAQ,GACEjB,KAAKC,MAAMgB,OACZ"}
|
package/lib/bundle.js
CHANGED
|
@@ -45,7 +45,7 @@ const ft=t=>(e,n)=>{void 0!==n?n.addInitializer((()=>{customElements.define(t,e)
|
|
|
45
45
|
* @license
|
|
46
46
|
* Copyright 2017 Google LLC
|
|
47
47
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
48
|
-
*/;function zt(t,e){return(n,o,r)=>{const i=e=>e.renderRoot?.querySelector(t)??null;if(e){const{get:t,set:e}="object"==typeof o?n:r??(()=>{const t=Symbol();return{get(){return this[t]},set(e){this[t]=e}}})();return _t(n,o,{get(){let n=t.call(this);return void 0===n&&(n=i(this),(null!==n||this.hasUpdated)&&e.call(this,n)),n}})}return _t(n,o,{get(){return i(this)}})}}const $t=i`:host{all:unset;display:block;font-family:var(--n-font-family);font-size:var(--n-font-size-m);line-height:var(--n-line-height);font-feature-settings:var(--n-font-features);box-sizing:border-box;text-align:start}*,::after,::before{box-sizing:border-box;margin:0;padding:0}:host([hidden]),[hidden]{display:none!important}`,St=i`:host{--_n-badge-background-color:var(--n-color-text-neutral);--_n-badge-chip-color:var(--n-color-status-neutral-weak);--_n-badge-border-color:var(--n-color-border-neutral);display:inline;vertical-align:middle}.n-badge{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;border-radius:var(--n-border-radius-pill);border:1px solid var(--_n-badge-border-color);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-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s);color:var(--_n-badge-background-color);gap:var(--n-space-xs);align-items:center;display:inline-flex;white-space:nowrap;position:relative}:host(:is([variant=success],[type=success])){--_n-badge-chip-color:var(--n-color-status-success-weak);--_n-badge-border-color:var(--n-color-border-success);--_n-badge-background-color:var(--n-color-text-success)}:host(:is([variant=warning],[type=warning])){--_n-badge-chip-color:var(--n-color-status-warning-weak);--_n-badge-border-color:var(--n-color-border-warning);--_n-badge-background-color:var(--n-color-text-warning)}:host(:is([variant=highlight],[type=highlight])){--_n-badge-chip-color:var(--n-color-status-highlight-weak);--_n-badge-border-color:var(--n-color-border-highlight);--_n-badge-background-color:var(--n-color-text-highlight)}:host(:is([variant=info],[type=info],[type=progress])){--_n-badge-chip-color:var(--n-color-status-info-weak);--_n-badge-border-color:var(--n-color-border-info);--_n-badge-background-color:var(--n-color-text-info)}:host(:is([variant=danger],[type=danger])){--_n-badge-chip-color:var(--n-color-status-danger-weak);--_n-badge-border-color:var(--n-color-border-danger);--_n-badge-background-color:var(--n-color-text-danger)}:host([strong]){--_n-badge-chip-color:var(--n-color-status-neutral);--_n-badge-border-color:var(--n-color-border-neutral);--_n-badge-background-color:var(--n-color-text-neutral-strong)}:host(:is([variant=success],[type=success])[strong]){--_n-badge-chip-color:var(--n-color-status-success);--_n-badge-border-color:var(--n-color-status-success);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=warning],[type=warning])[strong]){--_n-badge-chip-color:var(--n-color-status-warning);--_n-badge-border-color:var(--n-color-status-warning);--_n-badge-background-color:var(--n-color-text-warning-strong)}:host(:is([variant=highlight],[type=highlight])[strong]){--_n-badge-chip-color:var(--n-color-status-highlight);--_n-badge-border-color:var(--n-color-status-highlight);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=info],[type=info],[type=progress])[strong]){--_n-badge-chip-color:var(--n-color-status-info);--_n-badge-border-color:var(--n-color-status-info);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=danger],[type=danger])[strong]){--_n-badge-chip-color:var(--n-color-status-danger);--_n-badge-border-color:var(--n-color-status-danger);--_n-badge-background-color:var(--n-color-text-on-accent)}::slotted(nord-icon:not([size])){--_n-icon-size:var(--n-size-icon-xxs);transform:translateY(-.5px)}`;let Ct=class extends lt{constructor(){super(...arguments),this.strong=!1}render(){return q`<span class="n-badge"><slot name="icon"></slot><slot></slot></span>`}};Ct.styles=[$t,St],mt([wt({reflect:!0})],Ct.prototype,"type",void 0),mt([wt({reflect:!0})],Ct.prototype,"variant",void 0),mt([wt({reflect:!0,type:Boolean})],Ct.prototype,"strong",void 0),Ct=mt([ft("nord-badge")],Ct);var Et=Ct;
|
|
48
|
+
*/;function zt(t,e){return(n,o,r)=>{const i=e=>e.renderRoot?.querySelector(t)??null;if(e){const{get:t,set:e}="object"==typeof o?n:r??(()=>{const t=Symbol();return{get(){return this[t]},set(e){this[t]=e}}})();return _t(n,o,{get(){let n=t.call(this);return void 0===n&&(n=i(this),(null!==n||this.hasUpdated)&&e.call(this,n)),n}})}return _t(n,o,{get(){return i(this)}})}}const $t=i`:host{all:unset;display:block;font-family:var(--n-font-family);font-size:var(--n-font-size-m);line-height:var(--n-line-height);font-feature-settings:var(--n-font-features);box-sizing:border-box;text-align:start}*,::after,::before{box-sizing:border-box;margin:0;padding:0}:host([hidden]),[hidden]{display:none!important}`,St=i`:host{--_n-badge-background-color:var(--n-color-text-neutral);--_n-badge-chip-color:var(--n-color-status-neutral-weak);--_n-badge-border-color:var(--n-color-border-neutral);display:inline;vertical-align:middle;line-height:var(--n-line-height-tight)}.n-badge{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto;border-radius:var(--n-border-radius-pill);border:1px solid var(--_n-badge-border-color);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-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s);color:var(--_n-badge-background-color);gap:var(--n-space-xs);align-items:center;display:inline-flex;white-space:nowrap;position:relative}:host(:is([variant=success],[type=success])){--_n-badge-chip-color:var(--n-color-status-success-weak);--_n-badge-border-color:var(--n-color-border-success);--_n-badge-background-color:var(--n-color-text-success)}:host(:is([variant=warning],[type=warning])){--_n-badge-chip-color:var(--n-color-status-warning-weak);--_n-badge-border-color:var(--n-color-border-warning);--_n-badge-background-color:var(--n-color-text-warning)}:host(:is([variant=highlight],[type=highlight])){--_n-badge-chip-color:var(--n-color-status-highlight-weak);--_n-badge-border-color:var(--n-color-border-highlight);--_n-badge-background-color:var(--n-color-text-highlight)}:host(:is([variant=info],[type=info],[type=progress])){--_n-badge-chip-color:var(--n-color-status-info-weak);--_n-badge-border-color:var(--n-color-border-info);--_n-badge-background-color:var(--n-color-text-info)}:host(:is([variant=danger],[type=danger])){--_n-badge-chip-color:var(--n-color-status-danger-weak);--_n-badge-border-color:var(--n-color-border-danger);--_n-badge-background-color:var(--n-color-text-danger)}:host([strong]){--_n-badge-chip-color:var(--n-color-status-neutral);--_n-badge-border-color:var(--n-color-border-neutral);--_n-badge-background-color:var(--n-color-text-neutral-strong)}:host(:is([variant=success],[type=success])[strong]){--_n-badge-chip-color:var(--n-color-status-success);--_n-badge-border-color:var(--n-color-status-success);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=warning],[type=warning])[strong]){--_n-badge-chip-color:var(--n-color-status-warning);--_n-badge-border-color:var(--n-color-status-warning);--_n-badge-background-color:var(--n-color-text-warning-strong)}:host(:is([variant=highlight],[type=highlight])[strong]){--_n-badge-chip-color:var(--n-color-status-highlight);--_n-badge-border-color:var(--n-color-status-highlight);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=info],[type=info],[type=progress])[strong]){--_n-badge-chip-color:var(--n-color-status-info);--_n-badge-border-color:var(--n-color-status-info);--_n-badge-background-color:var(--n-color-text-on-accent)}:host(:is([variant=danger],[type=danger])[strong]){--_n-badge-chip-color:var(--n-color-status-danger);--_n-badge-border-color:var(--n-color-status-danger);--_n-badge-background-color:var(--n-color-text-on-accent)}::slotted(nord-icon:not([size])){--_n-icon-size:var(--n-size-icon-xxs);transform:translateY(-.5px)}`;let Ct=class extends lt{constructor(){super(...arguments),this.strong=!1}render(){return q`<span class="n-badge"><slot name="icon"></slot><slot></slot></span>`}};Ct.styles=[$t,St],mt([wt({reflect:!0})],Ct.prototype,"type",void 0),mt([wt({reflect:!0})],Ct.prototype,"variant",void 0),mt([wt({reflect:!0,type:Boolean})],Ct.prototype,"strong",void 0),Ct=mt([ft("nord-badge")],Ct);var Et=Ct;
|
|
49
49
|
/**
|
|
50
50
|
* @license
|
|
51
51
|
* Copyright 2020 Google LLC
|
|
@@ -70,7 +70,7 @@ const ft=t=>(e,n)=>{void 0!==n?n.addInitializer((()=>{customElements.define(t,e)
|
|
|
70
70
|
* @license
|
|
71
71
|
* Copyright 2018 Google LLC
|
|
72
72
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
73
|
-
*/const Jt=t=>t??H,te=i`:host{--_n-spinner-color:var(--n-spinner-color, var(--n-color-accent));--_n-spinner-size:var(--n-size-icon-m);--_n-spinner-border-width:calc(var(--_n-spinner-size) * 0.18);--_n-spinner-duration:0.66s;inline-size:var(--_n-spinner-size);block-size:var(--_n-spinner-size);display:inline-flex;position:relative;color:inherit}:host([size=xs]){--_n-spinner-size:var(--n-size-icon-xs)}:host([size="s"]){--_n-spinner-size:var(--n-size-icon-s)}:host([size="l"]){--_n-spinner-size:var(--n-size-icon-l)}:host([size=xl]){--_n-spinner-size:var(--n-size-icon-xl)}:host([size=xxl]){--_n-spinner-size:var(--n-size-icon-xxl)}.n-spinner,.n-spinner::after{position:absolute;z-index:var(--n-index-spinner);border-radius:var(--n-border-radius-circle);border:var(--_n-spinner-border-width) solid}.n-spinner{inset:0;border-color:transparent;border-block-end-color:var(--_n-spinner-color);animation:nRotate var(--_n-spinner-duration) linear infinite}.n-spinner::after{content:"";inset:calc(var(--_n-spinner-border-width) * -1);opacity:.3;border-color:var(--_n-spinner-color);border-block-end-color:transparent}@keyframes nRotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}`;let ee=class extends lt{constructor(){super(...arguments),this.size="m"}render(){return q`<div class="n-spinner" role="${Zt(this.label,"img")}" aria-label="${Jt(this.label)}" style="${Zt(this.color,`--_n-spinner-color:${this.color}`)}"></div>`}};ee.styles=[$t,te],mt([wt({reflect:!0})],ee.prototype,"size",void 0),mt([wt({reflect:!0})],ee.prototype,"color",void 0),mt([wt({reflect:!0})],ee.prototype,"label",void 0),ee=mt([ft("nord-spinner")],ee);var ne=ee;function oe(t){return class extends t{constructor(){super(...arguments),this.focusableRef=Yt()}focus(t){var e;null===(e=this.focusableRef.value)||void 0===e||e.focus(t)}blur(){var t;null===(t=this.focusableRef.value)||void 0===t||t.blur()}click(){var t;null===(t=this.focusableRef.value)||void 0===t||t.click()}}}function re(t){class e extends t{constructor(){super(...arguments),this.disabled=!1,this.value="",this.formAncestor=null}set form(t){const e=this._formId;this._formId=t,this.requestUpdate("form",e)}get form(){if(this._formId){return this.getRootNode().querySelector(`form#${this._formId}`)}return this.formAncestor}connectedCallback(){super.connectedCallback(),this.formAncestor=this.closest("form")}disconnectedCallback(){super.disconnectedCallback(),this.formAncestor=null}}return mt([wt({type:Boolean,reflect:!0})],e.prototype,"disabled",void 0),mt([wt({reflect:!0})],e.prototype,"name",void 0),mt([wt()],e.prototype,"value",void 0),mt([wt()],e.prototype,"form",null),e}const ie=i`:host{--_n-button-border-radius:var(--n-button-border-radius, var(--n-border-radius-s));--_n-button-gap:var(--n-button-gap, var(--n-space-s));--_n-button-gradient:var(--n-button-gradient, linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.013) 100%));--_n-button-background-color:var(--n-button-background-color, var(--n-color-button));--_n-button-border-color:var(--n-button-border-color, var(--n-color-border-strong));--_n-button-text-align:var(--n-button-text-align, center);--_n-button-box-shadow:var(--n-button-box-shadow, var(--n-box-shadow));--_n-button-color:var(--n-button-color, var(--n-color-text));--_n-button-padding-inline:var(--n-button-padding-inline, calc(var(--n-space-m) / 1.2));--_n-button-font-size:var(--n-button-font-size, var(--n-font-size-m));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight));--_n-button-min-block-size:var(--n-button-min-block-size, var(--n-space-xl));--_n-button-toggle-icon-color:var(--n-button-toggle-icon-color, var(--n-color-icon));--_n-button-overflow:var(--n-button-overflow, hidden);--_n-button-opacity:1;--_n-button-border-style:solid;--_n-button-inline-size:fit-content;--_n-button-padding-block:calc(var(--n-space-s) / 1.6);--_n-button-icon-size:var(--n-size-icon-s);display:inline-block}.n-button{-webkit-appearance:none;align-items:center;appearance:none;background:var(--_n-button-background-color);opacity:var(--_n-button-opacity);border-radius:var(--_n-button-border-radius);border:1px var(--_n-button-border-style) var(--_n-button-border-color);box-shadow:var(--_n-button-box-shadow);color:var(--_n-button-color);cursor:pointer;display:flex;gap:var(--_n-button-gap);font-family:var(--n-font-family);font-feature-settings:var(--n-font-features);font-size:var(--_n-button-font-size);font-weight:var(--_n-button-font-weight);line-height:var(--n-line-height-form);margin:0;min-block-size:var(--_n-button-min-block-size);padding:var(--_n-button-padding-block) var(--_n-button-padding-inline);text-align:var(--_n-button-text-align);text-decoration:none;transition:var(--n-transition-quickly);transition-property:background-color,opacity,color,box-shadow,border-color;-webkit-user-select:none;user-select:none;position:relative;inline-size:var(--_n-button-inline-size)}.n-button::after{content:"";position:absolute;background:0 0;background-image:var(--_n-button-gradient);border-radius:var(--_n-button-border-radius);background-repeat:repeat-x;inline-size:100%;inset-inline:0;block-size:100%;inset-block-start:0}:host([expand]){--_n-button-inline-size:100%;display:block}.n-content{flex:1;overflow:var(--_n-button-overflow);text-overflow:ellipsis;white-space:nowrap;position:relative}.n-button:hover{--_n-button-border-color:var(--n-button-border-color, var(--n-color-border-hover));--_n-button-background-color:var(--n-button-background-color, var(--n-color-button-hover))}.n-button:focus{outline:0}.n-button:focus-visible{--_n-button-border-color:var(--n-button-border-color, var(--n-color-accent));--_n-button-box-shadow:var(--n-button-box-shadow, 0 0 0 1px var(--n-color-accent), var(--n-box-shadow));--_n-button-border-style:solid}.n-button:active{opacity:.8;transform:translateY(1px);transition:none}:host([variant=primary]){--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-on-accent));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight-active))}:host([variant=primary]),:host([variant=primary]) .n-button:hover{--_n-button-border-color:var(--n-button-border-color, transparent);--_n-button-background-color:var(--n-button-background-color, var(--n-color-accent))}:host([variant=primary]) .n-button:hover{filter:brightness(93%)}:host([variant=primary]) .n-button:focus{--_n-button-box-shadow:var(--n-button-box-shadow, 0 0 0 1px var(--n-color-surface), 0 0 0 3px var(--_n-button-border-color))}:host([variant=dashed]){--_n-button-border-color:var(--n-button-border-color, var(--n-color-border-hover));--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-weaker));--_n-button-border-style:dashed}:host([variant=dashed]) .n-button:hover{--_n-button-color:var(--n-button-color, var(--n-color-text))}:host([variant=dashed]) .n-button::after{display:none}:host([variant=plain]){--_n-button-box-shadow:var(--n-button-box-shadow, none)}:host([variant=plain]),:host([variant=plain]) .n-button:hover{--_n-button-border-color:var(--n-button-border-color, transparent)}:host([variant=plain]) .n-button::after{display:none}:host([variant=danger]){--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-on-accent));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight-active))}:host([variant=danger]),:host([variant=danger]) .n-button:hover{--_n-button-border-color:var(--n-button-border-color, transparent);--_n-button-background-color:var(--n-button-background-color, var(--n-color-status-danger))}:host([variant=danger]) .n-button:hover{filter:brightness(93%)}:host([variant=danger]) .n-button:focus{--_n-button-border-color:var(--n-button-border-color, var(--n-color-status-danger));--_n-button-box-shadow:var(--n-button-box-shadow, 0 0 0 1px var(--n-color-surface), 0 0 0 3px var(--n-color-status-danger))}:host([disabled]){--_n-button-border-color:var(--n-button-border-color, var(--_n-button-background-color));--_n-button-background-color:var(--n-button-background-color, var(--n-color-border));--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-weak));--_n-button-opacity:0.5;pointer-events:none}:host([disabled]) .n-button::after{display:none}.n-button-spinner{position:absolute;transform:translateX(-50%) translateY(-50%);inset-block-start:50%;inset-inline-start:50%}:host([loading]:not([href])){pointer-events:none}:host([loading]:not([href])) .n-content,:host([loading]:not([href])) ::slotted([slot=end]),:host([loading]:not([href])) ::slotted([slot=start]){opacity:0}:host([size="s"]){--_n-button-gap:var(--n-button-gap, var(--n-space-xs));--_n-button-padding-inline:var(--n-button-padding-inline, calc(var(--n-space-s) + 1px));--_n-button-font-size:var(--n-button-font-size, var(--n-font-size-s));--_n-button-min-block-size:var(--n-button-min-block-size, calc(var(--n-space-l) + var(--n-space-xs)));--_n-button-padding-block:calc(var(--n-space-xs) - 1px);--_n-button-icon-size:var(--n-size-icon-xs)}:host([size="l"]){--_n-button-border-radius:var(--n-button-border-radius, var(--n-border-radius));--_n-button-padding-inline:var(--n-button-padding-inline, calc(var(--n-space-l) / 1.3));--_n-button-font-size:var(--n-button-font-size, var(--n-font-size-l));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight-active));--_n-button-min-block-size:var(--n-button-min-block-size, calc(var(--n-space-xxl) - var(--n-space-l)));--_n-button-icon-size:var(--n-size-icon-m)}:host([square]){--_n-button-inline-size:var(--_n-button-min-block-size);--_n-button-padding-block:0;--_n-button-padding-inline:0}:host([square]) .n-content{display:flex;justify-content:center;align-items:center}::slotted(*){color:inherit;pointer-events:none}::slotted(svg){color:var(--n-color-icon)}::slotted(button[slot=proxy]){display:none}:host(:not([variant=primary],[variant=danger])) ::slotted(nord-icon){color:var(--n-color-icon)}:host(:not([variant=primary],[variant=danger])) .n-toggle-icon{color:var(--_n-button-toggle-icon-color)}:host(:not([square])) slot:not([name])::slotted(nord-icon){transform:translateY(1px)}::slotted(nord-icon:not([size])),nord-icon{--_n-icon-size:var(--_n-button-icon-size)}`;class ae{constructor(t,e=""){this.host=t,this.slotName=e,this.handleSlotChange=t=>{t.target.name===this.slotName&&this.onChange(t)},t.addController(this),this.events=new Kt(t),this.selector=e?`:scope > [slot="${e}"]`:":scope > :not([slot])"}hostConnected(){this.host.shadowRoot&&this.events.listen(this.host.shadowRoot,"slotchange",this.handleSlotChange)}get hasContent(){return null!=this.content}get isEmpty(){return!this.hasContent}get content(){return this.host.querySelector(this.selector)}get assigned(){return Array.from(this.host.querySelectorAll(this.selector))}onChange(t){this.host.requestUpdate()}}let se=class extends(re(oe(lt))){constructor(){super(...arguments),this.defaultSlot=new ae(this),this.buttonRef=Yt(),this.events=new Kt(this),this.lightDom=new Qt(this,{render:()=>this.renderLightDom()}),this.variant="default",this.type="submit",this.size="m",this.download=!1,this.target="_self",this.expand=!1,this.square=!1,this.loading=!1,this.hideDropdownIcon=!1,this.handleOuterClick=t=>{t.composedPath().some((t=>t===this.focusableRef.value||t===this.buttonRef.value))||t.stopPropagation()}}connectedCallback(){super.connectedCallback(),this.events.listen(this,"click",this.handleOuterClick,!0)}render(){var t;const e="toggle"===(null===(t=this.assignedSlot)||void 0===t?void 0:t.name),n=this.defaultSlot.assigned.some((t=>"nord-icon"===t.localName)),o=e&&!this.hideDropdownIcon&&!n&&!this.href,r=q`<slot name="start"></slot><div class="n-content"><slot></slot></div><nord-spinner class="n-button-spinner" color="currentColor" ?hidden="${!this.loading||Boolean(this.href)}"></nord-spinner><slot name="end">${o?q`<nord-icon name="interface-dropdown-small" class="n-toggle-icon"></nord-icon>`:H}</slot>`;return this.href?this.renderLink(r):this.renderButton(r)}renderLink(t){return q`<a ${Xt(this.focusableRef)} class="n-button" target="${this.target}" ?download="${this.download}" href="${Zt(this.disabled,H,this.href)}" tabindex="${Zt(this.disabled,"-1")}" aria-disabled="${Zt(this.disabled,"true")}" role="${Zt(this.disabled,"link")}">${t}</a>`}renderButton(t){return q`<slot name="proxy" @slotchange="${this.handleProxyChange}"></slot><button ${Xt(this.focusableRef)} class="n-button" ?disabled="${this.disabled}" name="${Zt(this.name)}" value="${Zt(this.value)}" @click="${this.handleClick}" aria-disabled="${Zt(this.loading,"true")}" aria-expanded="${Zt(this.accessibleExpanded)}" aria-haspopup="${Zt(this.accessibleHasPopup)}">${t}</button>`}renderLightDom(){return this.href||!this.form?H:q`<button ${Xt(this.buttonRef)} slot="proxy" name="${Zt(this.name)}" value="${Zt(this.value)}" ?disabled="${this.disabled}" form="${Zt(this._formId)}" type="${this.type}"></button>`}handleClick(t){this.buttonRef.value&&(t.stopPropagation(),this.buttonRef.value.click())}handleProxyChange(t){const e=t.target,n=this.buttonRef.value;n&&n.assignedSlot!==e&&this.appendChild(n)}};se.styles=[$t,ie],mt([wt({reflect:!0})],se.prototype,"variant",void 0),mt([wt({reflect:!0})],se.prototype,"type",void 0),mt([wt({reflect:!0})],se.prototype,"size",void 0),mt([wt({attribute:"aria-expanded"})],se.prototype,"accessibleExpanded",void 0),mt([wt({attribute:"aria-haspopup"})],se.prototype,"accessibleHasPopup",void 0),mt([wt({reflect:!0})],se.prototype,"href",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"download",void 0),mt([wt()],se.prototype,"target",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"expand",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"square",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"loading",void 0),mt([wt({reflect:!0,type:Boolean,attribute:"hide-dropdown-icon"})],se.prototype,"hideDropdownIcon",void 0),se=mt([ft("nord-button")],se);var le=se;const de=i`:host{--_n-card-padding:var(--n-card-padding, var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-m));--_n-card-box-shadow:var(--n-card-box-shadow, var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius, var(--n-border-radius));color:var(--n-color-text);display:block;inline-size:100%}.n-card{background:var(--n-color-surface);border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);block-size:100%;display:flex;flex-direction:column}.header{border-block-end:1px solid var(--n-color-border);padding:var(--n-space-m) var(--_n-card-slot-padding);display:flex;gap:var(--n-space-s);align-items:center;justify-content:space-between;flex-wrap:wrap}:host([padding="l"]){--_n-card-padding:var(--n-card-padding, var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding, 0)}slot{display:block}slot:not([name]){padding:var(--_n-card-padding);flex:1}slot[name=footer]{padding:var(--_n-card-slot-padding);padding-block-start:0;white-space:nowrap}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);display:flex;gap:var(--n-stack-gap);align-items:center;flex-wrap:wrap;margin-block-start:calc(var(--n-space-xs) * -1)!important;margin-block-end:calc(var(--n-space-xs) * -1)!important}::slotted([slot=header]){font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading);margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let ce=class extends lt{constructor(){super(...arguments),this.headerSlot=new ae(this,"header"),this.headerEndSlot=new ae(this,"header-end"),this.footerSlot=new ae(this,"footer"),this.padding="m"}render(){return q`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};ce.styles=[$t,de],mt([wt({reflect:!0})],ce.prototype,"padding",void 0),ce=mt([ft("nord-card")],ce);var he=ce;
|
|
73
|
+
*/const Jt=t=>t??H,te=i`:host{--_n-spinner-color:var(--n-spinner-color, var(--n-color-accent));--_n-spinner-size:var(--n-size-icon-m);--_n-spinner-border-width:calc(var(--_n-spinner-size) * 0.18);--_n-spinner-duration:0.66s;inline-size:var(--_n-spinner-size);block-size:var(--_n-spinner-size);display:inline-flex;position:relative;color:inherit}:host([size=xs]){--_n-spinner-size:var(--n-size-icon-xs)}:host([size="s"]){--_n-spinner-size:var(--n-size-icon-s)}:host([size="l"]){--_n-spinner-size:var(--n-size-icon-l)}:host([size=xl]){--_n-spinner-size:var(--n-size-icon-xl)}:host([size=xxl]){--_n-spinner-size:var(--n-size-icon-xxl)}.n-spinner,.n-spinner::after{position:absolute;z-index:var(--n-index-spinner);border-radius:var(--n-border-radius-circle);border:var(--_n-spinner-border-width) solid}.n-spinner{inset:0;border-color:transparent;border-block-end-color:var(--_n-spinner-color);animation:nRotate var(--_n-spinner-duration) linear infinite}.n-spinner::after{content:"";inset:calc(var(--_n-spinner-border-width) * -1);opacity:.3;border-color:var(--_n-spinner-color);border-block-end-color:transparent}@keyframes nRotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}`;let ee=class extends lt{constructor(){super(...arguments),this.size="m"}render(){return q`<div class="n-spinner" role="${Zt(this.label,"img")}" aria-label="${Jt(this.label)}" style="${Zt(this.color,`--_n-spinner-color:${this.color}`)}"></div>`}};ee.styles=[$t,te],mt([wt({reflect:!0})],ee.prototype,"size",void 0),mt([wt({reflect:!0})],ee.prototype,"color",void 0),mt([wt({reflect:!0})],ee.prototype,"label",void 0),ee=mt([ft("nord-spinner")],ee);var ne=ee;function oe(t){return class extends t{constructor(){super(...arguments),this.focusableRef=Yt()}focus(t){var e;null===(e=this.focusableRef.value)||void 0===e||e.focus(t)}blur(){var t;null===(t=this.focusableRef.value)||void 0===t||t.blur()}click(){var t;null===(t=this.focusableRef.value)||void 0===t||t.click()}}}function re(t){class e extends t{constructor(){super(...arguments),this.disabled=!1,this.value="",this.formAncestor=null}set form(t){const e=this._formId;this._formId=t,this.requestUpdate("form",e)}get form(){if(this._formId){return this.getRootNode().querySelector(`form#${this._formId}`)}return this.formAncestor}connectedCallback(){super.connectedCallback(),this.formAncestor=this.closest("form")}disconnectedCallback(){super.disconnectedCallback(),this.formAncestor=null}}return mt([wt({type:Boolean,reflect:!0})],e.prototype,"disabled",void 0),mt([wt({reflect:!0})],e.prototype,"name",void 0),mt([wt()],e.prototype,"value",void 0),mt([wt()],e.prototype,"form",null),e}const ie=i`:host{--_n-button-border-radius:var(--n-button-border-radius, var(--n-border-radius-s));--_n-button-gap:var(--n-button-gap, var(--n-space-s));--_n-button-gradient:var(--n-button-gradient, linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.013) 100%));--_n-button-background-color:var(--n-button-background-color, var(--n-color-button));--_n-button-border-color:var(--n-button-border-color, var(--n-color-border-strong));--_n-button-text-align:var(--n-button-text-align, center);--_n-button-box-shadow:var(--n-button-box-shadow, var(--n-box-shadow));--_n-button-color:var(--n-button-color, var(--n-color-text));--_n-button-padding-inline:var(--n-button-padding-inline, calc(var(--n-space-m) / 1.2));--_n-button-font-size:var(--n-button-font-size, var(--n-font-size-m));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight));--_n-button-min-block-size:var(--n-button-min-block-size, var(--n-space-xl));--_n-button-toggle-icon-color:var(--n-button-toggle-icon-color, var(--n-color-icon));--_n-button-overflow:var(--n-button-overflow, hidden);--_n-button-opacity:1;--_n-button-border-style:solid;--_n-button-inline-size:fit-content;--_n-button-padding-block:calc(var(--n-space-s) / 1.6);--_n-button-icon-size:var(--n-size-icon-s);display:inline-block}.n-button{-webkit-appearance:none;align-items:center;appearance:none;background:var(--_n-button-background-color);opacity:var(--_n-button-opacity);border-radius:var(--_n-button-border-radius);border:1px var(--_n-button-border-style) var(--_n-button-border-color);box-shadow:var(--_n-button-box-shadow);color:var(--_n-button-color);cursor:pointer;display:flex;gap:var(--_n-button-gap);font-family:var(--n-font-family);font-feature-settings:var(--n-font-features);font-size:var(--_n-button-font-size);font-weight:var(--_n-button-font-weight);line-height:var(--n-line-height-form);margin:0;min-block-size:var(--_n-button-min-block-size);padding:var(--_n-button-padding-block) var(--_n-button-padding-inline);text-align:var(--_n-button-text-align);text-decoration:none;transition:var(--n-transition-quickly);transition-property:background-color,opacity,color,box-shadow,border-color;-webkit-user-select:none;user-select:none;position:relative;inline-size:var(--_n-button-inline-size)}.n-button::after{content:"";position:absolute;background:0 0;background-image:var(--_n-button-gradient);border-radius:var(--_n-button-border-radius);background-repeat:repeat-x;inline-size:100%;inset-inline:0;block-size:100%;inset-block-start:0}:host([expand]){--_n-button-inline-size:100%;display:block}.n-content{flex:1;overflow:var(--_n-button-overflow);text-overflow:ellipsis;white-space:nowrap;position:relative}.n-button:hover{--_n-button-border-color:var(--n-button-border-color, var(--n-color-border-hover));--_n-button-background-color:var(--n-button-background-color, var(--n-color-button-hover))}.n-button:focus{outline:0}.n-button:focus-visible{--_n-button-border-color:var(--n-button-border-color, var(--n-color-accent));--_n-button-box-shadow:var(--n-button-box-shadow, 0 0 0 1px var(--n-color-accent), var(--n-box-shadow));--_n-button-border-style:solid}.n-button:active{opacity:.8;transform:translateY(1px);transition:none}:host([variant=primary]){--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-on-accent));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight-active))}:host([variant=primary]),:host([variant=primary]) .n-button:hover{--_n-button-border-color:var(--n-button-border-color, transparent);--_n-button-background-color:var(--n-button-background-color, var(--n-color-accent))}:host([variant=primary]) .n-button:hover{filter:brightness(93%)}:host([variant=primary]) .n-button:focus{--_n-button-box-shadow:var(--n-button-box-shadow, 0 0 0 1px var(--n-color-surface), 0 0 0 3px var(--_n-button-border-color))}:host([variant=dashed]){--_n-button-border-color:var(--n-button-border-color, var(--n-color-border-hover));--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-weaker));--_n-button-border-style:dashed}:host([variant=dashed]) .n-button:hover{--_n-button-color:var(--n-button-color, var(--n-color-text))}:host([variant=dashed]) .n-button::after{display:none}:host([variant=plain]){--_n-button-box-shadow:var(--n-button-box-shadow, none)}:host([variant=plain]),:host([variant=plain]) .n-button:hover{--_n-button-border-color:var(--n-button-border-color, transparent)}:host([variant=plain]) .n-button::after{display:none}:host([variant=danger]){--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-on-accent));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight-active))}:host([variant=danger]),:host([variant=danger]) .n-button:hover{--_n-button-border-color:var(--n-button-border-color, transparent);--_n-button-background-color:var(--n-button-background-color, var(--n-color-status-danger))}:host([variant=danger]) .n-button:hover{filter:brightness(93%)}:host([variant=danger]) .n-button:focus{--_n-button-border-color:var(--n-button-border-color, var(--n-color-status-danger));--_n-button-box-shadow:var(--n-button-box-shadow, 0 0 0 1px var(--n-color-surface), 0 0 0 3px var(--n-color-status-danger))}:host([disabled]){--_n-button-border-color:var(--n-button-border-color, var(--_n-button-background-color));--_n-button-background-color:var(--n-button-background-color, var(--n-color-border));--_n-button-box-shadow:var(--n-button-box-shadow, none);--_n-button-color:var(--n-button-color, var(--n-color-text-weak));--_n-button-opacity:0.5;pointer-events:none}:host([disabled]) .n-button::after{display:none}.n-button-spinner{position:absolute;transform:translateX(-50%) translateY(-50%);inset-block-start:50%;inset-inline-start:50%}:host([loading]:not([href])){pointer-events:none}:host([loading]:not([href])) .n-content,:host([loading]:not([href])) ::slotted([slot=end]),:host([loading]:not([href])) ::slotted([slot=start]){opacity:0}:host([size="s"]){--_n-button-gap:var(--n-button-gap, var(--n-space-xs));--_n-button-padding-inline:var(--n-button-padding-inline, calc(var(--n-space-s) + 1px));--_n-button-font-size:var(--n-button-font-size, var(--n-font-size-s));--_n-button-min-block-size:var(--n-button-min-block-size, calc(var(--n-space-l) + var(--n-space-xs)));--_n-button-padding-block:calc(var(--n-space-xs) - 1px);--_n-button-icon-size:var(--n-size-icon-xs)}:host([size="l"]){--_n-button-border-radius:var(--n-button-border-radius, var(--n-border-radius));--_n-button-padding-inline:var(--n-button-padding-inline, calc(var(--n-space-l) / 1.3));--_n-button-font-size:var(--n-button-font-size, var(--n-font-size-l));--_n-button-font-weight:var(--n-button-font-weight, var(--n-font-weight-active));--_n-button-min-block-size:var(--n-button-min-block-size, calc(var(--n-space-xxl) - var(--n-space-l)));--_n-button-icon-size:var(--n-size-icon-m)}:host([square]){--_n-button-inline-size:var(--_n-button-min-block-size);--_n-button-padding-block:0;--_n-button-padding-inline:0}:host([square]) .n-content{display:flex;justify-content:center;align-items:center}::slotted(*){color:inherit;pointer-events:none}::slotted(svg){color:var(--n-color-icon)}::slotted(button[slot=proxy]){display:none}:host(:not([variant=primary],[variant=danger])) ::slotted(nord-icon){color:var(--n-color-icon)}:host(:not([variant=primary],[variant=danger])) .n-toggle-icon{color:var(--_n-button-toggle-icon-color)}:host(:not([square])) slot:not([name])::slotted(nord-icon){transform:translateY(1px)}::slotted(nord-icon:not([size])),nord-icon{--_n-icon-size:var(--_n-button-icon-size)}`;class ae{constructor(t,e=""){this.host=t,this.slotName=e,this.handleSlotChange=t=>{t.target.name===this.slotName&&this.onChange(t)},t.addController(this),this.events=new Kt(t),this.selector=e?`:scope > [slot="${e}"]`:":scope > :not([slot])"}hostConnected(){this.host.shadowRoot&&this.events.listen(this.host.shadowRoot,"slotchange",this.handleSlotChange)}get hasContent(){return null!=this.content}get isEmpty(){return!this.hasContent}get content(){return this.host.querySelector(this.selector)}get assigned(){return Array.from(this.host.querySelectorAll(this.selector))}onChange(t){this.host.requestUpdate()}}let se=class extends(re(oe(lt))){constructor(){super(...arguments),this.defaultSlot=new ae(this),this.buttonRef=Yt(),this.events=new Kt(this),this.lightDom=new Qt(this,{render:()=>this.renderLightDom()}),this.variant="default",this.type="submit",this.size="m",this.download=!1,this.target="_self",this.expand=!1,this.square=!1,this.loading=!1,this.hideDropdownIcon=!1,this.handleOuterClick=t=>{t.composedPath().some((t=>t===this.focusableRef.value||t===this.buttonRef.value))||t.stopPropagation()}}connectedCallback(){super.connectedCallback(),this.events.listen(this,"click",this.handleOuterClick,!0)}render(){var t;const e="toggle"===(null===(t=this.assignedSlot)||void 0===t?void 0:t.name),n=this.defaultSlot.assigned.some((t=>"nord-icon"===t.localName)),o=e&&!this.hideDropdownIcon&&!n&&!this.href,r=q`<slot name="start"></slot><div class="n-content"><slot></slot></div><nord-spinner class="n-button-spinner" color="currentColor" ?hidden="${!this.loading||Boolean(this.href)}"></nord-spinner><slot name="end">${o?q`<nord-icon name="interface-dropdown-small" class="n-toggle-icon"></nord-icon>`:H}</slot>`;return this.href?this.renderLink(r):this.renderButton(r)}renderLink(t){return q`<a ${Xt(this.focusableRef)} class="n-button" target="${this.target}" ?download="${this.download}" href="${Zt(this.disabled,H,this.href)}" tabindex="${Zt(this.disabled,"-1")}" aria-disabled="${Zt(this.disabled,"true")}" role="${Zt(this.disabled,"link")}">${t}</a>`}renderButton(t){return q`<slot name="proxy" @slotchange="${this.handleProxyChange}"></slot><button ${Xt(this.focusableRef)} class="n-button" ?disabled="${this.disabled}" name="${Zt(this.name)}" value="${Zt(this.value)}" @click="${this.handleClick}" aria-disabled="${Zt(this.loading,"true")}" aria-expanded="${Zt(this.accessibleExpanded)}" aria-haspopup="${Zt(this.accessibleHasPopup)}">${t}</button>`}renderLightDom(){return this.href||!this.form?H:q`<button ${Xt(this.buttonRef)} slot="proxy" name="${Zt(this.name)}" value="${Zt(this.value)}" ?disabled="${this.disabled}" form="${Zt(this._formId)}" type="${this.type}"></button>`}handleClick(t){this.buttonRef.value&&(t.stopPropagation(),this.buttonRef.value.click())}handleProxyChange(t){const e=t.target,n=this.buttonRef.value;n&&n.assignedSlot!==e&&this.appendChild(n)}};se.styles=[$t,ie],mt([wt({reflect:!0})],se.prototype,"variant",void 0),mt([wt({reflect:!0})],se.prototype,"type",void 0),mt([wt({reflect:!0})],se.prototype,"size",void 0),mt([wt({attribute:"aria-expanded"})],se.prototype,"accessibleExpanded",void 0),mt([wt({attribute:"aria-haspopup"})],se.prototype,"accessibleHasPopup",void 0),mt([wt({reflect:!0})],se.prototype,"href",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"download",void 0),mt([wt()],se.prototype,"target",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"expand",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"square",void 0),mt([wt({reflect:!0,type:Boolean})],se.prototype,"loading",void 0),mt([wt({reflect:!0,type:Boolean,attribute:"hide-dropdown-icon"})],se.prototype,"hideDropdownIcon",void 0),se=mt([ft("nord-button")],se);var le=se;const de=i`:host{--_n-card-padding:var(--n-card-padding, var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-m));--_n-card-box-shadow:var(--n-card-box-shadow, var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius, var(--n-border-radius));--_n-card-header-background:var(--n-card-header-background, transparent);color:var(--n-color-text);display:block;inline-size:100%}.n-card{background:var(--n-color-surface);border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);block-size:100%;display:flex;flex-direction:column}.header{background-color:var(--_n-card-header-background);border-block-end:1px solid var(--n-color-border);border-start-start-radius:var(--_n-card-border-radius);border-start-end-radius:var(--_n-card-border-radius);padding:var(--n-space-m) var(--_n-card-slot-padding);display:flex;gap:var(--n-space-s);align-items:center;justify-content:space-between;flex-wrap:wrap}:host([padding="l"]){--_n-card-padding:var(--n-card-padding, var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding, 0)}slot{display:block}slot:not([name]){padding:var(--_n-card-padding);flex:1}slot[name=footer]{padding:var(--_n-card-slot-padding);padding-block-start:0;white-space:nowrap}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);display:flex;gap:var(--n-stack-gap);align-items:center;flex-wrap:wrap;margin-block-start:calc(var(--n-space-xs) * -1)!important;margin-block-end:calc(var(--n-space-xs) * -1)!important}::slotted([slot=header]){font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading);margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let ce=class extends lt{constructor(){super(...arguments),this.headerSlot=new ae(this,"header"),this.headerEndSlot=new ae(this,"header-end"),this.footerSlot=new ae(this,"footer"),this.padding="m"}render(){return q`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};ce.styles=[$t,de],mt([wt({reflect:!0})],ce.prototype,"padding",void 0),ce=mt([ft("nord-card")],ce);var he=ce;
|
|
74
74
|
/**
|
|
75
75
|
* @license
|
|
76
76
|
* Copyright 2018 Google LLC
|
|
@@ -86,7 +86,7 @@ const ft=t=>(e,n)=>{void 0!==n?n.addInitializer((()=>{customElements.define(t,e)
|
|
|
86
86
|
* Copyright 2017 Google LLC
|
|
87
87
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
88
88
|
*/
|
|
89
|
-
let Be=class extends Mt{constructor(t){if(super(t),this.it=H,t.type!==Nt)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===H||null==t)return this._t=void 0,this.it=t;if(t===j)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;const e=[t];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}};Be.directiveName="unsafeHTML",Be.resultType=1;const Ie=Lt(Be),Ne=t=>fetch(`https://nordcdn.net/ds/icons/3.
|
|
89
|
+
let Be=class extends Mt{constructor(t){if(super(t),this.it=H,t.type!==Nt)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(t){if(t===H||null==t)return this._t=void 0,this.it=t;if(t===j)return t;if("string"!=typeof t)throw Error(this.constructor.directiveName+"() called with a non-string value");if(t===this.it)return this._t;this.it=t;const e=[t];return e.raw=e,this._t={_$litType$:this.constructor.resultType,strings:e,values:[]}}};Be.directiveName="unsafeHTML",Be.resultType=1;const Ie=Lt(Be),Ne=t=>fetch(`https://nordcdn.net/ds/icons/3.12.0-alpha.0/assets/${t}.svg`).then((e=>{if(!e.ok)throw new TypeError(`NORD: unknown icon: '${t}'`);return e.text()}));const Le=i`:host{--_n-icon-size:var(--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}`;class Me{constructor(t,e,n,o){this.host=t,this.key=e,this.cb=n,this.lifecycle=o,t.addController(this)}hostUpdate(){"update"===this.lifecycle&&this.handle()}hostUpdated(){"updated"===this.lifecycle&&this.handle()}handle(){const{key:t,_value:e,host:n}=this,o=n[t];e!==o&&(this._value=o,this.cb.call(n,e,o,t))}}function Pe(t,e="update"){return function(n,o){n.constructor.addInitializer((n=>{const r=n[o];n.addController(new Me(n,t,r,e))}))}}var Fe;let Ue=Fe=class extends lt{constructor(){super(...arguments),this.name="",this.svg=""}static registerResolver(t){this.manager.resolver=t}static registerIcon(t,e){return this.manager.registerIcon(t,e)}render(){return q`<div role="${Zt(this.label,"img")}" style="${Zt(this.color,`color:${this.color}`)}" aria-label="${Jt(this.label)}"><slot aria-hidden="true"></slot><div aria-hidden="true">${Ie(this.svg)}</div></div>`}handleNameChange(){this.name?Fe.manager.resolve(this.name,(t=>{this.svg=t})):this.svg=""}};Ue.styles=[$t,Le],Ue.manager=new class{constructor(){this.cache=new Map,this.resolver=Ne}resolve(t,e){let n=this.cache.get(t);"string"!=typeof n?(n||(n=this.resolver(t).catch((()=>"")).then((e=>(this.cache.set(t,e),e))),this.cache.set(t,n)),n.then(e)):e(n)}registerIcon(t,e){let n,o;if("string"==typeof t?(n=t,o=e):(n=t.title,o=t.default),!n)throw new Error("name is required when registering an icon");if(!o)throw new Error("icon must not be empty");this.cache.set(n,o)}clear(){this.cache.clear()}},mt([wt({reflect:!0})],Ue.prototype,"name",void 0),mt([wt({reflect:!0})],Ue.prototype,"size",void 0),mt([wt({reflect:!0})],Ue.prototype,"color",void 0),mt([wt({reflect:!0})],Ue.prototype,"label",void 0),mt([kt()],Ue.prototype,"svg",void 0),mt([Pe("name")],Ue.prototype,"handleNameChange",null),Ue=Fe=mt([ft("nord-icon")],Ue);var qe=Ue;qe.registerIcon(ge);const je=t=>t?`${t}px`:void 0;let He=class extends(Ee(ze(Se($e(Ce(re(oe(lt)))))))){constructor(){super(...arguments),this.startObserver=new Oe(this,(()=>this.startSlot)),this.endObserver=new Oe(this,(()=>this.endSlot)),this.direction=new Re(this),this.type="text",this.expand=!1,this.disallowPattern=void 0,this.handleInputChange=t=>{const e=t.target;this.disallowPattern&&function(t,e){const{value:n}=t,o=t.selectionStart,r=n.slice(0,o),i=n.slice(o,n.length),a=r.replace(e,""),s=a+i.replace(e,""),l=a.length;t.value=s,t.selectionStart=l,t.selectionEnd=l}(e,new RegExp(this.disallowPattern,"g")),this.handleInput(t)}}render(){var t;const e="number"===this.type;return q`${this.renderLabel()}<div class="${pe({"n-input-container":!0,"is-rtl":"rtl"===this.direction.dir})}" style="${be({"--_n-input-start-inline-size":je(this.startObserver.inlineSize),"--_n-input-end-inline-size":je(this.endObserver.inlineSize)})}"><slot name="start">${"search"===this.type?q`<nord-icon name="navigation-search"></nord-icon>`:H}</slot><input ${Xt(this.textSelectableRef)} ${Xt(this.focusableRef)} id="${this.inputId}" class="n-input" type="${e||"unit"===this.type?"text":this.type}" inputmode="${Zt(e,"numeric")}" pattern="${Zt(e,"[0-9]*")}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" name="${Jt(this.name)}" .value="${null!==(t=this.value)&&void 0!==t?t:""}" placeholder="${Jt(this.placeholder)}" @input="${this.handleInputChange}" @change="${this.handleChange}" @keydown="${this.handleKeydown}" @select="${this.handleSelect}" aria-describedby="${Jt(this.getDescribedBy())}" aria-invalid="${Jt(this.getInvalid())}" spellcheck="false" autocomplete="${this.autocomplete}"><slot name="end"></slot></div>${this.renderError()}`}handleKeydown(t){if("Enter"!==t.key)return;const{form:e}=this;if(e){const t=function(t){let e=t.querySelector('button[type="submit"]');!e&&t.id&&(e=t.getRootNode().querySelector(`button[form=${t.id}]`));return e}(e);setTimeout((()=>null==t?void 0:t.click()),0)}}handleSelect(t){t.stopPropagation(),this.dispatchEvent(new fe("select"))}};He.styles=[$t,Ae,De,Te],mt([zt("slot[name='start']")],He.prototype,"startSlot",void 0),mt([zt("slot[name='end']")],He.prototype,"endSlot",void 0),mt([wt({reflect:!0})],He.prototype,"type",void 0),mt([wt({reflect:!0,type:Boolean})],He.prototype,"expand",void 0),mt([wt({reflect:!0,attribute:"disallow-pattern"})],He.prototype,"disallowPattern",void 0),He=mt([ft("nord-input")],He);var We=He;
|
|
90
90
|
/**
|
|
91
91
|
* @license
|
|
92
92
|
* Copyright 2017 Google LLC
|