@nordhealth/components 4.12.0 → 4.12.2

package/lib/Drawer.js

@@ -1,2 +1,2 @@
-import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as e,html as t}from"lit";import{property as d,customElement as n}from"lit/decorators.js";import{S as s}from"./SlotController-Z6eG7LSZ.js";import"./Footer.js";import{s as a}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";const i=r`:host{--_n-drawer-padding:var(--n-drawer-padding, var(--n-space-l))}.n-drawer{--n-footer-box-shadow:none;display:flex;flex-direction:column;block-size:100%}.n-drawer-main{flex:1;padding:var(--_n-drawer-padding);overflow-y:auto}:host([padding=none]){--_n-drawer-padding:var(--n-drawer-padding, 0)}::slotted(nord-header){--_n-header-box-shadow:none}`;let l=class extends e{constructor(){super(...arguments),this.footerSlot=new s(this,"footer"),this.padding="m"}render(){return t`<div class="n-drawer"><slot name="header"></slot><div class="n-drawer-main"><slot></slot></div><nord-footer ?hidden="${this.footerSlot.isEmpty}"><slot name="${this.footerSlot.slotName}"></slot></nord-footer></div>`}};l.styles=[a,i],o([d({reflect:!0})],l.prototype,"padding",void 0),l=o([n("nord-drawer")],l);var p=l;export{p as default};
+import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as e,html as t}from"lit";import{property as d,customElement as n}from"lit/decorators.js";import{S as a}from"./SlotController-Z6eG7LSZ.js";import{s}from"./Component-DSU3Qp0O.js";import"./Footer.js";import"./EventController-BBOmvfLa.js";const i=r`:host{--_n-drawer-padding:var(--n-drawer-padding, var(--n-space-l))}.n-drawer{--n-footer-box-shadow:none;display:flex;flex-direction:column;block-size:100%}.n-drawer-main{flex:1;padding:var(--_n-drawer-padding);overflow-y:auto}:host([padding=none]){--_n-drawer-padding:var(--n-drawer-padding, 0)}::slotted(nord-header){--_n-header-box-shadow:none}`;let l=class extends e{constructor(){super(...arguments),this.footerSlot=new a(this,"footer"),this.padding="m"}render(){return t`<div class="n-drawer"><slot name="header"></slot><div class="n-drawer-main"><slot></slot></div><nord-footer ?hidden="${this.footerSlot.isEmpty}"><slot name="${this.footerSlot.slotName}"></slot></nord-footer></div>`}};l.styles=[s,i],o([d({reflect:!0})],l.prototype,"padding",void 0),l=o([n("nord-drawer")],l);var p=l;export{p as default};
 //# sourceMappingURL=Drawer.js.map

package/lib/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sources":["../src/drawer/Drawer.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\n\nimport \"../footer/Footer.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Drawer.css\"\n\n/**\n * Drawer is used to display context-sensitive actions and  information.\n * Drawer doesn’t block users from completing their task, like a modal would.\n *\n * @status new\n * @category structure\n * @slot header - Optional slot that holds a header for the drawer.\n * @slot - Default slot.\n * @slot footer - Optional slot that holds footer content for the drawer.\n *\n * @cssprop [--n-drawer-padding=var(--n-space-l)] - Controls the padding around the main area (the default slot), using our [spacing tokens](/tokens/#space).\n */\n@customElement(\"nord-drawer\")\nexport default class Drawer extends LitElement {\n  static styles = [componentStyle, style]\n\n  private footerSlot = new SlotController(this, \"footer\")\n\n  /**\n   * Controls the padding of the drawer component.\n   */\n  @property({ reflect: true }) padding: \"m\" | \"none\" = \"m\"\n\n  render() {\n    return html`\n      <div class=\"n-drawer\">\n        <slot name=\"header\"></slot>\n\n        <div class=\"n-drawer-main\">\n          <slot></slot>\n        </div>\n\n        <nord-footer ?hidden=${this.footerSlot.isEmpty}>\n          <slot name=${this.footerSlot.slotName}></slot>\n        </nord-footer>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-drawer\": Drawer\n  }\n}\n"],"names":["Drawer","LitElement","constructor","this","footerSlot","SlotController","padding","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"8pBAsBe,IAAMA,EAAN,cAAqBC,EAArB,WAAAC,uBAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UAKjBA,KAAOG,QAAiB,GAiBtD,CAfC,MAAAC,GACE,OAAOC,CAAI,wHAQgBL,KAAKC,WAAWK,wBACxBN,KAAKC,WAAWM,uCAIpC,GAvBMV,EAAAW,OAAS,CAACC,EAAgBC,GAOJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAmChB,EAAAiB,UAAA,eAAA,GARrCjB,EAAMc,EAAA,CAD1BI,EAAc,gBACMlB,SAAAA"}
+{"version":3,"file":"Drawer.js","sources":["../src/drawer/Drawer.ts"],"sourcesContent":["import { html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { SlotController } from '../common/controllers/SlotController.js'\n\nimport componentStyle from '../common/styles/Component.css'\n\nimport style from './Drawer.css'\nimport '../footer/Footer.js'\n\n/**\n * Drawer is used to display context-sensitive actions and  information.\n * Drawer doesn’t block users from completing their task, like a modal would.\n *\n * @status new\n * @category structure\n * @slot header - Optional slot that holds a header for the drawer.\n * @slot - Default slot.\n * @slot footer - Optional slot that holds footer content for the drawer.\n *\n * @cssprop [--n-drawer-padding=var(--n-space-l)] - Controls the padding around the main area (the default slot), using our [spacing tokens](/tokens/#space).\n */\n@customElement('nord-drawer')\nexport default class Drawer extends LitElement {\n  static styles = [componentStyle, style]\n\n  private footerSlot = new SlotController(this, 'footer')\n\n  /**\n   * Controls the padding of the drawer component.\n   */\n  @property({ reflect: true }) padding: 'm' | 'none' = 'm'\n\n  render() {\n    return html`\n      <div class=\"n-drawer\">\n        <slot name=\"header\"></slot>\n\n        <div class=\"n-drawer-main\">\n          <slot></slot>\n        </div>\n\n        <nord-footer ?hidden=${this.footerSlot.isEmpty}>\n          <slot name=${this.footerSlot.slotName}></slot>\n        </nord-footer>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-drawer': Drawer\n  }\n}\n"],"names":["Drawer","LitElement","constructor","this","footerSlot","SlotController","padding","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"ypBAsBe,IAAMA,EAAN,cAAqBC,EAArB,WAAAC,uBAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UAKjBA,KAAOG,QAAiB,GAiBtD,CAfC,MAAAC,GACE,OAAOC,CAAI,wHAQgBL,KAAKC,WAAWK,wBACxBN,KAAKC,WAAWM,uCAIpC,GAvBMV,EAAAW,OAAS,CAACC,EAAgBC,GAOJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAmChB,EAAAiB,UAAA,eAAA,GARrCjB,EAAMc,EAAA,CAD1BI,EAAc,gBACMlB,SAAAA"}

package/lib/Dropdown.js

@@ -1,2 +1,2 @@
-import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as e,html as t,LitElement as n}from"lit";import{query as r,property as s,customElement as d}from"lit/decorators.js";import{ifDefined as a}from"lit/directives/if-defined.js";import{S as i}from"./SlotController-Z6eG7LSZ.js";import{F as l}from"./Popout-DBLHeeXk.js";import{o as p}from"./observe-D0n0zOfU.js";import{s as c}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";import"./positioning-CsfLhMSW.js";import"./LightDismissController-4pH8cdko.js";import"./ShortcutController-BIb3WGzH.js";import"./tinykeys.module-_6MZt7MP.js";import"./ScrollbarController-C5CMxfb3.js";import"./events-Bv6wNHwJ.js";import"./DirectionController-ChvNGESZ.js";const h=e`:host{--_n-dropdown-size:var(--n-dropdown-size, 250px);--_n-dropdown-max-block-size:var(--n-dropdown-max-block-size, 460px)}.n-dropdown-content{padding:var(--n-space-s) 0;min-inline-size:var(--_n-dropdown-size);max-inline-size:calc(var(--_n-dropdown-size) * 1.5);max-block-size:var(--_n-dropdown-max-block-size);overflow-y:auto}@media (max-width:35.9375em){.n-dropdown-content{max-block-size:70vh;max-inline-size:none}}::slotted(nord-dropdown-group),::slotted(nord-dropdown-item){padding-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s)}::slotted(nord-dropdown-group){padding-block-end:var(--n-space-s);border-block-end:1px solid var(--n-color-border);margin-block-end:var(--n-space-s)}::slotted(nord-dropdown-group:last-child){padding-block-end:0;border-block-end:0;margin-block-end:0}::slotted(nord-message:first-of-type){padding-block-start:0}::slotted(nord-message:last-of-type){margin-block-end:var(--n-space-s)}slot[name=toggle]{display:inline-block}:host([expand]) slot[name=toggle]{inline-size:100%}:host([size="s"]){--_n-dropdown-size:var(--n-dropdown-size, 150px)}:host([size="l"]){--_n-dropdown-size:var(--n-dropdown-size, 300px)}.n-dropdown-header{padding:calc(var(--n-space-m) + 2px) var(--n-space-m);border-block-end:1px solid var(--n-color-border);background-color:var(--n-color-surface-raised);border-start-start-radius:var(--n-border-radius);border-start-end-radius:var(--n-border-radius);font-weight:var(--n-font-weight);display:flex;gap:var(--n-space-s);align-items:center;flex-wrap:wrap}.n-dropdown-header ::slotted(nord-button){--n-button-gap:var(--n-space-xs);--n-button-background-color:var(--n-color-surface)}.n-dropdown-header ::slotted(nord-button:hover){--n-button-background-color:var(--n-color-button-hover)}::slotted([slot=header-end]){margin-inline-start:auto;gap:var(--n-space-s);display:flex;align-items:center;flex-wrap:wrap}::slotted(:is(h1, h2, h3, h4, h5, h6, p)){margin:0!important}`;let m=class extends(l(n)){constructor(){super(...arguments),this.headerSlot=new i(this,"header"),this.headerEndSlot=new i(this,"header-end"),this.expand=!1,this.size="m",this.alwaysFloating=!1}connectedCallback(){super.connectedCallback();const o=this.querySelector('[slot="toggle"]');null==o||o.setAttribute("aria-haspopup","true")}render(){return t`<div class="n-dropdown" @focusout="${this.handleBlur}"><slot name="toggle" aria-controls="popout"></slot><nord-popout id="popout" align="${a(this.align)}" position="${a(this.position)}" ?open="${this.open}" ?always-floating="${this.alwaysFloating}" @open="${this.handleOpen}" @close="${this.handleClose}"><div class="n-dropdown-header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><div class="n-dropdown-content"><slot></slot></div></nord-popout></div>`}handleBlur(o){const e=o.relatedTarget;e&&!this.contains(e)&&this.popout.hide(!1)}handleOpen(){this.open=!0}handleClose(){this.open=!1}handleOpenChange(){var o;if(this.open){const e=null!==(o=this.querySelector("[autofocus]"))&&void 0!==o?o:this.querySelector("nord-dropdown-item, nord-message");null==e||e.focus(),this.list.scrollTop=0}}hide(o){return this.popout.hide(o)}show(){return this.popout.show()}};m.styles=[c,h],m.shadowRootOptions={...n.shadowRootOptions,delegatesFocus:!0},o([r(".n-dropdown-content")],m.prototype,"list",void 0),o([r("nord-popout",!0)],m.prototype,"popout",void 0),o([s({reflect:!0,type:Boolean})],m.prototype,"expand",void 0),o([s({reflect:!0})],m.prototype,"size",void 0),o([s({reflect:!0,type:Boolean,attribute:"always-floating"})],m.prototype,"alwaysFloating",void 0),o([p("open","updated")],m.prototype,"handleOpenChange",null),m=o([d("nord-dropdown")],m);var u=m;export{u as default};
+import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as e,html as t,LitElement as n}from"lit";import{query as r,property as s,customElement as d}from"lit/decorators.js";import{ifDefined as a}from"lit/directives/if-defined.js";import{S as i}from"./SlotController-Z6eG7LSZ.js";import{o as l}from"./observe-D0n0zOfU.js";import{F as p}from"./Popout-k_ddK22Q.js";import{s as c}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";import"./positioning-DDh0UNgJ.js";import"./DirectionController-ChvNGESZ.js";import"./LightDismissController-4pH8cdko.js";import"./ShortcutController-BIb3WGzH.js";import"./tinykeys.module-_6MZt7MP.js";import"./ScrollbarController-BFC67Y2x.js";import"./events-Bv6wNHwJ.js";const h=e`:host{--_n-dropdown-size:var(--n-dropdown-size, 250px);--_n-dropdown-max-block-size:var(--n-dropdown-max-block-size, 460px)}.n-dropdown-content{padding:var(--n-space-s) 0;min-inline-size:var(--_n-dropdown-size);max-inline-size:calc(var(--_n-dropdown-size) * 1.5);max-block-size:var(--_n-dropdown-max-block-size);overflow-y:auto}@media (max-width:35.9375em){.n-dropdown-content{max-block-size:70vh;max-inline-size:none}}::slotted(nord-dropdown-group),::slotted(nord-dropdown-item){padding-inline-start:var(--n-space-s);padding-inline-end:var(--n-space-s)}::slotted(nord-dropdown-group){padding-block-end:var(--n-space-s);border-block-end:1px solid var(--n-color-border);margin-block-end:var(--n-space-s)}::slotted(nord-dropdown-group:last-child){padding-block-end:0;border-block-end:0;margin-block-end:0}::slotted(nord-message:first-of-type){padding-block-start:0}::slotted(nord-message:last-of-type){margin-block-end:var(--n-space-s)}slot[name=toggle]{display:inline-block}:host([expand]) slot[name=toggle]{inline-size:100%}:host([size='s']){--_n-dropdown-size:var(--n-dropdown-size, 150px)}:host([size='l']){--_n-dropdown-size:var(--n-dropdown-size, 300px)}.n-dropdown-header{padding:calc(var(--n-space-m) + 2px) var(--n-space-m);border-block-end:1px solid var(--n-color-border);background-color:var(--n-color-surface-raised);border-start-start-radius:var(--n-border-radius);border-start-end-radius:var(--n-border-radius);font-weight:var(--n-font-weight);display:flex;gap:var(--n-space-s);align-items:center;flex-wrap:wrap}.n-dropdown-header ::slotted(nord-button){--n-button-gap:var(--n-space-xs);--n-button-background-color:var(--n-color-surface)}.n-dropdown-header ::slotted(nord-button:hover){--n-button-background-color:var(--n-color-button-hover)}::slotted([slot=header-end]){margin-inline-start:auto;gap:var(--n-space-s);display:flex;align-items:center;flex-wrap:wrap}::slotted(:is(h1, h2, h3, h4, h5, h6, p)){margin:0!important}`;let m=class extends(p(n)){constructor(){super(...arguments),this.headerSlot=new i(this,"header"),this.headerEndSlot=new i(this,"header-end"),this.expand=!1,this.size="m",this.alwaysFloating=!1}connectedCallback(){super.connectedCallback();const o=this.querySelector('[slot="toggle"]');null==o||o.setAttribute("aria-haspopup","true")}render(){return t`<div class="n-dropdown" @focusout="${this.handleBlur}"><slot name="toggle" aria-controls="popout"></slot><nord-popout id="popout" align="${a(this.align)}" position="${a(this.position)}" ?open="${this.open}" ?always-floating="${this.alwaysFloating}" @open="${this.handleOpen}" @close="${this.handleClose}"><div class="n-dropdown-header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><div class="n-dropdown-content"><slot></slot></div></nord-popout></div>`}handleBlur(o){const e=o.relatedTarget;e&&!this.contains(e)&&this.popout.hide(!1)}handleOpen(){this.open=!0}handleClose(){this.open=!1}handleOpenChange(){var o;if(this.open){const e=null!==(o=this.querySelector("[autofocus]"))&&void 0!==o?o:this.querySelector("nord-dropdown-item, nord-message");null==e||e.focus(),this.list.scrollTop=0}}hide(o){return this.popout.hide(o)}show(){return this.popout.show()}};m.styles=[c,h],m.shadowRootOptions={...n.shadowRootOptions,delegatesFocus:!0},o([r(".n-dropdown-content")],m.prototype,"list",void 0),o([r("nord-popout",!0)],m.prototype,"popout",void 0),o([s({reflect:!0,type:Boolean})],m.prototype,"expand",void 0),o([s({reflect:!0})],m.prototype,"size",void 0),o([s({reflect:!0,type:Boolean,attribute:"always-floating"})],m.prototype,"alwaysFloating",void 0),o([l("open","updated")],m.prototype,"handleOpenChange",null),m=o([d("nord-dropdown")],m);var u=m;export{u as default};
 //# sourceMappingURL=Dropdown.js.map

package/lib/Dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dropdown.js","sources":["../src/dropdown/Dropdown.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property, query } from \"lit/decorators.js\"\nimport { ifDefined } from \"lit/directives/if-defined.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport { FloatingMixin } from \"../common/mixins/FloatingComponentMixin.js\"\nimport { observe } from \"../common/decorators/observe.js\"\n\nimport type Popout from \"../popout/Popout.js\"\nimport \"../popout/Popout.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Dropdown.css\"\n\n/**\n * Dropdown menu displays a list of actions or selectable options for\n * a user. Dropdown uses popout component internally to create\n * the overlay functionality.\n *\n * @status ready\n * @category action\n *\n * @slot - The dropdown content.\n * @slot toggle - Used to place the toggle for dropdown.\n * @slot header - Optional slot that holds a header for the dropdown.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n *\n * @fires {NordEvent} open - Dispatched when the popout is opened.\n * @fires {NordEvent} close - Dispatched when the popout is closed.\n *\n * @cssprop [--n-dropdown-size=250px] - Controls the inline size, or width, of the dropdown. Will resize up to 1.5 times to account for larger content.\n * @cssprop [--n-dropdown-max-block-size=460px] - Controls the maximum block size, or height, of the dropdown. Larger content will get a scrollbar.\n */\n@customElement(\"nord-dropdown\")\nexport default class Dropdown extends FloatingMixin(LitElement) {\n  static styles = [componentStyle, style]\n\n  /**\n   * we delegate focus, to ensure focus does not move to body if you click\n   * some whitespace or a dropdown-group heading, as this would close the dropdown\n   * @internal\n   */\n  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true }\n\n  private headerSlot = new SlotController(this, \"header\")\n  private headerEndSlot = new SlotController(this, \"header-end\")\n\n  @query(\".n-dropdown-content\") private list!: HTMLElement\n  @query(\"nord-popout\", true) private popout!: Popout\n\n  /**\n   * Controls whether the toggle slot expands to fill the width of its container.\n   */\n  @property({ reflect: true, type: Boolean }) expand = false\n\n  /**\n   * The size of the dropdown. This affects the minimum and maximum inline-size\n   * of the dropdown.\n   */\n  @property({ reflect: true }) size: \"s\" | \"m\" | \"l\" = \"m\"\n\n  /**\n   * Set to true to always display the dropdown as a floating overlay, even on smaller viewports.\n   */\n  @property({ reflect: true, type: Boolean, attribute: \"always-floating\" }) alwaysFloating: boolean = false\n\n  connectedCallback() {\n    super.connectedCallback()\n\n    const toggle = this.querySelector(`[slot=\"toggle\"]`)\n    toggle?.setAttribute(\"aria-haspopup\", \"true\")\n  }\n\n  render() {\n    return html`\n      <div class=\"n-dropdown\" @focusout=${this.handleBlur}>\n        <slot name=\"toggle\" aria-controls=\"popout\"></slot>\n        <nord-popout\n          id=\"popout\"\n          align=${ifDefined(this.align)}\n          position=${ifDefined(this.position)}\n          ?open=${this.open}\n          ?always-floating=${this.alwaysFloating}\n          @open=${this.handleOpen}\n          @close=${this.handleClose}\n        >\n          <div class=\"n-dropdown-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          <div class=\"n-dropdown-content\">\n            <slot></slot>\n          </div>\n        </nord-popout>\n      </div>\n    `\n  }\n\n  private handleBlur(e: FocusEvent) {\n    const relatedTarget = e.relatedTarget as Node\n\n    // Safari will set relatedTarget to null when clicking on the trigger button\n    // because it doesn't focus buttons on click.\n    // this caused weird behavior where the dropdown closed _and_ opened with a single click.\n    // so we only run this logic if relatedTarget is set, which sidesteps this issue\n    if (relatedTarget && !this.contains(relatedTarget)) {\n      this.popout.hide(false)\n    }\n  }\n\n  private handleOpen() {\n    this.open = true\n  }\n\n  private handleClose() {\n    this.open = false\n  }\n\n  @observe(\"open\", \"updated\")\n  protected handleOpenChange() {\n    if (this.open) {\n      const focusTarget =\n        this.querySelector<HTMLElement>(\"[autofocus]\") ??\n        this.querySelector<HTMLElement>(\"nord-dropdown-item, nord-message\")\n\n      focusTarget?.focus()\n      this.list.scrollTop = 0\n    }\n  }\n\n  /**\n   * Hide the dropdown programmatically.\n   * This method delegates to the Dropdown's internal Popout component.\n   * See [Popout's hide() method](/components/popout#methods-hide) for more details.\n   * @param moveFocusToButton A boolean option to move the focus to the original button that opens the dropdown.\n   */\n  hide(moveFocusToButton?: boolean): Promise<TransitionEvent | void> {\n    return this.popout.hide(moveFocusToButton)\n  }\n\n  /**\n   * Show the dropdown programmatically.\n   * This method delegates to the Dropdown's internal Popout component.\n   * See [Popout's show() method](/components/popout#methods-hide) for more details.\n   */\n  show(): Promise<TransitionEvent | void> {\n    return this.popout.show()\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-dropdown\": Dropdown\n  }\n}\n"],"names":["Dropdown","FloatingMixin","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","expand","size","alwaysFloating","connectedCallback","super","toggle","querySelector","setAttribute","render","html","handleBlur","ifDefined","align","position","open","handleOpen","handleClose","isEmpty","slotName","e","relatedTarget","contains","popout","hide","handleOpenChange","focusTarget","_a","focus","list","scrollTop","moveFocusToButton","show","styles","componentStyle","style","shadowRootOptions","delegatesFocus","__decorate","query","prototype","property","reflect","type","Boolean","attribute","observe","customElement"],"mappings":"smFAiCe,IAAMA,EAAN,cAAuBC,EAAcC,IAArC,WAAAC,uBAULC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cAQLA,KAAMI,QAAG,EAMxBJ,KAAIK,KAAoB,IAKqBL,KAAcM,gBAAY,CAoFrG,CAlFC,iBAAAC,GACEC,MAAMD,oBAEN,MAAME,EAAST,KAAKU,cAAc,mBAClCD,SAAAA,EAAQE,aAAa,gBAAiB,OACvC,CAED,MAAAC,GACE,OAAOC,CAAI,sCAC2Bb,KAAKc,iGAI7BC,EAAUf,KAAKgB,qBACZD,EAAUf,KAAKiB,qBAClBjB,KAAKkB,2BACMlB,KAAKM,0BAChBN,KAAKmB,uBACJnB,KAAKoB,wDAE2BpB,KAAKC,WAAWoB,SAAWrB,KAAKG,cAAckB,wBACxErB,KAAKC,WAAWqB,gCAChBtB,KAAKG,cAAcmB,gGAQzC,CAEO,UAAAR,CAAWS,GACjB,MAAMC,EAAgBD,EAAEC,cAMpBA,IAAkBxB,KAAKyB,SAASD,IAClCxB,KAAK0B,OAAOC,MAAK,EAEpB,CAEO,UAAAR,GACNnB,KAAKkB,MAAO,CACb,CAEO,WAAAE,GACNpB,KAAKkB,MAAO,CACb,CAGS,gBAAAU,SACR,GAAI5B,KAAKkB,KAAM,CACb,MAAMW,EAC0C,QAA9CC,EAAA9B,KAAKU,cAA2B,sBAAc,IAAAoB,EAAAA,EAC9C9B,KAAKU,cAA2B,oCAElCmB,SAAAA,EAAaE,QACb/B,KAAKgC,KAAKC,UAAY,CACvB,CACF,CAQD,IAAAN,CAAKO,GACH,OAAOlC,KAAK0B,OAAOC,KAAKO,EACzB,CAOD,IAAAC,GACE,OAAOnC,KAAK0B,OAAOS,MACpB,GAhHMvC,EAAAwC,OAAS,CAACC,EAAgBC,GAO1B1C,EAAA2C,kBAAoB,IAAKzC,EAAWyC,kBAAmBC,gBAAgB,GAKxCC,EAAA,CAArCC,EAAM,wBAAiD9C,EAAA+C,UAAA,YAAA,GACpBF,EAAA,CAAnCC,EAAM,eAAe,IAA6B9C,EAAA+C,UAAA,cAAA,GAKPF,EAAA,CAA3CG,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAyBnD,EAAA+C,UAAA,cAAA,GAM7BF,EAAA,CAA5BG,EAAS,CAAEC,SAAS,KAAmCjD,EAAA+C,UAAA,YAAA,GAKkBF,EAAA,CAAzEG,EAAS,CAAEC,SAAS,EAAMC,KAAMC,QAASC,UAAW,qBAAoDpD,EAAA+C,UAAA,sBAAA,GAuD/FF,EAAA,CADTQ,EAAQ,OAAQ,YAUhBrD,EAAA+C,UAAA,mBAAA,MA9FkB/C,EAAQ6C,EAAA,CAD5BS,EAAc,kBACMtD,SAAAA"}
+{"version":3,"file":"Dropdown.js","sources":["../src/dropdown/Dropdown.ts"],"sourcesContent":["import type Popout from '../popout/Popout.js'\nimport { html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { SlotController } from '../common/controllers/SlotController.js'\nimport { observe } from '../common/decorators/observe.js'\n\nimport { FloatingMixin } from '../common/mixins/FloatingComponentMixin.js'\nimport componentStyle from '../common/styles/Component.css'\n\nimport style from './Dropdown.css'\nimport '../popout/Popout.js'\n\n/**\n * Dropdown menu displays a list of actions or selectable options for\n * a user. Dropdown uses popout component internally to create\n * the overlay functionality.\n *\n * @status ready\n * @category action\n *\n * @slot - The dropdown content.\n * @slot toggle - Used to place the toggle for dropdown.\n * @slot header - Optional slot that holds a header for the dropdown.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n *\n * @fires {NordEvent} open - Dispatched when the popout is opened.\n * @fires {NordEvent} close - Dispatched when the popout is closed.\n *\n * @cssprop [--n-dropdown-size=250px] - Controls the inline size, or width, of the dropdown. Will resize up to 1.5 times to account for larger content.\n * @cssprop [--n-dropdown-max-block-size=460px] - Controls the maximum block size, or height, of the dropdown. Larger content will get a scrollbar.\n */\n@customElement('nord-dropdown')\nexport default class Dropdown extends FloatingMixin(LitElement) {\n  static styles = [componentStyle, style]\n\n  /**\n   * we delegate focus, to ensure focus does not move to body if you click\n   * some whitespace or a dropdown-group heading, as this would close the dropdown\n   * @internal\n   */\n  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true }\n\n  private headerSlot = new SlotController(this, 'header')\n  private headerEndSlot = new SlotController(this, 'header-end')\n\n  @query('.n-dropdown-content') private list!: HTMLElement\n  @query('nord-popout', true) private popout!: Popout\n\n  /**\n   * Controls whether the toggle slot expands to fill the width of its container.\n   */\n  @property({ reflect: true, type: Boolean }) expand = false\n\n  /**\n   * The size of the dropdown. This affects the minimum and maximum inline-size\n   * of the dropdown.\n   */\n  @property({ reflect: true }) size: 's' | 'm' | 'l' = 'm'\n\n  /**\n   * Set to true to always display the dropdown as a floating overlay, even on smaller viewports.\n   */\n  @property({ reflect: true, type: Boolean, attribute: 'always-floating' }) alwaysFloating: boolean = false\n\n  connectedCallback() {\n    super.connectedCallback()\n\n    const toggle = this.querySelector(`[slot=\"toggle\"]`)\n    toggle?.setAttribute('aria-haspopup', 'true')\n  }\n\n  render() {\n    return html`\n      <div class=\"n-dropdown\" @focusout=${this.handleBlur}>\n        <slot name=\"toggle\" aria-controls=\"popout\"></slot>\n        <nord-popout\n          id=\"popout\"\n          align=${ifDefined(this.align)}\n          position=${ifDefined(this.position)}\n          ?open=${this.open}\n          ?always-floating=${this.alwaysFloating}\n          @open=${this.handleOpen}\n          @close=${this.handleClose}\n        >\n          <div class=\"n-dropdown-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          <div class=\"n-dropdown-content\">\n            <slot></slot>\n          </div>\n        </nord-popout>\n      </div>\n    `\n  }\n\n  private handleBlur(e: FocusEvent) {\n    const relatedTarget = e.relatedTarget as Node\n\n    // Safari will set relatedTarget to null when clicking on the trigger button\n    // because it doesn't focus buttons on click.\n    // this caused weird behavior where the dropdown closed _and_ opened with a single click.\n    // so we only run this logic if relatedTarget is set, which sidesteps this issue\n    if (relatedTarget && !this.contains(relatedTarget)) {\n      this.popout.hide(false)\n    }\n  }\n\n  private handleOpen() {\n    this.open = true\n  }\n\n  private handleClose() {\n    this.open = false\n  }\n\n  @observe('open', 'updated')\n  protected handleOpenChange() {\n    if (this.open) {\n      const focusTarget\n        = this.querySelector<HTMLElement>('[autofocus]')\n          ?? this.querySelector<HTMLElement>('nord-dropdown-item, nord-message')\n\n      focusTarget?.focus()\n      this.list.scrollTop = 0\n    }\n  }\n\n  /**\n   * Hide the dropdown programmatically.\n   * This method delegates to the Dropdown's internal Popout component.\n   * See [Popout's hide() method](/components/popout#methods-hide) for more details.\n   * @param moveFocusToButton A boolean option to move the focus to the original button that opens the dropdown.\n   */\n  hide(moveFocusToButton?: boolean): Promise<TransitionEvent | void> {\n    return this.popout.hide(moveFocusToButton)\n  }\n\n  /**\n   * Show the dropdown programmatically.\n   * This method delegates to the Dropdown's internal Popout component.\n   * See [Popout's show() method](/components/popout#methods-hide) for more details.\n   */\n  show(): Promise<TransitionEvent | void> {\n    return this.popout.show()\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-dropdown': Dropdown\n  }\n}\n"],"names":["Dropdown","FloatingMixin","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","expand","size","alwaysFloating","connectedCallback","super","toggle","querySelector","setAttribute","render","html","handleBlur","ifDefined","align","position","open","handleOpen","handleClose","isEmpty","slotName","e","relatedTarget","contains","popout","hide","handleOpenChange","focusTarget","_a","focus","list","scrollTop","moveFocusToButton","show","styles","componentStyle","style","shadowRootOptions","delegatesFocus","__decorate","query","prototype","property","reflect","type","Boolean","attribute","observe","customElement"],"mappings":"smFAiCe,IAAMA,EAAN,cAAuBC,EAAcC,IAArC,WAAAC,uBAULC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cAQLA,KAAMI,QAAG,EAMxBJ,KAAIK,KAAoB,IAKqBL,KAAcM,gBAAY,CAoFrG,CAlFC,iBAAAC,GACEC,MAAMD,oBAEN,MAAME,EAAST,KAAKU,cAAc,mBAClCD,SAAAA,EAAQE,aAAa,gBAAiB,OACvC,CAED,MAAAC,GACE,OAAOC,CAAI,sCAC2Bb,KAAKc,iGAI7BC,EAAUf,KAAKgB,qBACZD,EAAUf,KAAKiB,qBAClBjB,KAAKkB,2BACMlB,KAAKM,0BAChBN,KAAKmB,uBACJnB,KAAKoB,wDAE2BpB,KAAKC,WAAWoB,SAAWrB,KAAKG,cAAckB,wBACxErB,KAAKC,WAAWqB,gCAChBtB,KAAKG,cAAcmB,gGAQzC,CAEO,UAAAR,CAAWS,GACjB,MAAMC,EAAgBD,EAAEC,cAMpBA,IAAkBxB,KAAKyB,SAASD,IAClCxB,KAAK0B,OAAOC,MAAK,EAEpB,CAEO,UAAAR,GACNnB,KAAKkB,MAAO,CACb,CAEO,WAAAE,GACNpB,KAAKkB,MAAO,CACb,CAGS,gBAAAU,SACR,GAAI5B,KAAKkB,KAAM,CACb,MAAMW,EAC4C,QAA9CC,EAAA9B,KAAKU,cAA2B,sBAAc,IAAAoB,EAAAA,EAC3C9B,KAAKU,cAA2B,oCAEvCmB,SAAAA,EAAaE,QACb/B,KAAKgC,KAAKC,UAAY,CACvB,CACF,CAQD,IAAAN,CAAKO,GACH,OAAOlC,KAAK0B,OAAOC,KAAKO,EACzB,CAOD,IAAAC,GACE,OAAOnC,KAAK0B,OAAOS,MACpB,GAhHMvC,EAAAwC,OAAS,CAACC,EAAgBC,GAO1B1C,EAAA2C,kBAAoB,IAAKzC,EAAWyC,kBAAmBC,gBAAgB,GAKxCC,EAAA,CAArCC,EAAM,wBAAiD9C,EAAA+C,UAAA,YAAA,GACpBF,EAAA,CAAnCC,EAAM,eAAe,IAA6B9C,EAAA+C,UAAA,cAAA,GAKPF,EAAA,CAA3CG,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAyBnD,EAAA+C,UAAA,cAAA,GAM7BF,EAAA,CAA5BG,EAAS,CAAEC,SAAS,KAAmCjD,EAAA+C,UAAA,YAAA,GAKkBF,EAAA,CAAzEG,EAAS,CAAEC,SAAS,EAAMC,KAAMC,QAASC,UAAW,qBAAoDpD,EAAA+C,UAAA,sBAAA,GAuD/FF,EAAA,CADTQ,EAAQ,OAAQ,YAUhBrD,EAAA+C,UAAA,mBAAA,MA9FkB/C,EAAQ6C,EAAA,CAD5BS,EAAc,kBACMtD,SAAAA"}

package/lib/DropdownGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownGroup.js","sources":["../src/dropdown-group/DropdownGroup.ts"],"sourcesContent":["import { LitElement, html, nothing } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./DropdownGroup.css\"\n\n/**\n * Dropdown group includes all the actions or items in a single dropdown\n * group and is used for grouping items into related categories.\n *\n * @status ready\n * @category action\n * @slot - The dropdown group content.\n */\n@customElement(\"nord-dropdown-group\")\nexport default class DropdownGroup extends LitElement {\n  static styles = [componentStyle, style]\n\n  /**\n   * Heading and accessible label for the dropdown group.\n   */\n  @property({ reflect: true }) heading?: string\n\n  render() {\n    return html`\n      <div class=\"n-dropdown-group\">\n        ${this.heading\n          ? html`<p id=\"heading\" aria-hidden=\"true\" class=\"n-dropdown-group-heading\">${this.heading}</p>`\n          : nothing}\n        <div class=\"n-dropdown-group-content\" role=\"group\" aria-labelledby=${this.heading ? \"heading\" : nothing}>\n          <slot></slot>\n        </div>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-dropdown-group\": DropdownGroup\n  }\n}\n"],"names":["DropdownGroup","LitElement","render","html","this","heading","nothing","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"g0BAee,IAAMA,EAAN,cAA4BC,EAQzC,MAAAC,GACE,OAAOC,CAAI,iCAELC,KAAKC,QACHF,CAAI,uEAAuEC,KAAKC,cAChFC,wEACiEF,KAAKC,QAAU,UAAYC,8BAKrG,GAlBMN,EAAAO,OAAS,CAACC,EAAgBC,GAKJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAwBZ,EAAAa,UAAA,eAAA,GAN1Bb,EAAaU,EAAA,CADjCI,EAAc,wBACMd,SAAAA"}
+{"version":3,"file":"DropdownGroup.js","sources":["../src/dropdown-group/DropdownGroup.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport componentStyle from '../common/styles/Component.css'\nimport style from './DropdownGroup.css'\n\n/**\n * Dropdown group includes all the actions or items in a single dropdown\n * group and is used for grouping items into related categories.\n *\n * @status ready\n * @category action\n * @slot - The dropdown group content.\n */\n@customElement('nord-dropdown-group')\nexport default class DropdownGroup extends LitElement {\n  static styles = [componentStyle, style]\n\n  /**\n   * Heading and accessible label for the dropdown group.\n   */\n  @property({ reflect: true }) heading?: string\n\n  render() {\n    return html`\n      <div class=\"n-dropdown-group\">\n        ${this.heading\n          ? html`<p id=\"heading\" aria-hidden=\"true\" class=\"n-dropdown-group-heading\">${this.heading}</p>`\n          : nothing}\n        <div class=\"n-dropdown-group-content\" role=\"group\" aria-labelledby=${this.heading ? 'heading' : nothing}>\n          <slot></slot>\n        </div>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-dropdown-group': DropdownGroup\n  }\n}\n"],"names":["DropdownGroup","LitElement","render","html","this","heading","nothing","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"g0BAee,IAAMA,EAAN,cAA4BC,EAQzC,MAAAC,GACE,OAAOC,CAAI,iCAELC,KAAKC,QACHF,CAAI,uEAAuEC,KAAKC,cAChFC,wEACiEF,KAAKC,QAAU,UAAYC,8BAKrG,GAlBMN,EAAAO,OAAS,CAACC,EAAgBC,GAKJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAwBZ,EAAAa,UAAA,eAAA,GAN1Bb,EAAaU,EAAA,CADjCI,EAAc,wBACMd,SAAAA"}

package/lib/DropdownItem-Cy6lHtoG.js

@@ -0,0 +1,2 @@
+import{css as o}from"lit";const n=o`:host{--_n-dropdown-item-background-color:var(--n-dropdown-item-background-color, transparent);--_n-dropdown-item-color:var(--n-dropdown-item-color, var(--n-color-text));display:flex;line-height:var(--n-line-height-tight)}.n-dropdown-item{appearance:none;cursor:pointer;display:flex;flex:1;gap:var(--n-space-s);align-items:center;font-family:inherit;font-size:inherit;font-weight:var(--n-font-weight);text-decoration:none;border:0;color:var(--_n-dropdown-item-color);padding:var(--n-space-s);border-radius:var(--n-border-radius-s);background:var(--_n-dropdown-item-background-color);text-align:start;box-shadow:var(--n-dropdown-item-box-shadow,none);min-inline-size:0}.n-dropdown-item:hover{--_n-dropdown-item-background-color:var(--n-dropdown-item-background-color, var(--n-color-accent));--_n-dropdown-item-color:var(--n-dropdown-item-color, var(--n-color-text-on-accent))}.n-dropdown-item:hover ::slotted(*){color:var(--n-dropdown-item-color,var(--n-color-text-on-accent))!important}.n-dropdown-item ::slotted(nord-icon){color:var(--n-color-icon)}.n-dropdown-item:hover ::slotted(nord-icon){color:currentColor}.n-dropdown-item:active{opacity:.7}.n-dropdown-item:focus{--n-dropdown-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-dropdown-item:focus{--n-dropdown-item-box-shadow:none}.n-dropdown-item:focus-visible{--n-dropdown-item-box-shadow:0 0 0 2px var(--n-color-accent)}}@media (max-width:35.9375em){.n-dropdown-item{gap:var(--n-space-m);padding:calc(var(--n-space-m)/ 1.5) var(--n-space-m)}.n-dropdown-item ::slotted(nord-icon){block-size:var(--n-size-icon-m);inline-size:var(--n-size-icon-m)}}slot[name=end],slot[name=start]{flex:0 0 auto}slot[name=end]{display:flex;margin-inline-start:auto}.n-content{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host([disabled]){--_n-dropdown-item-background-color:var(--n-dropdown-item-background-color, transparent);--_n-dropdown-item-color:var(--n-dropdown-item-color, var(--n-color-text-weakest));pointer-events:none}:host([disabled]) .n-button::after{display:none}::slotted(nord-icon:not([size])){--_n-icon-size:var(--n-size-icon-s)}`;export{n as s};
+//# sourceMappingURL=DropdownItem-Cy6lHtoG.js.map

package/lib/DropdownItem-Cy6lHtoG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownItem-Cy6lHtoG.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/DropdownItem.js

@@ -1,2 +1,2 @@
-import{_ as t}from"./tslib.es6-CmLYFWVC.js";import{html as e,nothing as s,LitElement as o}from"lit";import{property as r,customElement as i}from"lit/decorators.js";import{ref as d}from"lit/directives/ref.js";import{F as n}from"./FocusableMixin-BlQLNPdJ.js";import{S as l}from"./SlotController-Z6eG7LSZ.js";import{c as a}from"./cond-CI1KbneT.js";import{s as m}from"./Component-DSU3Qp0O.js";import{s as p}from"./DropdownItem-BheCmR9u.js";import"./EventController-BBOmvfLa.js";let f=class extends(n(o)){constructor(){super(...arguments),this.endSlot=new l(this,"end"),this.target="_self",this.disabled=!1}render(){const t=e`<slot name="start"></slot><div class="n-content"><slot></slot></div><slot name="end" ?hidden="${this.endSlot.isEmpty}"></slot>`;return this.href?this.renderLink(t):this.renderButton(t)}renderLink(t){return e`<a ${d(this.focusableRef)} class="n-dropdown-item" target="${this.target}" href="${a(this.disabled,s,this.href)}" tabindex="${a(this.disabled,"-1")}" aria-disabled="${a(this.disabled,"true")}" role="${a(this.disabled,"link")}">${t}</a>`}renderButton(t){return e`<button ${d(this.focusableRef)} class="n-dropdown-item" ?disabled="${this.disabled}">${t}</button>`}};f.styles=[m,p],t([r({reflect:!0})],f.prototype,"href",void 0),t([r()],f.prototype,"target",void 0),t([r({type:Boolean,reflect:!0})],f.prototype,"disabled",void 0),f=t([i("nord-dropdown-item")],f);var h=f;export{h as default};
+import{_ as t}from"./tslib.es6-CmLYFWVC.js";import{html as e,nothing as s,LitElement as o}from"lit";import{property as r,customElement as i}from"lit/decorators.js";import{ref as d}from"lit/directives/ref.js";import{S as n}from"./SlotController-Z6eG7LSZ.js";import{c as l}from"./cond-CI1KbneT.js";import{F as a}from"./FocusableMixin-BlQLNPdJ.js";import{s as m}from"./Component-DSU3Qp0O.js";import{s as p}from"./DropdownItem-Cy6lHtoG.js";import"./EventController-BBOmvfLa.js";let f=class extends(a(o)){constructor(){super(...arguments),this.endSlot=new n(this,"end"),this.target="_self",this.disabled=!1}render(){const t=e`<slot name="start"></slot><div class="n-content"><slot></slot></div><slot name="end" ?hidden="${this.endSlot.isEmpty}"></slot>`;return this.href?this.renderLink(t):this.renderButton(t)}renderLink(t){return e`<a ${d(this.focusableRef)} class="n-dropdown-item" target="${this.target}" href="${l(this.disabled,s,this.href)}" tabindex="${l(this.disabled,"-1")}" aria-disabled="${l(this.disabled,"true")}" role="${l(this.disabled,"link")}">${t}</a>`}renderButton(t){return e`<button ${d(this.focusableRef)} class="n-dropdown-item" ?disabled="${this.disabled}">${t}</button>`}};f.styles=[m,p],t([r({reflect:!0})],f.prototype,"href",void 0),t([r()],f.prototype,"target",void 0),t([r({type:Boolean,reflect:!0})],f.prototype,"disabled",void 0),f=t([i("nord-dropdown-item")],f);var h=f;export{h as default};
 //# sourceMappingURL=DropdownItem.js.map

package/lib/DropdownItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownItem.js","sources":["../src/dropdown-item/DropdownItem.ts"],"sourcesContent":["import { LitElement, html, TemplateResult, nothing } 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 { FocusableMixin } from \"../common/mixins/FocusableMixin.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport { cond } from \"../common/directives/cond.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./DropdownItem.css\"\n\n/**\n * Dropdown item populates dropdown with actions. Items can be\n * placed either inside a dropdown group or directly inside a\n * dropdown component.\n *\n * @status ready\n * @category action\n * @slot - The dropdown item content.\n * @slot start - Used to place content before dropdown item text. Typically used for icons.\n * @slot end - Used to place content after dropdown item text. Typically used for icons.\n *\n * @cssprop [--n-dropdown-item-background-color=transparent] - Controls the background color of the item, using our [color tokens](/tokens/#color).\n * @cssprop [--n-dropdown-item-color=var(--n-color-text)] - Controls the color of the text within the item, using our [color tokens](/tokens/#color).\n */\n@customElement(\"nord-dropdown-item\")\nexport default class DropdownItem extends FocusableMixin(LitElement) {\n  static styles = [componentStyle, style]\n\n  private endSlot = new SlotController(this, \"end\")\n\n  /**\n   * The url the dropdown item should link to.\n   */\n  @property({ reflect: true }) href?: string\n\n  /**\n   * When provided together with a href property, determines where\n   * to open the linked URL. The keywords have special meanings for\n   * where to load the URL: “_self” means the current browsing context,\n   * “_blank” usually a new tab but users can configure browsers this to\n   * open a new window instead, “_parent” means the parent browsing\n   * context of the current one, but if no parent exists, behaves as\n   * _self, and finally “top” means the topmost browsing context.\n   */\n  @property() target: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" = \"_self\"\n\n  /**\n   * Makes the component disabled. This prevents users from\n   * being able to interact with the component, and conveys\n   * its inactive state to assistive technologies.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false\n\n  render() {\n    const innards = html`\n      <slot name=\"start\"></slot>\n      <div class=\"n-content\"><slot></slot></div>\n      <slot name=\"end\" ?hidden=${this.endSlot.isEmpty}></slot>\n    `\n\n    return this.href ? this.renderLink(innards) : this.renderButton(innards)\n  }\n\n  /**\n   * We jump through some hoops here to ensure the link is treated correctly when \"disabled\".\n   * Links cannot be disabled natively, so we need to rely on some aria magic to get the correct semantics.\n   * Along with the advice in the article below, we also set tabindex to \"-1\", so it is taken out of tab order.\n   *\n   * @see https://www.scottohara.me/blog/2021/05/28/disabled-links.html\n   */\n  private renderLink(innards: TemplateResult) {\n    return html`\n      <a\n        ${ref(this.focusableRef)}\n        class=\"n-dropdown-item\"\n        target=${this.target}\n        href=${cond(this.disabled, nothing, this.href)}\n        tabindex=${cond(this.disabled, \"-1\")}\n        aria-disabled=${cond(this.disabled, \"true\")}\n        role=${cond(this.disabled, \"link\")}\n        >${innards}\n      </a>\n    `\n  }\n\n  private renderButton(innards: TemplateResult) {\n    return html`\n      <button ${ref(this.focusableRef)} class=\"n-dropdown-item\" ?disabled=${this.disabled}>${innards}</button>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-dropdown-item\": DropdownItem\n  }\n}\n"],"names":["DropdownItem","FocusableMixin","LitElement","constructor","this","endSlot","SlotController","target","disabled","render","innards","html","isEmpty","href","renderLink","renderButton","ref","focusableRef","cond","nothing","styles","componentStyle","style","__decorate","property","reflect","prototype","type","Boolean","customElement"],"mappings":"0dA0Be,IAAMA,EAAN,cAA2BC,EAAeC,IAA1C,WAAAC,uBAGLC,KAAOC,QAAG,IAAIC,EAAeF,KAAM,OAgB/BA,KAAMG,OAA4C,QAOlBH,KAAQI,UAAG,CAuCxD,CArCC,MAAAC,GACE,MAAMC,EAAUC,CAAI,iGAGSP,KAAKC,QAAQO,mBAG1C,OAAOR,KAAKS,KAAOT,KAAKU,WAAWJ,GAAWN,KAAKW,aAAaL,EACjE,CASO,UAAAI,CAAWJ,GACjB,OAAOC,CAAI,MAELK,EAAIZ,KAAKa,iDAEFb,KAAKG,iBACPW,EAAKd,KAAKI,SAAUW,EAASf,KAAKS,oBAC9BK,EAAKd,KAAKI,SAAU,yBACfU,EAAKd,KAAKI,SAAU,kBAC7BU,EAAKd,KAAKI,SAAU,YACxBE,OAGR,CAEO,YAAAK,CAAaL,GACnB,OAAOC,CAAI,WACCK,EAAIZ,KAAKa,oDAAmDb,KAAKI,aAAYE,YAE1F,GA/DMV,EAAAoB,OAAS,CAACC,EAAgBC,GAOJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqBzB,EAAA0B,UAAA,YAAA,GAW9BH,EAAA,CAAXC,KAAoExB,EAAA0B,UAAA,cAAA,GAOzBH,EAAA,CAA3CC,EAAS,CAAEG,KAAMC,QAASH,SAAS,KAAwBzB,EAAA0B,UAAA,gBAAA,GA1BzC1B,EAAYuB,EAAA,CADhCM,EAAc,uBACM7B,SAAAA"}
+{"version":3,"file":"DropdownItem.js","sources":["../src/dropdown-item/DropdownItem.ts"],"sourcesContent":["import type { TemplateResult } from 'lit'\nimport { html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { ref } from 'lit/directives/ref.js'\nimport { SlotController } from '../common/controllers/SlotController.js'\nimport { cond } from '../common/directives/cond.js'\nimport { FocusableMixin } from '../common/mixins/FocusableMixin.js'\n\nimport componentStyle from '../common/styles/Component.css'\nimport style from './DropdownItem.css'\n\n/**\n * Dropdown item populates dropdown with actions. Items can be\n * placed either inside a dropdown group or directly inside a\n * dropdown component.\n *\n * @status ready\n * @category action\n * @slot - The dropdown item content.\n * @slot start - Used to place content before dropdown item text. Typically used for icons.\n * @slot end - Used to place content after dropdown item text. Typically used for icons.\n *\n * @cssprop [--n-dropdown-item-background-color=transparent] - Controls the background color of the item, using our [color tokens](/tokens/#color).\n * @cssprop [--n-dropdown-item-color=var(--n-color-text)] - Controls the color of the text within the item, using our [color tokens](/tokens/#color).\n */\n@customElement('nord-dropdown-item')\nexport default class DropdownItem extends FocusableMixin(LitElement) {\n  static styles = [componentStyle, style]\n\n  private endSlot = new SlotController(this, 'end')\n\n  /**\n   * The url the dropdown item should link to.\n   */\n  @property({ reflect: true }) href?: string\n\n  /**\n   * When provided together with a href property, determines where\n   * to open the linked URL. The keywords have special meanings for\n   * where to load the URL: “_self” means the current browsing context,\n   * “_blank” usually a new tab but users can configure browsers this to\n   * open a new window instead, “_parent” means the parent browsing\n   * context of the current one, but if no parent exists, behaves as\n   * _self, and finally “top” means the topmost browsing context.\n   */\n  @property() target: '_self' | '_blank' | '_parent' | '_top' = '_self'\n\n  /**\n   * Makes the component disabled. This prevents users from\n   * being able to interact with the component, and conveys\n   * its inactive state to assistive technologies.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false\n\n  render() {\n    const innards = html`\n      <slot name=\"start\"></slot>\n      <div class=\"n-content\"><slot></slot></div>\n      <slot name=\"end\" ?hidden=${this.endSlot.isEmpty}></slot>\n    `\n\n    return this.href ? this.renderLink(innards) : this.renderButton(innards)\n  }\n\n  /**\n   * We jump through some hoops here to ensure the link is treated correctly when \"disabled\".\n   * Links cannot be disabled natively, so we need to rely on some aria magic to get the correct semantics.\n   * Along with the advice in the article below, we also set tabindex to \"-1\", so it is taken out of tab order.\n   *\n   * @see https://www.scottohara.me/blog/2021/05/28/disabled-links.html\n   */\n  private renderLink(innards: TemplateResult) {\n    return html`\n      <a\n        ${ref(this.focusableRef)}\n        class=\"n-dropdown-item\"\n        target=${this.target}\n        href=${cond(this.disabled, nothing, this.href)}\n        tabindex=${cond(this.disabled, '-1')}\n        aria-disabled=${cond(this.disabled, 'true')}\n        role=${cond(this.disabled, 'link')}\n        >${innards}\n      </a>\n    `\n  }\n\n  private renderButton(innards: TemplateResult) {\n    return html`\n      <button ${ref(this.focusableRef)} class=\"n-dropdown-item\" ?disabled=${this.disabled}>${innards}</button>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-dropdown-item': DropdownItem\n  }\n}\n"],"names":["DropdownItem","FocusableMixin","LitElement","constructor","this","endSlot","SlotController","target","disabled","render","innards","html","isEmpty","href","renderLink","renderButton","ref","focusableRef","cond","nothing","styles","componentStyle","style","__decorate","property","reflect","prototype","type","Boolean","customElement"],"mappings":"0dA0Be,IAAMA,EAAN,cAA2BC,EAAeC,IAA1C,WAAAC,uBAGLC,KAAOC,QAAG,IAAIC,EAAeF,KAAM,OAgB/BA,KAAMG,OAA4C,QAOlBH,KAAQI,UAAG,CAuCxD,CArCC,MAAAC,GACE,MAAMC,EAAUC,CAAI,iGAGSP,KAAKC,QAAQO,mBAG1C,OAAOR,KAAKS,KAAOT,KAAKU,WAAWJ,GAAWN,KAAKW,aAAaL,EACjE,CASO,UAAAI,CAAWJ,GACjB,OAAOC,CAAI,MAELK,EAAIZ,KAAKa,iDAEFb,KAAKG,iBACPW,EAAKd,KAAKI,SAAUW,EAASf,KAAKS,oBAC9BK,EAAKd,KAAKI,SAAU,yBACfU,EAAKd,KAAKI,SAAU,kBAC7BU,EAAKd,KAAKI,SAAU,YACxBE,OAGR,CAEO,YAAAK,CAAaL,GACnB,OAAOC,CAAI,WACCK,EAAIZ,KAAKa,oDAAmDb,KAAKI,aAAYE,YAE1F,GA/DMV,EAAAoB,OAAS,CAACC,EAAgBC,GAOJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqBzB,EAAA0B,UAAA,YAAA,GAW9BH,EAAA,CAAXC,KAAoExB,EAAA0B,UAAA,cAAA,GAOzBH,EAAA,CAA3CC,EAAS,CAAEG,KAAMC,QAASH,SAAS,KAAwBzB,EAAA0B,UAAA,gBAAA,GA1BzC1B,EAAYuB,EAAA,CADhCM,EAAc,uBACM7B,SAAAA"}

package/lib/EmptyState.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.js","sources":["../src/empty-state/EmptyState.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement } from \"lit/decorators.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./EmptyState.css\"\n\n/**\n * Empty state can be used when there is no data to display to\n * describe what the user can do next. Empty state provides\n * explanation and guidance to help user progress.\n *\n * @status ready\n * @category feedback\n * @slot - default slot\n */\n@customElement(\"nord-empty-state\")\nexport default class EmptyState extends LitElement {\n  static styles = [componentStyle, style]\n\n  render() {\n    return html`<div class=\"n-empty-state\">\n      <slot></slot>\n    </div>`\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-empty-state\": EmptyState\n  }\n}\n"],"names":["EmptyState","LitElement","render","html","styles","componentStyle","style","__decorate","customElement"],"mappings":"shCAgBe,IAAMA,EAAN,cAAyBC,EAGtC,MAAAC,GACE,OAAOC,CAAI,gDAGZ,GANMH,EAAAI,OAAS,CAACC,EAAgBC,GADdN,EAAUO,EAAA,CAD9BC,EAAc,qBACMR,SAAAA"}
+{"version":3,"file":"EmptyState.js","sources":["../src/empty-state/EmptyState.ts"],"sourcesContent":["import { html, LitElement } from 'lit'\nimport { customElement } from 'lit/decorators.js'\n\nimport componentStyle from '../common/styles/Component.css'\nimport style from './EmptyState.css'\n\n/**\n * Empty state can be used when there is no data to display to\n * describe what the user can do next. Empty state provides\n * explanation and guidance to help user progress.\n *\n * @status ready\n * @category feedback\n * @slot - default slot\n */\n@customElement('nord-empty-state')\nexport default class EmptyState extends LitElement {\n  static styles = [componentStyle, style]\n\n  render() {\n    return html`<div class=\"n-empty-state\">\n      <slot></slot>\n    </div>`\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-empty-state': EmptyState\n  }\n}\n"],"names":["EmptyState","LitElement","render","html","styles","componentStyle","style","__decorate","customElement"],"mappings":"shCAgBe,IAAMA,EAAN,cAAyBC,EAGtC,MAAAC,GACE,OAAOC,CAAI,gDAGZ,GANMH,EAAAI,OAAS,CAACC,EAAgBC,GADdN,EAAUO,EAAA,CAD9BC,EAAc,qBACMR,SAAAA"}

package/lib/EventController-BBOmvfLa.js.map

@@ -1 +1 @@
-{"version":3,"file":"EventController-BBOmvfLa.js","sources":["../src/common/controllers/EventController.ts"],"sourcesContent":["import { ReactiveController, ReactiveControllerHost, isServer } from \"lit\"\n\ninterface ShadowRootEventMap {\n  slotchange: Event\n}\n\nexport class EventController implements ReactiveController {\n  private listeners: Array<() => void> = []\n\n  constructor(host: ReactiveControllerHost) {\n    host.addController(this)\n  }\n\n  hostDisconnected() {\n    this.listeners.forEach(stop => stop())\n    this.listeners = []\n  }\n\n  listen<K extends keyof WindowEventMap>(\n    window: Window,\n    type: K,\n    listener: (this: Window, ev: WindowEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof DocumentEventMap>(\n    document: Document,\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof HTMLElementEventMap>(\n    element: HTMLElement,\n    type: K,\n    listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof ShadowRootEventMap>(\n    element: ShadowRoot,\n    type: K,\n    listener: (this: ShadowRoot, ev: ShadowRootEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof MediaQueryListEventMap>(\n    element: MediaQueryList,\n    type: K,\n    listener: (this: ShadowRoot, ev: MediaQueryListEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen(\n    element: EventTarget,\n    type: string,\n    listener: (this: EventTarget, ev: Event) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen(\n    element: EventTarget,\n    type: string,\n    listener: (this: EventTarget, ev: Event) => void,\n    options?: boolean | AddEventListenerOptions\n  ) {\n    element?.addEventListener(type, listener, options)\n\n    const stop = () => element?.removeEventListener(type, listener, options)\n    this.listeners.push(stop)\n  }\n}\n"],"names":["EventController","constructor","host","this","listeners","addController","hostDisconnected","forEach","stop","listen","element","type","listener","options","addEventListener","push","removeEventListener"],"mappings":"MAMaA,EAGX,WAAAC,CAAYC,GAFJC,KAASC,UAAsB,GAGrCF,EAAKG,cAAcF,KACpB,CAED,gBAAAG,GACEH,KAAKC,UAAUG,SAAQC,GAAQA,MAC/BL,KAAKC,UAAY,EAClB,CA4CD,MAAAK,CACEC,EACAC,EACAC,EACAC,GAEAH,SAAAA,EAASI,iBAAiBH,EAAMC,EAAUC,GAG1CV,KAAKC,UAAUW,MADF,IAAML,aAAO,EAAPA,EAASM,oBAAoBL,EAAMC,EAAUC,IAEjE"}
+{"version":3,"file":"EventController-BBOmvfLa.js","sources":["../src/common/controllers/EventController.ts"],"sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from 'lit'\n\ninterface ShadowRootEventMap {\n  slotchange: Event\n}\n\nexport class EventController implements ReactiveController {\n  private listeners: Array<() => void> = []\n\n  constructor(host: ReactiveControllerHost) {\n    host.addController(this)\n  }\n\n  hostDisconnected() {\n    this.listeners.forEach(stop => stop())\n    this.listeners = []\n  }\n\n  listen<K extends keyof WindowEventMap>(\n    window: Window,\n    type: K,\n    listener: (this: Window, ev: WindowEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof DocumentEventMap>(\n    document: Document,\n    type: K,\n    listener: (this: Document, ev: DocumentEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof HTMLElementEventMap>(\n    element: HTMLElement,\n    type: K,\n    listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof ShadowRootEventMap>(\n    element: ShadowRoot,\n    type: K,\n    listener: (this: ShadowRoot, ev: ShadowRootEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen<K extends keyof MediaQueryListEventMap>(\n    element: MediaQueryList,\n    type: K,\n    listener: (this: ShadowRoot, ev: MediaQueryListEventMap[K]) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen(\n    element: EventTarget,\n    type: string,\n    listener: (this: EventTarget, ev: Event) => void,\n    options?: boolean | AddEventListenerOptions\n  ): void\n\n  listen(\n    element: EventTarget,\n    type: string,\n    listener: (this: EventTarget, ev: Event) => void,\n    options?: boolean | AddEventListenerOptions,\n  ) {\n    element?.addEventListener(type, listener, options)\n\n    const stop = () => element?.removeEventListener(type, listener, options)\n    this.listeners.push(stop)\n  }\n}\n"],"names":["EventController","constructor","host","this","listeners","addController","hostDisconnected","forEach","stop","listen","element","type","listener","options","addEventListener","push","removeEventListener"],"mappings":"MAMaA,EAGX,WAAAC,CAAYC,GAFJC,KAASC,UAAsB,GAGrCF,EAAKG,cAAcF,KACpB,CAED,gBAAAG,GACEH,KAAKC,UAAUG,SAAQC,GAAQA,MAC/BL,KAAKC,UAAY,EAClB,CA4CD,MAAAK,CACEC,EACAC,EACAC,EACAC,GAEAH,SAAAA,EAASI,iBAAiBH,EAAMC,EAAUC,GAG1CV,KAAKC,UAAUW,MADF,IAAML,aAAO,EAAPA,EAASM,oBAAoBL,EAAMC,EAAUC,IAEjE"}

package/lib/Fieldset.js

@@ -1,2 +1,2 @@
-import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as t,html as i}from"lit";import{property as o,customElement as s}from"lit/decorators.js";import{S as n}from"./SlotController-Z6eG7LSZ.js";import{c as l}from"./cond-CI1KbneT.js";import{s as a}from"./Component-DSU3Qp0O.js";import{s as d}from"./FormField-CUC_H-0e.js";import"./EventController-BBOmvfLa.js";const h=r`fieldset{border:none}.n-label-container{margin-block-end:calc(var(--n-space-s) * 2)}:host([size="s"]) .n-label-container{margin-block-end:var(--n-space-s)}.n-hidden{position:absolute;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);block-size:1px;inline-size:1px;white-space:nowrap}`;let p=class extends t{constructor(){super(...arguments),this.errorSlot=new n(this,"error"),this.hintSlot=new n(this,"hint"),this.label="",this.required=!1,this.hideRequired=!1,this.hideLabel=!1,this.size="m"}render(){const{hasError:e}=this;return i`<fieldset aria-invalid="${l(e,"true")}" aria-describedby="${l(e,"error")}" aria-required="${l(this.required,"true")}"><legend class="n-label-container ${this.hideLabel?"n-hidden":""}"><div class="n-label"><slot name="label">${this.label}</slot><span aria-hidden="true" class="n-required" ?hidden="${!this.required||this.hideRequired}">*</span></div><div class="n-caption n-hint" ?hidden="${!this.hasHint}"><slot name="hint">${this.hint}</slot></div></legend><slot></slot><div class="n-caption n-error" id="error" role="alert" ?hidden="${!this.hasError}"><slot name="error">${this.error}</slot></div></fieldset>`}get hasHint(){return Boolean(this.hint)||this.hintSlot.hasContent}get hasError(){return Boolean(this.error)||this.errorSlot.hasContent}};p.styles=[a,d,h],e([o({reflect:!0})],p.prototype,"label",void 0),e([o({reflect:!0})],p.prototype,"hint",void 0),e([o({reflect:!0})],p.prototype,"error",void 0),e([o({reflect:!0,type:Boolean})],p.prototype,"required",void 0),e([o({reflect:!0,type:Boolean,attribute:"hide-required"})],p.prototype,"hideRequired",void 0),e([o({reflect:!0,type:Boolean,attribute:"hide-label"})],p.prototype,"hideLabel",void 0),e([o({reflect:!0})],p.prototype,"size",void 0),p=e([s("nord-fieldset")],p);var c=p;export{c as default};
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as t,html as i}from"lit";import{property as o,customElement as s}from"lit/decorators.js";import{S as n}from"./SlotController-Z6eG7LSZ.js";import{c as l}from"./cond-CI1KbneT.js";import{s as a}from"./Component-DSU3Qp0O.js";import{s as d}from"./FormField--eLuhPue.js";import"./EventController-BBOmvfLa.js";const h=r`fieldset{border:none}.n-label-container{margin-block-end:calc(var(--n-space-s) * 2)}:host([size='s']) .n-label-container{margin-block-end:var(--n-space-s)}.n-hidden{position:absolute;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);block-size:1px;inline-size:1px;white-space:nowrap}`;let p=class extends t{constructor(){super(...arguments),this.errorSlot=new n(this,"error"),this.hintSlot=new n(this,"hint"),this.label="",this.required=!1,this.hideRequired=!1,this.hideLabel=!1,this.size="m"}render(){const{hasError:e}=this;return i`<fieldset aria-invalid="${l(e,"true")}" aria-describedby="${l(e,"error")}" aria-required="${l(this.required,"true")}"><legend class="n-label-container ${this.hideLabel?"n-hidden":""}"><div class="n-label"><slot name="label">${this.label}</slot><span aria-hidden="true" class="n-required" ?hidden="${!this.required||this.hideRequired}">*</span></div><div class="n-caption n-hint" ?hidden="${!this.hasHint}"><slot name="hint">${this.hint}</slot></div></legend><slot></slot><div class="n-caption n-error" id="error" role="alert" ?hidden="${!this.hasError}"><slot name="error">${this.error}</slot></div></fieldset>`}get hasHint(){return Boolean(this.hint)||this.hintSlot.hasContent}get hasError(){return Boolean(this.error)||this.errorSlot.hasContent}};p.styles=[a,d,h],e([o({reflect:!0})],p.prototype,"label",void 0),e([o({reflect:!0})],p.prototype,"hint",void 0),e([o({reflect:!0})],p.prototype,"error",void 0),e([o({reflect:!0,type:Boolean})],p.prototype,"required",void 0),e([o({reflect:!0,type:Boolean,attribute:"hide-required"})],p.prototype,"hideRequired",void 0),e([o({reflect:!0,type:Boolean,attribute:"hide-label"})],p.prototype,"hideLabel",void 0),e([o({reflect:!0})],p.prototype,"size",void 0),p=e([s("nord-fieldset")],p);var c=p;export{c as default};
 //# sourceMappingURL=Fieldset.js.map

package/lib/Fieldset.js.map

@@ -1 +1 @@
-{"version":3,"file":"Fieldset.js","sources":["../src/fieldset/Fieldset.ts"],"sourcesContent":["import { html, LitElement } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport { SlotController } from \"../common/controllers/SlotController.js\"\nimport { cond } from \"../common/directives/cond.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport formFieldStyle from \"../common/styles/FormField.css\"\nimport style from \"./Fieldset.css\"\n\n/**\n * Fieldset is used for grouping sets of input components.\n * It is necessary to use a fieldset with radio and checkbox components.\n * It can also be useful for logically grouping other types of inputs.\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 fieldset.\n * @slot error - Optional slot that holds error text for the fieldset.\n *\n * @cssprop [--n-label-color=var(--n-color-text)] - Controls the text color of the label, using our [color tokens](/tokens/#color).\n */\n@customElement(\"nord-fieldset\")\nexport default class Fieldset extends LitElement {\n  static styles = [componentStyle, formFieldStyle, style]\n\n  private errorSlot = new SlotController(this, \"error\")\n  private hintSlot = new SlotController(this, \"hint\")\n\n  /**\n   * Label for the fieldset. Rendered as a `<legend>` element.\n   */\n  @property({ reflect: true }) label: string = \"\"\n\n  /**\n   * Optional hint text to be displayed with the input. Alternatively use the hint slot.\n   */\n  @property({ reflect: true }) hint?: string\n\n  /**\n   * Optional error to be shown with the fieldset. Alternatively use the error slot.\n   */\n  @property({ reflect: true }) error?: string\n\n  /**\n   * Determines whether the fieldset is required or not.\n   * A fieldset marked as required will be announced as such to users of assistive technology.\n   * When using this property you need to also set “novalidate” attribute on a form element to prevent browser from displaying its own validation errors.\n   */\n  @property({ reflect: true, type: Boolean }) required = false\n\n  /**\n   * Visually hide the required indicator, but still show\n   * required attribute to assistive technologies like screen readers.\n   */\n  @property({ reflect: true, type: Boolean, attribute: \"hide-required\" }) hideRequired = false\n\n  /**\n   * Visually hide the label, but still show it to assistive technologies like screen readers.\n   */\n  @property({ reflect: true, type: Boolean, attribute: \"hide-label\" }) hideLabel = false\n\n  /**\n   * The size of the label.\n   */\n  @property({ reflect: true }) size: \"s\" | \"m\" = \"m\"\n\n  render() {\n    const { hasError } = this\n\n    return html`\n      <fieldset\n        aria-invalid=${cond(hasError, \"true\")}\n        aria-describedby=${cond(hasError, \"error\")}\n        aria-required=${cond(this.required, \"true\")}\n      >\n        <legend class=\"n-label-container ${this.hideLabel ? \"n-hidden\" : \"\"}\">\n          <div class=\"n-label\">\n            <slot name=\"label\">${this.label}</slot\n            ><span aria-hidden=\"true\" class=\"n-required\" ?hidden=${!this.required || this.hideRequired}>*</span>\n          </div>\n\n          <div class=\"n-caption n-hint\" ?hidden=${!this.hasHint}>\n            <slot name=\"hint\">${this.hint}</slot>\n          </div>\n        </legend>\n\n        <slot></slot>\n\n        <div class=\"n-caption n-error\" id=\"error\" role=\"alert\" ?hidden=${!this.hasError}>\n          <slot name=\"error\">${this.error}</slot>\n        </div>\n      </fieldset>\n    `\n  }\n\n  protected get hasHint() {\n    return Boolean(this.hint) || this.hintSlot.hasContent\n  }\n\n  protected get hasError() {\n    return Boolean(this.error) || this.errorSlot.hasContent\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-fieldset\": Fieldset\n  }\n}\n"],"names":["Fieldset","LitElement","constructor","this","errorSlot","SlotController","hintSlot","label","required","hideRequired","hideLabel","size","render","hasError","html","cond","hasHint","hint","error","Boolean","hasContent","styles","componentStyle","formFieldStyle","style","__decorate","property","reflect","prototype","type","attribute","customElement"],"mappings":"mqBAuBe,IAAMA,EAAN,cAAuBC,EAAvB,WAAAC,uBAGLC,KAASC,UAAG,IAAIC,EAAeF,KAAM,SACrCA,KAAQG,SAAG,IAAID,EAAeF,KAAM,QAKfA,KAAKI,MAAW,GAiBDJ,KAAQK,UAAG,EAMiBL,KAAYM,cAAG,EAKlBN,KAASO,WAAG,EAKpDP,KAAIQ,KAAc,GAsChD,CApCC,MAAAC,GACE,MAAMC,SAAEA,GAAaV,KAErB,OAAOW,CAAI,2BAEQC,EAAKF,EAAU,8BACXE,EAAKF,EAAU,4BAClBE,EAAKZ,KAAKK,SAAU,6CAEDL,KAAKO,UAAY,WAAa,+CAExCP,KAAKI,qEAC8BJ,KAAKK,UAAYL,KAAKM,uEAGvCN,KAAKa,8BACxBb,KAAKc,2GAMqCd,KAAKU,gCAChDV,KAAKe,+BAIjC,CAED,WAAcF,GACZ,OAAOG,QAAQhB,KAAKc,OAASd,KAAKG,SAASc,UAC5C,CAED,YAAcP,GACZ,OAAOM,QAAQhB,KAAKe,QAAUf,KAAKC,UAAUgB,UAC9C,GA9EMpB,EAAMqB,OAAG,CAACC,EAAgBC,EAAgBC,GAQpBC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA0B3B,EAAA4B,UAAA,aAAA,GAKlBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqB3B,EAAA4B,UAAA,YAAA,GAKbH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsB3B,EAAA4B,UAAA,aAAA,GAOCH,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAME,KAAMV,WAA2BnB,EAAA4B,UAAA,gBAAA,GAMYH,EAAA,CAAvEC,EAAS,CAAEC,SAAS,EAAME,KAAMV,QAASW,UAAW,mBAAuC9B,EAAA4B,UAAA,oBAAA,GAKvBH,EAAA,CAApEC,EAAS,CAAEC,SAAS,EAAME,KAAMV,QAASW,UAAW,gBAAiC9B,EAAA4B,UAAA,iBAAA,GAKzDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA6B3B,EAAA4B,UAAA,YAAA,GA1C/B5B,EAAQyB,EAAA,CAD5BM,EAAc,kBACM/B,SAAAA"}
+{"version":3,"file":"Fieldset.js","sources":["../src/fieldset/Fieldset.ts"],"sourcesContent":["import { html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { SlotController } from '../common/controllers/SlotController.js'\nimport { cond } from '../common/directives/cond.js'\n\nimport componentStyle from '../common/styles/Component.css'\nimport formFieldStyle from '../common/styles/FormField.css'\nimport style from './Fieldset.css'\n\n/**\n * Fieldset is used for grouping sets of input components.\n * It is necessary to use a fieldset with radio and checkbox components.\n * It can also be useful for logically grouping other types of inputs.\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 fieldset.\n * @slot error - Optional slot that holds error text for the fieldset.\n *\n * @cssprop [--n-label-color=var(--n-color-text)] - Controls the text color of the label, using our [color tokens](/tokens/#color).\n */\n@customElement('nord-fieldset')\nexport default class Fieldset extends LitElement {\n  static styles = [componentStyle, formFieldStyle, style]\n\n  private errorSlot = new SlotController(this, 'error')\n  private hintSlot = new SlotController(this, 'hint')\n\n  /**\n   * Label for the fieldset. Rendered as a `<legend>` element.\n   */\n  @property({ reflect: true }) label: string = ''\n\n  /**\n   * Optional hint text to be displayed with the input. Alternatively use the hint slot.\n   */\n  @property({ reflect: true }) hint?: string\n\n  /**\n   * Optional error to be shown with the fieldset. Alternatively use the error slot.\n   */\n  @property({ reflect: true }) error?: string\n\n  /**\n   * Determines whether the fieldset is required or not.\n   * A fieldset marked as required will be announced as such to users of assistive technology.\n   * When using this property you need to also set “novalidate” attribute on a form element to prevent browser from displaying its own validation errors.\n   */\n  @property({ reflect: true, type: Boolean }) required = false\n\n  /**\n   * Visually hide the required indicator, but still show\n   * required attribute to assistive technologies like screen readers.\n   */\n  @property({ reflect: true, type: Boolean, attribute: 'hide-required' }) hideRequired = false\n\n  /**\n   * Visually hide the label, but still show it to assistive technologies like screen readers.\n   */\n  @property({ reflect: true, type: Boolean, attribute: 'hide-label' }) hideLabel = false\n\n  /**\n   * The size of the label.\n   */\n  @property({ reflect: true }) size: 's' | 'm' = 'm'\n\n  render() {\n    const { hasError } = this\n\n    return html`\n      <fieldset\n        aria-invalid=${cond(hasError, 'true')}\n        aria-describedby=${cond(hasError, 'error')}\n        aria-required=${cond(this.required, 'true')}\n      >\n        <legend class=\"n-label-container ${this.hideLabel ? 'n-hidden' : ''}\">\n          <div class=\"n-label\">\n            <slot name=\"label\">${this.label}</slot\n            ><span aria-hidden=\"true\" class=\"n-required\" ?hidden=${!this.required || this.hideRequired}>*</span>\n          </div>\n\n          <div class=\"n-caption n-hint\" ?hidden=${!this.hasHint}>\n            <slot name=\"hint\">${this.hint}</slot>\n          </div>\n        </legend>\n\n        <slot></slot>\n\n        <div class=\"n-caption n-error\" id=\"error\" role=\"alert\" ?hidden=${!this.hasError}>\n          <slot name=\"error\">${this.error}</slot>\n        </div>\n      </fieldset>\n    `\n  }\n\n  protected get hasHint() {\n    return Boolean(this.hint) || this.hintSlot.hasContent\n  }\n\n  protected get hasError() {\n    return Boolean(this.error) || this.errorSlot.hasContent\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-fieldset': Fieldset\n  }\n}\n"],"names":["Fieldset","LitElement","constructor","this","errorSlot","SlotController","hintSlot","label","required","hideRequired","hideLabel","size","render","hasError","html","cond","hasHint","hint","error","Boolean","hasContent","styles","componentStyle","formFieldStyle","style","__decorate","property","reflect","prototype","type","attribute","customElement"],"mappings":"mqBAuBe,IAAMA,EAAN,cAAuBC,EAAvB,WAAAC,uBAGLC,KAASC,UAAG,IAAIC,EAAeF,KAAM,SACrCA,KAAQG,SAAG,IAAID,EAAeF,KAAM,QAKfA,KAAKI,MAAW,GAiBDJ,KAAQK,UAAG,EAMiBL,KAAYM,cAAG,EAKlBN,KAASO,WAAG,EAKpDP,KAAIQ,KAAc,GAsChD,CApCC,MAAAC,GACE,MAAMC,SAAEA,GAAaV,KAErB,OAAOW,CAAI,2BAEQC,EAAKF,EAAU,8BACXE,EAAKF,EAAU,4BAClBE,EAAKZ,KAAKK,SAAU,6CAEDL,KAAKO,UAAY,WAAa,+CAExCP,KAAKI,qEAC8BJ,KAAKK,UAAYL,KAAKM,uEAGvCN,KAAKa,8BACxBb,KAAKc,2GAMqCd,KAAKU,gCAChDV,KAAKe,+BAIjC,CAED,WAAcF,GACZ,OAAOG,QAAQhB,KAAKc,OAASd,KAAKG,SAASc,UAC5C,CAED,YAAcP,GACZ,OAAOM,QAAQhB,KAAKe,QAAUf,KAAKC,UAAUgB,UAC9C,GA9EMpB,EAAMqB,OAAG,CAACC,EAAgBC,EAAgBC,GAQpBC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA0B3B,EAAA4B,UAAA,aAAA,GAKlBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqB3B,EAAA4B,UAAA,YAAA,GAKbH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsB3B,EAAA4B,UAAA,aAAA,GAOCH,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAME,KAAMV,WAA2BnB,EAAA4B,UAAA,gBAAA,GAMYH,EAAA,CAAvEC,EAAS,CAAEC,SAAS,EAAME,KAAMV,QAASW,UAAW,mBAAuC9B,EAAA4B,UAAA,oBAAA,GAKvBH,EAAA,CAApEC,EAAS,CAAEC,SAAS,EAAME,KAAMV,QAASW,UAAW,gBAAiC9B,EAAA4B,UAAA,iBAAA,GAKzDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA6B3B,EAAA4B,UAAA,YAAA,GA1C/B5B,EAAQyB,EAAA,CAD5BM,EAAc,kBACM/B,SAAAA"}

package/lib/FocusableMixin-BlQLNPdJ.js.map

@@ -1 +1 @@
-{"version":3,"file":"FocusableMixin-BlQLNPdJ.js","sources":["../src/common/mixins/FocusableMixin.ts"],"sourcesContent":["/* eslint-disable max-classes-per-file */\n\nimport { LitElement } from \"lit\"\nimport { createRef, Ref } from \"lit/directives/ref.js\"\n\ntype Constructable<T = Record<string, unknown>> = new (...args: any[]) => T\n\nexport declare class FocusableMixinInterface {\n  protected focusableRef: Ref<HTMLElement>\n  focus(options?: FocusOptions): void\n  blur(): void\n  click(): void\n}\n\nexport function FocusableMixin<T extends Constructable<LitElement>>(superClass: T) {\n  class FocusableElement extends superClass {\n    protected focusableRef = createRef<HTMLElement>()\n\n    /**\n     * Programmatically move focus to the component.\n     * @param {FocusOptions} options An object which controls aspects of the focusing process.\n     */\n    focus(options?: FocusOptions) {\n      this.focusableRef.value?.focus(options)\n    }\n\n    /**\n     * Programmatically remove focus from the component.\n     */\n    blur() {\n      this.focusableRef.value?.blur()\n    }\n\n    /**\n     * Programmatically simulates a click on the component.\n     */\n    click() {\n      this.focusableRef.value?.click()\n    }\n  }\n\n  return FocusableElement as unknown as Constructable<FocusableMixinInterface> & T\n}\n"],"names":["FocusableMixin","superClass","constructor","this","focusableRef","createRef","focus","options","_a","value","blur","click"],"mappings":"kDAcM,SAAUA,EAAoDC,GA2BlE,OA1BA,cAA+BA,EAA/B,WAAAC,uBACYC,KAAYC,aAAGC,GAuB1B,CAjBC,KAAAC,CAAMC,iBACJC,EAAAL,KAAKC,aAAaK,sBAAOH,MAAMC,EAChC,CAKD,IAAAG,SAC2B,QAAzBF,EAAAL,KAAKC,aAAaK,aAAO,IAAAD,GAAAA,EAAAE,MAC1B,CAKD,KAAAC,SAC2B,QAAzBH,EAAAL,KAAKC,aAAaK,aAAO,IAAAD,GAAAA,EAAAG,OAC1B,EAIL"}
+{"version":3,"file":"FocusableMixin-BlQLNPdJ.js","sources":["../src/common/mixins/FocusableMixin.ts"],"sourcesContent":["import type { LitElement } from 'lit'\nimport type { Ref } from 'lit/directives/ref.js'\nimport { createRef } from 'lit/directives/ref.js'\n\ntype Constructable<T = Record<string, unknown>> = new (...args: any[]) => T\n\nexport declare class FocusableMixinInterface {\n  protected focusableRef: Ref<HTMLElement>\n  focus(options?: FocusOptions): void\n  blur(): void\n  click(): void\n}\n\nexport function FocusableMixin<T extends Constructable<LitElement>>(superClass: T) {\n  class FocusableElement extends superClass {\n    protected focusableRef = createRef<HTMLElement>()\n\n    /**\n     * Programmatically move focus to the component.\n     * @param {FocusOptions} options An object which controls aspects of the focusing process.\n     */\n    focus(options?: FocusOptions) {\n      this.focusableRef.value?.focus(options)\n    }\n\n    /**\n     * Programmatically remove focus from the component.\n     */\n    blur() {\n      this.focusableRef.value?.blur()\n    }\n\n    /**\n     * Programmatically simulates a click on the component.\n     */\n    click() {\n      this.focusableRef.value?.click()\n    }\n  }\n\n  return FocusableElement as unknown as Constructable<FocusableMixinInterface> & T\n}\n"],"names":["FocusableMixin","superClass","constructor","this","focusableRef","createRef","focus","options","_a","value","blur","click"],"mappings":"kDAaM,SAAUA,EAAoDC,GA2BlE,OA1BA,cAA+BA,EAA/B,WAAAC,uBACYC,KAAYC,aAAGC,GAuB1B,CAjBC,KAAAC,CAAMC,iBACJC,EAAAL,KAAKC,aAAaK,sBAAOH,MAAMC,EAChC,CAKD,IAAAG,SAC2B,QAAzBF,EAAAL,KAAKC,aAAaK,aAAO,IAAAD,GAAAA,EAAAE,MAC1B,CAKD,KAAAC,SAC2B,QAAzBH,EAAAL,KAAKC,aAAaK,aAAO,IAAAD,GAAAA,EAAAG,OAC1B,EAIL"}

package/lib/Footer.js

@@ -1,2 +1,2 @@
-import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as e,html as t}from"lit";import{property as n,customElement as a}from"lit/decorators.js";import{s}from"./Component-DSU3Qp0O.js";const l=r`:host{--_n-footer-padding-inline:var(--n-footer-padding-inline, var(--n-space-l));--_n-footer-box-shadow:var(--n-footer-box-shadow, var(--n-box-shadow-header));--_n-footer-background-color:var(--n-footer-background-color, var(--n-color-surface));--_n-footer-padding-block:var(--n-space-m);color:var(--n-color-text)}::slotted(*){margin:0!important}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}.n-footer{display:flex;flex-flow:row;align-items:center;flex-wrap:wrap;gap:var(--n-space-s);padding:var(--_n-footer-padding-block) var(--_n-footer-padding-inline);background-color:var(--_n-footer-background-color);border-block-start:1px solid var(--n-color-border);box-shadow:var(--_n-footer-box-shadow);justify-content:flex-end}:host([size="s"]){--_n-footer-padding-block:var(--n-space-s)}`;let d=class extends e{constructor(){super(...arguments),this.size="m"}render(){return t`<footer class="n-footer"><slot></slot></footer>`}};d.styles=[s,l],o([n({reflect:!0})],d.prototype,"size",void 0),d=o([a("nord-footer")],d);var i=d;export{i as default};
+import{_ as o}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as e,html as t}from"lit";import{property as n,customElement as a}from"lit/decorators.js";import{s}from"./Component-DSU3Qp0O.js";const l=r`:host{--_n-footer-padding-inline:var(--n-footer-padding-inline, var(--n-space-l));--_n-footer-box-shadow:var(--n-footer-box-shadow, var(--n-box-shadow-header));--_n-footer-background-color:var(--n-footer-background-color, var(--n-color-surface));--_n-footer-padding-block:var(--n-space-m);color:var(--n-color-text)}::slotted(*){margin:0!important}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}.n-footer{display:flex;flex-flow:row;align-items:center;flex-wrap:wrap;gap:var(--n-space-s);padding:var(--_n-footer-padding-block) var(--_n-footer-padding-inline);background-color:var(--_n-footer-background-color);border-block-start:1px solid var(--n-color-border);box-shadow:var(--_n-footer-box-shadow);justify-content:flex-end}:host([size='s']){--_n-footer-padding-block:var(--n-space-s)}`;let d=class extends e{constructor(){super(...arguments),this.size="m"}render(){return t`<footer class="n-footer"><slot></slot></footer>`}};d.styles=[s,l],o([n({reflect:!0})],d.prototype,"size",void 0),d=o([a("nord-footer")],d);var i=d;export{i as default};
 //# sourceMappingURL=Footer.js.map

package/lib/Footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Footer.js","sources":["../src/footer/Footer.ts"],"sourcesContent":["import { LitElement, html } from \"lit\"\nimport { customElement, property } from \"lit/decorators.js\"\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Footer.css\"\n\n/**\n * The footer is a block of designated space for providing additional information or actions that are positioned below the main content.\n *\n * @status new\n * @category structure\n * @slot - The footer content.\n *\n * @cssprop [--n-footer-padding-inline=var(--n-space-l)] - Controls the inline padding around the footer’s main slot, using [spacing tokens](/tokens/#space).\n * @cssprop [--n-footer-box-shadow=var(--n-box-shadow-header)] - Controls the box shadow of the footer, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-footer-background-color=var(--n-color-surface)] - Controls the background color of the footer, using [color tokens](/tokens/#color).\n */\n@customElement(\"nord-footer\")\nexport default class Footer extends LitElement {\n  static styles = [componentStyle, style]\n\n  /**\n   * Controls the size of the footer component.\n   */\n  @property({ reflect: true }) size: \"m\" | \"s\" = \"m\"\n\n  render() {\n    return html`\n      <footer class=\"n-footer\">\n        <slot></slot>\n      </footer>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-footer\": Footer\n  }\n}\n"],"names":["Footer","LitElement","constructor","this","size","render","html","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"kiCAiBe,IAAMA,EAAN,cAAqBC,EAArB,WAAAC,uBAMgBC,KAAIC,KAAc,GAShD,CAPC,MAAAC,GACE,OAAOC,CAAI,iDAKZ,GAbMN,EAAAO,OAAS,CAACC,EAAgBC,GAKJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA6BZ,EAAAa,UAAA,YAAA,GAN/Bb,EAAMU,EAAA,CAD1BI,EAAc,gBACMd,SAAAA"}
+{"version":3,"file":"Footer.js","sources":["../src/footer/Footer.ts"],"sourcesContent":["import { html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport componentStyle from '../common/styles/Component.css'\nimport style from './Footer.css'\n\n/**\n * The footer is a block of designated space for providing additional information or actions that are positioned below the main content.\n *\n * @status new\n * @category structure\n * @slot - The footer content.\n *\n * @cssprop [--n-footer-padding-inline=var(--n-space-l)] - Controls the inline padding around the footer’s main slot, using [spacing tokens](/tokens/#space).\n * @cssprop [--n-footer-box-shadow=var(--n-box-shadow-header)] - Controls the box shadow of the footer, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-footer-background-color=var(--n-color-surface)] - Controls the background color of the footer, using [color tokens](/tokens/#color).\n */\n@customElement('nord-footer')\nexport default class Footer extends LitElement {\n  static styles = [componentStyle, style]\n\n  /**\n   * Controls the size of the footer component.\n   */\n  @property({ reflect: true }) size: 'm' | 's' = 'm'\n\n  render() {\n    return html`\n      <footer class=\"n-footer\">\n        <slot></slot>\n      </footer>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-footer': Footer\n  }\n}\n"],"names":["Footer","LitElement","constructor","this","size","render","html","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"kiCAiBe,IAAMA,EAAN,cAAqBC,EAArB,WAAAC,uBAMgBC,KAAIC,KAAc,GAShD,CAPC,MAAAC,GACE,OAAOC,CAAI,iDAKZ,GAbMN,EAAAO,OAAS,CAACC,EAAgBC,GAKJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA6BZ,EAAAa,UAAA,YAAA,GAN/Bb,EAAMU,EAAA,CAD1BI,EAAc,gBACMd,SAAAA"}

package/lib/FormAssociatedMixin-DFL7yabe.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormAssociatedMixin-DFL7yabe.js","sources":["../src/common/mixins/FormAssociatedMixin.ts"],"sourcesContent":["/* eslint-disable max-classes-per-file */\nimport { html, LitElement, TemplateResult } from \"lit\"\nimport { property } from \"lit/decorators.js\"\nimport { FormDataController } from \"../controllers/FormDataController.js\"\nimport { SlotController } from \"../controllers/SlotController.js\"\nimport { NordEvent } from \"../events.js\"\nimport { InputMixinInterface } from \"./InputMixin.js\"\nimport \"../../visually-hidden/VisuallyHidden.js\"\n\ntype Constructor<T = Record<string, unknown>> = new (...args: any[]) => T\ntype NativeInputElement = HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement\n\nexport declare class FormAssociatedMixinInterface {\n  label: string\n  required: boolean\n  hideRequired: boolean\n  hint?: string\n  hideLabel: boolean\n  placeholder?: string\n  error?: string\n\n  protected inputId: string\n  protected errorId: string\n  protected hintId: string\n  protected labelSlot: SlotController\n  protected hintSlot: SlotController\n  protected errorSlot: SlotController\n  protected formData: FormDataController\n\n  protected get formValue(): string | undefined\n  protected get hasError(): boolean\n  protected get hasHint(): boolean\n\n  protected handleChange(e: Event): void\n  protected handleInput(e: Event): void\n  protected renderLabel(additionalContent?: TemplateResult): TemplateResult\n  protected renderError(): TemplateResult\n  protected getDescribedBy(): string | undefined\n  protected getInvalid(): \"true\" | undefined\n}\n\nexport function FormAssociatedMixin<T extends Constructor<InputMixinInterface & LitElement>>(superClass: T) {\n  // TODO: would be nice if custom elements analyzer could pick up the slot docs from the mixin\n\n  /**\n   * @slot label - Use when a label requires more than plain text.\n   * @slot hint - Use when a hint requires more than plain text.\n   * @slot error - Optional slot that holds error text for the input.\n   */\n  class FormAssociatedElement extends superClass {\n    protected labelSlot = new SlotController(this, \"label\")\n    protected errorSlot = new SlotController(this, \"error\")\n    protected hintSlot = new SlotController(this, \"hint\")\n    protected formData = new FormDataController(this, { value: () => this.formValue })\n\n    protected get formValue() {\n      return this.value\n    }\n\n    protected inputId = \"input\"\n    protected errorId = \"error\"\n    protected hintId = \"hint\"\n\n    /**\n     * Label for the input.\n     */\n    @property({ reflect: true }) label: string = \"\"\n\n    /**\n     * Optional hint text to be displayed with the input. Alternatively use the hint slot.\n     */\n    @property({ reflect: true }) hint?: string\n\n    /**\n     * Visually hide the label, but still show it to assistive technologies like screen readers.\n     */\n    @property({ reflect: true, type: Boolean, attribute: \"hide-label\" }) hideLabel = false\n\n    /**\n     * Placeholder text to display within the input.\n     */\n    @property({ reflect: true }) placeholder?: string\n\n    /**\n     * Optional error to be shown with the input. Alternatively use the error slot.\n     */\n    @property({ reflect: true }) error?: string\n\n    /**\n     * Determines whether the input is required or not.\n     * An input marked as required will be announced as such to users of assistive technology.\n     * When using this property you need to also set “novalidate” attribute on a form element to prevent browser from displaying its own validation errors.\n     */\n    @property({ reflect: true, type: Boolean }) required = false\n\n    /**\n     * Visually hide the required indicator, but still show\n     * required attribute to assistive technologies like screen readers.\n     */\n    @property({ reflect: true, type: Boolean, attribute: \"hide-required\" }) hideRequired = false\n\n    protected handleInput(e: Event) {\n      e.stopPropagation()\n      const target = e.target as NativeInputElement\n      this.value = target.value\n\n      /**\n       * Fired as the user types into the input.\n       */\n      this.dispatchEvent(new NordEvent(\"input\"))\n    }\n\n    protected handleChange(e: Event) {\n      e.stopPropagation()\n\n      /**\n       * Fired whenever the input's value is changed via user interaction.\n       */\n      this.dispatchEvent(new NordEvent(\"change\"))\n    }\n\n    protected renderLabel(additionalContent?: TemplateResult) {\n      const label = html`\n        <label for=${this.inputId}>\n          <slot name=\"label\">${this.label}</slot\n          ><span ?hidden=${!this.required || this.hideRequired} aria-hidden=\"true\" class=\"n-required\">*</span>\n          ${additionalContent}\n        </label>\n\n        <div class=\"n-caption n-hint\" id=${this.hintId} ?hidden=${!this.hasHint}>\n          <slot name=\"hint\">${this.hint}</slot>\n        </div>\n      `\n\n      return this.hideLabel\n        ? html`<nord-visually-hidden>${label}</nord-visually-hidden>`\n        : html`<div class=\"n-label-container\">${label}</div>`\n    }\n\n    protected renderError() {\n      return html`\n        <div class=\"n-caption n-error\" id=${this.errorId} role=\"alert\" ?hidden=${!this.hasError}>\n          <slot name=\"error\">${this.error}</slot>\n        </div>\n      `\n    }\n\n    protected getDescribedBy() {\n      const { hasHint, hasError } = this\n\n      if (hasHint && hasError) {\n        return `${this.hintId} ${this.errorId}`\n      }\n      if (hasHint) {\n        return this.hintId\n      }\n      if (hasError) {\n        return this.errorId\n      }\n\n      return undefined\n    }\n\n    protected getInvalid() {\n      return this.hasError ? \"true\" : undefined\n    }\n\n    protected get hasHint() {\n      return Boolean(this.hint) || this.hintSlot.hasContent\n    }\n\n    protected get hasError() {\n      return Boolean(this.error) || this.errorSlot.hasContent\n    }\n  }\n\n  return FormAssociatedElement as unknown as Constructor<FormAssociatedMixinInterface> & T\n}\n"],"names":["FormAssociatedMixin","superClass","FormAssociatedElement","constructor","this","labelSlot","SlotController","errorSlot","hintSlot","formData","FormDataController","value","formValue","inputId","errorId","hintId","label","hideLabel","required","hideRequired","handleInput","e","stopPropagation","target","dispatchEvent","NordEvent","handleChange","renderLabel","additionalContent","html","hasHint","hint","renderError","hasError","error","getDescribedBy","getInvalid","undefined","Boolean","hasContent","__decorate","property","reflect","prototype","type","attribute"],"mappings":"+RAyCM,SAAUA,EAA6EC,GAQ3F,MAAMC,UAA8BD,EAApC,WAAAE,uBACYC,KAASC,UAAG,IAAIC,EAAeF,KAAM,SACrCA,KAASG,UAAG,IAAID,EAAeF,KAAM,SACrCA,KAAQI,SAAG,IAAIF,EAAeF,KAAM,QACpCA,KAAAK,SAAW,IAAIC,EAAmBN,KAAM,CAAEO,MAAO,IAAMP,KAAKQ,YAM5DR,KAAOS,QAAG,QACVT,KAAOU,QAAG,QACVV,KAAMW,OAAG,OAKUX,KAAKY,MAAW,GAUwBZ,KAASa,WAAG,EAiBrCb,KAAQc,UAAG,EAMiBd,KAAYe,cAAG,CA2ExF,CAvHC,aAAcP,GACZ,OAAOR,KAAKO,KACb,CA4CS,WAAAS,CAAYC,GACpBA,EAAEC,kBACF,MAAMC,EAASF,EAAEE,OACjBnB,KAAKO,MAAQY,EAAOZ,MAKpBP,KAAKoB,cAAc,IAAIC,EAAU,SAClC,CAES,YAAAC,CAAaL,GACrBA,EAAEC,kBAKFlB,KAAKoB,cAAc,IAAIC,EAAU,UAClC,CAES,WAAAE,CAAYC,GACpB,MAAMZ,EAAQa,CAAI,eACHzB,KAAKS,+BACKT,KAAKY,+BACRZ,KAAKc,UAAYd,KAAKe,gEACtCS,8CAG+BxB,KAAKW,qBAAmBX,KAAK0B,8BAC1C1B,KAAK2B,oBAI7B,OAAO3B,KAAKa,UACRY,CAAI,yBAAyBb,2BAC7Ba,CAAI,kCAAkCb,SAC3C,CAES,WAAAgB,GACR,OAAOH,CAAI,sCAC2BzB,KAAKU,mCAAiCV,KAAK6B,gCACxD7B,KAAK8B,oBAG/B,CAES,cAAAC,GACR,MAAML,QAAEA,EAAOG,SAAEA,GAAa7B,KAE9B,OAAI0B,GAAWG,EACN,GAAG7B,KAAKW,UAAUX,KAAKU,UAE5BgB,EACK1B,KAAKW,OAEVkB,EACK7B,KAAKU,aADd,CAKD,CAES,UAAAsB,GACR,OAAOhC,KAAK6B,SAAW,YAASI,CACjC,CAED,WAAcP,GACZ,OAAOQ,QAAQlC,KAAK2B,OAAS3B,KAAKI,SAAS+B,UAC5C,CAED,YAAcN,GACZ,OAAOK,QAAQlC,KAAK8B,QAAU9B,KAAKG,UAAUgC,UAC9C,EAGH,OA9G+BC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA0BxC,EAAAyC,UAAA,aAAA,GAKlBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqBxC,EAAAyC,UAAA,YAAA,GAK2BH,EAAA,CAApEC,EAAS,CAAEC,SAAS,EAAME,KAAMN,QAASO,UAAW,gBAAiC3C,EAAAyC,UAAA,iBAAA,GAKzDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA4BxC,EAAAyC,UAAA,mBAAA,GAKpBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsBxC,EAAAyC,UAAA,aAAA,GAOCH,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAME,KAAMN,WAA2BpC,EAAAyC,UAAA,gBAAA,GAMYH,EAAA,CAAvEC,EAAS,CAAEC,SAAS,EAAME,KAAMN,QAASO,UAAW,mBAAuC3C,EAAAyC,UAAA,oBAAA,GA6EvFzC,CACT"}
+{"version":3,"file":"FormAssociatedMixin-DFL7yabe.js","sources":["../src/common/mixins/FormAssociatedMixin.ts"],"sourcesContent":["import type { LitElement, TemplateResult } from 'lit'\nimport type { InputMixinInterface } from './InputMixin.js'\nimport { html } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { FormDataController } from '../controllers/FormDataController.js'\nimport { SlotController } from '../controllers/SlotController.js'\nimport { NordEvent } from '../events.js'\nimport '../../visually-hidden/VisuallyHidden.js'\n\ntype Constructor<T = Record<string, unknown>> = new (...args: any[]) => T\ntype NativeInputElement = HTMLSelectElement | HTMLInputElement | HTMLTextAreaElement\n\nexport declare class FormAssociatedMixinInterface {\n  label: string\n  required: boolean\n  hideRequired: boolean\n  hint?: string\n  hideLabel: boolean\n  placeholder?: string\n  error?: string\n\n  protected inputId: string\n  protected errorId: string\n  protected hintId: string\n  protected labelSlot: SlotController\n  protected hintSlot: SlotController\n  protected errorSlot: SlotController\n  protected formData: FormDataController\n\n  protected get formValue(): string | undefined\n  protected get hasError(): boolean\n  protected get hasHint(): boolean\n\n  protected handleChange(e: Event): void\n  protected handleInput(e: Event): void\n  protected renderLabel(additionalContent?: TemplateResult): TemplateResult\n  protected renderError(): TemplateResult\n  protected getDescribedBy(): string | undefined\n  protected getInvalid(): 'true' | undefined\n}\n\nexport function FormAssociatedMixin<T extends Constructor<InputMixinInterface & LitElement>>(superClass: T) {\n  // TODO: would be nice if custom elements analyzer could pick up the slot docs from the mixin\n\n  /**\n   * @slot label - Use when a label requires more than plain text.\n   * @slot hint - Use when a hint requires more than plain text.\n   * @slot error - Optional slot that holds error text for the input.\n   */\n  class FormAssociatedElement extends superClass {\n    protected labelSlot = new SlotController(this, 'label')\n    protected errorSlot = new SlotController(this, 'error')\n    protected hintSlot = new SlotController(this, 'hint')\n    protected formData = new FormDataController(this, { value: () => this.formValue })\n\n    protected get formValue() {\n      return this.value\n    }\n\n    protected inputId = 'input'\n    protected errorId = 'error'\n    protected hintId = 'hint'\n\n    /**\n     * Label for the input.\n     */\n    @property({ reflect: true }) label: string = ''\n\n    /**\n     * Optional hint text to be displayed with the input. Alternatively use the hint slot.\n     */\n    @property({ reflect: true }) hint?: string\n\n    /**\n     * Visually hide the label, but still show it to assistive technologies like screen readers.\n     */\n    @property({ reflect: true, type: Boolean, attribute: 'hide-label' }) hideLabel = false\n\n    /**\n     * Placeholder text to display within the input.\n     */\n    @property({ reflect: true }) placeholder?: string\n\n    /**\n     * Optional error to be shown with the input. Alternatively use the error slot.\n     */\n    @property({ reflect: true }) error?: string\n\n    /**\n     * Determines whether the input is required or not.\n     * An input marked as required will be announced as such to users of assistive technology.\n     * When using this property you need to also set “novalidate” attribute on a form element to prevent browser from displaying its own validation errors.\n     */\n    @property({ reflect: true, type: Boolean }) required = false\n\n    /**\n     * Visually hide the required indicator, but still show\n     * required attribute to assistive technologies like screen readers.\n     */\n    @property({ reflect: true, type: Boolean, attribute: 'hide-required' }) hideRequired = false\n\n    protected handleInput(e: Event) {\n      e.stopPropagation()\n      const target = e.target as NativeInputElement\n      this.value = target.value\n\n      /**\n       * Fired as the user types into the input.\n       */\n      this.dispatchEvent(new NordEvent('input'))\n    }\n\n    protected handleChange(e: Event) {\n      e.stopPropagation()\n\n      /**\n       * Fired whenever the input's value is changed via user interaction.\n       */\n      this.dispatchEvent(new NordEvent('change'))\n    }\n\n    protected renderLabel(additionalContent?: TemplateResult) {\n      const label = html`\n        <label for=${this.inputId}>\n          <slot name=\"label\">${this.label}</slot\n          ><span ?hidden=${!this.required || this.hideRequired} aria-hidden=\"true\" class=\"n-required\">*</span>\n          ${additionalContent}\n        </label>\n\n        <div class=\"n-caption n-hint\" id=${this.hintId} ?hidden=${!this.hasHint}>\n          <slot name=\"hint\">${this.hint}</slot>\n        </div>\n      `\n\n      return this.hideLabel\n        ? html`<nord-visually-hidden>${label}</nord-visually-hidden>`\n        : html`<div class=\"n-label-container\">${label}</div>`\n    }\n\n    protected renderError() {\n      return html`\n        <div class=\"n-caption n-error\" id=${this.errorId} role=\"alert\" ?hidden=${!this.hasError}>\n          <slot name=\"error\">${this.error}</slot>\n        </div>\n      `\n    }\n\n    protected getDescribedBy() {\n      const { hasHint, hasError } = this\n\n      if (hasHint && hasError) {\n        return `${this.hintId} ${this.errorId}`\n      }\n      if (hasHint) {\n        return this.hintId\n      }\n      if (hasError) {\n        return this.errorId\n      }\n\n      return undefined\n    }\n\n    protected getInvalid() {\n      return this.hasError ? 'true' : undefined\n    }\n\n    protected get hasHint() {\n      return Boolean(this.hint) || this.hintSlot.hasContent\n    }\n\n    protected get hasError() {\n      return Boolean(this.error) || this.errorSlot.hasContent\n    }\n  }\n\n  return FormAssociatedElement as unknown as Constructor<FormAssociatedMixinInterface> & T\n}\n"],"names":["FormAssociatedMixin","superClass","FormAssociatedElement","constructor","this","labelSlot","SlotController","errorSlot","hintSlot","formData","FormDataController","value","formValue","inputId","errorId","hintId","label","hideLabel","required","hideRequired","handleInput","e","stopPropagation","target","dispatchEvent","NordEvent","handleChange","renderLabel","additionalContent","html","hasHint","hint","renderError","hasError","error","getDescribedBy","getInvalid","undefined","Boolean","hasContent","__decorate","property","reflect","prototype","type","attribute"],"mappings":"+RAyCM,SAAUA,EAA6EC,GAQ3F,MAAMC,UAA8BD,EAApC,WAAAE,uBACYC,KAASC,UAAG,IAAIC,EAAeF,KAAM,SACrCA,KAASG,UAAG,IAAID,EAAeF,KAAM,SACrCA,KAAQI,SAAG,IAAIF,EAAeF,KAAM,QACpCA,KAAAK,SAAW,IAAIC,EAAmBN,KAAM,CAAEO,MAAO,IAAMP,KAAKQ,YAM5DR,KAAOS,QAAG,QACVT,KAAOU,QAAG,QACVV,KAAMW,OAAG,OAKUX,KAAKY,MAAW,GAUwBZ,KAASa,WAAG,EAiBrCb,KAAQc,UAAG,EAMiBd,KAAYe,cAAG,CA2ExF,CAvHC,aAAcP,GACZ,OAAOR,KAAKO,KACb,CA4CS,WAAAS,CAAYC,GACpBA,EAAEC,kBACF,MAAMC,EAASF,EAAEE,OACjBnB,KAAKO,MAAQY,EAAOZ,MAKpBP,KAAKoB,cAAc,IAAIC,EAAU,SAClC,CAES,YAAAC,CAAaL,GACrBA,EAAEC,kBAKFlB,KAAKoB,cAAc,IAAIC,EAAU,UAClC,CAES,WAAAE,CAAYC,GACpB,MAAMZ,EAAQa,CAAI,eACHzB,KAAKS,+BACKT,KAAKY,+BACRZ,KAAKc,UAAYd,KAAKe,gEACtCS,8CAG+BxB,KAAKW,qBAAmBX,KAAK0B,8BAC1C1B,KAAK2B,oBAI7B,OAAO3B,KAAKa,UACRY,CAAI,yBAAyBb,2BAC7Ba,CAAI,kCAAkCb,SAC3C,CAES,WAAAgB,GACR,OAAOH,CAAI,sCAC2BzB,KAAKU,mCAAiCV,KAAK6B,gCACxD7B,KAAK8B,oBAG/B,CAES,cAAAC,GACR,MAAML,QAAEA,EAAOG,SAAEA,GAAa7B,KAE9B,OAAI0B,GAAWG,EACN,GAAG7B,KAAKW,UAAUX,KAAKU,UAE5BgB,EACK1B,KAAKW,OAEVkB,EACK7B,KAAKU,aADd,CAKD,CAES,UAAAsB,GACR,OAAOhC,KAAK6B,SAAW,YAASI,CACjC,CAED,WAAcP,GACZ,OAAOQ,QAAQlC,KAAK2B,OAAS3B,KAAKI,SAAS+B,UAC5C,CAED,YAAcN,GACZ,OAAOK,QAAQlC,KAAK8B,QAAU9B,KAAKG,UAAUgC,UAC9C,EAGH,OA9G+BC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA0BxC,EAAAyC,UAAA,aAAA,GAKlBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAqBxC,EAAAyC,UAAA,YAAA,GAK2BH,EAAA,CAApEC,EAAS,CAAEC,SAAS,EAAME,KAAMN,QAASO,UAAW,gBAAiC3C,EAAAyC,UAAA,iBAAA,GAKzDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA4BxC,EAAAyC,UAAA,mBAAA,GAKpBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsBxC,EAAAyC,UAAA,aAAA,GAOCH,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAME,KAAMN,WAA2BpC,EAAAyC,UAAA,gBAAA,GAMYH,EAAA,CAAvEC,EAAS,CAAEC,SAAS,EAAME,KAAMN,QAASO,UAAW,mBAAuC3C,EAAAyC,UAAA,oBAAA,GA6EvFzC,CACT"}

package/lib/FormDataController-OUt5L5uC.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormDataController-OUt5L5uC.js","sources":["../src/common/controllers/FormDataController.ts"],"sourcesContent":["import { ReactiveController, ReactiveControllerHost } from \"lit\"\nimport { InputMixinInterface } from \"../mixins/InputMixin.js\"\n\ntype FormDataOptions = {\n  value: () => string | undefined\n}\n\nexport class FormDataController implements ReactiveController {\n  private _form: HTMLFormElement | null = null\n\n  constructor(\n    private host: ReactiveControllerHost & InputMixinInterface,\n    private options: FormDataOptions\n  ) {\n    host.addController(this)\n  }\n\n  hostConnected() {\n    this.listen(this.host.form)\n  }\n\n  hostUpdated() {\n    this.listen(this.host.form)\n  }\n\n  hostDisconnected() {\n    this.cleanup()\n  }\n\n  private listen(form: HTMLFormElement | null) {\n    if (this._form !== form) {\n      this.cleanup()\n      this._form = form\n      this._form?.addEventListener(\"formdata\", this.handleFormData)\n    }\n  }\n\n  private cleanup() {\n    this._form?.removeEventListener(\"formdata\", this.handleFormData)\n    this._form = null\n  }\n\n  private handleFormData = (e: FormDataEvent) => {\n    const { disabled, name } = this.host\n\n    if (disabled) {\n      return\n    }\n    if (!name) {\n      return\n    }\n\n    const value = this.options.value()\n    if (value != null) {\n      e.formData.append(name, value)\n    }\n  }\n}\n"],"names":["FormDataController","constructor","host","options","this","_form","handleFormData","e","disabled","name","value","formData","append","addController","hostConnected","listen","form","hostUpdated","hostDisconnected","cleanup","_a","addEventListener","removeEventListener"],"mappings":"MAOaA,EAGX,WAAAC,CACUC,EACAC,GADAC,KAAIF,KAAJA,EACAE,KAAOD,QAAPA,EAJFC,KAAKC,MAA2B,KAkChCD,KAAAE,eAAkBC,IACxB,MAAMC,SAAEA,EAAQC,KAAEA,GAASL,KAAKF,KAEhC,GAAIM,EACF,OAEF,IAAKC,EACH,OAGF,MAAMC,EAAQN,KAAKD,QAAQO,QACd,MAATA,GACFH,EAAEI,SAASC,OAAOH,EAAMC,EACzB,EAzCDR,EAAKW,cAAcT,KACpB,CAED,aAAAU,GACEV,KAAKW,OAAOX,KAAKF,KAAKc,KACvB,CAED,WAAAC,GACEb,KAAKW,OAAOX,KAAKF,KAAKc,KACvB,CAED,gBAAAE,GACEd,KAAKe,SACN,CAEO,MAAAJ,CAAOC,SACTZ,KAAKC,QAAUW,IACjBZ,KAAKe,UACLf,KAAKC,MAAQW,EACH,QAAVI,EAAAhB,KAAKC,aAAK,IAAAe,GAAAA,EAAEC,iBAAiB,WAAYjB,KAAKE,gBAEjD,CAEO,OAAAa,SACI,QAAVC,EAAAhB,KAAKC,aAAK,IAAAe,GAAAA,EAAEE,oBAAoB,WAAYlB,KAAKE,gBACjDF,KAAKC,MAAQ,IACd"}
+{"version":3,"file":"FormDataController-OUt5L5uC.js","sources":["../src/common/controllers/FormDataController.ts"],"sourcesContent":["import type { ReactiveController, ReactiveControllerHost } from 'lit'\nimport type { InputMixinInterface } from '../mixins/InputMixin.js'\n\ninterface FormDataOptions {\n  value: () => string | undefined\n}\n\nexport class FormDataController implements ReactiveController {\n  private _form: HTMLFormElement | null = null\n\n  constructor(\n    private host: ReactiveControllerHost & InputMixinInterface,\n    private options: FormDataOptions,\n  ) {\n    host.addController(this)\n  }\n\n  hostConnected() {\n    this.listen(this.host.form)\n  }\n\n  hostUpdated() {\n    this.listen(this.host.form)\n  }\n\n  hostDisconnected() {\n    this.cleanup()\n  }\n\n  private listen(form: HTMLFormElement | null) {\n    if (this._form !== form) {\n      this.cleanup()\n      this._form = form\n      this._form?.addEventListener('formdata', this.handleFormData)\n    }\n  }\n\n  private cleanup() {\n    this._form?.removeEventListener('formdata', this.handleFormData)\n    this._form = null\n  }\n\n  private handleFormData = (e: FormDataEvent) => {\n    const { disabled, name } = this.host\n\n    if (disabled) {\n      return\n    }\n    if (!name) {\n      return\n    }\n\n    const value = this.options.value()\n    if (value != null) {\n      e.formData.append(name, value)\n    }\n  }\n}\n"],"names":["FormDataController","constructor","host","options","this","_form","handleFormData","e","disabled","name","value","formData","append","addController","hostConnected","listen","form","hostUpdated","hostDisconnected","cleanup","_a","addEventListener","removeEventListener"],"mappings":"MAOaA,EAGX,WAAAC,CACUC,EACAC,GADAC,KAAIF,KAAJA,EACAE,KAAOD,QAAPA,EAJFC,KAAKC,MAA2B,KAkChCD,KAAAE,eAAkBC,IACxB,MAAMC,SAAEA,EAAQC,KAAEA,GAASL,KAAKF,KAEhC,GAAIM,EACF,OAEF,IAAKC,EACH,OAGF,MAAMC,EAAQN,KAAKD,QAAQO,QACd,MAATA,GACFH,EAAEI,SAASC,OAAOH,EAAMC,EACzB,EAzCDR,EAAKW,cAAcT,KACpB,CAED,aAAAU,GACEV,KAAKW,OAAOX,KAAKF,KAAKc,KACvB,CAED,WAAAC,GACEb,KAAKW,OAAOX,KAAKF,KAAKc,KACvB,CAED,gBAAAE,GACEd,KAAKe,SACN,CAEO,MAAAJ,CAAOC,SACTZ,KAAKC,QAAUW,IACjBZ,KAAKe,UACLf,KAAKC,MAAQW,EACH,QAAVI,EAAAhB,KAAKC,aAAK,IAAAe,GAAAA,EAAEC,iBAAiB,WAAYjB,KAAKE,gBAEjD,CAEO,OAAAa,SACI,QAAVC,EAAAhB,KAAKC,aAAK,IAAAe,GAAAA,EAAEE,oBAAoB,WAAYlB,KAAKE,gBACjDF,KAAKC,MAAQ,IACd"}

package/lib/{FormField-CUC_H-0e.js → FormField--eLuhPue.js}

@@ -1,2 +1,2 @@
-import{css as n}from"lit";const a=n`:host{--_n-label-color:var(--n-label-color, var(--n-color-text))}.n-caption,::slotted(.n-caption){font-size:var(--n-font-size-s);line-height:var(--n-line-height-caption)}.n-label-container{margin-block-end:var(--n-space-s);display:inline-block}.n-label,::slotted(label),label{display:block!important;color:var(--_n-label-color);font-family:var(--n-font-family);font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading)!important;line-height:var(--n-line-height-heading);margin:0!important}.n-hint{padding-block-start:var(--n-space-xs);color:var(--n-color-text-weaker)}:host([size="s"]) ::slotted(label),:host([size="s"]) :is(label,.n-label){font-size:var(--n-font-size-s)}.n-error{margin-block-start:var(--n-space-s);color:var(--n-color-text-error)}.n-required{color:var(--n-color-status-danger);margin-inline-start:var(--n-space-xs)}`;export{a as s};
-//# sourceMappingURL=FormField-CUC_H-0e.js.map
+import{css as n}from"lit";const a=n`:host{--_n-label-color:var(--n-label-color, var(--n-color-text))}.n-caption,::slotted(.n-caption){font-size:var(--n-font-size-s);line-height:var(--n-line-height-caption)}.n-label-container{margin-block-end:var(--n-space-s);display:inline-block}.n-label,::slotted(label),label{display:block!important;color:var(--_n-label-color);font-family:var(--n-font-family);font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading)!important;line-height:var(--n-line-height-heading);margin:0!important}.n-hint{padding-block-start:var(--n-space-xs);color:var(--n-color-text-weaker)}:host([size='s']) ::slotted(label),:host([size='s']) :is(label,.n-label){font-size:var(--n-font-size-s)}.n-error{margin-block-start:var(--n-space-s);color:var(--n-color-text-error)}.n-required{color:var(--n-color-status-danger);margin-inline-start:var(--n-space-xs)}`;export{a as s};
+//# sourceMappingURL=FormField--eLuhPue.js.map

package/lib/FormField--eLuhPue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormField--eLuhPue.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/lib/Header.js

@@ -1,2 +1,2 @@
-import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as a,html as o}from"lit";import{property as n,customElement as d}from"lit/decorators.js";import{S as t}from"./SlotController-Z6eG7LSZ.js";import{s}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";const i=r`:host{--_n-header-box-shadow:var(--n-box-shadow-header);--_n-header-block-size:var(--n-header-block-size, var(--n-space-xxl));--_n-header-padding-block:var(--n-space-m);--_n-header-padding-inline:var(--n-space-l);color:var(--n-color-text)}::slotted(*){margin:0!important}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}.n-header,.n-header-end{display:flex;flex-flow:row;align-items:center;gap:var(--n-space-m)}.n-header{padding:var(--_n-header-padding-block) var(--_n-header-padding-inline);padding-inline-start:calc(var(--_n-header-padding-inline) + var(--_n-header-gutter,0px));background-color:var(--n-color-surface);border-block-end:1px solid var(--n-color-border);box-shadow:var(--_n-header-box-shadow);block-size:var(--_n-header-block-size)}.n-header-end{margin-inline-start:auto;gap:var(--n-space-s)}:host([size="s"]){--_n-header-block-size:var(--n-size-top-bar);--_n-header-padding-block:var(--n-space-s)}`;let l=class extends a{constructor(){super(...arguments),this.endSlot=new t(this,"end"),this.size="m"}render(){return o`<header class="n-header"><slot></slot><div class="n-header-end" ?hidden="${this.endSlot.isEmpty}"><slot name="end"></slot></div></header>`}};l.styles=[s,i],e([n({reflect:!0})],l.prototype,"size",void 0),l=e([d("nord-header")],l);var c=l;export{c as default};
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as r,LitElement as a,html as o}from"lit";import{property as n,customElement as d}from"lit/decorators.js";import{S as t}from"./SlotController-Z6eG7LSZ.js";import{s}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";const i=r`:host{--_n-header-box-shadow:var(--n-box-shadow-header);--_n-header-block-size:var(--n-header-block-size, var(--n-space-xxl));--_n-header-padding-block:var(--n-space-m);--_n-header-padding-inline:var(--n-space-l);color:var(--n-color-text)}::slotted(*){margin:0!important}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}.n-header,.n-header-end{display:flex;flex-flow:row;align-items:center;gap:var(--n-space-m)}.n-header{padding:var(--_n-header-padding-block) var(--_n-header-padding-inline);padding-inline-start:calc(var(--_n-header-padding-inline) + var(--_n-header-gutter,0px));background-color:var(--n-color-surface);border-block-end:1px solid var(--n-color-border);box-shadow:var(--_n-header-box-shadow);block-size:var(--_n-header-block-size)}.n-header-end{margin-inline-start:auto;gap:var(--n-space-s)}:host([size='s']){--_n-header-block-size:var(--n-size-top-bar);--_n-header-padding-block:var(--n-space-s)}`;let l=class extends a{constructor(){super(...arguments),this.endSlot=new t(this,"end"),this.size="m"}render(){return o`<header class="n-header"><slot></slot><div class="n-header-end" ?hidden="${this.endSlot.isEmpty}"><slot name="end"></slot></div></header>`}};l.styles=[s,i],e([n({reflect:!0})],l.prototype,"size",void 0),l=e([d("nord-header")],l);var c=l;export{c as default};
 //# sourceMappingURL=Header.js.map

package/lib/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../src/header/Header.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 \"./Header.css\"\n\n/**\n * The header is a block of designated space for labelling the currently\n * viewed context as well as providing primary actions.\n *\n * @status ready\n * @category structure\n * @slot - The header content.\n * @slot end - Optional slot for buttons, toggles, etc.\n */\n@customElement(\"nord-header\")\nexport default class Header extends LitElement {\n  static styles = [componentStyle, style]\n\n  private endSlot = new SlotController(this, \"end\")\n\n  /**\n   * Controls the size of the header component.\n   */\n  @property({ reflect: true }) size: \"m\" | \"s\" = \"m\"\n\n  render() {\n    return html`\n      <header class=\"n-header\">\n        <slot></slot>\n        <div class=\"n-header-end\" ?hidden=${this.endSlot.isEmpty}>\n          <slot name=\"end\"></slot>\n        </div>\n      </header>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"nord-header\": Header\n  }\n}\n"],"names":["Header","LitElement","constructor","this","endSlot","SlotController","size","render","html","isEmpty","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"yvCAgBe,IAAMA,EAAN,cAAqBC,EAArB,WAAAC,uBAGLC,KAAOC,QAAG,IAAIC,EAAeF,KAAM,OAKdA,KAAIG,KAAc,GAYhD,CAVC,MAAAC,GACE,OAAOC,CAAI,4EAG6BL,KAAKC,QAAQK,kDAKtD,GAlBMT,EAAAU,OAAS,CAACC,EAAgBC,GAOJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA6Bf,EAAAgB,UAAA,YAAA,GAR/BhB,EAAMa,EAAA,CAD1BI,EAAc,gBACMjB,SAAAA"}
+{"version":3,"file":"Header.js","sources":["../src/header/Header.ts"],"sourcesContent":["import { html, LitElement } 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 './Header.css'\n\n/**\n * The header is a block of designated space for labelling the currently\n * viewed context as well as providing primary actions.\n *\n * @status ready\n * @category structure\n * @slot - The header content.\n * @slot end - Optional slot for buttons, toggles, etc.\n */\n@customElement('nord-header')\nexport default class Header extends LitElement {\n  static styles = [componentStyle, style]\n\n  private endSlot = new SlotController(this, 'end')\n\n  /**\n   * Controls the size of the header component.\n   */\n  @property({ reflect: true }) size: 'm' | 's' = 'm'\n\n  render() {\n    return html`\n      <header class=\"n-header\">\n        <slot></slot>\n        <div class=\"n-header-end\" ?hidden=${this.endSlot.isEmpty}>\n          <slot name=\"end\"></slot>\n        </div>\n      </header>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-header': Header\n  }\n}\n"],"names":["Header","LitElement","constructor","this","endSlot","SlotController","size","render","html","isEmpty","styles","componentStyle","style","__decorate","property","reflect","prototype","customElement"],"mappings":"yvCAgBe,IAAMA,EAAN,cAAqBC,EAArB,WAAAC,uBAGLC,KAAOC,QAAG,IAAIC,EAAeF,KAAM,OAKdA,KAAIG,KAAc,GAYhD,CAVC,MAAAC,GACE,OAAOC,CAAI,4EAG6BL,KAAKC,QAAQK,kDAKtD,GAlBMT,EAAAU,OAAS,CAACC,EAAgBC,GAOJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA6Bf,EAAAgB,UAAA,YAAA,GAR/BhB,EAAMa,EAAA,CAD1BI,EAAc,gBACMjB,SAAAA"}

package/lib/Icon.js

@@ -1,2 +1,2 @@
-import{_ as i}from"./tslib.es6-CmLYFWVC.js";import{css as e,LitElement as s,html as o}from"lit";import{property as r,state as n,customElement as t}from"lit/decorators.js";import{ifDefined as a}from"lit/directives/if-defined.js";import{unsafeHTML as l}from"lit/directives/unsafe-html.js";import{c}from"./cond-CI1KbneT.js";import{IconManager as m}from"./IconManager.js";import{s as v}from"./Component-DSU3Qp0O.js";import{o as d}from"./observe-D0n0zOfU.js";const z=e`: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}`;var h;let p=h=class extends s{constructor(){super(...arguments),this.name="",this.svg=""}static registerResolver(i){this.manager.resolver=i}static registerIcon(i,e){return this.manager.registerIcon(i,e)}render(){return o`<div role="${c(this.label,"img")}" style="${c(this.color,`color:${this.color}`)}" aria-label="${a(this.label)}"><slot aria-hidden="true"></slot><div aria-hidden="true">${l(this.svg)}</div></div>`}handleNameChange(){this.name?h.manager.resolve(this.name,(i=>{this.svg=i})):this.svg=""}};p.styles=[v,z],p.manager=new m,i([r({reflect:!0})],p.prototype,"name",void 0),i([r({reflect:!0})],p.prototype,"size",void 0),i([r({reflect:!0})],p.prototype,"color",void 0),i([r({reflect:!0})],p.prototype,"label",void 0),i([n()],p.prototype,"svg",void 0),i([d("name")],p.prototype,"handleNameChange",null),p=h=i([t("nord-icon")],p);var f=p;export{f as default};
+import{_ as i}from"./tslib.es6-CmLYFWVC.js";import{css as e,LitElement as s,html as o}from"lit";import{property as r,state as n,customElement as t}from"lit/decorators.js";import{ifDefined as a}from"lit/directives/if-defined.js";import{unsafeHTML as l}from"lit/directives/unsafe-html.js";import{o as c}from"./observe-D0n0zOfU.js";import{c as m}from"./cond-CI1KbneT.js";import{s as v}from"./Component-DSU3Qp0O.js";import{IconManager as d}from"./IconManager.js";const z=e`: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}`;var h;let p=h=class extends s{constructor(){super(...arguments),this.name="",this.svg=""}static registerResolver(i){this.manager.resolver=i}static registerIcon(i,e){return this.manager.registerIcon(i,e)}render(){return o`<div role="${m(this.label,"img")}" style="${m(this.color,`color:${this.color}`)}" aria-label="${a(this.label)}"><slot aria-hidden="true"></slot><div aria-hidden="true">${l(this.svg)}</div></div>`}handleNameChange(){this.name?h.manager.resolve(this.name,(i=>{this.svg=i})):this.svg=""}};p.styles=[v,z],p.manager=new d,i([r({reflect:!0})],p.prototype,"name",void 0),i([r({reflect:!0})],p.prototype,"size",void 0),i([r({reflect:!0})],p.prototype,"color",void 0),i([r({reflect:!0})],p.prototype,"label",void 0),i([n()],p.prototype,"svg",void 0),i([c("name")],p.prototype,"handleNameChange",null),p=h=i([t("nord-icon")],p);var f=p;export{f as default};
 //# sourceMappingURL=Icon.js.map

package/lib/Icon.js.map

@@ -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 { cond } from \"../common/directives/cond.js\"\nimport { IconManager, IconResolver } from \"./IconManager.js\"\n\nimport componentStyle from \"../common/styles/Component.css\"\nimport style from \"./Icon.css\"\nimport { observe } from \"../common/decorators/observe.js\"\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 manager = new IconManager()\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    this.manager.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    return this.manager.registerIcon(iconOrName, icon)\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   * @default \"m\"\n   */\n  @property({ reflect: true }) size?: \"xxs\" | \"xs\" | \"s\" | \"m\" | \"l\" | \"xl\" | \"xxl\"\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    Icon.manager.resolve(this.name, svg => {\n      this.svg = 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","svg","registerResolver","resolver","manager","registerIcon","iconOrName","icon","render","html","cond","label","color","ifDefined","unsafeHTML","handleNameChange","resolve","styles","componentStyle","style","IconManager","__decorate","property","reflect","prototype","state","observe","customElement"],"mappings":"8/BAoBe,IAAMA,EAAIC,EAAV,cAAmBC,EAAnB,WAAAC,uBAyCgBC,KAAIC,KAAW,GAoB3BD,KAAGE,IAAW,EA6BhC,CA/EC,uBAAOC,CAAiBC,GACtBJ,KAAKK,QAAQD,SAAWA,CACzB,CAqBD,mBAAOE,CAAaC,EAAyDC,GAC3E,OAAOR,KAAKK,QAAQC,aAAaC,EAAYC,EAC9C,CA2BD,MAAAC,GAIE,OAAOC,CAAI,cAEAC,EAAKX,KAAKY,MAAO,kBAChBD,EAAKX,KAAKa,MAAO,SAASb,KAAKa,yBAC1BC,EAAUd,KAAKY,mEAGFG,EAAWf,KAAKE,kBAG/C,CAGS,gBAAAc,GACHhB,KAAKC,KAKVJ,EAAKQ,QAAQY,QAAQjB,KAAKC,MAAMC,IAC9BF,KAAKE,IAAMA,CAAG,IALdF,KAAKE,IAAM,EAOd,GAxFMN,EAAAsB,OAAS,CAACC,EAAgBC,GAElBxB,EAAAS,QAAU,IAAIgB,EAsCAC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyB5B,EAAA6B,UAAA,YAAA,GAMjBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA4D5B,EAAA6B,UAAA,YAAA,GAMpDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsB5B,EAAA6B,UAAA,aAAA,GAMdH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsB5B,EAAA6B,UAAA,aAAA,GAE1BH,EAAA,CAAhBI,KAAgC9B,EAAA6B,UAAA,WAAA,GAmBvBH,EAAA,CADTK,EAAQ,SAUR/B,EAAA6B,UAAA,mBAAA,MAzFkB7B,EAAIC,EAAAyB,EAAA,CADxBM,EAAc,cACMhC,SAAAA"}
+{"version":3,"file":"Icon.js","sources":["../src/icon/Icon.ts"],"sourcesContent":["import type { IconResolver } from './IconManager.js'\nimport { 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'\n\nimport { cond } from '../common/directives/cond.js'\nimport componentStyle from '../common/styles/Component.css'\nimport style from './Icon.css'\nimport { IconManager } from './IconManager.js'\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 manager = new IconManager()\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    this.manager.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    return this.manager.registerIcon(iconOrName, icon)\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   * @default \"m\"\n   */\n  @property({ reflect: true }) size?: 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'\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    Icon.manager.resolve(this.name, (svg) => {\n      this.svg = 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","svg","registerResolver","resolver","manager","registerIcon","iconOrName","icon","render","html","cond","label","color","ifDefined","unsafeHTML","handleNameChange","resolve","styles","componentStyle","style","IconManager","__decorate","property","reflect","prototype","state","observe","customElement"],"mappings":"mgCAqBe,IAAMA,EAAIC,EAAV,cAAmBC,EAAnB,WAAAC,uBAyCgBC,KAAIC,KAAW,GAoB3BD,KAAGE,IAAW,EA6BhC,CA/EC,uBAAOC,CAAiBC,GACtBJ,KAAKK,QAAQD,SAAWA,CACzB,CAqBD,mBAAOE,CAAaC,EAAyDC,GAC3E,OAAOR,KAAKK,QAAQC,aAAaC,EAAYC,EAC9C,CA2BD,MAAAC,GAIE,OAAOC,CAAI,cAEAC,EAAKX,KAAKY,MAAO,kBAChBD,EAAKX,KAAKa,MAAO,SAASb,KAAKa,yBAC1BC,EAAUd,KAAKY,mEAGFG,EAAWf,KAAKE,kBAG/C,CAGS,gBAAAc,GACHhB,KAAKC,KAKVJ,EAAKQ,QAAQY,QAAQjB,KAAKC,MAAOC,IAC/BF,KAAKE,IAAMA,CAAG,IALdF,KAAKE,IAAM,EAOd,GAxFMN,EAAAsB,OAAS,CAACC,EAAgBC,GAElBxB,EAAAS,QAAU,IAAIgB,EAsCAC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyB5B,EAAA6B,UAAA,YAAA,GAMjBH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAA4D5B,EAAA6B,UAAA,YAAA,GAMpDH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsB5B,EAAA6B,UAAA,aAAA,GAMdH,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAsB5B,EAAA6B,UAAA,aAAA,GAE1BH,EAAA,CAAhBI,KAAgC9B,EAAA6B,UAAA,WAAA,GAmBvBH,EAAA,CADTK,EAAQ,SAUR/B,EAAA6B,UAAA,mBAAA,MAzFkB7B,EAAIC,EAAAyB,EAAA,CADxBM,EAAc,cACMhC,SAAAA"}

package/lib/IconManager.js

@@ -1,2 +1,2 @@
-const e=e=>fetch(`https://nordcdn.net/ds/icons/3.13.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};
+const e=e=>fetch(`https://nordcdn.net/ds/icons/3.14.1/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};
 //# sourceMappingURL=IconManager.js.map

package/lib/IconManager.js.map

@@ -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,8CAAmED,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"}
+{"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    }\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,8CAAmED,SAAYE,MAAMC,IACzF,IAAKA,EAASC,GACZ,MAAM,IAAIC,UAAU,wBAAwBL,MAG9C,OAAOG,EAASG,MAAM,UAGbC,EAAb,WAAAC,GACUC,KAAAC,MAAQ,IAAIC,IACpBF,KAAAG,SAA6Eb,CAuD9E,CArDC,OAAAc,CAAQb,EAAcc,GACpB,IAAIC,EAASN,KAAKC,MAAMM,IAAIhB,GAGN,iBAAXe,GAMNA,IACHA,EAASN,KAAKG,SAASZ,GACpBiB,OAAM,IAAM,KACZf,MAAMgB,IAELT,KAAKC,MAAMS,IAAInB,EAAMkB,GACdA,KAIXT,KAAKC,MAAMS,IAAInB,EAAMe,IAGvBA,EAAOb,KAAKY,IAlBVA,EAAWC,EAmBd,CAED,YAAAK,CAAaC,EAAyDC,GACpE,IAAItB,EACAkB,EAYJ,GAV0B,iBAAfG,GACTrB,EAAOqB,EACPH,EAAMI,IAGNtB,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/Input.js

@@ -1,2 +1,2 @@
-import{_ as t}from"./tslib.es6-CmLYFWVC.js";import{css as n,isServer as e,html as o,nothing as i,LitElement as r}from"lit";import{query as s,property as a,customElement as d}from"lit/decorators.js";import{ifDefined as l}from"lit/directives/if-defined.js";import{classMap as c}from"lit/directives/class-map.js";import{ref as p}from"lit/directives/ref.js";import{styleMap as u}from"lit/directives/style-map.js";import{F as m}from"./FocusableMixin-BlQLNPdJ.js";import{F as h}from"./FormAssociatedMixin-DFL7yabe.js";import{I as v}from"./InputMixin-LetXsCyv.js";import{R as b,s as f}from"./TextField-C5gYzfOp.js";import{A as g}from"./AutocompleteMixin-D8eiOxvO.js";import{T as w}from"./TextSelectableMixin-Cfv__lHS.js";import{S as y}from"./SizeMixin-CU9cLbLC.js";import{s as z}from"./Component-DSU3Qp0O.js";import{s as x}from"./FormField-CUC_H-0e.js";import{D as j}from"./DirectionController-ChvNGESZ.js";import{c as $}from"./cond-CI1KbneT.js";import S from"./Icon.js";import{N as _}from"./events-Bv6wNHwJ.js";import"./FormDataController-OUt5L5uC.js";import"./SlotController-Z6eG7LSZ.js";import"./EventController-BBOmvfLa.js";import"./VisuallyHidden.js";import"lit/directives/unsafe-html.js";import"./IconManager.js";import"./observe-D0n0zOfU.js";var k=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m16.03 14.61c1.23-1.54 1.97-3.49 1.97-5.61 0-4.97-4.03-9-9-9s-9 4.03-9 9 4.03 9 9 9c2.12 0 4.07-.74 5.61-1.97l3.97 3.97 1.41-1.41-3.97-3.97zm-7.03 1.39c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7z" fill="currentColor"/></svg>',tags:"nordicon navigation menu find search magnifying glass",title:"navigation-search"});const F=n`.n-input::-webkit-search-cancel-button,.n-input::-webkit-search-decoration{-webkit-appearance:none;appearance:none}.n-input-container{font-size:var(--n-font-size-m);display:grid;grid-template-columns:max-content 1fr max-content}.n-input{grid-area:1/1/2/4;padding-inline-start:var(--_n-input-start-inline-size,var(--_n-input-padding-inline));padding-inline-end:var(--_n-input-end-inline-size,var(--_n-input-padding-inline))}slot[name=end],slot[name=start]{pointer-events:none;display:flex;align-items:center;color:var(--n-color-icon)}:host([disabled]) slot:is([name=start],[name=end]){color:var(--n-color-text-weakest)}slot[name=start]{grid-area:1/1/2/2;order:1}slot[name=end]{grid-area:1/3/2/4}.is-rtl slot[name=end],slot[name=start]{--n-button-border-radius:var(--n-border-radius-s) 0 0 var(--n-border-radius-s)}.is-rtl slot[name=start],slot[name=end]{--n-button-border-radius:0 var(--n-border-radius-s) var(--n-border-radius-s) 0}:is([name=start],[name=end])::slotted(*){font-size:var(--_n-input-font-size)}[name=start]::slotted(*),nord-icon{margin-inline-start:var(--_n-input-padding-inline)!important;margin-inline-end:calc(var(--_n-input-padding-inline)/ 2)!important}[name=end]::slotted(*){margin-inline-start:calc(var(--_n-input-padding-inline)/ 2)!important;margin-inline-end:var(--_n-input-padding-inline)!important}[name=start]::slotted(:is(nord-button, nord-dropdown)){margin-inline-start:0!important}[name=end]::slotted(:is(nord-button, nord-dropdown)){margin-inline-end:0!important}nord-icon{--_n-input-icon-color:var(--n-input-icon-color, var(--n-color-icon));color:var(--_n-input-icon-color)}::slotted(:is(nord-button:not([disabled]), nord-dropdown)){pointer-events:auto;position:relative}::slotted(nord-button:not([disabled],:focus)),::slotted(nord-dropdown:not(:focus-within)){--n-button-box-shadow:none}::slotted(nord-button:active),::slotted(nord-dropdown:active:not([open])){inset-block-start:-1px}::slotted(nord-button[disabled]){--n-button-color:var(--n-color-text-weaker);-webkit-text-fill-color:var(--n-button-color);opacity:.8}.n-input-container:hover:not(:focus-within) ::slotted(:is(nord-button:not([disabled]),nord-dropdown)),.n-label-container:hover~.n-input-container:not(:focus-within) ::slotted(:is(nord-button:not([disabled]),nord-dropdown)){--n-button-border-color:var(--n-input-border-color, var(--n-color-border-hover))}.n-input-container:focus-within ::slotted(:is(nord-button,nord-dropdown:not([open]))){--n-button-border-color:var(--n-input-border-color, var(--n-color-accent))}:host([error]) .n-input-container ::slotted(:is(nord-button:not(:focus),nord-dropdown:not(:focus-within),nord-dropdown[open])){--n-button-border-color:var(--n-input-border-color, var(--n-color-status-danger))}:host([size="s"]) ::slotted(nord-button){--_n-button-padding-inline:calc(var(--n-space-s) * 1.4)}:host{--_n-input-icon-size:var(--n-size-icon-s)}:host([size="s"]){--_n-input-icon-size:var(--n-size-icon-xs)}:host([size="l"]){--_n-input-icon-size:var(--n-size-icon-m)}::slotted(nord-icon:not([size])),nord-icon{--_n-icon-size:var(--_n-input-icon-size)}:host([type=unit]) :is(.n-input-container,.n-input){--_n-input-text-align:var(--n-input-text-align, end);font-family:var(--n-font-family-code)!important}:host([type=button]) :is(.n-input-container,.n-input){cursor:pointer}`;class C{constructor(t,n){this.target=n,this.hadFirstUpdate=!1,t.addController(this),e||(this.observer=new ResizeObserver((([n])=>{const[e]=n.borderBoxSize;this.borderBoxSize=e,t.requestUpdate()})))}get inlineSize(){var t;return null===(t=this.borderBoxSize)||void 0===t?void 0:t.inlineSize}get blockSize(){var t;return null===(t=this.borderBoxSize)||void 0===t?void 0:t.blockSize}hostUpdated(){!this.hadFirstUpdate&&this.observer&&(this.observer.observe(this.target()),this.hadFirstUpdate=!0)}hostConnected(){this.hadFirstUpdate&&this.observer&&this.observer.observe(this.target())}hostDisconnected(){this.observer&&this.observer.disconnect()}}S.registerIcon(k);const I=t=>t?`${t}px`:void 0;let B=class extends(y(h(g(b(w(v(m(r)))))))){constructor(){super(...arguments),this.startObserver=new C(this,(()=>this.startSlot)),this.endObserver=new C(this,(()=>this.endSlot)),this.direction=new j(this),this.type="text",this.expand=!1,this.disallowPattern=void 0,this.handleInputChange=t=>{const n=t.target;this.disallowPattern&&function(t,n){const{value:e}=t,o=t.selectionStart,i=e.slice(0,o),r=e.slice(o,e.length),s=i.replace(n,""),a=s+r.replace(n,""),d=s.length;t.value=a,t.selectionStart=d,t.selectionEnd=d}(n,new RegExp(this.disallowPattern,"g")),this.handleInput(t)}}render(){var t;const n="number"===this.type;return o`${this.renderLabel()}<div class="${c({"n-input-container":!0,"is-rtl":"rtl"===this.direction.dir})}" style="${u({"--_n-input-start-inline-size":I(this.startObserver.inlineSize),"--_n-input-end-inline-size":I(this.endObserver.inlineSize)})}"><slot name="start">${"search"===this.type?o`<nord-icon name="navigation-search"></nord-icon>`:i}</slot><input ${p(this.textSelectableRef)} ${p(this.focusableRef)} id="${this.inputId}" class="n-input" type="${n||"unit"===this.type?"text":this.type}" inputmode="${$(n,"numeric")}" pattern="${$(n,"[0-9]*")}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" name="${l(this.name)}" .value="${null!==(t=this.value)&&void 0!==t?t:""}" placeholder="${l(this.placeholder)}" @input="${this.handleInputChange}" @change="${this.handleChange}" @keydown="${this.handleKeydown}" @select="${this.handleSelect}" aria-describedby="${l(this.getDescribedBy())}" aria-invalid="${l(this.getInvalid())}" spellcheck="false" autocomplete="${this.autocomplete}"><slot name="end"></slot></div>${this.renderError()}`}handleKeydown(t){if("Enter"!==t.key)return;const{form:n}=this;if(n){const t=function(t){let n=t.querySelector('button[type="submit"]');!n&&t.id&&(n=t.getRootNode().querySelector(`button[form=${t.id}]`));return n}(n);setTimeout((()=>null==t?void 0:t.click()),0)}}handleSelect(t){t.stopPropagation(),this.dispatchEvent(new _("select"))}};B.styles=[z,x,f,F],t([s("slot[name='start']")],B.prototype,"startSlot",void 0),t([s("slot[name='end']")],B.prototype,"endSlot",void 0),t([a({reflect:!0})],B.prototype,"type",void 0),t([a({reflect:!0,type:Boolean})],B.prototype,"expand",void 0),t([a({reflect:!0,attribute:"disallow-pattern"})],B.prototype,"disallowPattern",void 0),B=t([d("nord-input")],B);var M=B;export{M as default};
+import{_ as t}from"./tslib.es6-CmLYFWVC.js";import{isServer as n,css as e,html as o,nothing as i,LitElement as r}from"lit";import{query as s,property as a,customElement as d}from"lit/decorators.js";import{classMap as l}from"lit/directives/class-map.js";import{ifDefined as c}from"lit/directives/if-defined.js";import{ref as p}from"lit/directives/ref.js";import{styleMap as u}from"lit/directives/style-map.js";import{D as m}from"./DirectionController-ChvNGESZ.js";import{c as h}from"./cond-CI1KbneT.js";import{N as v}from"./events-Bv6wNHwJ.js";import{A as b}from"./AutocompleteMixin-D8eiOxvO.js";import{F as f}from"./FocusableMixin-BlQLNPdJ.js";import{F as g}from"./FormAssociatedMixin-DFL7yabe.js";import{I as w}from"./InputMixin-LetXsCyv.js";import{R as y,s as z}from"./TextField-BdEdZ0_b.js";import{S as x}from"./SizeMixin-CU9cLbLC.js";import{T as j}from"./TextSelectableMixin-Cfv__lHS.js";import{s as $}from"./Component-DSU3Qp0O.js";import{s as S}from"./FormField--eLuhPue.js";import _ from"./Icon.js";import"./FormDataController-OUt5L5uC.js";import"./SlotController-Z6eG7LSZ.js";import"./EventController-BBOmvfLa.js";import"./VisuallyHidden.js";import"lit/directives/unsafe-html.js";import"./observe-D0n0zOfU.js";import"./IconManager.js";var k=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m16.03 14.61c1.23-1.54 1.97-3.49 1.97-5.61 0-4.97-4.03-9-9-9s-9 4.03-9 9 4.03 9 9 9c2.12 0 4.07-.74 5.61-1.97l3.97 3.97 1.41-1.41-3.97-3.97zm-7.03 1.39c-3.86 0-7-3.14-7-7s3.14-7 7-7 7 3.14 7 7-3.14 7-7 7z" fill="currentColor"/></svg>',tags:"nordicon navigation menu find search magnifying glass",title:"navigation-search"});class F{constructor(t,e){this.target=e,this.hadFirstUpdate=!1,t.addController(this),n||(this.observer=new ResizeObserver((([n])=>{const[e]=n.borderBoxSize;this.borderBoxSize=e,t.requestUpdate()})))}get inlineSize(){var t;return null===(t=this.borderBoxSize)||void 0===t?void 0:t.inlineSize}get blockSize(){var t;return null===(t=this.borderBoxSize)||void 0===t?void 0:t.blockSize}hostUpdated(){!this.hadFirstUpdate&&this.observer&&(this.observer.observe(this.target()),this.hadFirstUpdate=!0)}hostConnected(){this.hadFirstUpdate&&this.observer&&this.observer.observe(this.target())}hostDisconnected(){this.observer&&this.observer.disconnect()}}const C=e`.n-input::-webkit-search-cancel-button,.n-input::-webkit-search-decoration{appearance:none}.n-input-container{font-size:var(--n-font-size-m);display:grid;grid-template-columns:max-content 1fr max-content}.n-input{grid-area:1/1/2/4;padding-inline-start:var(--_n-input-start-inline-size,var(--_n-input-padding-inline));padding-inline-end:var(--_n-input-end-inline-size,var(--_n-input-padding-inline))}slot[name=end],slot[name=start]{pointer-events:none;display:flex;align-items:center;color:var(--n-color-icon)}:host([disabled]) slot:is([name=start],[name=end]){color:var(--n-color-text-weakest)}slot[name=start]{grid-area:1/1/2/2;order:1}slot[name=end]{grid-area:1/3/2/4}.is-rtl slot[name=end],slot[name=start]{--n-button-border-radius:var(--n-border-radius-s) 0 0 var(--n-border-radius-s)}.is-rtl slot[name=start],slot[name=end]{--n-button-border-radius:0 var(--n-border-radius-s) var(--n-border-radius-s) 0}:is([name=start],[name=end])::slotted(*){font-size:var(--_n-input-font-size)}[name=start]::slotted(*),nord-icon{margin-inline-start:var(--_n-input-padding-inline)!important;margin-inline-end:calc(var(--_n-input-padding-inline)/ 2)!important}[name=end]::slotted(*){margin-inline-start:calc(var(--_n-input-padding-inline)/ 2)!important;margin-inline-end:var(--_n-input-padding-inline)!important}[name=start]::slotted(:is(nord-button, nord-dropdown)){margin-inline-start:0!important}[name=end]::slotted(:is(nord-button, nord-dropdown)){margin-inline-end:0!important}nord-icon{--_n-input-icon-color:var(--n-input-icon-color, var(--n-color-icon));color:var(--_n-input-icon-color)}::slotted(:is(nord-button:not([disabled]), nord-dropdown)){pointer-events:auto;position:relative}::slotted(nord-button:not([disabled],:focus)),::slotted(nord-dropdown:not(:focus-within)){--n-button-box-shadow:none}::slotted(nord-button:active),::slotted(nord-dropdown:active:not([open])){inset-block-start:-1px}::slotted(nord-button[disabled]){--n-button-color:var(--n-color-text-weaker);-webkit-text-fill-color:var(--n-button-color);opacity:.8}.n-input-container:hover:not(:focus-within) ::slotted(:is(nord-button:not([disabled]), nord-dropdown)),.n-label-container:hover~.n-input-container:not(:focus-within) ::slotted(:is(nord-button:not([disabled]),nord-dropdown)){--n-button-border-color:var(--n-input-border-color, var(--n-color-border-hover))}.n-input-container:focus-within ::slotted(:is(nord-button,nord-dropdown:not([open]))){--n-button-border-color:var(--n-input-border-color, var(--n-color-accent))}:host([error]) .n-input-container ::slotted(:is(nord-button:not(:focus),nord-dropdown:not(:focus-within),nord-dropdown[open])){--n-button-border-color:var(--n-input-border-color, var(--n-color-status-danger))}:host([size='s']) ::slotted(nord-button){--_n-button-padding-inline:calc(var(--n-space-s) * 1.4)}:host{--_n-input-icon-size:var(--n-size-icon-s)}:host([size='s']){--_n-input-icon-size:var(--n-size-icon-xs)}:host([size='l']){--_n-input-icon-size:var(--n-size-icon-m)}::slotted(nord-icon:not([size])),nord-icon{--_n-icon-size:var(--_n-input-icon-size)}:host([type=unit]) :is(.n-input-container,.n-input){--_n-input-text-align:var(--n-input-text-align, end);font-family:var(--n-font-family-code)!important}:host([type=button]) :is(.n-input-container,.n-input){cursor:pointer}`;_.registerIcon(k);const I=t=>t?`${t}px`:void 0;let B=class extends(x(g(b(y(j(w(f(r)))))))){constructor(){super(...arguments),this.startObserver=new F(this,(()=>this.startSlot)),this.endObserver=new F(this,(()=>this.endSlot)),this.direction=new m(this),this.type="text",this.expand=!1,this.disallowPattern=void 0,this.handleInputChange=t=>{const n=t.target;this.disallowPattern&&function(t,n){const{value:e}=t,o=t.selectionStart,i=e.slice(0,o),r=e.slice(o,e.length),s=i.replace(n,""),a=s+r.replace(n,""),d=s.length;t.value=a,t.selectionStart=d,t.selectionEnd=d}(n,new RegExp(this.disallowPattern,"g")),this.handleInput(t)}}render(){var t;const n="number"===this.type;return o`${this.renderLabel()}<div class="${l({"n-input-container":!0,"is-rtl":"rtl"===this.direction.dir})}" style="${u({"--_n-input-start-inline-size":I(this.startObserver.inlineSize),"--_n-input-end-inline-size":I(this.endObserver.inlineSize)})}"><slot name="start">${"search"===this.type?o`<nord-icon name="navigation-search"></nord-icon>`:i}</slot><input ${p(this.textSelectableRef)} ${p(this.focusableRef)} id="${this.inputId}" class="n-input" type="${n||"unit"===this.type?"text":this.type}" inputmode="${h(n,"numeric")}" pattern="${h(n,"[0-9]*")}" ?disabled="${this.disabled}" ?required="${this.required}" ?readonly="${this.readonly}" name="${c(this.name)}" .value="${null!==(t=this.value)&&void 0!==t?t:""}" placeholder="${c(this.placeholder)}" @input="${this.handleInputChange}" @change="${this.handleChange}" @keydown="${this.handleKeydown}" @select="${this.handleSelect}" aria-describedby="${c(this.getDescribedBy())}" aria-invalid="${c(this.getInvalid())}" spellcheck="false" autocomplete="${this.autocomplete}"><slot name="end"></slot></div>${this.renderError()}`}handleKeydown(t){if("Enter"!==t.key)return;const{form:n}=this;if(n){const t=function(t){let n=t.querySelector('button[type="submit"]');!n&&t.id&&(n=t.getRootNode().querySelector(`button[form=${t.id}]`));return n}(n);setTimeout((()=>null==t?void 0:t.click()),0)}}handleSelect(t){t.stopPropagation(),this.dispatchEvent(new v("select"))}};B.styles=[$,S,z,C],t([s("slot[name='start']")],B.prototype,"startSlot",void 0),t([s("slot[name='end']")],B.prototype,"endSlot",void 0),t([a({reflect:!0})],B.prototype,"type",void 0),t([a({reflect:!0,type:Boolean})],B.prototype,"expand",void 0),t([a({reflect:!0,attribute:"disallow-pattern"})],B.prototype,"disallowPattern",void 0),B=t([d("nord-input")],B);var M=B;export{M as default};
 //# sourceMappingURL=Input.js.map