@nordhealth/components 4.26.1 → 5.0.0-alpha.0

package/lib/Calendar-C1SxrlzN.js

@@ -0,0 +1,2 @@
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as a,LitElement as n,isServer as t,html as i}from"lit";import{query as r,property as s,state as o,customElement as d}from"lit/decorators.js";import{classMap as l}from"lit/directives/class-map.js";import{repeat as c}from"lit/directives/repeat.js";import{o as h}from"./tinykeys.module-_6MZt7MP.js";import{m as u,c as v}from"./collection-Dvg2XbxV.js";import{D as p}from"./DirectionController-ChvNGESZ.js";import{E as g}from"./EventController-BBOmvfLa.js";import{D as m,k as f,p as y,a as b,d as x,l as w,m as z,n as D,o as k,q as $,b as _,s as S,r as F,t as M,u as T,g as C,v as Y}from"./dates-C-ZvzXaC.js";import{o as j}from"./observe-D0n0zOfU.js";import{c as N}from"./cond-CI1KbneT.js";import{r as R}from"./number-Dg2vCfGd.js";import{s as E}from"./Component-BJ5O5n8k.js";import L from"./Icon.js";import{LocalizeController as O}from"./LocalizeController.js";import{DateRangeSelectEvent as X}from"./DateRangeSelectEvent.js";import{DateSelectEvent as W}from"./DateSelectEvent.js";import"./Button.js";import"./VisuallyHidden.js";var A=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m.100342 6.92903 2.121318-2.12132 7.77818 7.77819 7.77826-7.77828 2.1213 2.12132-8.4853 8.48536c-.7811.7811-2.04743.7811-2.82848 0z" fill="currentColor"/></svg>',tags:"nordicon arrow down small caret pointing triangle chevron",title:"arrow-down-small"});var U=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m13.0712.105225 2.1213 2.121315-7.77816 7.77816 7.77826 7.7783-2.1213 2.1213-8.48539-8.4854c-.78105-.781-.78105-2.04735 0-2.82839z" fill="currentColor"/></svg>',tags:"nordicon arrow left small caret pointing triangle chevron",title:"arrow-left-small"});var H=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m6.92903.100342-2.12132 2.121318 7.77819 7.77818-7.77828 7.77826 2.12132 2.1213 8.48536-8.4853c.7811-.7811.7811-2.04743 0-2.82848z" fill="currentColor"/></svg>',tags:"nordicon arrow right small caret pointing triangle chevron",title:"arrow-right-small"});const I=e=>e.preventDefault();class P{constructor(e,a){this.hadFirstUpdate=!1,this.initialTouchX=0,this.initialTouchY=0,this.handleTouchStart=e=>{const[{pageX:a,pageY:n}]=e.changedTouches;this.initialTouchX=a,this.initialTouchY=n},this.handleTouchEnd=e=>{const[{pageX:a,pageY:n}]=e.changedTouches,{matchesGesture:t,onSwipeEnd:i}=this.options,r=a-this.initialTouchX,s=n-this.initialTouchY,o={initialX:this.initialTouchX,initialY:this.initialTouchY,pageX:a,pageY:n,distX:r,distY:s};t(o)&&(e.preventDefault(),i(o))},e.addController(this),this.events=new g(e),this.options={target:()=>e,...a}}hostUpdated(){if(!this.hadFirstUpdate){this.hadFirstUpdate=!0;const e=this.options.target();this.events.listen(e,"touchstart",this.handleTouchStart),this.events.listen(e,"touchmove",I),this.events.listen(e,"touchend",this.handleTouchEnd)}}hostDisconnected(){this.hadFirstUpdate=!1}}function B({distX:e,distY:a}){return Math.abs(e)>=70&&Math.abs(a)<=70}function q({distX:e,distY:a}){return Math.abs(a)>=70&&Math.abs(e)<=70&&a>0}const V=a`:host{--_n-calendar-box-shadow:var(--n-calendar-box-shadow,var(--n-box-shadow-popout));--_n-calendar-border-radius:var(--n-calendar-border-radius,var(--n-border-radius-s));--_n-calendar-highlight-color:var(--n-calendar-highlight-color,var(--n-color-accent));--_n-calendar-padding-block-start:var(--n-calendar-padding-block,var(--n-space-m));--_n-calendar-padding-block-end:var(--n-calendar-padding-block,var(--n-space-m));--_n-calendar-padding-inline:var(--n-calendar-padding-inline,var(--n-space-m));--_n-calendar-day-size:var(--n-calendar-day-size,var(--n-space-xl));--_n-calendar-day-font-size:var(--n-calendar-day-font-size,var(--n-font-size-m));--_n-calendar-select-label-font-size:var(--n-calendar-select-label-font-size,var(--n-font-size-xl));--_n-calendar-nav-padding-inline:var(--n-calendar-nav-padding-inline,11px);--_n-calendar-nav-gap:var(--n-calendar-nav-gap,var(--n-space-xs));--_n-calendar-header-margin-block-end:var(--n-calendar-header-margin-block-end,var(--n-space-m));--_n-calendar-header-padding-block-end:var(--n-calendar-header-padding-block-end,0);--_n-calendar-header-gap:var(--n-calendar-header-gap,var(--n-space-s));--_n-calendar-inline-size:var(--n-calendar-inline-size,max-content);font-feature-settings:var(--n-font-features-reduced)}:host([size=s]){--_n-calendar-day-size:var(--n-calendar-day-size,calc(var(--n-space-l) + var(--n-space-xs)));--_n-calendar-day-font-size:var(--n-calendar-day-font-size,var(--n-font-size-s));--_n-calendar-select-label-font-size:var(--n-calendar-select-label-font-size,var(--n-font-size-l));--_n-calendar-nav-padding-inline:var(--n-calendar-nav-padding-inline,var(--n-space-s));--_n-calendar-header-margin-block-end:var(--n-calendar-header-margin-block-end,var(--n-space-s));--_n-calendar-header-padding-block-end:var(--n-calendar-header-padding-block-end,var(--n-space-xs))}.n-calendar{background:var(--n-color-surface);border-radius:var(--_n-calendar-border-radius);box-shadow:var(--_n-calendar-box-shadow);inline-size:var(--_n-calendar-inline-size);min-inline-size:min-content;padding-block-end:var(--_n-calendar-padding-block-end);padding-block-start:var(--_n-calendar-padding-block-start);padding-inline-end:var(--_n-calendar-padding-inline);padding-inline-start:var(--_n-calendar-padding-inline);user-select:none}:host([expand]){--_n-calendar-inline-size:var(--n-calendar-inline-size,100%)}.n-calendar-table{border-collapse:collapse;border-spacing:0;color:var(--n-color-text);font-size:var(--n-font-size-m);font-weight:var(--n-font-weight);inline-size:100%;text-align:center}.n-calendar-table-header{font-size:var(--n-font-size-s);font-weight:var(--n-font-weight-active);letter-spacing:1px;padding-block-end:var(--n-space-s);text-decoration:none;text-transform:uppercase}.n-calendar-cell{padding:1px;text-align:center}.n-calendar-day{appearance:none;background:#0000;block-size:var(--_n-calendar-day-size);border:0;border-radius:var(--n-border-radius-s);color:var(--n-color-text);cursor:pointer;display:inline-block;font-family:var(--n-font-family);font-size:var(--_n-calendar-day-font-size);font-variant-numeric:tabular-nums;font-weight:var(--n-font-weight);inline-size:var(--_n-calendar-day-size);padding:0 0 1px;position:relative;text-align:center;vertical-align:middle}.n-calendar-day[aria-current=date]{box-shadow:0 0 0 1px var(--n-color-text-link);color:var(--n-color-text-link);position:relative}.n-calendar-day:hover{background:var(--n-color-active)}.n-calendar-day:focus,.n-calendar-day[aria-pressed=true]{background:var(--n-color-accent);box-shadow:none;color:var(--n-color-text-on-accent);outline:0}.n-calendar-day:active{background:var(--n-color-accent);box-shadow:none!important;color:var(--n-color-text-on-accent)}.n-calendar-day:focus{box-shadow:0 0 5px var(--n-color-accent)}.n-calendar-day:not(.is-month){box-shadow:none}.n-calendar-day:not(.is-month),.n-calendar-day[aria-disabled=true]{background:#0000;color:var(--n-color-text-weakest)}.n-calendar-day[aria-disabled=true]{color:var(--n-color-text-weaker);cursor:default;text-decoration:line-through}.n-calendar-day:not(.is-month)[aria-disabled=true]{color:var(--n-color-text-weakest);text-decoration:none}.n-calendar-day[aria-disabled=true][aria-current=date]{box-shadow:0 0 0 1px var(--n-color-accent);color:var(--n-color-text-link)}.n-calendar-day[aria-disabled=true][aria-current=date]:focus{background:var(--n-color-accent);box-shadow:0 0 5px var(--n-color-accent);color:var(--n-color-text-on-accent)}.n-calendar-day[aria-disabled=true]:not([aria-current=date]):before{display:none}.n-calendar-day.is-outside{background:#0000;box-shadow:none;color:var(--n-color-text-weakest);cursor:default;pointer-events:none}.n-calendar-day.is-outside:before{display:none}:host([range]) .n-calendar-day.is-in-range{background:var(--n-color-active);color:var(--n-color-text)}.n-calendar-day.is-highlighted:after{--_n-calendar-highlight-size:5px;background-color:var(--_n-calendar-highlight-color);block-size:var(--_n-calendar-highlight-size);border-radius:var(--n-border-radius-circle);content:"";inline-size:var(--_n-calendar-highlight-size);inset-block-end:var(--n-space-xs);inset-inline-start:calc(50% - var(--_n-calendar-highlight-size)/2);position:absolute}.n-calendar-day.is-highlighted.is-month:is([aria-pressed=true],:focus):not([aria-disabled=true]):after{background-color:var(--n-color-text-on-accent)}.n-calendar-day.is-highlighted:is(:not(.is-month),.is-outside,[aria-disabled=true]):after{background-color:var(--n-color-text-weakest)}.n-calendar-header{align-items:center;column-gap:var(--_n-calendar-header-gap);display:flex;inline-size:100%;justify-content:space-between;margin-block-end:var(--_n-calendar-header-margin-block-end);padding-block-end:var(--_n-calendar-header-padding-block-end)}.n-calendar-header.is-static{column-gap:var(--n-space-xs)}.n-calendar-title{color:var(--n-color-text);flex:1;font-size:var(--n-font-size-m);font-weight:var(--n-font-weight-heading);margin:0;text-align:center}.n-calendar-header.is-static nord-button.is-hidden{visibility:hidden}.n-calendar.has-multiple-months{align-items:flex-start;display:flex;flex-direction:row;gap:var(--n-space-l)}.n-calendar.has-multiple-months .n-calendar-month{flex:1;min-inline-size:0}.n-calendar-nav{column-gap:var(--_n-calendar-nav-gap);display:flex;white-space:nowrap}.n-calendar-nav nord-button{--_n-button-padding-inline:var(--_n-calendar-nav-padding-inline)}.n-calendar-select{display:inline-flex;line-height:var(--n-line-height);position:relative}.n-calendar-select span{margin-inline-end:var(--n-space-s)}.n-calendar-select select{block-size:100%;cursor:pointer;font-size:var(--n-font-size-l);inline-size:100%;inset-block-start:0;inset-inline-start:0;opacity:0;position:absolute}.n-calendar-select select:focus+.n-calendar-select-label{box-shadow:0 0 0 2px var(--n-color-accent)}.n-calendar-select-label{align-items:center;border-radius:var(--n-border-radius-s);color:var(--n-color-text);display:flex;font-size:var(--_n-calendar-select-label-font-size);font-weight:var(--n-font-weight-active);inline-size:100%;padding-block:0;padding-inline-end:var(--n-space-xs);padding-inline-start:var(--n-space-s);pointer-events:none;position:relative}`;function G(e){return a=>{a.preventDefault(),e(a)}}L.registerIcon(H),L.registerIcon(U),L.registerIcon(A);const J=()=>!1,K=()=>!1;function Q(e,a){return null==e||null==a||e.getTime()<=a.getTime()?[e,a]:[a,e]}let Z=class extends n{constructor(){super(...arguments),this.direction=new p(this),this.swipe=new P(this,{matchesGesture:B,onSwipeEnd:({distX:e})=>this.addMonths(e<0?1:-1)}),this.shortcuts=h({ArrowRight:G((()=>this.addDays(this.direction.isLTR?1:-1))),ArrowLeft:G((()=>this.addDays(this.direction.isLTR?-1:1))),ArrowDown:G((()=>this.addDays(7))),ArrowUp:G((()=>this.addDays(-7))),Home:G((()=>this.startOfWeek())),End:G((()=>this.endOfWeek())),PageUp:G((()=>this.addMonths(-1))),PageDown:G((()=>this.addMonths(1))),"Shift+PageUp":G((()=>this.addYears(-1))),"Shift+PageDown":G((()=>this.addYears(1)))}),this.localize=new O(this,{onLangChange:()=>this.handleLangChange()}),this.value="",this.firstDayOfWeek=m.Monday,this.expand=!1,this.size="m",this.isDateDisabled=J,this.isDateHighlighted=K,this.range=!1,this.months=1,this.activeFocus=!1,this.focusedDay=new Date,this.handleDaySelect=e=>{const a=f(e,y(this.min||""),y(this.max||"")),n=!this.isDateDisabled(e);a&&n&&(this.range?this.selectRangeDay(e):(this.value=b(e),this.dispatchEvent(new W("change",e))))},this.handleDayHover=e=>{this.range&&this.pendingRangeStart&&(this.hoveredDay=e)},this.handleMonthSelect=e=>{this.setMonth(Number.parseInt(e.target.value,10))},this.handleYearSelect=e=>{this.setYear(Number.parseInt(e.target.value,10))},this.handleNextMonthClick=e=>{e.preventDefault(),this.addMonths(1)},this.handlePreviousMonthClick=e=>{e.preventDefault(),this.addMonths(-1)},this.enableActiveFocus=()=>{this.activeFocus=!0},this.disableActiveFocus=e=>{const a=e.currentTarget,n=e.relatedTarget;n&&!a.contains(n)&&(this.activeFocus=!1)}}focus(e){var a;const n=null!==(a=null==e?void 0:e.target)&&void 0!==a?a:"day";"day"===n?this.focusedDayNode.focus():"month"===n&&this.monthSelectNode.focus()}render(){var e;const a=this.getToday(),n=y(this.value),r=y(this.rangeStart||""),s=y(this.rangeEnd||""),o=this.pendingRangeStart?null!==(e=this.hoveredDay)&&void 0!==e?e:this.focusedDay:void 0,[d,h]=this.pendingRangeStart?Q(this.pendingRangeStart,o):Q(r,s),p=y(this.min||""),g=y(this.max||""),m=p?x(p):void 0,b=g?w(g):void 0,k=a.getFullYear(),$=p?p.getFullYear():k-100,_=g?g.getFullYear():k+10;t&&this.handleLangChange();const S=Math.max(1,this.months),F=Array.from({length:S},((e,a)=>new Date(this.focusedDay.getFullYear(),this.focusedDay.getMonth()+a,1))),M=S>1,T=null!=p&&F.some((e=>z(p,e))),C=null!=g&&F.some((e=>z(g,e))),j=(e,t)=>{const r=z(e,t);if(M&&!r)return i`<td class="n-calendar-cell" aria-hidden="true"></td>`;const s=!f(e,p,g),o=Y(e,a),c=this.isDateDisabled(e),u=this.isDateHighlighted(e),v=this.dateFormatShort.format(e),m=this.range&&null!=d&&Y(e,d),y=this.range&&null!=h&&Y(e,h),b=this.range&&null!=d&&null!=h&&e>=d&&e<=h,x=this.range?m||y:Y(e,n),w=null!=d&&Y(d,h),D=u&&"string"==typeof u?`${v}, ${u}`:v;return i`<td class="n-calendar-cell"><button type="button" tabindex="${Y(e,this.focusedDay)?0:-1}" class="${l({"n-calendar-day":!0,"is-outside":s,"is-month":r,"is-highlighted":u,"is-in-range":b&&!x,"is-range-start":m&&!w,"is-range-end":y&&!w})}" @click="${()=>this.handleDaySelect(e)}" @mouseenter="${()=>this.handleDayHover(e)}" @keydown="${this.shortcuts}" ?disabled="${s}" aria-disabled="${N(c,"true")}" aria-pressed="${x?"true":"false"}" aria-current="${N(o,"date")}" aria-label="${D}"><span aria-hidden="true">${e.getDate()}</span></button></td>`},E=(e,a,n)=>{const t=e.getMonth(),r=e.getFullYear();if(M){const e=0===a,s=a===S-1;return i`<div class="n-calendar-header is-static"><nord-button class="${l({"n-calendar-prev":!0,"is-hidden":!e})}" size="${this.size}" square variant="plain" @click="${this.handlePreviousMonthClick}" ?disabled="${!e||T}" type="button"><nord-visually-hidden>${this.localize.term("prevMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-left-small":"arrow-right-small"}" size="${"s"===this.size?"xs":"s"}"></nord-icon></nord-button><h2 class="n-calendar-title" id="${n}" aria-live="polite" aria-atomic="true">${this.monthNames[t]} ${r}</h2><nord-button class="${l({"n-calendar-next":!0,"is-hidden":!s})}" size="${this.size}" square variant="plain" @click="${this.handleNextMonthClick}" ?disabled="${!s||C}" type="button"><nord-visually-hidden>${this.localize.term("nextMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-right-small":"arrow-left-small"}" size="${"s"===this.size?"xs":"s"}"></nord-icon></nord-button></div>`}return i`<div class="n-calendar-header"><div><nord-visually-hidden><h2 id="${n}" aria-live="polite" aria-atomic="true">${this.monthNames[t]}, ${r}</h2></nord-visually-hidden><div class="n-calendar-select"><select aria-label="${this.localize.term("monthSelectLabel")}" class="n-calendar-select-month" @input="${this.handleMonthSelect}">${this.monthNames.map(((e,a)=>i`<option value="${a}" ?selected="${a===t}" ?disabled="${!f(new Date(r,a,1),m,b)}">${e}</option>`))}</select><div class="n-calendar-select-label" aria-hidden="true"><span>${this.monthNamesShort[t]}</span><nord-icon color="var(--n-color-icon)" name="arrow-down-small" size="xxs"></nord-icon></div></div><div class="n-calendar-select"><select aria-label="${this.localize.term("yearSelectLabel")}" class="n-calendar-select-year" @input="${this.handleYearSelect}">${c(R($,_),(e=>e),(e=>i`<option ?selected="${e===r}">${e}</option>`))}</select><div class="n-calendar-select-label" aria-hidden="true"><span>${r}</span><nord-icon color="var(--n-color-icon)" name="arrow-down-small" size="xxs"></nord-icon></div></div></div><div class="n-calendar-nav"><nord-button class="n-calendar-prev" size="${this.size}" square @click="${this.handlePreviousMonthClick}" ?disabled="${z(p,e)}" type="button"><nord-visually-hidden>${this.localize.term("prevMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-left-small":"arrow-right-small"}" size="${"s"===this.size?"xs":"s"}"></nord-icon></nord-button><nord-button class="n-calendar-next" size="${this.size}" square @click="${this.handleNextMonthClick}" ?disabled="${z(g,e)}" type="button"><nord-visually-hidden>${this.localize.term("nextMonthLabel")}</nord-visually-hidden><nord-icon name="${this.direction.isLTR?"arrow-right-small":"arrow-left-small"}" size="${"s"===this.size?"xs":"s"}"></nord-icon></nord-button></div></div>`};return i`<div class="${l({"n-calendar":!0,"has-multiple-months":M})}">${F.map(((e,a)=>{const n=`dialog-header-${a}`;return i`<div class="n-calendar-month">${E(e,a,n)}<table class="n-calendar-table" aria-labelledby="${n}" @focusin="${this.enableActiveFocus}" @focusout="${this.disableActiveFocus}"><thead><tr>${u(this.dayNames,this.firstDayOfWeek,((e,a)=>i`<th class="n-calendar-table-header" scope="col"><span aria-hidden="true">${this.dayNamesShort[a]}</span><nord-visually-hidden>${e}</nord-visually-hidden></th>`))}</tr></thead><tbody>${v(D(e,this.firstDayOfWeek),7).map((a=>i`<tr class="n-calendar-row">${a.map((a=>j(a,e)))}</tr>`))}</tbody></table></div>`}))}</div>`}handleValueChange(){this.range||this.setFocusedDay(y(this.value)||this.getToday())}handleRangeChange(){if(!this.range)return;const e=y(this.rangeStart||""),a=y(this.rangeEnd||"");this.setFocusedDay(e||a||this.getToday())}handleFocusedDayChange(){this.activeFocus&&this.focusedDayNode.focus()}handleLangChange(){const e=this.localize.resolvedLang;this.dateFormatShort=new Intl.DateTimeFormat(e,{day:"numeric",month:"long"}),this.monthNames=k(e,"long"),this.monthNamesShort=k(e,"short"),this.dayNames=$(e,"long"),this.dayNamesShort=$(e,"narrow")}selectRangeDay(e){if(!this.pendingRangeStart)return this.pendingRangeStart=e,this.hoveredDay=e,this.rangeStart=b(e),void(this.rangeEnd=b(e));const[a,n]=Q(this.pendingRangeStart,e);this.pendingRangeStart=void 0,this.hoveredDay=void 0,this.rangeStart=b(a),this.rangeEnd=b(n),this.dispatchEvent(new X("range-change",a,n))}getToday(){return y(this.today||"")||new Date}addDays(e){this.setFocusedDay(_(this.focusedDay,e))}addMonths(e){this.setMonth(this.focusedDay.getMonth()+e)}addYears(e){this.setYear(this.focusedDay.getFullYear()+e)}startOfWeek(){this.setFocusedDay(S(this.focusedDay,this.firstDayOfWeek))}endOfWeek(){this.setFocusedDay(F(this.focusedDay,this.firstDayOfWeek))}setMonth(e){const a=M(x(this.focusedDay),e),n=w(a),t=M(this.focusedDay,e);this.setFocusedDay(T(t,a,n))}setYear(e){const a=C(x(this.focusedDay),e),n=w(a),t=C(this.focusedDay,e);this.setFocusedDay(T(t,a,n))}setFocusedDay(e){this.focusedDay=T(e,y(this.min||""),y(this.max||"")),this.dispatchEvent(new W("nord-focus-date",this.focusedDay))}};Z.styles=[E,V],e([r(".n-calendar-select-month",!0)],Z.prototype,"monthSelectNode",void 0),e([r('button[tabindex="0"]')],Z.prototype,"focusedDayNode",void 0),e([s()],Z.prototype,"value",void 0),e([s({reflect:!0,type:Number,attribute:"first-day-of-week"})],Z.prototype,"firstDayOfWeek",void 0),e([s({reflect:!0})],Z.prototype,"min",void 0),e([s({reflect:!0})],Z.prototype,"max",void 0),e([s({reflect:!0})],Z.prototype,"today",void 0),e([s({reflect:!0,type:Boolean})],Z.prototype,"expand",void 0),e([s({reflect:!0})],Z.prototype,"size",void 0),e([s({attribute:!1})],Z.prototype,"isDateDisabled",void 0),e([s({attribute:!1})],Z.prototype,"isDateHighlighted",void 0),e([s({reflect:!0,type:Boolean})],Z.prototype,"range",void 0),e([s({reflect:!0,attribute:"range-start"})],Z.prototype,"rangeStart",void 0),e([s({reflect:!0,attribute:"range-end"})],Z.prototype,"rangeEnd",void 0),e([s({reflect:!0,type:Number})],Z.prototype,"months",void 0),e([o()],Z.prototype,"activeFocus",void 0),e([o()],Z.prototype,"focusedDay",void 0),e([o()],Z.prototype,"pendingRangeStart",void 0),e([o()],Z.prototype,"hoveredDay",void 0),e([j("value")],Z.prototype,"handleValueChange",null),e([j("rangeStart"),j("rangeEnd")],Z.prototype,"handleRangeChange",null),e([j("focusedDay","updated")],Z.prototype,"handleFocusedDayChange",null),Z=e([d("nord-calendar")],Z);var ee=Z;export{ee as C,P as S,q as i};
+//# sourceMappingURL=Calendar-C1SxrlzN.js.map

package/lib/Calendar-C1SxrlzN.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar-C1SxrlzN.js","sources":["../../icons/lib/assets/arrow-down-small.js","../../icons/lib/assets/arrow-left-small.js","../../icons/lib/assets/arrow-right-small.js","../src/common/controllers/SwipeController.ts","../src/calendar/Calendar.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m.100342 6.92903 2.121318-2.12132 7.77818 7.77819 7.77826-7.77828 2.1213 2.12132-8.4853 8.48536c-.7811.7811-2.04743.7811-2.82848 0z\" fill=\"currentColor\"/></svg>';\nexport const title = \"arrow-down-small\";\nexport const tags = \"nordicon arrow down small caret pointing triangle chevron\";\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m13.0712.105225 2.1213 2.121315-7.77816 7.77816 7.77826 7.7783-2.1213 2.1213-8.48539-8.4854c-.78105-.781-.78105-2.04735 0-2.82839z\" fill=\"currentColor\"/></svg>';\nexport const title = \"arrow-left-small\";\nexport const tags = \"nordicon arrow left small caret pointing triangle chevron\";\n","export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m6.92903.100342-2.12132 2.121318 7.77819 7.77818-7.77828 7.77826 2.12132 2.1213 8.48536-8.4853c.7811-.7811.7811-2.04743 0-2.82848z\" fill=\"currentColor\"/></svg>';\nexport const title = \"arrow-right-small\";\nexport const tags =\n  \"nordicon arrow right small caret pointing triangle chevron\";\n","import type { ReactiveController, ReactiveElement } from 'lit'\nimport { EventController } from './EventController.js'\n\nexport interface SwipeDetails {\n  initialX: number\n  initialY: number\n  pageX: number\n  pageY: number\n  distX: number\n  distY: number\n}\n\nconst preventDefault = (e: Event) => e.preventDefault()\n\ntype SetRequired<T, K extends keyof T> = T & { [Property in K]-?: T[K] }\ninterface SwipeControllerOptions {\n  target?: () => HTMLElement\n  matchesGesture: (details: SwipeDetails) => boolean\n  onSwipeEnd: (details: SwipeDetails) => void\n}\n\nexport class SwipeController implements ReactiveController {\n  private events: EventController\n  private hadFirstUpdate = false\n\n  private initialTouchX: number = 0\n  private initialTouchY: number = 0\n  private options: SetRequired<SwipeControllerOptions, 'target'>\n\n  constructor(host: ReactiveElement, options: SwipeControllerOptions) {\n    host.addController(this)\n    this.events = new EventController(host)\n\n    this.options = {\n      target: () => host,\n      ...options,\n    }\n  }\n\n  hostUpdated() {\n    if (!this.hadFirstUpdate) {\n      this.hadFirstUpdate = true\n\n      const target = this.options.target()\n      this.events.listen(target, 'touchstart', this.handleTouchStart)\n      this.events.listen(target, 'touchmove', preventDefault)\n      this.events.listen(target, 'touchend', this.handleTouchEnd)\n    }\n  }\n\n  hostDisconnected() {\n    this.hadFirstUpdate = false\n  }\n\n  private handleTouchStart = (event: TouchEvent) => {\n    const [{ pageX, pageY }] = event.changedTouches\n    this.initialTouchX = pageX\n    this.initialTouchY = pageY\n  }\n\n  private handleTouchEnd = (event: TouchEvent) => {\n    const [{ pageX, pageY }] = event.changedTouches\n    const { matchesGesture, onSwipeEnd } = this.options\n\n    const distX = pageX - this.initialTouchX\n    const distY = pageY - this.initialTouchY\n    const details = { initialX: this.initialTouchX, initialY: this.initialTouchY, pageX, pageY, distX, distY }\n\n    if (matchesGesture(details)) {\n      event.preventDefault()\n      onSwipeEnd(details)\n    }\n  }\n}\n\nconst THRESHOLD = 70\n\nexport function isHorizontalSwipe({ distX, distY }: SwipeDetails) {\n  return Math.abs(distX) >= THRESHOLD && Math.abs(distY) <= THRESHOLD\n}\n\nexport function isDownwardsSwipe({ distX, distY }: SwipeDetails) {\n  return Math.abs(distY) >= THRESHOLD && Math.abs(distX) <= THRESHOLD && distY > 0\n}\n","import * as arrowDownIcon from '@nordhealth/icons/lib/assets/arrow-down-small.js'\nimport * as arrowLeftIcon from '@nordhealth/icons/lib/assets/arrow-left-small.js'\nimport * as arrowRightIcon from '@nordhealth/icons/lib/assets/arrow-right-small.js'\nimport { html, isServer, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { repeat } from 'lit/directives/repeat.js'\nimport { createKeybindingsHandler } from 'tinykeys'\n\nimport { chunk, mapWithOffset } from '../common/collection.js'\nimport { DirectionController } from '../common/controllers/DirectionController.js'\nimport { isHorizontalSwipe, SwipeController } from '../common/controllers/SwipeController.js'\n\nimport {\n  addDays,\n  clamp,\n  DaysOfWeek,\n  endOfMonth,\n  endOfWeek,\n  getDayNames,\n  getMonthNames,\n  getViewOfMonth,\n  inRange,\n  isEqual,\n  isEqualMonth,\n  parseISODate,\n  printISODate,\n  setMonth,\n  setYear,\n  startOfMonth,\n  startOfWeek,\n} from '../common/dates.js'\nimport { observe } from '../common/decorators/observe.js'\nimport { cond } from '../common/directives/cond.js'\nimport { range } from '../common/number.js'\nimport componentStyle from '../common/styles/Component.css'\nimport Icon from '../icon/Icon.js'\nimport { LocalizeController } from '../localization/LocalizeController.js'\nimport style from './Calendar.css'\n\nimport { DateRangeSelectEvent } from './DateRangeSelectEvent.js'\nimport { DateSelectEvent } from './DateSelectEvent.js'\nimport '../button/Button.js'\nimport '../visually-hidden/VisuallyHidden.js'\n\nexport type DatePredicate = (date: Date) => boolean\n\nIcon.registerIcon(arrowRightIcon)\nIcon.registerIcon(arrowLeftIcon)\nIcon.registerIcon(arrowDownIcon)\n\nfunction preventDefault(fn: EventListener) {\n  return (e: Event) => {\n    e.preventDefault()\n    fn(e)\n  }\n}\n\nconst isDateDisabled: DatePredicate = () => false\nconst isDateHighlighted = () => false\n\nconst dialogLabelId = 'dialog-header'\n\n/**\n * Orders two (possibly undefined) dates ascending. Returns `[earlier, later]`,\n * preserving `undefined` slots so callers can render a partial range.\n */\nfunction orderDates(a?: Date, b?: Date): [Date | undefined, Date | undefined] {\n  if (a == null || b == null) {\n    return [a, b]\n  }\n  return a.getTime() <= b.getTime() ? [a, b] : [b, a]\n}\n\n/**\n * Calendar allows user to pick a date. It comes with built-in\n * functionality that allows you to set a minimum and a maximum allowed date.\n * Please note that the date must be passed in ISO-8601 format.\n *\n * @status ready\n * @category list\n * @fires {DateSelectEvent} change - Dispatched when a date is selected and the value changes.\n * @fires {DateRangeSelectEvent} range-change - Dispatched in `range` mode when a complete range (start and end) has been selected.\n * @fires {DateSelectEvent} nord-focus-date - Dispatched when the calendar's focused date changes.\n *\n * @cssprop [--n-calendar-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-calendar-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-calendar-padding-block=var(--n-space-m)] - Controls the block padding of the calendar, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-padding-inline=var(--n-space-m)] - Controls the inline padding of the calendar, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-day-size=var(--n-space-xl)] - Controls the block and inline size of each day cell, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-day-font-size=var(--n-font-size-m)] - Controls the font size of each day cell, using [font size tokens](/tokens/#font-size).\n * @cssprop [--n-calendar-select-label-font-size=var(--n-font-size-xl)] - Controls the font size of the month and year select labels, using [font size tokens](/tokens/#font-size).\n * @cssprop [--n-calendar-nav-padding-inline=11px] - Controls the inline padding of the previous and next month buttons.\n * @cssprop [--n-calendar-nav-gap=var(--n-space-xs)] - Controls the gap between the previous and next month buttons, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-header-margin-block-end=var(--n-space-m)] - Controls the block-end margin of the calendar header, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-header-padding-block-end=0] - Controls the block-end padding of the calendar header, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-header-gap=var(--n-space-s)] - Controls the gap between the month/year selects and the navigation buttons, using [space tokens](/tokens/#space).\n * @cssprop [--n-calendar-inline-size=max-content] - Controls the inline size of the calendar. Defaults to `100%` when the `expand` attribute is set.\n *\n * @localization prevMonthLabel - Accessible label for the previous month button.\n * @localization nextMonthLabel - Accessible label for the next month button.\n * @localization monthSelectLabel - Accessible label for the month select.\n * @localization yearSelectLabel - Accessible label for the year select.\n */\n@customElement('nord-calendar')\nexport default class Calendar extends LitElement {\n  static styles = [componentStyle, style]\n\n  @query('.n-calendar-select-month', true) private monthSelectNode!: HTMLElement\n  @query(`button[tabindex=\"0\"]`) private focusedDayNode!: HTMLButtonElement\n\n  private direction = new DirectionController(this)\n  private swipe = new SwipeController(this, {\n    matchesGesture: isHorizontalSwipe,\n    onSwipeEnd: ({ distX }) => this.addMonths(distX < 0 ? 1 : -1),\n  })\n\n  private shortcuts = createKeybindingsHandler({\n    'ArrowRight': preventDefault(() => this.addDays(this.direction.isLTR ? 1 : -1)),\n    'ArrowLeft': preventDefault(() => this.addDays(this.direction.isLTR ? -1 : 1)),\n    'ArrowDown': preventDefault(() => this.addDays(7)),\n    'ArrowUp': preventDefault(() => this.addDays(-7)),\n    'Home': preventDefault(() => this.startOfWeek()),\n    'End': preventDefault(() => this.endOfWeek()),\n    'PageUp': preventDefault(() => this.addMonths(-1)),\n    'PageDown': preventDefault(() => this.addMonths(1)),\n    'Shift+PageUp': preventDefault(() => this.addYears(-1)),\n    'Shift+PageDown': preventDefault(() => this.addYears(1)),\n  })\n\n  private localize = new LocalizeController<'nord-calendar'>(this, {\n    onLangChange: () => this.handleLangChange(),\n  })\n\n  /**\n   * Whilst dateAdapter is used for handling the formatting/parsing dates in the input,\n   * these are used to format dates exclusively for the benefit of screen readers.\n   *\n   * We prefer DateTimeFormat over date.toLocaleDateString, as the former has\n   * better performance when formatting large number of dates. See:\n   * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Performance\n   */\n  private dateFormatShort!: Intl.DateTimeFormat\n  private monthNames!: string[]\n  private monthNamesShort!: string[]\n  private dayNames!: string[]\n  private dayNamesShort!: string[]\n\n  /**\n   * The selected date on the calendar. Must be in IS0-8601 format: YYYY-MM-DD.\n   */\n  @property() value: string = ''\n\n  /**\n   * Which day is considered first day of the week? `0` for Sunday, `1` for Monday, etc.\n   * Default is Monday.\n   */\n  @property({ reflect: true, type: Number, attribute: 'first-day-of-week' }) firstDayOfWeek: DaysOfWeek\n    = DaysOfWeek.Monday\n\n  /**\n   * Minimum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n   * This setting can be used alone or together with the max property.\n   */\n  @property({ reflect: true }) min?: string\n\n  /**\n   * Maximum date allowed to be picked. Must be in IS0-8601 format: YYYY-MM-DD.\n   * This setting can be used alone or together with the min property.\n   */\n  @property({ reflect: true }) max?: string\n\n  /**\n   * The date that is considered today. Must be in IS0-8601 format: YYYY-MM-DD.\n   * If not set, the current local date of the user is used.\n   */\n  @property({ reflect: true }) today?: string\n\n  /**\n   * Controls whether the calendar expands to fill the width of its container.\n   */\n  @property({ reflect: true, type: Boolean }) expand = false\n\n  /**\n   * Controls the size of the calendar.\n   */\n  @property({ reflect: true }) size: 's' | 'm' = 'm'\n\n  /**\n   * Controls which days are disabled and therefore disallowed.\n   * For example, this can be used to disallow selection of weekends.\n   */\n  @property({ attribute: false }) isDateDisabled: DatePredicate = isDateDisabled\n\n  /**\n   * Controls which days are highlighted with a small indicator.\n   * Returning a \"falsy\" value will not show an indicator.\n   * Returning \"truthy\" value will show the indicator, but without an accessible label.\n   * Returning a string will show the indicator, and use the string as accessible label.\n   * It is recommended to return a string rather than a truthy value whenever possible.\n   */\n  @property({ attribute: false }) isDateHighlighted: (date: Date) => string | boolean = isDateHighlighted\n\n  /**\n   * Opt into range selection. When `true`, clicking selects a range start, and\n   * the next click selects the end (the two clicks are swapped if the second is\n   * earlier than the first). The in-range days are styled, and a hover preview\n   * shows the range that would result. A completed range fires `range-change`.\n   *\n   * This is off by default, so the calendar keeps its single-date behaviour\n   * (the `value`/`change` API) unless `range` is set.\n   */\n  @property({ reflect: true, type: Boolean }) range = false\n\n  /**\n   * The start of the selected range, in ISO-8601 format: YYYY-MM-DD. Only used\n   * when `range` is set. Pair with `rangeEnd` to control the selection.\n   */\n  @property({ reflect: true, attribute: 'range-start' }) rangeStart?: string\n\n  /**\n   * The end of the selected range, in ISO-8601 format: YYYY-MM-DD. Only used\n   * when `range` is set. Pair with `rangeStart` to control the selection.\n   */\n  @property({ reflect: true, attribute: 'range-end' }) rangeEnd?: string\n\n  /**\n   * The number of consecutive months to display side by side, starting from the\n   * focused month. Defaults to `1`. Useful with `range` for picking a span that\n   * crosses months without paging — the range and its hover preview span every\n   * visible month, and the navigation arrows slide the whole window. With more\n   * than one month the month/year dropdowns are replaced by static titles.\n   */\n  @property({ reflect: true, type: Number }) months = 1\n\n  @state() private activeFocus = false\n  @state() private focusedDay = new Date()\n\n  /**\n   * While picking a range, the first click is held here until the second click\n   * completes the range. `undefined` means no in-progress pick.\n   */\n  @state() private pendingRangeStart?: Date\n\n  /** The day currently hovered while a range pick is in progress (preview). */\n  @state() private hoveredDay?: Date\n\n  /**\n   * Programmatically move focus to the calendar.\n   * @param options An object which controls aspects of the focusing process.\n   */\n  focus(options?: FocusOptions & { target: 'day' | 'month' }) {\n    const target = options?.target ?? 'day'\n\n    if (target === 'day') {\n      this.focusedDayNode.focus()\n    }\n    else if (target === 'month') {\n      this.monthSelectNode.focus()\n    }\n  }\n\n  render() {\n    const today = this.getToday()\n    const valueAsDate = parseISODate(this.value)\n\n    // Resolve the visible range bounds for `range` mode. While a range pick is\n    // in progress, the second bound follows the hovered/focused day so the user\n    // sees a live preview of the range that would result.\n    const committedStart = parseISODate(this.rangeStart || '')\n    const committedEnd = parseISODate(this.rangeEnd || '')\n    const previewEnd = this.pendingRangeStart ? (this.hoveredDay ?? this.focusedDay) : undefined\n    const [rangeFrom, rangeTo] = this.pendingRangeStart\n      ? orderDates(this.pendingRangeStart, previewEnd)\n      : orderDates(committedStart, committedEnd)\n\n    const minDate = parseISODate(this.min || '')\n    const maxDate = parseISODate(this.max || '')\n    const minDateStartOfMonth = minDate ? startOfMonth(minDate) : undefined\n    const maxDateEndOfMonth = maxDate ? endOfMonth(maxDate) : undefined\n\n    const currentYear = today.getFullYear()\n    const minYear = minDate ? minDate.getFullYear() : currentYear - 100\n    const maxYear = maxDate ? maxDate.getFullYear() : currentYear + 10\n\n    if (isServer) {\n      // Needed when run on a server, because the `onLangChange` callback does not get triggered, so we need to manually\n      // call `handleLangChange` to set the localized values for month and day names, which the `render` method relies on.\n      this.handleLangChange()\n    }\n\n    // Render `months` consecutive month grids, anchored on the focused month.\n    // They all read the same range state, so a range (and its hover preview) spans\n    // months automatically.\n    const count = Math.max(1, this.months)\n    const months = Array.from(\n      { length: count },\n      (_, i) => new Date(this.focusedDay.getFullYear(), this.focusedDay.getMonth() + i, 1),\n    )\n    const multi = count > 1\n\n    // In multi-month mode adjacent months share the same overlap days (the\n    // trailing days of one month are the leading days of the next), so rendering\n    // the out-of-month days in every grid would emit the same date twice —\n    // duplicating `tabindex=\"0\"`, `aria-pressed` and range styling. Disable\n    // boundary navigation when ANY visible month already reaches the bound, so\n    // the arrows never appear enabled-but-noop.\n    const reachesMin = minDate != null && months.some(monthDate => isEqualMonth(minDate, monthDate))\n    const reachesMax = maxDate != null && months.some(monthDate => isEqualMonth(maxDate, monthDate))\n\n    const dayCell = (day: Date, monthDate: Date) => {\n      const isInMonth = isEqualMonth(day, monthDate)\n\n      // In multi-month mode the leading/trailing overlap days belong to the\n      // adjacent grid, so each date is rendered (and owned) by exactly one\n      // month. Render an inert placeholder here instead of a duplicate button.\n      if (multi && !isInMonth) {\n        return html`<td class=\"n-calendar-cell\" aria-hidden=\"true\"></td>`\n      }\n\n      const outsideRange = !inRange(day, minDate, maxDate)\n      const isToday = isEqual(day, today)\n      const isDisabled = this.isDateDisabled(day)\n      const isHighlighted = this.isDateHighlighted(day)\n      const formattedDate = this.dateFormatShort.format(day)\n\n      // In range mode the \"selected\" days are the two range ends; otherwise it is\n      // the single `value`.\n      const isRangeStart = this.range && rangeFrom != null && isEqual(day, rangeFrom)\n      const isRangeEnd = this.range && rangeTo != null && isEqual(day, rangeTo)\n      const isInRange = this.range && rangeFrom != null && rangeTo != null && day >= rangeFrom && day <= rangeTo\n      const isSelected = this.range ? isRangeStart || isRangeEnd : isEqual(day, valueAsDate)\n      const sameDayRange = rangeFrom != null && isEqual(rangeFrom, rangeTo)\n\n      const accessibleLabel\n        = isHighlighted && typeof isHighlighted === 'string' ? `${formattedDate}, ${isHighlighted}` : formattedDate\n\n      return html`\n        <td class=\"n-calendar-cell\">\n          <button\n            type=\"button\"\n            tabindex=${isEqual(day, this.focusedDay) ? 0 : -1}\n            class=${classMap({\n              'n-calendar-day': true,\n              'is-outside': outsideRange,\n              'is-month': isInMonth,\n              'is-highlighted': isHighlighted,\n              'is-in-range': isInRange && !isSelected,\n              'is-range-start': isRangeStart && !sameDayRange,\n              'is-range-end': isRangeEnd && !sameDayRange,\n            })}\n            @click=${() => this.handleDaySelect(day)}\n            @mouseenter=${() => this.handleDayHover(day)}\n            @keydown=${this.shortcuts}\n            ?disabled=${outsideRange}\n            aria-disabled=${cond(isDisabled, 'true')}\n            aria-pressed=${isSelected ? 'true' : 'false'}\n            aria-current=${cond(isToday, 'date')}\n            aria-label=${accessibleLabel}\n          >\n            <span aria-hidden=\"true\">${day.getDate()}</span>\n          </button>\n        </td>\n      `\n    }\n\n    // The rich month/year selects only make sense for a single month. With more\n    // than one month, each shows a static title with the prev/next arrows on the\n    // first/last month, so navigation slides the whole window of months.\n    const header = (monthDate: Date, index: number, labelId: string) => {\n      const monthIndex = monthDate.getMonth()\n      const monthYear = monthDate.getFullYear()\n      if (multi) {\n        const isFirst = index === 0\n        const isLast = index === count - 1\n        return html`\n          <div class=\"n-calendar-header is-static\">\n            <nord-button\n              class=${classMap({ 'n-calendar-prev': true, 'is-hidden': !isFirst })}\n              size=${this.size}\n              square\n              variant=\"plain\"\n              @click=${this.handlePreviousMonthClick}\n              ?disabled=${!isFirst || reachesMin}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term('prevMonthLabel')}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? 'arrow-left-small' : 'arrow-right-small'} size=${this.size === 's' ? 'xs' : 's'}></nord-icon>\n            </nord-button>\n\n            <h2 class=\"n-calendar-title\" id=${labelId} aria-live=\"polite\" aria-atomic=\"true\">\n              ${this.monthNames[monthIndex]} ${monthYear}\n            </h2>\n\n            <nord-button\n              class=${classMap({ 'n-calendar-next': true, 'is-hidden': !isLast })}\n              size=${this.size}\n              square\n              variant=\"plain\"\n              @click=${this.handleNextMonthClick}\n              ?disabled=${!isLast || reachesMax}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term('nextMonthLabel')}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? 'arrow-right-small' : 'arrow-left-small'} size=${this.size === 's' ? 'xs' : 's'}></nord-icon>\n            </nord-button>\n          </div>\n        `\n      }\n      return html`\n        <div class=\"n-calendar-header\">\n          <div>\n            <nord-visually-hidden>\n              <h2 id=${labelId} aria-live=\"polite\" aria-atomic=\"true\">${this.monthNames[monthIndex]}, ${monthYear}</h2>\n            </nord-visually-hidden>\n\n            <div class=\"n-calendar-select\">\n              <select aria-label=${this.localize.term('monthSelectLabel')} class=\"n-calendar-select-month\" @input=${this.handleMonthSelect}>\n                ${this.monthNames.map(\n                  (month, i) => html`\n                    <option\n                      value=${i}\n                      ?selected=${i === monthIndex}\n                      ?disabled=${!inRange(new Date(monthYear, i, 1), minDateStartOfMonth, maxDateEndOfMonth)}\n                    >\n                      ${month}\n                    </option>\n                  `,\n                )}\n              </select>\n              <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n                <span>${this.monthNamesShort[monthIndex]}</span>\n                <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n              </div>\n            </div>\n\n            <div class=\"n-calendar-select\">\n              <select aria-label=${this.localize.term('yearSelectLabel')} class=\"n-calendar-select-year\" @input=${this.handleYearSelect}>\n                ${repeat(\n                  range(minYear, maxYear),\n                  year => year,\n                  year => html`<option ?selected=${year === monthYear}>${year}</option>`,\n                )}\n              </select>\n              <div class=\"n-calendar-select-label\" aria-hidden=\"true\">\n                <span>${monthYear}</span>\n                <nord-icon color=\"var(--n-color-icon)\" name=\"arrow-down-small\" size=\"xxs\"></nord-icon>\n              </div>\n            </div>\n          </div>\n\n          <div class=\"n-calendar-nav\">\n            <nord-button\n              class=\"n-calendar-prev\"\n              size=${this.size}\n              square\n              @click=${this.handlePreviousMonthClick}\n              ?disabled=${isEqualMonth(minDate, monthDate)}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term('prevMonthLabel')}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? 'arrow-left-small' : 'arrow-right-small'} size=${this.size === 's' ? 'xs' : 's'}></nord-icon>\n            </nord-button>\n\n            <nord-button\n              class=\"n-calendar-next\"\n              size=${this.size}\n              square\n              @click=${this.handleNextMonthClick}\n              ?disabled=${isEqualMonth(maxDate, monthDate)}\n              type=\"button\"\n            >\n              <nord-visually-hidden>${this.localize.term('nextMonthLabel')}</nord-visually-hidden>\n              <nord-icon name=${this.direction.isLTR ? 'arrow-right-small' : 'arrow-left-small'} size=${this.size === 's' ? 'xs' : 's'}></nord-icon>\n            </nord-button>\n          </div>\n        </div>\n      `\n    }\n\n    return html`\n      <div class=${classMap({ 'n-calendar': true, 'has-multiple-months': multi })}>\n        ${months.map((monthDate, index) => {\n          const labelId = `${dialogLabelId}-${index}`\n          return html`\n            <div class=\"n-calendar-month\">\n              ${header(monthDate, index, labelId)}\n\n              <table\n                class=\"n-calendar-table\"\n                aria-labelledby=${labelId}\n                @focusin=${this.enableActiveFocus}\n                @focusout=${this.disableActiveFocus}\n              >\n                <thead>\n                  <tr>\n                    ${mapWithOffset(\n                      this.dayNames,\n                      this.firstDayOfWeek,\n                      (dayName, i) => html`\n                        <th class=\"n-calendar-table-header\" scope=\"col\">\n                          <span aria-hidden=\"true\">${this.dayNamesShort[i]}</span>\n                          <nord-visually-hidden>${dayName}</nord-visually-hidden>\n                        </th>\n                      `,\n                    )}\n                  </tr>\n                </thead>\n                <tbody>\n                  ${chunk(getViewOfMonth(monthDate, this.firstDayOfWeek), 7).map(\n                    week => html`<tr class=\"n-calendar-row\">${week.map(day => dayCell(day, monthDate))}</tr>`,\n                  )}\n                </tbody>\n              </table>\n            </div>\n          `\n        })}\n      </div>\n    `\n  }\n\n  @observe('value')\n  protected handleValueChange() {\n    if (this.range) {\n      return\n    }\n    this.setFocusedDay(parseISODate(this.value) || this.getToday())\n  }\n\n  @observe('rangeStart')\n  @observe('rangeEnd')\n  protected handleRangeChange() {\n    if (!this.range) {\n      return\n    }\n    // Focus the most relevant end of the committed range so the calendar opens\n    // showing it, falling back to today when nothing is set.\n    const start = parseISODate(this.rangeStart || '')\n    const end = parseISODate(this.rangeEnd || '')\n    this.setFocusedDay(start || end || this.getToday())\n  }\n\n  @observe('focusedDay', 'updated')\n  protected handleFocusedDayChange() {\n    if (this.activeFocus) {\n      this.focusedDayNode.focus()\n    }\n  }\n\n  private handleLangChange() {\n    const lang = this.localize.resolvedLang\n    this.dateFormatShort = new Intl.DateTimeFormat(lang, { day: 'numeric', month: 'long' })\n    this.monthNames = getMonthNames(lang, 'long')\n    this.monthNamesShort = getMonthNames(lang, 'short')\n    this.dayNames = getDayNames(lang, 'long')\n    this.dayNamesShort = getDayNames(lang, 'narrow')\n  }\n\n  private handleDaySelect = (day: Date) => {\n    const isWithinBounds = inRange(day, parseISODate(this.min || ''), parseISODate(this.max || ''))\n    const isAllowed = !this.isDateDisabled(day)\n\n    if (!isWithinBounds || !isAllowed) {\n      return\n    }\n\n    if (this.range) {\n      this.selectRangeDay(day)\n      return\n    }\n\n    this.value = printISODate(day)\n    this.dispatchEvent(new DateSelectEvent('change', day))\n  }\n\n  /**\n   * Two-click range selection: the first click starts a pending range, the\n   * second completes it. The two ends are swapped if the second click is before\n   * the first, so the committed range is always ordered `start <= end`.\n   */\n  private selectRangeDay(day: Date) {\n    if (!this.pendingRangeStart) {\n      this.pendingRangeStart = day\n      this.hoveredDay = day\n      this.rangeStart = printISODate(day)\n      this.rangeEnd = printISODate(day)\n      return\n    }\n\n    const [start, end] = orderDates(this.pendingRangeStart, day) as [Date, Date]\n    this.pendingRangeStart = undefined\n    this.hoveredDay = undefined\n    this.rangeStart = printISODate(start)\n    this.rangeEnd = printISODate(end)\n    this.dispatchEvent(new DateRangeSelectEvent('range-change', start, end))\n  }\n\n  private handleDayHover = (day: Date) => {\n    if (this.range && this.pendingRangeStart) {\n      this.hoveredDay = day\n    }\n  }\n\n  private getToday() {\n    return parseISODate(this.today || '') || new Date()\n  }\n\n  private addDays(days: number) {\n    this.setFocusedDay(addDays(this.focusedDay, days))\n  }\n\n  private addMonths(months: number) {\n    this.setMonth(this.focusedDay.getMonth() + months)\n  }\n\n  private addYears(years: number) {\n    this.setYear(this.focusedDay.getFullYear() + years)\n  }\n\n  private startOfWeek() {\n    this.setFocusedDay(startOfWeek(this.focusedDay, this.firstDayOfWeek))\n  }\n\n  private endOfWeek() {\n    this.setFocusedDay(endOfWeek(this.focusedDay, this.firstDayOfWeek))\n  }\n\n  private setMonth(month: number) {\n    const min = setMonth(startOfMonth(this.focusedDay), month)\n    const max = endOfMonth(min)\n    const date = setMonth(this.focusedDay, month)\n\n    this.setFocusedDay(clamp(date, min, max))\n  }\n\n  private setYear(year: number) {\n    const min = setYear(startOfMonth(this.focusedDay), year)\n    const max = endOfMonth(min)\n    const date = setYear(this.focusedDay, year)\n\n    this.setFocusedDay(clamp(date, min, max))\n  }\n\n  private setFocusedDay(day: Date) {\n    this.focusedDay = clamp(day, parseISODate(this.min || ''), parseISODate(this.max || ''))\n    this.dispatchEvent(new DateSelectEvent('nord-focus-date', this.focusedDay))\n  }\n\n  private handleMonthSelect = (e: Event) => {\n    this.setMonth(Number.parseInt((e.target as HTMLSelectElement).value, 10))\n  }\n\n  private handleYearSelect = (e: Event) => {\n    this.setYear(Number.parseInt((e.target as HTMLSelectElement).value, 10))\n  }\n\n  private handleNextMonthClick = (event: MouseEvent) => {\n    event.preventDefault()\n    this.addMonths(1)\n  }\n\n  private handlePreviousMonthClick = (event: MouseEvent) => {\n    event.preventDefault()\n    this.addMonths(-1)\n  }\n\n  private enableActiveFocus = () => {\n    this.activeFocus = true\n  }\n\n  private disableActiveFocus = (e: FocusEvent) => {\n    const table = e.currentTarget as Node\n    const relatedTarget = e.relatedTarget as Node\n\n    if (relatedTarget && !table.contains(relatedTarget)) {\n      this.activeFocus = false\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-calendar': Calendar\n  }\n}\n"],"names":["preventDefault","e","SwipeController","constructor","host","options","this","hadFirstUpdate","initialTouchX","initialTouchY","handleTouchStart","event","pageX","pageY","changedTouches","handleTouchEnd","matchesGesture","onSwipeEnd","distX","distY","details","initialX","initialY","addController","events","EventController","target","hostUpdated","listen","hostDisconnected","isHorizontalSwipe","Math","abs","isDownwardsSwipe","fn","Icon","registerIcon","arrowRightIcon","arrowLeftIcon","arrowDownIcon","isDateDisabled","isDateHighlighted","orderDates","a","b","getTime","Calendar","LitElement","direction","DirectionController","swipe","addMonths","shortcuts","createKeybindingsHandler","ArrowRight","addDays","isLTR","ArrowLeft","ArrowDown","ArrowUp","Home","startOfWeek","End","endOfWeek","PageUp","PageDown","addYears","localize","LocalizeController","onLangChange","handleLangChange","value","firstDayOfWeek","DaysOfWeek","Monday","expand","size","range","months","activeFocus","focusedDay","Date","handleDaySelect","day","isWithinBounds","inRange","parseISODate","min","max","isAllowed","selectRangeDay","printISODate","dispatchEvent","DateSelectEvent","handleDayHover","pendingRangeStart","hoveredDay","handleMonthSelect","setMonth","Number","parseInt","handleYearSelect","setYear","handleNextMonthClick","handlePreviousMonthClick","enableActiveFocus","disableActiveFocus","table","currentTarget","relatedTarget","contains","focus","_a","focusedDayNode","monthSelectNode","render","today","getToday","valueAsDate","committedStart","rangeStart","committedEnd","rangeEnd","previewEnd","undefined","rangeFrom","rangeTo","minDate","maxDate","minDateStartOfMonth","startOfMonth","maxDateEndOfMonth","endOfMonth","currentYear","getFullYear","minYear","maxYear","isServer","count","Array","from","length","_","i","getMonth","multi","reachesMin","some","monthDate","isEqualMonth","reachesMax","dayCell","isInMonth","html","outsideRange","isToday","isEqual","isDisabled","isHighlighted","formattedDate","dateFormatShort","format","isRangeStart","isRangeEnd","isInRange","isSelected","sameDayRange","accessibleLabel","classMap","cond","getDate","header","index","labelId","monthIndex","monthYear","isFirst","isLast","term","monthNames","map","month","monthNamesShort","repeat","year","mapWithOffset","dayNames","dayName","dayNamesShort","chunk","getViewOfMonth","week","handleValueChange","setFocusedDay","handleRangeChange","start","end","handleFocusedDayChange","lang","resolvedLang","Intl","DateTimeFormat","getMonthNames","getDayNames","DateRangeSelectEvent","days","years","date","clamp","styles","componentStyle","style","__decorate","query","prototype","property","reflect","type","attribute","Boolean","state","observe","customElement"],"mappings":"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"}

package/lib/Calendar.js

@@ -1,2 +1,2 @@
-import"./tslib.es6-CmLYFWVC.js";export{C as default}from"./Calendar-ChNZdVRO.js";import"lit";import"lit/decorators.js";import"lit/directives/class-map.js";import"lit/directives/repeat.js";import"./tinykeys.module-_6MZt7MP.js";import"./collection-Dvg2XbxV.js";import"./DirectionController-ChvNGESZ.js";import"./dates-CAAlPKZi.js";import"./observe-D0n0zOfU.js";import"./cond-CI1KbneT.js";import"./number-Dg2vCfGd.js";import"./Component-DSU3Qp0O.js";import"./Icon.js";import"./LocalizeController.js";import"./DateSelectEvent.js";import"./Button.js";import"./VisuallyHidden.js";import"./EventController-BBOmvfLa.js";import"lit/directives/if-defined.js";import"lit/directives/unsafe-html.js";import"./IconManager.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";import"./events-Bv6wNHwJ.js";import"lit/directives/ref.js";import"./LightDomController-DIwtVelV.js";import"./SlotController-Z6eG7LSZ.js";import"./FocusableMixin-BlQLNPdJ.js";import"./InputMixin-LetXsCyv.js";import"./Spinner.js";
+import"./tslib.es6-CmLYFWVC.js";export{C as default}from"./Calendar-C1SxrlzN.js";import"lit";import"lit/decorators.js";import"lit/directives/class-map.js";import"lit/directives/repeat.js";import"./tinykeys.module-_6MZt7MP.js";import"./collection-Dvg2XbxV.js";import"./DirectionController-ChvNGESZ.js";import"./dates-C-ZvzXaC.js";import"./observe-D0n0zOfU.js";import"./cond-CI1KbneT.js";import"./number-Dg2vCfGd.js";import"./Component-BJ5O5n8k.js";import"./Icon.js";import"./LocalizeController.js";import"./DateRangeSelectEvent.js";import"./DateSelectEvent.js";import"./Button.js";import"./VisuallyHidden.js";import"./EventController-BBOmvfLa.js";import"lit/directives/if-defined.js";import"lit/directives/unsafe-html.js";import"./IconManager.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";import"./localization10.js";import"./localization11.js";import"./localization12.js";import"./localization13.js";import"./localization14.js";import"./localization15.js";import"./localization16.js";import"./localization17.js";import"./localization18.js";import"./localization19.js";import"./localization20.js";import"./localization21.js";import"./localization22.js";import"./events-Bv6wNHwJ.js";import"lit/directives/ref.js";import"./LightDomController-DIwtVelV.js";import"./SlotController-Z6eG7LSZ.js";import"./FocusableMixin-BlQLNPdJ.js";import"./InputMixin-LetXsCyv.js";import"./Spinner.js";
 //# sourceMappingURL=Calendar.js.map

package/lib/Card.js

@@ -1,2 +1,2 @@
-import{_ as r}from"./tslib.es6-CmLYFWVC.js";import{css as a,LitElement as d,html as e}from"lit";import{property as o,customElement as n}from"lit/decorators.js";import{S as t}from"./SlotController-Z6eG7LSZ.js";import{s as i}from"./Component-DSU3Qp0O.js";import"./EventController-BBOmvfLa.js";const s=a`:host{--_n-card-padding:var(--n-card-padding, var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-m));--_n-card-background-color:var(--n-card-background-color, var(--n-color-surface));--_n-card-box-shadow:var(--n-card-box-shadow, var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius, var(--n-border-radius));--_n-card-header-background:var(--n-card-header-background, transparent);--_n-card-border-color:var(--n-card-border-color, var(--n-color-border));--_n-card-header-padding-block:var(--n-card-header-padding-block, var(--n-space-m));--_n-card-header-padding-inline:var(--n-card-header-padding-inline, var(--_n-card-slot-padding));--_n-card-header-flex-wrap:var(--n-card-header-flex-wrap, wrap);--_n-card-header-slot-flex-grow:var(--n-card-header-slot-flex-grow, 0);color:var(--n-color-text);display:block;inline-size:100%}.n-card{--n-color-border:var(--_n-card-border-color);background:var(--_n-card-background-color);border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);block-size:100%;display:flex;flex-direction:column}.header{background-color:var(--_n-card-header-background);border-block-end:1px solid var(--_n-card-border-color);border-start-start-radius:var(--_n-card-border-radius);border-start-end-radius:var(--_n-card-border-radius);padding-block:var(--_n-card-header-padding-block);padding-inline:var(--_n-card-header-padding-inline);display:flex;gap:var(--n-space-s);align-items:center;justify-content:space-between;flex-wrap:var(--_n-card-header-flex-wrap)}:host([padding='l']){--_n-card-padding:var(--n-card-padding, var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding, var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding, 0)}slot{display:block}slot:not([name]){padding:var(--_n-card-padding);flex:1}slot[name=header]{flex-grow:var(--_n-card-header-slot-flex-grow);min-inline-size:0}slot[name=footer]{padding:var(--_n-card-slot-padding);white-space:nowrap}:host(:not([footer-divider])) slot[name=footer]{padding-block-start:0}:host([footer-divider]) slot[name=footer]{border-block-start:1px solid var(--_n-card-border-color)}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);display:flex;gap:var(--n-stack-gap);align-items:center;flex-wrap:wrap;min-inline-size:0;margin-block-start:var(--n-card-header-end-margin-block-start,calc(var(--n-space-xs) * -1))!important;margin-block-end:var(--n-card-header-end-margin-block-end,calc(var(--n-space-xs) * -1))!important}::slotted([slot=header]){font-size:var(--n-font-size-m)!important;font-weight:var(--n-font-weight-heading)!important;margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let l=class extends d{constructor(){super(...arguments),this.headerSlot=new t(this,"header"),this.headerEndSlot=new t(this,"header-end"),this.footerSlot=new t(this,"footer"),this.padding="m",this.footerDivider=!1}render(){return e`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};l.styles=[i,s],r([o({reflect:!0})],l.prototype,"padding",void 0),r([o({type:Boolean,reflect:!0,attribute:"footer-divider"})],l.prototype,"footerDivider",void 0),l=r([n("nord-card")],l);var c=l;export{c as default};
+import{_ as r}from"./tslib.es6-CmLYFWVC.js";import{css as a,LitElement as d,html as e}from"lit";import{property as o,customElement as n}from"lit/decorators.js";import{S as t}from"./SlotController-Z6eG7LSZ.js";import{s as i}from"./Component-BJ5O5n8k.js";import"./EventController-BBOmvfLa.js";const s=a`:host{--_n-card-padding:var(--n-card-padding,var(--n-space-m));--_n-card-slot-padding:var(--n-card-slot-padding,var(--n-space-m));--_n-card-background-color:var(--n-card-background-color,var(--n-color-surface));--_n-card-box-shadow:var(--n-card-box-shadow,var(--n-box-shadow-card));--_n-card-border-radius:var(--n-card-border-radius,var(--n-border-radius));--_n-card-header-background:var(--n-card-header-background,#0000);--_n-card-border-color:var(--n-card-border-color,var(--n-color-border));--_n-card-header-padding-block:var(--n-card-header-padding-block,var(--n-space-m));--_n-card-header-padding-inline:var(--n-card-header-padding-inline,var(--_n-card-slot-padding));--_n-card-header-flex-wrap:var(--n-card-header-flex-wrap,wrap);--_n-card-header-slot-flex-grow:var(--n-card-header-slot-flex-grow,0);color:var(--n-color-text);display:block;inline-size:100%}.n-card{--n-color-border:var(--_n-card-border-color);background:var(--_n-card-background-color);block-size:100%;border-radius:var(--_n-card-border-radius);box-shadow:var(--_n-card-box-shadow);display:flex;flex-direction:column}.header{align-items:center;background-color:var(--_n-card-header-background);border-block-end:1px solid var(--_n-card-border-color);border-start-end-radius:var(--_n-card-border-radius);border-start-start-radius:var(--_n-card-border-radius);display:flex;flex-wrap:var(--_n-card-header-flex-wrap);gap:var(--n-space-s);justify-content:space-between;padding-block:var(--_n-card-header-padding-block);padding-inline:var(--_n-card-header-padding-inline)}:host([padding=l]){--_n-card-padding:var(--n-card-padding,var(--n-space-l));--_n-card-slot-padding:var(--n-card-slot-padding,var(--n-space-l))}:host([padding=none]){--_n-card-padding:var(--n-card-padding,0)}slot{display:block}slot:not([name]){flex:1;padding:var(--_n-card-padding)}slot[name=header]{flex-grow:var(--_n-card-header-slot-flex-grow);min-inline-size:0}slot[name=footer]{padding:var(--_n-card-slot-padding);white-space:nowrap}:host(:not([footer-divider])) slot[name=footer]{padding-block-start:0}:host([footer-divider]) slot[name=footer]{border-block-start:1px solid var(--_n-card-border-color)}::slotted([slot=header-end]){--n-stack-gap:var(--n-space-s);align-items:center;display:flex;flex-wrap:wrap;gap:var(--n-stack-gap);margin-block-end:var(--n-card-header-end-margin-block-end,calc(var(--n-space-xs)*-1))!important;margin-block-start:var(--n-card-header-end-margin-block-start,calc(var(--n-space-xs)*-1))!important;min-inline-size:0}::slotted([slot=header]){font-size:var(--n-font-size-m)!important;font-weight:var(--n-font-weight-heading)!important;margin:0}::slotted(a){color:var(--n-color-text-link);text-decoration:underline}::slotted(a:hover){text-decoration:none}`;let l=class extends d{constructor(){super(...arguments),this.headerSlot=new t(this,"header"),this.headerEndSlot=new t(this,"header-end"),this.footerSlot=new t(this,"footer"),this.padding="m",this.footerDivider=!1}render(){return e`<div class="n-card"><div class="header" ?hidden="${this.headerSlot.isEmpty&&this.headerEndSlot.isEmpty}"><slot name="${this.headerSlot.slotName}"></slot><slot name="${this.headerEndSlot.slotName}"></slot></div><slot></slot><slot name="${this.footerSlot.slotName}" ?hidden="${this.footerSlot.isEmpty}"></slot></div>`}};l.styles=[i,s],r([o({reflect:!0})],l.prototype,"padding",void 0),r([o({type:Boolean,reflect:!0,attribute:"footer-divider"})],l.prototype,"footerDivider",void 0),l=r([n("nord-card")],l);var c=l;export{c as default};
 //# sourceMappingURL=Card.js.map

package/lib/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../src/card/Card.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 './Card.css'\n\n/**\n * Cards are shadowed surfaces that display content and actions on a\n * single topic. They should be easy to scan for relevant and\n * actionable information.\n *\n * @status ready\n * @category structure\n * @slot - The card content.\n * @slot header - Optional slot that holds a header for the card.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n * @slot footer - Optional slot that holds footer content for the card.\n *\n * @cssprop [--n-card-background-color=var(--n-color-surface)] - Controls the background color of the card.\n * @cssprop [--n-card-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-card-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-card-padding=var(--n-space-m)] - Controls the padding on all sides of the card.\n * @cssprop [--n-card-slot-padding=var(--n-space-m)] - Controls the padding of items slotted within the card. This does not affect the block padding of items slotted into the header.\n * @cssprop [--n-card-header-background=transparent] - Controls the background color of the card header.\n * @cssprop [--n-card-border-color=var(--n-color-border)] - Controls the border color of the card header and footer divider.\n * @cssprop [--n-card-header-padding-block=var(--n-space-m)] - Controls the block (top and bottom) padding of the card header.\n * @cssprop [--n-card-header-padding-inline=var(--n-card-slot-padding)] - Controls the inline (left and right) padding of the card header.\n * @cssprop [--n-card-header-slot-flex-grow=0] - Controls the flex-grow value of the header slot.\n * @cssprop [--n-card-header-end-margin-block-start=calc(var(--n-space-xs) * -1)] - Block-start margin of content slotted into `header-end`. The negative default lets buttons and similar controls sit within the header without inflating its height. Override (e.g. `0`) when slotting tall content that should occupy the full header height.\n * @cssprop [--n-card-header-end-margin-block-end=calc(var(--n-space-xs) * -1)] - Block-end margin of content slotted into `header-end`. The negative default lets buttons and similar controls sit within the header without inflating its height. Override (e.g. `0`) when slotting tall content that should occupy the full header height.\n */\n@customElement('nord-card')\nexport default class Card extends LitElement {\n  static styles = [componentStyle, style]\n\n  private headerSlot = new SlotController(this, 'header')\n  private headerEndSlot = new SlotController(this, 'header-end')\n  private footerSlot = new SlotController(this, 'footer')\n\n  /**\n   * Controls the padding of the card component. When set to “none”,\n   * the header and footer slots will still have padding.\n   */\n  @property({ reflect: true }) padding: 'm' | 'l' | 'none' = 'm'\n\n  /**\n   * When set, adds a divider border above the footer slot.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'footer-divider' }) footerDivider = false\n\n  render() {\n    return html`\n      <div class=\"n-card\">\n        <div class=\"header\" ?hidden=${this.headerSlot.isEmpty && this.headerEndSlot.isEmpty}>\n          <slot name=${this.headerSlot.slotName}></slot>\n          <slot name=${this.headerEndSlot.slotName}></slot>\n        </div>\n        <slot></slot>\n        <slot name=${this.footerSlot.slotName} ?hidden=${this.footerSlot.isEmpty}></slot>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-card': Card\n  }\n}\n"],"names":["Card","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","footerSlot","padding","footerDivider","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","type","Boolean","attribute","customElement"],"mappings":"8+FAgCe,IAAMA,EAAN,cAAmBC,EAAnB,WAAAC,uBAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cACzCA,KAAUI,WAAG,IAAIF,EAAeF,KAAM,UAMjBA,KAAOK,QAAuB,IAKcL,KAAaM,eAAG,CAc1F,CAZC,MAAAC,GACE,OAAOC,CAAI,oDAEuBR,KAAKC,WAAWQ,SAAWT,KAAKG,cAAcM,wBAC7DT,KAAKC,WAAWS,gCAChBV,KAAKG,cAAcO,mDAGrBV,KAAKI,WAAWM,sBAAoBV,KAAKI,WAAWK,wBAGtE,GA5BMZ,EAAAc,OAAS,CAACC,EAAgBC,GAUJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyCnB,EAAAoB,UAAA,eAAA,GAKWH,EAAA,CAAxEC,EAAS,CAAEG,KAAMC,QAASH,SAAS,EAAMI,UAAW,oBAAyCvB,EAAAoB,UAAA,qBAAA,GAhB3EpB,EAAIiB,EAAA,CADxBO,EAAc,cACMxB,SAAAA"}
+{"version":3,"file":"Card.js","sources":["../src/card/Card.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 './Card.css'\n\n/**\n * Cards are shadowed surfaces that display content and actions on a\n * single topic. They should be easy to scan for relevant and\n * actionable information.\n *\n * @status ready\n * @category structure\n * @slot - The card content.\n * @slot header - Optional slot that holds a header for the card.\n * @slot header-end - Optional slot that positions content at the end of the header. Useful for actions or additional info.\n * @slot footer - Optional slot that holds footer content for the card.\n *\n * @cssprop [--n-card-background-color=var(--n-color-surface)] - Controls the background color of the card.\n * @cssprop [--n-card-border-radius=var(--n-border-radius)] - Controls how rounded the corners are, using [border radius tokens](/tokens/#border-radius).\n * @cssprop [--n-card-box-shadow=var(--n-box-shadow-popout)] - Controls the surrounding shadow, using [box shadow tokens](/tokens/#box-shadow).\n * @cssprop [--n-card-padding=var(--n-space-m)] - Controls the padding on all sides of the card.\n * @cssprop [--n-card-slot-padding=var(--n-space-m)] - Controls the padding of items slotted within the card. This does not affect the block padding of items slotted into the header.\n * @cssprop [--n-card-header-background=transparent] - Controls the background color of the card header.\n * @cssprop [--n-card-border-color=var(--n-color-border)] - Controls the border color of the card header and footer divider.\n * @cssprop [--n-card-header-padding-block=var(--n-space-m)] - Controls the block (top and bottom) padding of the card header.\n * @cssprop [--n-card-header-padding-inline=var(--n-card-slot-padding)] - Controls the inline (left and right) padding of the card header.\n * @cssprop [--n-card-header-slot-flex-grow=0] - Controls the flex-grow value of the header slot.\n * @cssprop [--n-card-header-end-margin-block-start=calc(var(--n-space-xs) * -1)] - Block-start margin of content slotted into `header-end`. The negative default lets buttons and similar controls sit within the header without inflating its height. Override (e.g. `0`) when slotting tall content that should occupy the full header height.\n * @cssprop [--n-card-header-end-margin-block-end=calc(var(--n-space-xs) * -1)] - Block-end margin of content slotted into `header-end`. The negative default lets buttons and similar controls sit within the header without inflating its height. Override (e.g. `0`) when slotting tall content that should occupy the full header height.\n */\n@customElement('nord-card')\nexport default class Card extends LitElement {\n  static styles = [componentStyle, style]\n\n  private headerSlot = new SlotController(this, 'header')\n  private headerEndSlot = new SlotController(this, 'header-end')\n  private footerSlot = new SlotController(this, 'footer')\n\n  /**\n   * Controls the padding of the card component. When set to “none”,\n   * the header and footer slots will still have padding.\n   */\n  @property({ reflect: true }) padding: 'm' | 'l' | 'none' = 'm'\n\n  /**\n   * When set, adds a divider border above the footer slot.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'footer-divider' }) footerDivider = false\n\n  render() {\n    return html`\n      <div class=\"n-card\">\n        <div class=\"header\" ?hidden=${this.headerSlot.isEmpty && this.headerEndSlot.isEmpty}>\n          <slot name=${this.headerSlot.slotName}></slot>\n          <slot name=${this.headerEndSlot.slotName}></slot>\n        </div>\n        <slot></slot>\n        <slot name=${this.footerSlot.slotName} ?hidden=${this.footerSlot.isEmpty}></slot>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-card': Card\n  }\n}\n"],"names":["Card","LitElement","constructor","this","headerSlot","SlotController","headerEndSlot","footerSlot","padding","footerDivider","render","html","isEmpty","slotName","styles","componentStyle","style","__decorate","property","reflect","prototype","type","Boolean","attribute","customElement"],"mappings":"o9FAgCe,IAAMA,EAAN,cAAmBC,EAAnB,WAAAC,uBAGLC,KAAUC,WAAG,IAAIC,EAAeF,KAAM,UACtCA,KAAaG,cAAG,IAAID,EAAeF,KAAM,cACzCA,KAAUI,WAAG,IAAIF,EAAeF,KAAM,UAMjBA,KAAOK,QAAuB,IAKcL,KAAaM,eAAG,CAc1F,CAZC,MAAAC,GACE,OAAOC,CAAI,oDAEuBR,KAAKC,WAAWQ,SAAWT,KAAKG,cAAcM,wBAC7DT,KAAKC,WAAWS,gCAChBV,KAAKG,cAAcO,mDAGrBV,KAAKI,WAAWM,sBAAoBV,KAAKI,WAAWK,wBAGtE,GA5BMZ,EAAAc,OAAS,CAACC,EAAgBC,GAUJC,EAAA,CAA5BC,EAAS,CAAEC,SAAS,KAAyCnB,EAAAoB,UAAA,eAAA,GAKWH,EAAA,CAAxEC,EAAS,CAAEG,KAAMC,QAASH,SAAS,EAAMI,UAAW,oBAAyCvB,EAAAoB,UAAA,qBAAA,GAhB3EpB,EAAIiB,EAAA,CADxBO,EAAc,cACMxB,SAAAA"}

package/lib/Checkbox.js

@@ -1,2 +1,2 @@
-import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{c as n}from"./interface-checked-small-BQmkNgCI.js";import{css as i,html as o,nothing as r,LitElement as t}from"lit";import{property as c,customElement as s}from"lit/decorators.js";import{ifDefined as a}from"lit/directives/if-defined.js";import{ref as l}from"lit/directives/ref.js";import{F as d}from"./FocusableMixin-BlQLNPdJ.js";import{F as h}from"./FormAssociatedMixin-B4Qj-CQN.js";import{I as p}from"./InputMixin-LetXsCyv.js";import{S as m}from"./SizeMixin-CU9cLbLC.js";import{s as v}from"./Component-DSU3Qp0O.js";import{s as b}from"./FormField-BFaVzUjk.js";import u from"./Icon.js";import"./FormDataController-OUt5L5uC.js";import"./SlotController-Z6eG7LSZ.js";import"./EventController-BBOmvfLa.js";import"./events-Bv6wNHwJ.js";import"./VisuallyHidden.js";import"lit/directives/unsafe-html.js";import"./observe-D0n0zOfU.js";import"./cond-CI1KbneT.js";import"./IconManager.js";var x=Object.freeze({__proto__:null,default:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m20 8.49976v3.00004h-20v-3.00004z" fill="currentColor"/></svg>',tags:"nordicon interface remove small delete erase minimize line minus sign",title:"interface-remove-small"});const k=i`:host{--_n-checkbox-size:calc(var(--n-space-m) * 1.25);--_n-checkbox-accent-color:var(--n-color-accent);--_n-checkbox-border-color:var(--n-color-border-hover);--_n-checkbox-icon-size:var(--n-size-icon-s);display:inline-block}.n-flex{display:flex}.n-expand{flex:1}.n-input-container{position:relative}input{appearance:none;background:var(--n-color-surface);border:1px solid var(--_n-checkbox-border-color);border-radius:var(--n-border-radius-s);display:block;inline-size:var(--_n-checkbox-size);block-size:var(--_n-checkbox-size);cursor:pointer}input:checked,input:indeterminate{--_n-checkbox-border-color:var(--n-color-accent);background:var(--_n-checkbox-accent-color)}input[aria-invalid]{--_n-checkbox-accent-color:var(--n-color-status-danger);--_n-checkbox-border-color:var(--_n-checkbox-accent-color)}input:focus-visible{outline:0!important}input:focus{outline:0!important;box-shadow:0 0 0 1px var(--n-color-surface),0 0 0 3px var(--n-color-accent)}input:active{opacity:.8}:host([disabled]) label{color:var(--n-color-text-weaker);cursor:default}:host([disabled]) input{background:var(--_n-checkbox-accent-color);cursor:default;opacity:1}:host([disabled]) input:not(:is(:checked, :indeterminate)){--_n-checkbox-accent-color:var(--n-color-active);--_n-checkbox-border-color:var(--n-color-border-neutral)}:host([disabled]) input:is(:checked, :indeterminate){opacity:.3}nord-icon{--_n-icon-size:var(--_n-checkbox-icon-size);display:none;position:absolute;color:var(--n-color-text-on-accent);inset:var(--n-space-xs);z-index:var(--n-index-default);pointer-events:none}input:checked~.icon-checked,input:indeterminate~.icon-indeterminate{display:block}.n-label-container{margin-block-end:0}label{user-select:none;font-weight:var(--n-font-weight)!important;line-height:var(--n-line-height-form);padding-inline-start:var(--n-space-s);cursor:pointer}.n-hint{padding-inline-start:var(--n-space-s)}.n-error{margin-block-start:var(--n-space-xs);padding-inline-start:var(--n-space-s)}:host([hint-below]) :is(.n-hint, .n-error){padding-inline-start:0}:host([size='s']){--_n-checkbox-size:var(--n-space-m);--_n-checkbox-icon-size:var(--n-size-icon-xs)}:host([size='s']) nord-icon{inset:calc(var(--n-space-s)/ 2.6)}:host([size='s']:not([hide-label])) .n-input-container{margin:calc(var(--n-space-s)/ 2.6) 0}:host([size='l']){--_n-checkbox-size:var(--n-space-l);--_n-checkbox-icon-size:var(--n-size-icon-m)}:host([size='l']:not([hide-label])) .n-label-container{margin:2px 0 0}`;u.registerIcon(n),u.registerIcon(x);let f=class extends(m(h(p(d(t))))){constructor(){super(...arguments),this.indeterminate=!1,this.checked=!1}get formValue(){return this.checked?this.value||"on":void 0}render(){return o`<div class="n-flex"><div class="n-input-container"><input ${l(this.focusableRef)} class="n-input" id="${this.inputId}" type="checkbox" name="${a(this.name)}" .value="${this.value}" .checked="${this.checked}" .indeterminate="${this.indeterminate}" ?disabled="${this.disabled}" ?required="${this.required}" aria-describedby="${a(this.getDescribedBy())}" aria-invalid="${a(this.getInvalid())}" @change="${this.handleChange}"><nord-icon class="icon-checked" name="interface-checked-small"></nord-icon><nord-icon class="icon-indeterminate" name="interface-remove-small"></nord-icon></div><div class="n-expand">${this.renderLabel()} ${this.isHintBelow?r:this.renderError()}</div></div>${this.isHintBelow?this.renderError():r} ${this.isHintBelow?this.renderHint():r}`}handleChange(e){const n=e.target;this.checked=n.checked,super.handleChange(e)}};f.styles=[v,b,k],e([c({reflect:!0,type:Boolean})],f.prototype,"indeterminate",void 0),e([c({reflect:!0,type:Boolean})],f.prototype,"checked",void 0),f=e([s("nord-checkbox")],f);var g=f;export{g as default};
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{c as o}from"./interface-checked-small-BQmkNgCI.js";import{r as i}from"./interface-remove-small-DUaWSs90.js";import{css as n,html as r,nothing as t,LitElement as c}from"lit";import{property as s,customElement as a}from"lit/decorators.js";import{ifDefined as l}from"lit/directives/if-defined.js";import{ref as d}from"lit/directives/ref.js";import{F as h}from"./FocusableMixin-BlQLNPdJ.js";import{F as p}from"./FormAssociatedMixin-D9aPREgv.js";import{I as m}from"./InputMixin-LetXsCyv.js";import{S as b}from"./SizeMixin-CU9cLbLC.js";import{s as v}from"./Component-BJ5O5n8k.js";import{s as u}from"./FormField-CMgEFZCK.js";import x from"./Icon.js";import"./FormDataController-OUt5L5uC.js";import"./events-Bv6wNHwJ.js";import"./FieldControlMixin-BXNZJXu9.js";import"./context-consumer-BJVUulGf.js";import"./context-request-event-CCRlXoeR.js";import"./field-context.js";import"./create-context-CJ69ntlY.js";import"./SlotController-Z6eG7LSZ.js";import"./EventController-BBOmvfLa.js";import"./light-dom-styles-DXsbiKU9.js";import"./VisuallyHidden.js";import"lit/directives/unsafe-html.js";import"./observe-D0n0zOfU.js";import"./cond-CI1KbneT.js";import"./IconManager.js";const f=n`:host{--_n-checkbox-size:calc(var(--n-space-m)*1.25);--_n-checkbox-accent-color:var(--n-color-accent);--_n-checkbox-border-color:var(--n-color-border-hover);--_n-checkbox-icon-size:var(--n-size-icon-s);display:inline-block}.n-flex{display:flex}.n-expand{flex:1}.n-input-container{position:relative}input{appearance:none;background:var(--n-color-surface);block-size:var(--_n-checkbox-size);border:1px solid var(--_n-checkbox-border-color);border-radius:var(--n-border-radius-s);cursor:pointer;display:block;inline-size:var(--_n-checkbox-size)}input:checked,input:indeterminate{--_n-checkbox-border-color:var(--n-color-accent);background:var(--_n-checkbox-accent-color)}input[aria-invalid]{--_n-checkbox-accent-color:var(--n-color-status-danger);--_n-checkbox-border-color:var(--_n-checkbox-accent-color)}input:focus,input:focus-visible{outline:none!important}input:focus{box-shadow:0 0 0 1px var(--n-color-surface),0 0 0 3px var(--n-color-accent)}input:active{opacity:.8}:host([disabled]) label{color:var(--n-color-text-weaker);cursor:default}:host([disabled]) input{background:var(--_n-checkbox-accent-color);cursor:default;opacity:1}:host([disabled]) input:not(:is(:checked,:indeterminate)){--_n-checkbox-accent-color:var(--n-color-active);--_n-checkbox-border-color:var(--n-color-border-neutral)}:host([disabled]) input:is(:checked,:indeterminate){opacity:.3}nord-icon{--_n-icon-size:var(--_n-checkbox-icon-size);color:var(--n-color-text-on-accent);display:none;inset:var(--n-space-xs);pointer-events:none;position:absolute;z-index:var(--n-index-default)}input:checked~.icon-checked,input:indeterminate~.icon-indeterminate{display:block}.n-label-container{margin-block-end:0}label{cursor:pointer;font-weight:var(--n-font-weight)!important;line-height:var(--n-line-height-form);user-select:none}.n-error,.n-hint,label{padding-inline-start:var(--n-space-s)}.n-error{margin-block-start:var(--n-space-xs)}:host([hint-below]) :is(.n-hint,.n-error){padding-inline-start:0}:host([size=s]){--_n-checkbox-size:var(--n-space-m);--_n-checkbox-icon-size:var(--n-size-icon-xs)}:host([size=s]) nord-icon{inset:calc(var(--n-space-s)/2.6)}:host([size=s]:not([hide-label])) .n-input-container{margin:calc(var(--n-space-s)/2.6) 0}:host([size=l]){--_n-checkbox-size:var(--n-space-l);--_n-checkbox-icon-size:var(--n-size-icon-m)}:host([size=l]:not([hide-label])) .n-label-container{margin:2px 0 0}`;x.registerIcon(o),x.registerIcon(i);let k=class extends(b(p(m(h(c))))){constructor(){super(...arguments),this.indeterminate=!1,this.checked=!1}get formValue(){return this.checked?this.value||"on":void 0}render(){return r`<div class="n-flex"><div class="n-input-container"><input ${d(this.focusableRef)} class="n-input" id="${this.inputId}" type="checkbox" name="${l(this.name)}" .value="${this.value}" .checked="${this.checked}" .indeterminate="${this.indeterminate}" ?disabled="${this.effectiveDisabled}" ?required="${this.required}" aria-label="${l(this.controlAriaLabel)}" aria-describedby="${l(this.controlAriaDescribedby)}" aria-invalid="${l(this.controlAriaInvalid)}" @change="${this.handleChange}"><nord-icon class="icon-checked" name="interface-checked-small"></nord-icon><nord-icon class="icon-indeterminate" name="interface-remove-small"></nord-icon></div><div class="n-expand">${this.renderLabel()} ${this.isHintBelow?t:this.renderError()}</div></div>${this.isHintBelow?this.renderError():t} ${this.isHintBelow?this.renderHint():t}`}handleChange(e){const o=e.target;this.checked=o.checked,super.handleChange(e)}};k.styles=[v,u,f],e([s({reflect:!0,type:Boolean})],k.prototype,"indeterminate",void 0),e([s({reflect:!0,type:Boolean})],k.prototype,"checked",void 0),k=e([a("nord-checkbox")],k);var j=k;export{j as default};
 //# sourceMappingURL=Checkbox.js.map

package/lib/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","sources":["../../icons/lib/assets/interface-remove-small.js","../src/checkbox/Checkbox.ts"],"sourcesContent":["export default '<svg viewBox=\"0 0 20 20\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"m20 8.49976v3.00004h-20v-3.00004z\" fill=\"currentColor\"/></svg>';\nexport const title = \"interface-remove-small\";\nexport const tags =\n  \"nordicon interface remove small delete erase minimize line minus sign\";\n","import * as checkedIcon from '@nordhealth/icons/lib/assets/interface-checked-small.js'\nimport * as indeterminateIcon from '@nordhealth/icons/lib/assets/interface-remove-small.js'\nimport { html, LitElement, 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'\n\nimport { FocusableMixin } from '../common/mixins/FocusableMixin.js'\nimport { FormAssociatedMixin } from '../common/mixins/FormAssociatedMixin.js'\nimport { InputMixin } from '../common/mixins/InputMixin.js'\nimport { SizeMixin } from '../common/mixins/SizeMixin.js'\nimport componentStyle from '../common/styles/Component.css'\n\nimport formFieldStyle from '../common/styles/FormField.css'\nimport Icon from '../icon/Icon.js'\nimport style from './Checkbox.css'\n\nIcon.registerIcon(checkedIcon)\nIcon.registerIcon(indeterminateIcon)\n\n/**\n * Checkboxes allow user to choose one or more options from a limited set of options.\n * If you have more than 10 options, please use Select component instead.\n *\n * @status ready\n * @category form\n * @slot label - Use when a label requires more than plain text.\n * @slot hint - Optional slot that holds hint text for the input.\n * @slot error - Optional slot that holds error text for the input.\n *\n * @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-checkbox')\nexport default class Checkbox extends SizeMixin(FormAssociatedMixin(InputMixin(FocusableMixin(LitElement)))) {\n  static styles = [componentStyle, formFieldStyle, style]\n\n  protected override get formValue() {\n    return this.checked ? this.value || 'on' : undefined\n  }\n\n  /**\n   * Controls whether the checkbox is in an indeterminate state.\n   */\n  @property({ reflect: true, type: Boolean }) indeterminate = false\n\n  /**\n   * Controls whether the checkbox is checked or not.\n   */\n  @property({ reflect: true, type: Boolean }) checked: boolean = false\n\n  render() {\n    return html`\n      <div class=\"n-flex\">\n        <div class=\"n-input-container\">\n          <input\n            ${ref(this.focusableRef)}\n            class=\"n-input\"\n            id=${this.inputId}\n            type=\"checkbox\"\n            name=${ifDefined(this.name)}\n            .value=${this.value}\n            .checked=${this.checked}\n            .indeterminate=${this.indeterminate}\n            ?disabled=${this.disabled}\n            ?required=${this.required}\n            aria-describedby=${ifDefined(this.getDescribedBy())}\n            aria-invalid=${ifDefined(this.getInvalid())}\n            @change=${this.handleChange}\n          />\n          <nord-icon class=\"icon-checked\" name=\"interface-checked-small\"></nord-icon>\n          <nord-icon class=\"icon-indeterminate\" name=\"interface-remove-small\"></nord-icon>\n        </div>\n        <div class=\"n-expand\">${this.renderLabel()} ${this.isHintBelow ? nothing : this.renderError()}</div>\n      </div>\n      ${this.isHintBelow ? this.renderError() : nothing}\n      ${this.isHintBelow ? this.renderHint() : nothing}\n    `\n  }\n\n  protected handleChange(e: Event): void {\n    const target = e.target as HTMLInputElement\n    this.checked = target.checked\n    super.handleChange(e)\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-checkbox': Checkbox\n  }\n}\n"],"names":["Icon","registerIcon","checkedIcon","indeterminateIcon","Checkbox","SizeMixin","FormAssociatedMixin","InputMixin","FocusableMixin","LitElement","constructor","this","indeterminate","checked","formValue","value","undefined","render","html","ref","focusableRef","inputId","ifDefined","name","disabled","required","getDescribedBy","getInvalid","handleChange","renderLabel","isHintBelow","nothing","renderError","renderHint","e","target","super","styles","componentStyle","formFieldStyle","style","__decorate","property","reflect","type","Boolean","prototype","customElement"],"mappings":"88BAAe,2IAGb,8EAFmB,q8ECgBrBA,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAeH,IAAMC,EAAN,cAAuBC,EAAUC,EAAoBC,EAAWC,EAAeC,OAA/E,WAAAC,uBAU+BC,KAAaC,eAAG,EAKhBD,KAAOE,SAAY,CAoChE,CAhDC,aAAuBC,GACrB,OAAOH,KAAKE,QAAUF,KAAKI,OAAS,UAAOC,CAC5C,CAYD,MAAAC,GACE,OAAOC,CAAI,6DAIDC,EAAIR,KAAKS,qCAENT,KAAKU,kCAEHC,EAAUX,KAAKY,kBACbZ,KAAKI,oBACHJ,KAAKE,4BACCF,KAAKC,6BACVD,KAAKa,wBACLb,KAAKc,+BACEH,EAAUX,KAAKe,oCACnBJ,EAAUX,KAAKgB,2BACpBhB,KAAKiB,wMAKKjB,KAAKkB,iBAAiBlB,KAAKmB,YAAcC,EAAUpB,KAAKqB,4BAEhFrB,KAAKmB,YAAcnB,KAAKqB,cAAgBD,KACxCpB,KAAKmB,YAAcnB,KAAKsB,aAAeF,GAE5C,CAES,YAAAH,CAAaM,GACrB,MAAMC,EAASD,EAAEC,OACjBxB,KAAKE,QAAUsB,EAAOtB,QACtBuB,MAAMR,aAAaM,EACpB,GAjDM9B,EAAMiC,OAAG,CAACC,EAAgBC,EAAgBC,GASLC,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAgCzC,EAAA0C,UAAA,qBAAA,GAKrBL,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAmCzC,EAAA0C,UAAA,eAAA,GAfjD1C,EAAQqC,EAAA,CAD5BM,EAAc,kBACM3C,SAAAA"}
+{"version":3,"file":"Checkbox.js","sources":["../src/checkbox/Checkbox.ts"],"sourcesContent":["import * as checkedIcon from '@nordhealth/icons/lib/assets/interface-checked-small.js'\nimport * as indeterminateIcon from '@nordhealth/icons/lib/assets/interface-remove-small.js'\nimport { html, LitElement, 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'\n\nimport { FocusableMixin } from '../common/mixins/FocusableMixin.js'\nimport { FormAssociatedMixin } from '../common/mixins/FormAssociatedMixin.js'\nimport { InputMixin } from '../common/mixins/InputMixin.js'\nimport { SizeMixin } from '../common/mixins/SizeMixin.js'\nimport componentStyle from '../common/styles/Component.css'\n\nimport formFieldStyle from '../common/styles/FormField.css'\nimport Icon from '../icon/Icon.js'\nimport style from './Checkbox.css'\n\nIcon.registerIcon(checkedIcon)\nIcon.registerIcon(indeterminateIcon)\n\n/**\n * Checkboxes allow user to choose one or more options from a limited set of options.\n * If you have more than 10 options, please use Select component instead.\n *\n * @status ready\n * @category form\n * @slot label - Use when a label requires more than plain text.\n * @slot hint - Optional slot that holds hint text for the input.\n * @slot error - Optional slot that holds error text for the input.\n *\n * @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-checkbox')\nexport default class Checkbox extends SizeMixin(FormAssociatedMixin(InputMixin(FocusableMixin(LitElement)))) {\n  static styles = [componentStyle, formFieldStyle, style]\n\n  protected override get formValue() {\n    return this.checked ? this.value || 'on' : undefined\n  }\n\n  /**\n   * Controls whether the checkbox is in an indeterminate state.\n   */\n  @property({ reflect: true, type: Boolean }) indeterminate = false\n\n  /**\n   * Controls whether the checkbox is checked or not.\n   */\n  @property({ reflect: true, type: Boolean }) checked: boolean = false\n\n  render() {\n    return html`\n      <div class=\"n-flex\">\n        <div class=\"n-input-container\">\n          <input\n            ${ref(this.focusableRef)}\n            class=\"n-input\"\n            id=${this.inputId}\n            type=\"checkbox\"\n            name=${ifDefined(this.name)}\n            .value=${this.value}\n            .checked=${this.checked}\n            .indeterminate=${this.indeterminate}\n            ?disabled=${this.effectiveDisabled}\n            ?required=${this.required}\n            aria-label=${ifDefined(this.controlAriaLabel)}\n            aria-describedby=${ifDefined(this.controlAriaDescribedby)}\n            aria-invalid=${ifDefined(this.controlAriaInvalid)}\n            @change=${this.handleChange}\n          />\n          <nord-icon class=\"icon-checked\" name=\"interface-checked-small\"></nord-icon>\n          <nord-icon class=\"icon-indeterminate\" name=\"interface-remove-small\"></nord-icon>\n        </div>\n        <div class=\"n-expand\">${this.renderLabel()} ${this.isHintBelow ? nothing : this.renderError()}</div>\n      </div>\n      ${this.isHintBelow ? this.renderError() : nothing}\n      ${this.isHintBelow ? this.renderHint() : nothing}\n    `\n  }\n\n  protected handleChange(e: Event): void {\n    const target = e.target as HTMLInputElement\n    this.checked = target.checked\n    super.handleChange(e)\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-checkbox': Checkbox\n  }\n}\n"],"names":["Icon","registerIcon","checkedIcon","indeterminateIcon","Checkbox","SizeMixin","FormAssociatedMixin","InputMixin","FocusableMixin","LitElement","constructor","this","indeterminate","checked","formValue","value","undefined","render","html","ref","focusableRef","inputId","ifDefined","name","effectiveDisabled","required","controlAriaLabel","controlAriaDescribedby","controlAriaInvalid","handleChange","renderLabel","isHintBelow","nothing","renderError","renderHint","e","target","super","styles","componentStyle","formFieldStyle","style","__decorate","property","reflect","type","Boolean","prototype","customElement"],"mappings":"ohHAiBAA,EAAKC,aAAaC,GAClBF,EAAKC,aAAaE,GAeH,IAAMC,EAAN,cAAuBC,EAAUC,EAAoBC,EAAWC,EAAeC,OAA/E,WAAAC,uBAU+BC,KAAaC,eAAG,EAKhBD,KAAOE,SAAY,CAqChE,CAjDC,aAAuBC,GACrB,OAAOH,KAAKE,QAAUF,KAAKI,OAAS,UAAOC,CAC5C,CAYD,MAAAC,GACE,OAAOC,CAAI,6DAIDC,EAAIR,KAAKS,qCAENT,KAAKU,kCAEHC,EAAUX,KAAKY,kBACbZ,KAAKI,oBACHJ,KAAKE,4BACCF,KAAKC,6BACVD,KAAKa,iCACLb,KAAKc,yBACJH,EAAUX,KAAKe,wCACTJ,EAAUX,KAAKgB,0CACnBL,EAAUX,KAAKiB,iCACpBjB,KAAKkB,wMAKKlB,KAAKmB,iBAAiBnB,KAAKoB,YAAcC,EAAUrB,KAAKsB,4BAEhFtB,KAAKoB,YAAcpB,KAAKsB,cAAgBD,KACxCrB,KAAKoB,YAAcpB,KAAKuB,aAAeF,GAE5C,CAES,YAAAH,CAAaM,GACrB,MAAMC,EAASD,EAAEC,OACjBzB,KAAKE,QAAUuB,EAAOvB,QACtBwB,MAAMR,aAAaM,EACpB,GAlDM/B,EAAMkC,OAAG,CAACC,EAAgBC,EAAgBC,GASLC,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAgC1C,EAAA2C,UAAA,qBAAA,GAKrBL,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAmC1C,EAAA2C,UAAA,eAAA,GAfjD3C,EAAQsC,EAAA,CAD5BM,EAAc,kBACM5C,SAAAA"}

package/lib/CollapseController-BtKNFNyJ.js

@@ -0,0 +1,2 @@
+import{isServer as t}from"lit";import{S as s}from"./StateAttributesController-BIh96sXZ.js";import{t as e}from"./events-Bv6wNHwJ.js";function i(){return!t&&window.matchMedia("(prefers-reduced-motion: reduce)").matches}class n{constructor(t,s){this.host=t,this.options=s,this._status="closed",this.rafId=0,this.token=0,t.addController(this)}get status(){return this._status}get transitioning(){return"initial"===this._status||"ending"===this._status}get state(){return{open:"open"===this._status||"initial"===this._status,closed:"closed"===this._status,"starting-style":"initial"===this._status,"ending-style":"ending"===this._status}}hostUpdated(){const t=this.options.open();if(t===this.previousOpen)return;const s=void 0===this.previousOpen;this.previousOpen=t,s?this._status=t?"open":"closed":t?this.enter():this.leave()}hostDisconnected(){this.cancelRaf(),this.token++}enter(){var s,e;if(this.cancelRaf(),this.token++,i()||t)return this._status="open",null===(e=(s=this.options).onOpened)||void 0===e||e.call(s),void this.host.requestUpdate();this._status="initial",this.host.requestUpdate(),this.rafId=requestAnimationFrame((()=>{var t,s;this.rafId=0,this._status="open",null===(s=(t=this.options).onOpened)||void 0===s||s.call(t),this.host.requestUpdate()}))}leave(){var s,n,o,r,a;this.cancelRaf();const h=++this.token;if(i()||t)return this._status="closed",null===(n=(s=this.options).onClosed)||void 0===n||n.call(s),void this.host.requestUpdate();this._status="ending",this.host.requestUpdate();const l=null!==(a=null===(r=(o=this.options).target)||void 0===r?void 0:r.call(o))&&void 0!==a?a:this.host;e(l).then((()=>{var t,s;h===this.token&&(this._status="closed",null===(s=(t=this.options).onClosed)||void 0===s||s.call(t),this.host.requestUpdate())}))}cancelRaf(){this.rafId&&(cancelAnimationFrame(this.rafId),this.rafId=0)}}class o{constructor(t,e){this.host=t,this.options=e,this._animating=!1,this.handleTransitionEnd=t=>{if(t.target!==this.target||"block-size"!==t.propertyName)return;this._animating=!1;const s=this.target;s.style.removeProperty("block-size"),s.style.removeProperty(this.options.heightVar),this.options.open()||(s.hidden=!0)},this.handleTransitionCancel=t=>{t.target===this.target&&"block-size"===t.propertyName&&(this._animating=!1)},this.transitionStatus=new n(t,{open:e.open,target:e.target}),this.stateAttributes=new s(t,(()=>this.transitionStatus.state)),t.addController(this)}get animating(){return this._animating}get status(){return this.transitionStatus.status}get target(){var t,s,e;return null!==(e=null===(s=(t=this.options).target)||void 0===s?void 0:s.call(t))&&void 0!==e?e:this.host}hostConnected(){const t=this.target;t.addEventListener("transitionend",this.handleTransitionEnd),t.addEventListener("transitioncancel",this.handleTransitionCancel)}hostDisconnected(){const t=this.target;t.removeEventListener("transitionend",this.handleTransitionEnd),t.removeEventListener("transitioncancel",this.handleTransitionCancel),t.style.removeProperty("block-size"),t.style.removeProperty(this.options.heightVar),this._animating=!1}hostUpdated(){const t=this.options.open();if(t===this.previousOpen)return;const s=void 0===this.previousOpen;this.previousOpen=t,s||(t?this.animateOpen():this.animateClose())}currentHeight(){const t=this.target;return this._animating?t.getBoundingClientRect().height:t.scrollHeight}animateOpen(){const s=this.target;if(s.hidden=!1,i()||t)return this._animating=!1,s.style.removeProperty(this.options.heightVar),void s.style.removeProperty("block-size");const e=this._animating?s.getBoundingClientRect().height:0;s.style.setProperty("block-size",`${e}px`),s.offsetHeight,s.style.removeProperty("block-size");const n=s.scrollHeight;s.style.setProperty("block-size",`${e}px`),s.offsetHeight,s.style.setProperty(this.options.heightVar,`${n}px`),this._animating=!0,s.style.setProperty("block-size",`${n}px`)}animateClose(){const s=this.target;if(i()||t)return this._animating=!1,s.style.removeProperty(this.options.heightVar),s.style.removeProperty("block-size"),void(s.hidden=!0);const e=this.currentHeight();s.style.setProperty(this.options.heightVar,`${e}px`),s.style.setProperty("block-size",`${e}px`),s.offsetHeight,this._animating=!0,s.style.setProperty("block-size","0px")}}export{o as C};
+//# sourceMappingURL=CollapseController-BtKNFNyJ.js.map

package/lib/CollapseController-BtKNFNyJ.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapseController-BtKNFNyJ.js","sources":["../src/common/prefers-reduced-motion.ts","../src/common/controllers/TransitionStatusController.ts","../src/common/controllers/CollapseController.ts"],"sourcesContent":["import { isServer } from 'lit'\n\n/**\n * Whether the user has requested reduced motion via the\n * `prefers-reduced-motion: reduce` media query. Always `false` on the server,\n * where `window` is unavailable. Use it to skip JS-driven animations (CSS\n * `transition` declarations should also guard themselves with the same query).\n */\nexport function prefersReducedMotion(): boolean {\n  return !isServer && window.matchMedia('(prefers-reduced-motion: reduce)').matches\n}\n","import type { ReactiveController, ReactiveControllerHost } from 'lit'\nimport { isServer } from 'lit'\n\nimport { transition } from '../events.js'\nimport { prefersReducedMotion } from '../prefers-reduced-motion.js'\n\n/**\n * The lifecycle of an enter/leave transition.\n * - `closed` / `open` — settled states.\n * - `initial` — the first frame of an enter transition (the \"from\" styles are\n *   applied; removing them on the next frame commits the transition).\n * - `ending` — a leave transition is running.\n */\nexport type TransitionStatus = 'closed' | 'initial' | 'open' | 'ending'\n\nexport interface TransitionStatusOptions {\n  /** Reads the host's logical open state; diffed after every host update. */\n  open: () => boolean\n  /** The element carrying the CSS transition. Defaults to the host. */\n  target?: () => HTMLElement\n  /** Called once a completed enter transition settles to `open`. */\n  onOpened?: () => void\n  /** Called once a completed leave transition settles to `closed`. */\n  onClosed?: () => void\n}\n\n/**\n * Tracks the enter/leave transition status of a host, mirroring Base UI's\n * `useTransitionStatus`. It does not animate or touch the DOM itself — it\n * exposes a `status` and a `state` object (intended to be reflected to\n * `data-open` / `data-closed` / `data-starting-style` / `data-ending-style` via\n * a {@link StateAttributesController}). Reduced motion / SSR skip the\n * intermediate frames and settle synchronously.\n */\nexport class TransitionStatusController implements ReactiveController {\n  private _status: TransitionStatus = 'closed'\n  private previousOpen?: boolean\n  private rafId = 0\n  /** Bumped on every enter/leave so a stale pending settle is ignored. */\n  private token = 0\n\n  constructor(\n    private host: ReactiveControllerHost & HTMLElement,\n    private options: TransitionStatusOptions,\n  ) {\n    host.addController(this)\n  }\n\n  /** The current transition status. */\n  get status(): TransitionStatus {\n    return this._status\n  }\n\n  /** Whether an enter or leave transition is currently running. */\n  get transitioning(): boolean {\n    return this._status === 'initial' || this._status === 'ending'\n  }\n\n  /** The state object to reflect as `data-*` style hooks. */\n  get state(): Record<string, boolean> {\n    return {\n      'open': this._status === 'open' || this._status === 'initial',\n      'closed': this._status === 'closed',\n      'starting-style': this._status === 'initial',\n      'ending-style': this._status === 'ending',\n    }\n  }\n\n  hostUpdated() {\n    const open = this.options.open()\n    if (open === this.previousOpen) {\n      return\n    }\n    const first = this.previousOpen === undefined\n    this.previousOpen = open\n\n    // The first observed value is a settled state — no transition, no events.\n    if (first) {\n      this._status = open ? 'open' : 'closed'\n      return\n    }\n\n    if (open) {\n      this.enter()\n    }\n    else {\n      this.leave()\n    }\n  }\n\n  hostDisconnected() {\n    this.cancelRaf()\n    // Invalidate any pending settle so a late transitionend can't change state\n    // after disconnect.\n    this.token++\n  }\n\n  private enter() {\n    this.cancelRaf()\n    this.token++\n\n    if (prefersReducedMotion() || isServer) {\n      this._status = 'open'\n      this.options.onOpened?.()\n      this.host.requestUpdate()\n      return\n    }\n\n    // Apply the \"from\" frame (data-starting-style), then commit on the next\n    // frame so a CSS enter transition has a defined starting point.\n    this._status = 'initial'\n    this.host.requestUpdate()\n    this.rafId = requestAnimationFrame(() => {\n      this.rafId = 0\n      this._status = 'open'\n      this.options.onOpened?.()\n      this.host.requestUpdate()\n    })\n  }\n\n  private leave() {\n    this.cancelRaf()\n    const token = ++this.token\n\n    if (prefersReducedMotion() || isServer) {\n      this._status = 'closed'\n      this.options.onClosed?.()\n      this.host.requestUpdate()\n      return\n    }\n\n    this._status = 'ending'\n    this.host.requestUpdate()\n\n    const target = this.options.target?.() ?? this.host\n    void transition(target).then(() => {\n      // Ignore if re-opened (or disconnected) before the leave completed.\n      if (token !== this.token) {\n        return\n      }\n      this._status = 'closed'\n      this.options.onClosed?.()\n      this.host.requestUpdate()\n    })\n  }\n\n  private cancelRaf() {\n    if (this.rafId) {\n      cancelAnimationFrame(this.rafId)\n      this.rafId = 0\n    }\n  }\n}\n","import type { ReactiveController, ReactiveControllerHost } from 'lit'\nimport { isServer } from 'lit'\n\nimport { prefersReducedMotion } from '../prefers-reduced-motion.js'\nimport { StateAttributesController } from './StateAttributesController.js'\nimport { TransitionStatusController } from './TransitionStatusController.js'\n\nexport interface CollapseOptions {\n  /** Reads the host's open state; diffed after every host update. */\n  open: () => boolean\n  /**\n   * The CSS custom property set to the measured content height during the\n   * animation (e.g. `--n-accordion-panel-height`), for consumers to read.\n   */\n  heightVar: string\n  /** The element to animate. Defaults to the host. */\n  target?: () => HTMLElement\n}\n\n/**\n * Animates a host's `block-size` between `0` and its measured content height as\n * its `open` state toggles — the shared engine behind the accordion and\n * collapsible panels. It measures the live rendered height (so rapid re-toggles\n * continue smoothly rather than snapping), respects reduced motion, and cleans\n * up on disconnect.\n *\n * It owns a {@link TransitionStatusController} (+ a {@link StateAttributesController})\n * so the host also gains `data-open` / `data-closed` / `data-starting-style` /\n * `data-ending-style` state hooks, driven off the same `block-size` transition.\n */\nexport class CollapseController implements ReactiveController {\n  private _animating = false\n  private previousOpen?: boolean\n\n  /** Exposes the transition status (and reflects the state attributes). */\n  private transitionStatus: TransitionStatusController\n  private stateAttributes: StateAttributesController\n\n  constructor(\n    private host: ReactiveControllerHost & HTMLElement,\n    private options: CollapseOptions,\n  ) {\n    this.transitionStatus = new TransitionStatusController(host, {\n      open: options.open,\n      target: options.target,\n    })\n    this.stateAttributes = new StateAttributesController(host, () => this.transitionStatus.state)\n    host.addController(this)\n  }\n\n  /** Whether a `block-size` transition is currently running. */\n  get animating(): boolean {\n    return this._animating\n  }\n\n  get status() {\n    return this.transitionStatus.status\n  }\n\n  private get target(): HTMLElement {\n    return this.options.target?.() ?? this.host\n  }\n\n  hostConnected() {\n    const el = this.target\n    el.addEventListener('transitionend', this.handleTransitionEnd)\n    el.addEventListener('transitioncancel', this.handleTransitionCancel)\n  }\n\n  hostDisconnected() {\n    const el = this.target\n    el.removeEventListener('transitionend', this.handleTransitionEnd)\n    el.removeEventListener('transitioncancel', this.handleTransitionCancel)\n    // Clear any in-flight inline styles so a reconnect starts from a clean slate.\n    el.style.removeProperty('block-size')\n    el.style.removeProperty(this.options.heightVar)\n    this._animating = false\n  }\n\n  hostUpdated() {\n    const open = this.options.open()\n    if (open === this.previousOpen) {\n      return\n    }\n    const first = this.previousOpen === undefined\n    this.previousOpen = open\n\n    // The initial state is applied by the host (e.g. `hidden = !open`) without\n    // animation; only subsequent toggles animate.\n    if (first) {\n      return\n    }\n\n    if (open) {\n      this.animateOpen()\n    }\n    else {\n      this.animateClose()\n    }\n  }\n\n  /**\n   * Measure the height to animate from. While a transition is in flight the box\n   * is mid-collapse/expand, so `scrollHeight` is clipped — use the live rendered\n   * height instead so we never snap to a stale full/zero height.\n   */\n  private currentHeight(): number {\n    const el = this.target\n    return this._animating ? el.getBoundingClientRect().height : el.scrollHeight\n  }\n\n  private animateOpen() {\n    const el = this.target\n    el.hidden = false\n\n    if (prefersReducedMotion() || isServer) {\n      this._animating = false\n      el.style.removeProperty(this.options.heightVar)\n      el.style.removeProperty('block-size')\n      return\n    }\n\n    // Start from the collapsed height (0) for a fresh open; only when a previous\n    // transition is still running do we pin the partial rendered height so the\n    // open continues smoothly. (`el.hidden` was just cleared above, so reading\n    // scrollHeight/getBoundingClientRect here would report the full natural\n    // height and animate from full→full — i.e. not animate at all.)\n    const start = this._animating ? el.getBoundingClientRect().height : 0\n    el.style.setProperty('block-size', `${start}px`)\n    void el.offsetHeight\n\n    // Measure the natural target height with the fixed block-size removed, then\n    // restore the start so the transition has a defined point to animate from.\n    el.style.removeProperty('block-size')\n    const target = el.scrollHeight\n    el.style.setProperty('block-size', `${start}px`)\n    void el.offsetHeight\n\n    el.style.setProperty(this.options.heightVar, `${target}px`)\n    this._animating = true\n    el.style.setProperty('block-size', `${target}px`)\n  }\n\n  private animateClose() {\n    const el = this.target\n\n    if (prefersReducedMotion() || isServer) {\n      this._animating = false\n      el.style.removeProperty(this.options.heightVar)\n      el.style.removeProperty('block-size')\n      el.hidden = true\n      return\n    }\n\n    const height = this.currentHeight()\n    el.style.setProperty(this.options.heightVar, `${height}px`)\n    el.style.setProperty('block-size', `${height}px`)\n    void el.offsetHeight\n\n    this._animating = true\n    el.style.setProperty('block-size', '0px')\n  }\n\n  private handleTransitionEnd = (event: TransitionEvent) => {\n    // Only react to our own block-size transition, not bubbled child ones.\n    if (event.target !== this.target || event.propertyName !== 'block-size') {\n      return\n    }\n\n    this._animating = false\n    const el = this.target\n    el.style.removeProperty('block-size')\n    el.style.removeProperty(this.options.heightVar)\n\n    if (!this.options.open()) {\n      el.hidden = true\n    }\n  }\n\n  // On an interrupted transition (rapid re-toggle) the replacement animation has\n  // already been scheduled by the new open/close, so just clear the flag — do\n  // NOT reset styles, which would clobber the new transition's start height.\n  private handleTransitionCancel = (event: TransitionEvent) => {\n    if (event.target !== this.target || event.propertyName !== 'block-size') {\n      return\n    }\n    this._animating = false\n  }\n}\n"],"names":["prefersReducedMotion","isServer","window","matchMedia","matches","TransitionStatusController","constructor","host","options","this","_status","rafId","token","addController","status","transitioning","state","open","closed","hostUpdated","previousOpen","first","undefined","enter","leave","hostDisconnected","cancelRaf","_b","onOpened","requestUpdate","requestAnimationFrame","onClosed","target","_e","_d","call","_c","transition","then","cancelAnimationFrame","CollapseController","_animating","handleTransitionEnd","event","propertyName","el","style","removeProperty","heightVar","hidden","handleTransitionCancel","transitionStatus","stateAttributes","StateAttributesController","animating","_a","hostConnected","addEventListener","removeEventListener","animateOpen","animateClose","currentHeight","getBoundingClientRect","height","scrollHeight","start","setProperty","offsetHeight"],"mappings":"6IAQgBA,IACd,OAAQC,GAAYC,OAAOC,WAAW,oCAAoCC,OAC5E,OCwBaC,EAOX,WAAAC,CACUC,EACAC,GADAC,KAAIF,KAAJA,EACAE,KAAOD,QAAPA,EARFC,KAAOC,QAAqB,SAE5BD,KAAKE,MAAG,EAERF,KAAKG,MAAG,EAMdL,EAAKM,cAAcJ,KACpB,CAGD,UAAIK,GACF,OAAOL,KAAKC,OACb,CAGD,iBAAIK,GACF,MAAwB,YAAjBN,KAAKC,SAA0C,WAAjBD,KAAKC,OAC3C,CAGD,SAAIM,GACF,MAAO,CACLC,KAAyB,SAAjBR,KAAKC,SAAuC,YAAjBD,KAAKC,QACxCQ,OAA2B,WAAjBT,KAAKC,QACf,iBAAmC,YAAjBD,KAAKC,QACvB,eAAiC,WAAjBD,KAAKC,QAExB,CAED,WAAAS,GACE,MAAMF,EAAOR,KAAKD,QAAQS,OAC1B,GAAIA,IAASR,KAAKW,aAChB,OAEF,MAAMC,OAA8BC,IAAtBb,KAAKW,aACnBX,KAAKW,aAAeH,EAGhBI,EACFZ,KAAKC,QAAUO,EAAO,OAAS,SAI7BA,EACFR,KAAKc,QAGLd,KAAKe,OAER,CAED,gBAAAC,GACEhB,KAAKiB,YAGLjB,KAAKG,OACN,CAEO,KAAAW,WAIN,GAHAd,KAAKiB,YACLjB,KAAKG,QAEDZ,KAA0BC,EAI5B,OAHAQ,KAAKC,QAAU,eACfiB,KAAAlB,KAAKD,SAAQoB,sCACbnB,KAAKF,KAAKsB,gBAMZpB,KAAKC,QAAU,UACfD,KAAKF,KAAKsB,gBACVpB,KAAKE,MAAQmB,uBAAsB,aACjCrB,KAAKE,MAAQ,EACbF,KAAKC,QAAU,eACfiB,KAAAlB,KAAKD,SAAQoB,iCACbnB,KAAKF,KAAKsB,eAAe,GAE5B,CAEO,KAAAL,iBACNf,KAAKiB,YACL,MAAMd,IAAUH,KAAKG,MAErB,GAAIZ,KAA0BC,EAI5B,OAHAQ,KAAKC,QAAU,iBACfiB,KAAAlB,KAAKD,SAAQuB,sCACbtB,KAAKF,KAAKsB,gBAIZpB,KAAKC,QAAU,SACfD,KAAKF,KAAKsB,gBAEV,MAAMG,EAAgC,QAAvBC,EAAuB,QAAvBC,KAAAzB,KAAKD,SAAQwB,cAAU,IAAAE,OAAA,EAAAA,EAAAC,KAAAC,UAAA,IAAAH,EAAAA,EAAIxB,KAAKF,KAC1C8B,EAAWL,GAAQM,MAAK,aAEvB1B,IAAUH,KAAKG,QAGnBH,KAAKC,QAAU,iBACfiB,KAAAlB,KAAKD,SAAQuB,iCACbtB,KAAKF,KAAKsB,gBAAe,GAE5B,CAEO,SAAAH,GACFjB,KAAKE,QACP4B,qBAAqB9B,KAAKE,OAC1BF,KAAKE,MAAQ,EAEhB,QCzHU6B,EAQX,WAAAlC,CACUC,EACAC,GADAC,KAAIF,KAAJA,EACAE,KAAOD,QAAPA,EATFC,KAAUgC,YAAG,EAoIbhC,KAAAiC,oBAAuBC,IAE7B,GAAIA,EAAMX,SAAWvB,KAAKuB,QAAiC,eAAvBW,EAAMC,aACxC,OAGFnC,KAAKgC,YAAa,EAClB,MAAMI,EAAKpC,KAAKuB,OAChBa,EAAGC,MAAMC,eAAe,cACxBF,EAAGC,MAAMC,eAAetC,KAAKD,QAAQwC,WAEhCvC,KAAKD,QAAQS,SAChB4B,EAAGI,QAAS,EACb,EAMKxC,KAAAyC,uBAA0BP,IAC5BA,EAAMX,SAAWvB,KAAKuB,QAAiC,eAAvBW,EAAMC,eAG1CnC,KAAKgC,YAAa,EAAK,EAhJvBhC,KAAK0C,iBAAmB,IAAI9C,EAA2BE,EAAM,CAC3DU,KAAMT,EAAQS,KACde,OAAQxB,EAAQwB,SAElBvB,KAAK2C,gBAAkB,IAAIC,EAA0B9C,GAAM,IAAME,KAAK0C,iBAAiBnC,QACvFT,EAAKM,cAAcJ,KACpB,CAGD,aAAI6C,GACF,OAAO7C,KAAKgC,UACb,CAED,UAAI3B,GACF,OAAOL,KAAK0C,iBAAiBrC,MAC9B,CAED,UAAYkB,aACV,OAA8B,QAAvBI,EAAuB,QAAvBT,GAAA4B,EAAA9C,KAAKD,SAAQwB,cAAU,IAAAL,OAAA,EAAAA,EAAAQ,KAAAoB,UAAA,IAAAnB,EAAAA,EAAI3B,KAAKF,IACxC,CAED,aAAAiD,GACE,MAAMX,EAAKpC,KAAKuB,OAChBa,EAAGY,iBAAiB,gBAAiBhD,KAAKiC,qBAC1CG,EAAGY,iBAAiB,mBAAoBhD,KAAKyC,uBAC9C,CAED,gBAAAzB,GACE,MAAMoB,EAAKpC,KAAKuB,OAChBa,EAAGa,oBAAoB,gBAAiBjD,KAAKiC,qBAC7CG,EAAGa,oBAAoB,mBAAoBjD,KAAKyC,wBAEhDL,EAAGC,MAAMC,eAAe,cACxBF,EAAGC,MAAMC,eAAetC,KAAKD,QAAQwC,WACrCvC,KAAKgC,YAAa,CACnB,CAED,WAAAtB,GACE,MAAMF,EAAOR,KAAKD,QAAQS,OAC1B,GAAIA,IAASR,KAAKW,aAChB,OAEF,MAAMC,OAA8BC,IAAtBb,KAAKW,aACnBX,KAAKW,aAAeH,EAIhBI,IAIAJ,EACFR,KAAKkD,cAGLlD,KAAKmD,eAER,CAOO,aAAAC,GACN,MAAMhB,EAAKpC,KAAKuB,OAChB,OAAOvB,KAAKgC,WAAaI,EAAGiB,wBAAwBC,OAASlB,EAAGmB,YACjE,CAEO,WAAAL,GACN,MAAMd,EAAKpC,KAAKuB,OAGhB,GAFAa,EAAGI,QAAS,EAERjD,KAA0BC,EAI5B,OAHAQ,KAAKgC,YAAa,EAClBI,EAAGC,MAAMC,eAAetC,KAAKD,QAAQwC,gBACrCH,EAAGC,MAAMC,eAAe,cAS1B,MAAMkB,EAAQxD,KAAKgC,WAAaI,EAAGiB,wBAAwBC,OAAS,EACpElB,EAAGC,MAAMoB,YAAY,aAAc,GAAGD,OACjCpB,EAAGsB,aAIRtB,EAAGC,MAAMC,eAAe,cACxB,MAAMf,EAASa,EAAGmB,aAClBnB,EAAGC,MAAMoB,YAAY,aAAc,GAAGD,OACjCpB,EAAGsB,aAERtB,EAAGC,MAAMoB,YAAYzD,KAAKD,QAAQwC,UAAW,GAAGhB,OAChDvB,KAAKgC,YAAa,EAClBI,EAAGC,MAAMoB,YAAY,aAAc,GAAGlC,MACvC,CAEO,YAAA4B,GACN,MAAMf,EAAKpC,KAAKuB,OAEhB,GAAIhC,KAA0BC,EAK5B,OAJAQ,KAAKgC,YAAa,EAClBI,EAAGC,MAAMC,eAAetC,KAAKD,QAAQwC,WACrCH,EAAGC,MAAMC,eAAe,mBACxBF,EAAGI,QAAS,GAId,MAAMc,EAAStD,KAAKoD,gBACpBhB,EAAGC,MAAMoB,YAAYzD,KAAKD,QAAQwC,UAAW,GAAGe,OAChDlB,EAAGC,MAAMoB,YAAY,aAAc,GAAGH,OACjClB,EAAGsB,aAER1D,KAAKgC,YAAa,EAClBI,EAAGC,MAAMoB,YAAY,aAAc,MACpC"}

package/lib/Collapsible.js

@@ -0,0 +1,2 @@
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as t,isServer as o,LitElement as s}from"lit";import{property as i,customElement as l}from"lit/decorators.js";import{o as r}from"./observe-D0n0zOfU.js";import{N as n}from"./events-Bv6wNHwJ.js";import{i as a}from"./light-dom-styles-DXsbiKU9.js";import{D as p}from"./DraftComponentMixin-4qug5Rky.js";const d=t`nord-collapsible{display:block;font-family:var(--n-font-family);font-feature-settings:var(--n-font-features)}nord-collapsible,nord-collapsible *,nord-collapsible :after,nord-collapsible :before{box-sizing:border-box}`;let c=1;class b extends n{constructor(e){super("toggle"),Object.defineProperty(this,"open",{value:e,enumerable:!0,writable:!1})}}let h=class extends(p(s)){constructor(){super(...arguments),this.collapsibleId="nord-collapsible-"+c++,this.open=!1,this.disabled=!1}connectedCallback(){super.connectedCallback(),a(this,d),this.setup()}createRenderRoot(){return this}get trigger(){return this.querySelector("nord-collapsible-trigger")}get panel(){return this.querySelector("nord-collapsible-panel")}setup(){if(o)return;const{trigger:e,panel:t}=this;t&&(t.id||(t.id=`${this.collapsibleId}-panel`),t.open=this.open),e&&(e.id||(e.id=`${this.collapsibleId}-trigger`),e.open=this.open,e.disabled=this.disabled,t&&(e.setAttribute("aria-controls",t.id),t.setAttribute("aria-labelledby",e.id)))}handleOpenChange(e,t){this.syncState(),void 0!==e&&e!==t&&this.dispatchEvent(new b(t))}handleDisabledChange(){const{trigger:e}=this;e&&(e.disabled=this.disabled)}syncState(){const{trigger:e,panel:t}=this;e&&(e.open=this.open),t&&(t.open=this.open)}toggle(){this.disabled||(this.open=!this.open)}expand(){this.disabled||(this.open=!0)}collapse(){this.disabled||(this.open=!1)}};e([i({reflect:!0,type:Boolean})],h.prototype,"open",void 0),e([i({reflect:!0,type:Boolean})],h.prototype,"disabled",void 0),e([r("open")],h.prototype,"handleOpenChange",null),e([r("disabled")],h.prototype,"handleDisabledChange",null),h=e([l("nord-collapsible")],h);var g=h;export{b as CollapsibleToggleEvent,g as default};
+//# sourceMappingURL=Collapsible.js.map

package/lib/Collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Collapsible.js","sources":["../src/collapsible/Collapsible.ts"],"sourcesContent":["import type CollapsiblePanel from './CollapsiblePanel.js'\nimport type CollapsibleTrigger from './CollapsibleTrigger.js'\n\nimport { isServer, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { observe } from '../common/decorators/observe.js'\nimport { NordEvent } from '../common/events.js'\n\nimport { injectLightDomStyles } from '../common/light-dom-styles.js'\nimport { DraftComponentMixin } from '../common/mixins/DraftComponentMixin.js'\nimport style from './Collapsible.css'\n\nlet collapsibleCount = 1\n\n/**\n * Event dispatched when a collapsible is opened or closed, either by the user\n * activating its trigger or programmatically toggling the `open` property.\n */\nexport class CollapsibleToggleEvent extends NordEvent {\n  declare open: boolean\n\n  constructor(open: boolean) {\n    super('toggle')\n    Object.defineProperty(this, 'open', {\n      value: open,\n      enumerable: true,\n      writable: false,\n    })\n  }\n}\n\n/**\n * Collapsible is a disclosure that shows or hides a section of content. It wires\n * together a [Collapsible Trigger](/components/collapsible-trigger/) and a\n * [Collapsible Panel](/components/collapsible-panel/), animating the panel\n * height as it opens and closes.\n *\n * @status draft\n * @category structure\n * @lightDom true\n *\n * @slot - Default slot for the [Collapsible Trigger](/components/collapsible-trigger/), [Collapsible Panel](/components/collapsible-panel/) and any other content.\n *\n * @fires {CollapsibleToggleEvent} toggle - Dispatched when the collapsible is opened or closed. The event includes an `open` property reflecting the new state.\n */\n@customElement('nord-collapsible')\nexport default class Collapsible extends DraftComponentMixin(LitElement) {\n  private collapsibleId = `nord-collapsible-${collapsibleCount++}`\n\n  /**\n   * Whether the collapsible is open.\n   */\n  @property({ reflect: true, type: Boolean }) open = false\n\n  /**\n   * Whether the collapsible should ignore user interaction.\n   */\n  @property({ reflect: true, type: Boolean }) disabled = false\n\n  connectedCallback() {\n    super.connectedCallback()\n    injectLightDomStyles(this, style)\n    this.setup()\n  }\n\n  // Render in the light DOM so the trigger and panel are the element's own\n  // content and the injected stylesheet applies (no shadow boundary, like Table).\n  protected createRenderRoot() {\n    return this\n  }\n\n  private get trigger() {\n    return this.querySelector<CollapsibleTrigger>('nord-collapsible-trigger')\n  }\n\n  private get panel() {\n    return this.querySelector<CollapsiblePanel>('nord-collapsible-panel')\n  }\n\n  /**\n   * Wire up the ARIA relationship between the trigger and the panel and reflect\n   * the initial open state to both.\n   */\n  private setup() {\n    if (isServer) {\n      return\n    }\n\n    const { trigger, panel } = this\n\n    if (panel) {\n      panel.id ||= `${this.collapsibleId}-panel`\n      panel.open = this.open\n    }\n\n    if (trigger) {\n      trigger.id ||= `${this.collapsibleId}-trigger`\n      trigger.open = this.open\n      trigger.disabled = this.disabled\n      if (panel) {\n        trigger.setAttribute('aria-controls', panel.id)\n        panel.setAttribute('aria-labelledby', trigger.id)\n      }\n    }\n  }\n\n  @observe('open')\n  protected handleOpenChange(oldValue: boolean | undefined, newValue: boolean) {\n    this.syncState()\n\n    // Skip the initial assignment so we don't fire on first render.\n    if (oldValue !== undefined && oldValue !== newValue) {\n      this.dispatchEvent(new CollapsibleToggleEvent(newValue))\n    }\n  }\n\n  @observe('disabled')\n  protected handleDisabledChange() {\n    const { trigger } = this\n    if (trigger) {\n      trigger.disabled = this.disabled\n    }\n  }\n\n  /**\n   * Push the current open state down to the trigger and panel.\n   */\n  private syncState() {\n    const { trigger, panel } = this\n\n    if (trigger) {\n      trigger.open = this.open\n    }\n\n    if (panel) {\n      panel.open = this.open\n    }\n  }\n\n  /**\n   * Toggle the collapsible open or closed. Called by the trigger.\n   */\n  toggle() {\n    if (this.disabled) {\n      return\n    }\n\n    this.open = !this.open\n  }\n\n  /**\n   * Open the collapsible programmatically.\n   */\n  expand() {\n    if (!this.disabled) {\n      this.open = true\n    }\n  }\n\n  /**\n   * Close the collapsible programmatically.\n   */\n  collapse() {\n    if (!this.disabled) {\n      this.open = false\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-collapsible': Collapsible\n  }\n}\n"],"names":["collapsibleCount","CollapsibleToggleEvent","NordEvent","constructor","open","super","Object","defineProperty","this","value","enumerable","writable","Collapsible","DraftComponentMixin","LitElement","collapsibleId","disabled","connectedCallback","injectLightDomStyles","style","setup","createRenderRoot","trigger","querySelector","panel","isServer","id","setAttribute","handleOpenChange","oldValue","newValue","syncState","undefined","dispatchEvent","handleDisabledChange","toggle","expand","collapse","__decorate","property","reflect","type","Boolean","prototype","observe","customElement"],"mappings":"okBAYA,IAAIA,EAAmB,EAMjB,MAAOC,UAA+BC,EAG1C,WAAAC,CAAYC,GACVC,MAAM,UACNC,OAAOC,eAAeC,KAAM,OAAQ,CAClCC,MAAOL,EACPM,YAAY,EACZC,UAAU,GAEb,EAkBY,IAAMC,EAAN,cAA0BC,EAAoBC,IAA9C,WAAAX,uBACLK,KAAAO,cAAgB,oBAAoBf,IAKAQ,KAAIJ,MAAG,EAKPI,KAAQQ,UAAG,CA8GxD,CA5GC,iBAAAC,GACEZ,MAAMY,oBACNC,EAAqBV,KAAMW,GAC3BX,KAAKY,OACN,CAIS,gBAAAC,GACR,OAAOb,IACR,CAED,WAAYc,GACV,OAAOd,KAAKe,cAAkC,2BAC/C,CAED,SAAYC,GACV,OAAOhB,KAAKe,cAAgC,yBAC7C,CAMO,KAAAH,GACN,GAAIK,EACF,OAGF,MAAMH,QAAEA,EAAOE,MAAEA,GAAUhB,KAEvBgB,IACFA,EAAME,KAANF,EAAME,GAAO,GAAGlB,KAAKO,uBACrBS,EAAMpB,KAAOI,KAAKJ,MAGhBkB,IACFA,EAAQI,KAARJ,EAAQI,GAAO,GAAGlB,KAAKO,yBACvBO,EAAQlB,KAAOI,KAAKJ,KACpBkB,EAAQN,SAAWR,KAAKQ,SACpBQ,IACFF,EAAQK,aAAa,gBAAiBH,EAAME,IAC5CF,EAAMG,aAAa,kBAAmBL,EAAQI,KAGnD,CAGS,gBAAAE,CAAiBC,EAA+BC,GACxDtB,KAAKuB,iBAGYC,IAAbH,GAA0BA,IAAaC,GACzCtB,KAAKyB,cAAc,IAAIhC,EAAuB6B,GAEjD,CAGS,oBAAAI,GACR,MAAMZ,QAAEA,GAAYd,KAChBc,IACFA,EAAQN,SAAWR,KAAKQ,SAE3B,CAKO,SAAAe,GACN,MAAMT,QAAEA,EAAOE,MAAEA,GAAUhB,KAEvBc,IACFA,EAAQlB,KAAOI,KAAKJ,MAGlBoB,IACFA,EAAMpB,KAAOI,KAAKJ,KAErB,CAKD,MAAA+B,GACM3B,KAAKQ,WAITR,KAAKJ,MAAQI,KAAKJ,KACnB,CAKD,MAAAgC,GACO5B,KAAKQ,WACRR,KAAKJ,MAAO,EAEf,CAKD,QAAAiC,GACO7B,KAAKQ,WACRR,KAAKJ,MAAO,EAEf,GAlH2CkC,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAuB9B,EAAA+B,UAAA,YAAA,GAKZL,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAA2B9B,EAAA+B,UAAA,gBAAA,GAkDlDL,EAAA,CADTM,EAAQ,SAQRhC,EAAA+B,UAAA,mBAAA,MAGSL,EAAA,CADTM,EAAQ,aAMRhC,EAAA+B,UAAA,uBAAA,MA5EkB/B,EAAW0B,EAAA,CAD/BO,EAAc,qBACMjC,SAAAA"}

package/lib/CollapsiblePanel.js

@@ -0,0 +1,2 @@
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as o,LitElement as t}from"lit";import{property as r,customElement as n}from"lit/decorators.js";import{C as s}from"./CollapseController-BtKNFNyJ.js";import{i as l}from"./light-dom-styles-DXsbiKU9.js";import"./StateAttributesController-BIh96sXZ.js";import"./events-Bv6wNHwJ.js";const i=o`nord-collapsible-panel{box-sizing:border-box;display:block;font-family:var(--n-font-family);font-feature-settings:var(--n-font-features);overflow:hidden;transition:block-size var(--n-transition-slowly)}nord-collapsible-panel[hidden]{display:none}@media (prefers-reduced-motion:reduce){nord-collapsible-panel{transition:none}}`;let a=class extends t{constructor(){super(...arguments),this.open=!1,this.collapse=new s(this,{open:()=>this.open,heightVar:"--n-collapsible-panel-height"})}connectedCallback(){super.connectedCallback(),l(this,i),this.setAttribute("role","region"),this.hidden=!this.open}createRenderRoot(){return this}};e([r({reflect:!0,type:Boolean})],a.prototype,"open",void 0),a=e([n("nord-collapsible-panel")],a);var p=a;export{p as default};
+//# sourceMappingURL=CollapsiblePanel.js.map

package/lib/CollapsiblePanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapsiblePanel.js","sources":["../src/collapsible/CollapsiblePanel.ts"],"sourcesContent":["import { LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { CollapseController } from '../common/controllers/CollapseController.js'\nimport { injectLightDomStyles } from '../common/light-dom-styles.js'\n\nimport style from './CollapsiblePanel.css'\n\n/**\n * Collapsible Panel holds the content revealed by its\n * [Collapsible Trigger](/components/collapsible-trigger/). It must be placed\n * inside a [Collapsible](/components/collapsible/) and animates its height as it\n * opens and closes.\n *\n * @status draft\n * @category structure\n * @lightDom true\n *\n * @slot - Default slot for the collapsible content.\n *\n * @attr {boolean} data-open - Present while the panel is open (or opening).\n * @attr {boolean} data-closed - Present while the panel is closed.\n * @attr {boolean} data-starting-style - Present for the first frame of the open transition.\n * @attr {boolean} data-ending-style - Present while the close transition runs.\n *\n * @cssprop [--n-collapsible-panel-height] - Set during the open/close animation to the measured content height. Read it to coordinate custom animations.\n */\n@customElement('nord-collapsible-panel')\nexport default class CollapsiblePanel extends LitElement {\n  /**\n   * Whether the panel is open. Set by the parent\n   * [Collapsible](/components/collapsible/).\n   */\n  @property({ reflect: true, type: Boolean }) open = false\n\n  // The height animation + transition-status data-attributes live in the shared\n  // controller (also used by the accordion panel).\n  private collapse = new CollapseController(this, {\n    open: () => this.open,\n    heightVar: '--n-collapsible-panel-height',\n  })\n\n  connectedCallback() {\n    super.connectedCallback()\n    injectLightDomStyles(this, style)\n    this.setAttribute('role', 'region')\n    // Reflect the initial state without animating.\n    this.hidden = !this.open\n  }\n\n  // Render in the light DOM so the content is the element's own children and the\n  // injected stylesheet applies (no shadow boundary).\n  protected createRenderRoot() {\n    return this\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-collapsible-panel': CollapsiblePanel\n  }\n}\n"],"names":["CollapsiblePanel","LitElement","constructor","this","open","collapse","CollapseController","heightVar","connectedCallback","super","injectLightDomStyles","style","setAttribute","hidden","createRenderRoot","__decorate","property","reflect","type","Boolean","prototype","customElement"],"mappings":"4pBA4Be,IAAMA,EAAN,cAA+BC,EAA/B,WAAAC,uBAK+BC,KAAIC,MAAG,EAI3CD,KAAAE,SAAW,IAAIC,EAAmBH,KAAM,CAC9CC,KAAM,IAAMD,KAAKC,KACjBG,UAAW,gCAgBd,CAbC,iBAAAC,GACEC,MAAMD,oBACNE,EAAqBP,KAAMQ,GAC3BR,KAAKS,aAAa,OAAQ,UAE1BT,KAAKU,QAAUV,KAAKC,IACrB,CAIS,gBAAAU,GACR,OAAOX,IACR,GArB2CY,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAuBnB,EAAAoB,UAAA,YAAA,GALrCpB,EAAgBe,EAAA,CADpCM,EAAc,2BACMrB,SAAAA"}

package/lib/CollapsibleTrigger.js

@@ -0,0 +1,2 @@
+import{_ as e}from"./tslib.es6-CmLYFWVC.js";import{css as t,LitElement as i}from"lit";import{property as o,customElement as s}from"lit/decorators.js";import{F as r}from"./FocusableWhenDisabledController-C_Mn1mfN.js";import{o as l}from"./observe-D0n0zOfU.js";import{i as n}from"./light-dom-styles-DXsbiKU9.js";const a=t`nord-collapsible-trigger{align-items:center;box-sizing:border-box;color:var(--n-color-text);cursor:pointer;display:inline-flex;font-family:var(--n-font-family);font-size:var(--n-font-size-s);font-weight:var(--n-font-weight-active);gap:var(--n-space-xs);line-height:var(--n-line-height-tight);user-select:none}nord-collapsible-trigger:focus-visible{border-radius:var(--n-border-radius-s);outline:2px solid var(--n-color-accent);outline-offset:2px}nord-collapsible-trigger[aria-disabled=true]{color:var(--n-color-text-weaker);cursor:not-allowed}`;let d=class extends i{constructor(){super(...arguments),this.open=!1,this.disabled=!1,this.focusable=new r(this,{disabled:()=>this.disabled}),this.handleClick=()=>{this.activate()},this.handleKeydown=e=>{"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),this.activate())}}connectedCallback(){super.connectedCallback(),n(this,a),this.setAttribute("role","button"),this.setAttribute("aria-expanded",`${this.open}`),this.addEventListener("click",this.handleClick),this.addEventListener("keydown",this.handleKeydown)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this.handleClick),this.removeEventListener("keydown",this.handleKeydown)}createRenderRoot(){return this}get collapsible(){return this.closest("nord-collapsible")}handleOpenChange(){this.setAttribute("aria-expanded",`${this.open}`)}activate(){var e;this.disabled||null===(e=this.collapsible)||void 0===e||e.toggle()}};e([o({reflect:!0,type:Boolean})],d.prototype,"open",void 0),e([o({reflect:!0,type:Boolean})],d.prototype,"disabled",void 0),e([l("open")],d.prototype,"handleOpenChange",null),d=e([s("nord-collapsible-trigger")],d);var c=d;export{c as default};
+//# sourceMappingURL=CollapsibleTrigger.js.map

package/lib/CollapsibleTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollapsibleTrigger.js","sources":["../src/collapsible/CollapsibleTrigger.ts"],"sourcesContent":["import type Collapsible from './Collapsible.js'\nimport { LitElement } from 'lit'\n\nimport { customElement, property } from 'lit/decorators.js'\nimport { FocusableWhenDisabledController } from '../common/controllers/FocusableWhenDisabledController.js'\nimport { observe } from '../common/decorators/observe.js'\n\nimport { injectLightDomStyles } from '../common/light-dom-styles.js'\nimport style from './CollapsibleTrigger.css'\n\n/**\n * Collapsible Trigger is the interactive control that opens and closes its\n * [Collapsible](/components/collapsible/) panel. It must be placed inside a\n * [Collapsible](/components/collapsible/).\n *\n * @status draft\n * @category structure\n * @lightDom true\n *\n * @slot - Default slot for the trigger label and/or an icon.\n */\n@customElement('nord-collapsible-trigger')\nexport default class CollapsibleTrigger extends LitElement {\n  /**\n   * Whether the associated panel is open. Set by the parent\n   * [Collapsible](/components/collapsible/); reflected so it can be styled.\n   */\n  @property({ reflect: true, type: Boolean }) open = false\n\n  /**\n   * Whether the trigger is disabled. Set by the parent\n   * [Collapsible](/components/collapsible/).\n   */\n  @property({ reflect: true, type: Boolean }) disabled = false\n\n  // Keeps the trigger focusable while disabled (aria-disabled + tabindex=0),\n  // matching Base UI; activation is blocked by `activate()` below.\n  private focusable = new FocusableWhenDisabledController(this, { disabled: () => this.disabled })\n\n  connectedCallback() {\n    super.connectedCallback()\n    injectLightDomStyles(this, style)\n    // The host itself is the focusable button: light DOM can't delegate focus\n    // into a shadow `<button>`, so we apply button semantics directly.\n    this.setAttribute('role', 'button')\n    this.setAttribute('aria-expanded', `${this.open}`)\n    this.addEventListener('click', this.handleClick)\n    this.addEventListener('keydown', this.handleKeydown)\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n    this.removeEventListener('click', this.handleClick)\n    this.removeEventListener('keydown', this.handleKeydown)\n  }\n\n  // Render in the light DOM so the trigger label/icon stay as the element's own\n  // content (no shadow boundary, like Table and Kbd).\n  protected createRenderRoot() {\n    return this\n  }\n\n  private get collapsible() {\n    return this.closest<Collapsible>('nord-collapsible')\n  }\n\n  @observe('open')\n  protected handleOpenChange() {\n    this.setAttribute('aria-expanded', `${this.open}`)\n  }\n\n  private activate() {\n    if (this.disabled) {\n      return\n    }\n\n    this.collapsible?.toggle()\n  }\n\n  private handleClick = () => {\n    this.activate()\n  }\n\n  private handleKeydown = (event: KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      this.activate()\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-collapsible-trigger': CollapsibleTrigger\n  }\n}\n"],"names":["CollapsibleTrigger","LitElement","constructor","this","open","disabled","focusable","FocusableWhenDisabledController","handleClick","activate","handleKeydown","event","key","preventDefault","connectedCallback","super","injectLightDomStyles","style","setAttribute","addEventListener","disconnectedCallback","removeEventListener","createRenderRoot","collapsible","closest","handleOpenChange","_a","toggle","__decorate","property","reflect","type","Boolean","prototype","observe","customElement"],"mappings":"g2BAsBe,IAAMA,EAAN,cAAiCC,EAAjC,WAAAC,uBAK+BC,KAAIC,MAAG,EAMPD,KAAQE,UAAG,EAI/CF,KAAAG,UAAY,IAAIC,EAAgCJ,KAAM,CAAEE,SAAU,IAAMF,KAAKE,WA0C7EF,KAAWK,YAAG,KACpBL,KAAKM,UAAU,EAGTN,KAAAO,cAAiBC,IACL,UAAdA,EAAMC,KAAiC,MAAdD,EAAMC,MACjCD,EAAME,iBACNV,KAAKM,WACN,CAEJ,CAlDC,iBAAAK,GACEC,MAAMD,oBACNE,EAAqBb,KAAMc,GAG3Bd,KAAKe,aAAa,OAAQ,UAC1Bf,KAAKe,aAAa,gBAAiB,GAAGf,KAAKC,QAC3CD,KAAKgB,iBAAiB,QAAShB,KAAKK,aACpCL,KAAKgB,iBAAiB,UAAWhB,KAAKO,cACvC,CAED,oBAAAU,GACEL,MAAMK,uBACNjB,KAAKkB,oBAAoB,QAASlB,KAAKK,aACvCL,KAAKkB,oBAAoB,UAAWlB,KAAKO,cAC1C,CAIS,gBAAAY,GACR,OAAOnB,IACR,CAED,eAAYoB,GACV,OAAOpB,KAAKqB,QAAqB,mBAClC,CAGS,gBAAAC,GACRtB,KAAKe,aAAa,gBAAiB,GAAGf,KAAKC,OAC5C,CAEO,QAAAK,SACFN,KAAKE,UAIS,QAAlBqB,EAAAvB,KAAKoB,mBAAa,IAAAG,GAAAA,EAAAC,QACnB,GAlD2CC,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAAuBhC,EAAAiC,UAAA,YAAA,GAMZL,EAAA,CAA3CC,EAAS,CAAEC,SAAS,EAAMC,KAAMC,WAA2BhC,EAAAiC,UAAA,gBAAA,GAkClDL,EAAA,CADTM,EAAQ,SAGRlC,EAAAiC,UAAA,mBAAA,MA/CkBjC,EAAkB4B,EAAA,CADtCO,EAAc,6BACMnC,SAAAA"}

package/lib/Combobox-By4h1Sp-.js

@@ -0,0 +1,2 @@
+import{css as o}from"lit";const n=o`nord-combobox,nord-combobox *,nord-combobox :after,nord-combobox :before{box-sizing:border-box}nord-combobox>.n-render-root{display:contents}nord-combobox-group,nord-combobox-option{display:none}nord-combobox{--_n-combobox-background:var(--n-input-background,var(--n-color-surface));--_n-combobox-border-color:var(--n-input-border-color,var(--n-color-border-strong));--_n-combobox-border-radius:var(--n-input-border-radius,var(--n-border-radius-s));--_n-combobox-block-size:var(--n-combobox-block-size,var(--n-space-xl));--_n-combobox-min-content-block-size:calc(var(--n-line-height-form) + var(--n-space-s)/1.6*2 + 2px);--_n-combobox-padding-block:calc(var(--_n-combobox-block-size)/2 - var(--n-line-height-form)/2 - 1px);--_n-combobox-padding-inline:calc(var(--n-space-s) + var(--n-space-xs));--_n-combobox-font-size:var(--n-font-size-m);--_n-combobox-divider-block-size:var(--n-space-m);--_n-combobox-tags-padding:calc(var(--n-space-xs)*0.75);display:block}nord-combobox[size=s]{--_n-combobox-block-size:var(--n-combobox-block-size,calc(var(--n-space-l) + var(--n-space-xs)));--_n-combobox-padding-block:calc(var(--_n-combobox-block-size)/2 - var(--n-line-height-form)/2 - 1px);--_n-combobox-padding-inline:calc(var(--n-space-xs)*1.5);--_n-combobox-divider-block-size:calc(var(--n-space-s) + var(--n-space-xs)/2);--_n-combobox-tags-padding:calc(var(--n-space-xs)/2)}nord-combobox[size=l]{--_n-combobox-border-radius:var(--n-input-border-radius,var(--n-border-radius));--_n-combobox-block-size:max(var(--n-combobox-block-size,calc(var(--n-space-xxl) - var(--n-space-l))),var(--_n-combobox-min-content-block-size));--_n-combobox-padding-block:calc(var(--_n-combobox-block-size)/2 - var(--n-line-height-form)/2 - 1px);--_n-combobox-padding-inline:calc(var(--n-space-s) + var(--n-space-xs));--_n-combobox-divider-block-size:var(--n-space-l)}nord-combobox .n-combobox{inline-size:100%;position:relative}nord-combobox .n-control{align-items:center;background:var(--_n-combobox-background);border:1px solid var(--_n-combobox-border-color);border-radius:var(--_n-combobox-border-radius);cursor:text;display:flex;gap:var(--n-space-s);inline-size:100%;min-block-size:var(--_n-combobox-block-size);padding-inline-end:var(--_n-combobox-padding-inline);padding-inline-start:var(--_n-combobox-padding-inline);transition:border var(--n-transition-quickly),box-shadow var(--n-transition-quickly),background var(--n-transition-quickly)}nord-combobox .n-tags{align-items:center;display:flex;flex:1;flex-wrap:wrap;gap:var(--_n-combobox-tags-padding);min-inline-size:0;padding-block-end:var(--_n-combobox-tags-padding);padding-block-start:var(--_n-combobox-tags-padding)}nord-combobox .n-tags .n-input{padding-block-end:0;padding-block-start:0}nord-combobox .n-control:hover{--_n-combobox-border-color:var(--n-input-border-color,var(--n-color-border-hover))}nord-combobox .n-control:focus-within{--_n-combobox-border-color:var(--n-input-border-color,var(--n-color-accent));box-shadow:0 0 0 1px var(--_n-combobox-border-color)}nord-combobox[disabled] .n-control{--_n-combobox-background:var(--n-input-background-inactive,var(--n-color-active));--_n-combobox-border-color:var(--n-input-border-color,var(--n-color-active));cursor:auto;pointer-events:none}nord-combobox .n-control.is-invalid{--_n-combobox-border-color:var(--n-color-border-danger)}nord-combobox .n-control.is-invalid:focus-within{--_n-combobox-border-color:var(--n-color-status-danger)}nord-combobox .n-slot{align-items:center;color:var(--n-color-icon);display:flex;flex-shrink:0}nord-combobox .n-slot:empty{display:none}nord-combobox[disabled] .n-slot{color:var(--n-color-text-weakest)}nord-combobox .n-slot nord-icon{--_n-icon-size:var(--n-size-icon-s)}nord-combobox .n-input{appearance:none;background:#0000;border:none;color:var(--n-color-text);flex:1;font-family:var(--n-font-family);font-feature-settings:var(--n-font-features);font-size:var(--_n-combobox-font-size);line-height:var(--n-line-height-form);margin:0;min-inline-size:3rem;outline:none;padding-block-end:var(--_n-combobox-padding-block);padding-block-start:var(--_n-combobox-padding-block);padding-inline-end:0;padding-inline-start:0}nord-combobox .n-control input.n-input:focus,nord-combobox .n-control input.n-input:focus-visible,nord-combobox .n-control input.n-input:focus-within{background:#0000;border:none;box-shadow:none;outline:none}nord-combobox .n-input::placeholder{color:var(--n-color-text-weakest);opacity:1}nord-combobox[disabled] .n-input{color:var(--n-color-text-weakest)}nord-combobox .n-divider{background:var(--n-color-border);block-size:var(--_n-combobox-divider-block-size);flex-shrink:0;inline-size:1px}nord-combobox .n-toggle{align-items:center;appearance:none;background:#0000;border:none;color:var(--n-color-icon);cursor:pointer;display:flex;flex-shrink:0;justify-content:center;margin:0;padding:0}nord-combobox .n-toggle nord-icon{--_n-icon-size:var(--n-size-icon-s)}nord-combobox[disabled] .n-toggle{color:var(--n-color-text-weakest);cursor:auto}nord-combobox .n-clear{align-items:center;appearance:none;background:#0000;border:none;border-radius:var(--n-border-radius-s);color:var(--n-color-icon);cursor:pointer;display:flex;flex-shrink:0;justify-content:center;margin:0;padding:0;transition:color var(--n-transition-quickly)}nord-combobox .n-clear:hover{color:var(--n-color-text)}nord-combobox .n-clear:focus-visible{outline:2px solid var(--n-color-accent);outline-offset:2px}nord-combobox .n-clear nord-icon{--_n-icon-size:var(--n-size-icon-xs)}nord-combobox .n-loading{flex-shrink:0}nord-combobox .n-chip{--n-tag-block-size:calc(var(--_n-combobox-block-size) - var(--n-space-s));flex-shrink:0}nord-combobox .n-listbox{inline-size:var(--n-combobox-list-inline-size,var(--_n-combobox-anchor-inline-size,100%));margin:0;max-block-size:calc(var(--n-space-xxl)*4);overflow-y:auto;padding-block-end:var(--n-space-s);padding-block-start:var(--n-space-s);padding-inline:0}nord-combobox .n-virtual-sizer{inline-size:100%;position:relative}nord-combobox .n-virtual-row{inset-block-start:0;inset-inline:0;position:absolute}nord-combobox .n-virtual-row>.n-option{block-size:100%;box-sizing:border-box;min-block-size:0;overflow:hidden}nord-combobox .n-group-label{color:var(--n-color-text-weaker);font-size:var(--n-font-size-xs);font-weight:var(--n-font-weight-heading);line-height:var(--n-line-height-tight);padding-block-end:var(--n-space-s);padding-block-start:var(--n-space-s);padding-inline-end:calc(var(--n-space-s) + var(--n-space-xs)/2);padding-inline-start:calc(var(--n-space-s) + var(--n-space-xs)/2)}nord-combobox [role=group]:not(:first-child):before{border-block-start:1px solid var(--n-color-border);content:"";display:block;margin-block-end:var(--n-space-s);margin-block-start:var(--n-space-s)}nord-combobox .n-option{align-items:center;color:var(--n-color-text);cursor:pointer;display:flex;font-size:var(--_n-combobox-font-size);gap:var(--n-space-s);line-height:var(--n-line-height);padding-block-end:calc(var(--n-space-xs)*1.5);padding-block-start:calc(var(--n-space-xs)*1.5);padding-inline-end:calc(var(--n-space-s) + var(--n-space-xs)/2);padding-inline-start:calc(var(--n-space-s) + var(--n-space-xs)/2);user-select:none}nord-combobox .n-option.is-active{background:var(--n-color-accent);color:var(--n-color-text-on-accent)}nord-combobox .n-option:active{opacity:.8}nord-combobox .n-option.is-disabled{color:var(--n-color-text-weakest);cursor:default;pointer-events:none}nord-combobox .n-option-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}nord-combobox .n-option-check{block-size:var(--n-space-m);color:var(--n-color-text-highlight);display:grid;flex:0 0 var(--n-space-m);inline-size:var(--n-space-m);place-items:center}nord-combobox .n-option.is-active .n-option-check{color:currentColor}nord-combobox .n-create{color:var(--n-color-text-link)}nord-combobox .n-create .n-option-label{font-weight:var(--n-font-weight-active)}nord-combobox .n-create-icon{--_n-icon-size:var(--n-size-icon-s);color:currentColor;flex-shrink:0}nord-combobox .n-create-kbd{flex-shrink:0}nord-combobox .n-empty{align-items:center;color:var(--n-color-text-weaker);display:flex;font-size:var(--_n-combobox-font-size);justify-content:center;padding:var(--n-space-s);text-align:center}`;export{n as s};
+//# sourceMappingURL=Combobox-By4h1Sp-.js.map

package/lib/Combobox-By4h1Sp-.js.map

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

package/lib/Combobox.js

@@ -0,0 +1,2 @@
+import{_ as t}from"./tslib.es6-CmLYFWVC.js";import{i}from"./context-provider-D8lrPLVi.js";import{a as e}from"./interface-add-small-B-hv2v9J.js";import{nothing as o,html as s}from"lit";import{property as r,state as l,customElement as a}from"lit/decorators.js";import{classMap as n}from"lit/directives/class-map.js";import{repeat as p}from"lit/directives/repeat.js";import{i as c}from"./light-dom-styles-DXsbiKU9.js";import m from"./Icon.js";import{comboboxRegistryContext as d}from"./combobox-context.js";import{s as h}from"./Combobox-By4h1Sp-.js";import u from"./ComboboxBase.js";import{ComboboxClearEvent as j,ComboboxCreateEvent as v}from"./ComboboxEvents.js";import"./Kbd.js";import"./Tag.js";import"./ComboboxOption.js";import"./ComboboxGroup.js";import"./context-request-event-CCRlXoeR.js";import"lit/directives/if-defined.js";import"lit/directives/unsafe-html.js";import"./observe-D0n0zOfU.js";import"./cond-CI1KbneT.js";import"./Component-BJ5O5n8k.js";import"./IconManager.js";import"./create-context-CJ69ntlY.js";import"./ActiveDescendantController-BnMqM79O.js";import"./number-Dg2vCfGd.js";import"./interface-close-small-CnpAFMO3.js";import"./interface-dropdown-small-CYvgxudU.js";import"lit/directives/ref.js";import"lit/directives/style-map.js";import"./collection-Dvg2XbxV.js";import"./FormDataController-OUt5L5uC.js";import"./LightDismissController-4pH8cdko.js";import"./EventController-BBOmvfLa.js";import"./ShortcutController-BIb3WGzH.js";import"./tinykeys.module-_6MZt7MP.js";import"./ResizeController-14PUwRQy.js";import"./StateAttributesController-BIh96sXZ.js";import"./events-Bv6wNHwJ.js";import"./AutocompleteMixin-D8eiOxvO.js";import"./DraftComponentMixin-4qug5Rky.js";import"./FieldControlMixin-BXNZJXu9.js";import"./context-consumer-BJVUulGf.js";import"./field-context.js";import"./SlotController-Z6eG7LSZ.js";import"./VisuallyHidden.js";import"./Popout-DpN7PP9h.js";import"./positioning-D-K8Mueq.js";import"./DirectionController-ChvNGESZ.js";import"./ScrollbarController-BFC67Y2x.js";import"./InputMixin-LetXsCyv.js";import"./SizeMixin-CU9cLbLC.js";import"./LocalizeController.js";import"./translation.js";import"./en-us.js";import"./localization.js";import"./localization2.js";import"./localization3.js";import"./localization4.js";import"./localization5.js";import"./localization6.js";import"./localization7.js";import"./localization8.js";import"./localization9.js";import"./localization10.js";import"./localization11.js";import"./localization12.js";import"./localization13.js";import"./localization14.js";import"./localization15.js";import"./localization16.js";import"./localization17.js";import"./localization18.js";import"./localization19.js";import"./localization20.js";import"./localization21.js";import"./localization22.js";import"./Spinner.js";import"./interface-checked-small-BQmkNgCI.js";import"./FocusableMixin-BlQLNPdJ.js";m.registerIcon(e);let b=class extends u{constructor(){super(...arguments),this.value="",this.multiple=!1,this.clearable=!0,this.creatable=!1,this.slottedOptions=[],this.createdOptions=[],this.optionElements=new Set,this.optionRegistry={add:t=>{this.optionElements.add(t),this.rebuildSlottedOptions()},remove:t=>{this.optionElements.delete(t),this.rebuildSlottedOptions()},notify:()=>this.rebuildSlottedOptions()},this.registryProvider=new i(this,{context:d,initialValue:this.optionRegistry})}connectedCallback(){super.connectedCallback(),c(this,h)}readOptionElement(t){var i,e,o,s,r;const l=(null===(i=t.closest("nord-combobox-group"))||void 0===i?void 0:i.getAttribute("label"))||void 0,a=null!==(s=null!==(e=t.getAttribute("label"))&&void 0!==e?e:null===(o=t.textContent)||void 0===o?void 0:o.trim())&&void 0!==s?s:"",n={value:null!==(r=t.getAttribute("value"))&&void 0!==r?r:"",label:a,disabled:t.hasAttribute("disabled")};return l&&(n.group=l),t.children.length>0&&(n.html=t.innerHTML),n}rebuildSlottedOptions(){const t=[...this.optionElements].sort(((t,i)=>t.compareDocumentPosition(i)&Node.DOCUMENT_POSITION_FOLLOWING?-1:1));this.slottedOptions=t.map((t=>this.readOptionElement(t)))}get resolvedOptions(){const t=this.options.length?this.options:this.slottedOptions,i=this.createdOptions,e=this.resolvedCache;if(e&&e.options===this.options&&e.slotted===this.slottedOptions&&e.created===i)return e.result;const o=i.length?[...t,...i]:t;return this.resolvedCache={options:this.options,slotted:this.slottedOptions,created:i,result:o},o}get isMultiple(){return this.multiple}get showsQueryInInput(){return this.isMultiple||this.queryDirty}get inputPlaceholder(){return this.isMultiple&&this.hasValue?void 0:this.placeholder}get createIndex(){return this.canCreate?this.filteredOptions.length:-1}get canCreate(){const t=this.search.trim();return!(!this.creatable||!t)&&!this.resolvedOptions.some((i=>i.label.toLocaleLowerCase()===t.toLocaleLowerCase()))}get showClear(){return this.clearable&&this.hasValue&&!this.disabled}get ariaMultiselectable(){return this.isMultiple?"true":"false"}clear(){this.value=this.isMultiple?[]:"",this.search="",this.queryDirty=!1,this.dispatchEvent(new j),this.commit(),this.focus()}selectOption(t){if(!this.isMultiple)return super.selectOption(t);if(t.disabled)return;this.labelCache.set(t.value,t.label);const i=this.values.includes(t.value)?this.values.filter((i=>i!==t.value)):[...this.values,t.value];this.value=i,this.search="",this.queryDirty=!1,this.commit(),this.focus()}onInput(t){!this.isMultiple&&""===t.value&&this.hasValue&&(this.value="",this.commit())}emitCreate(){const t=this.search.trim();if(!t)return;if(!this.dispatchEvent(new v(t)))return;const i={value:t,label:t};this.resolvedOptions.some((t=>t.value===i.value))||(this.createdOptions=[...this.createdOptions,i]),this.labelCache.set(i.value,i.label),this.selectOption(i)}onUnhandledKeydown(t){"Backspace"===t.key&&this.isMultiple&&!this.search&&this.values.length&&this.removeValue(this.values[this.values.length-1])}removeValue(t){this.disabled||(this.value=this.values.filter((i=>i!==t)),this.commit(),this.focus())}renderLeadingControl(){return this.isMultiple?p(this.values,(t=>t),(t=>s`<nord-tag class="n-chip" size="s" variant="removable" ?disabled="${this.disabled}" @remove="${()=>this.removeValue(t)}" @click="${t=>t.stopPropagation()}">${this.labelFor(t)}</nord-tag>`)):o}renderCreate(){const t=this.activeDescendant.activeIndex===this.createIndex;return s`<div id="${this.createId}" class="${n({"n-option":!0,"n-create":!0,"is-active":t})}" role="option" aria-selected="false" @click="${this.emitCreate}" @mousemove="${()=>this.activeDescendant.setActiveIndex(this.createIndex)}"><nord-icon class="n-create-icon" name="interface-add-small"></nord-icon><span class="n-option-label">${this.localize.term("createLabel",this.search.trim())}</span><nord-kbd class="n-create-kbd" aria-hidden="true">⏎</nord-kbd></div>`}};t([r({attribute:!1})],b.prototype,"value",void 0),t([r({reflect:!0,type:Boolean})],b.prototype,"multiple",void 0),t([r({reflect:!0,type:Boolean})],b.prototype,"clearable",void 0),t([r({reflect:!0,type:Boolean})],b.prototype,"creatable",void 0),t([l()],b.prototype,"slottedOptions",void 0),t([l()],b.prototype,"createdOptions",void 0),b=t([a("nord-combobox")],b);var f=b;export{j as ComboboxClearEvent,v as ComboboxCreateEvent,f as default};
+//# sourceMappingURL=Combobox.js.map

package/lib/Combobox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Combobox.js","sources":["../src/combobox/Combobox.ts"],"sourcesContent":["import type { ComboboxRegistry } from './combobox-context.js'\nimport type { ComboboxOption } from './ComboboxBase.js'\nimport { ContextProvider } from '@lit/context'\nimport * as addIcon from '@nordhealth/icons/lib/assets/interface-add-small.js'\nimport { html, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport { repeat } from 'lit/directives/repeat.js'\n\nimport { injectLightDomStyles } from '../common/light-dom-styles.js'\nimport Icon from '../icon/Icon.js'\nimport { comboboxRegistryContext } from './combobox-context.js'\nimport style from './Combobox.css'\nimport ComboboxBase from './ComboboxBase.js'\nimport { ComboboxClearEvent, ComboboxCreateEvent } from './ComboboxEvents.js'\nimport '../kbd/Kbd.js'\nimport '../tag/Tag.js'\nimport './ComboboxOption.js'\nimport './ComboboxGroup.js'\n\nIcon.registerIcon(addIcon)\n\nexport type { ComboboxOption } from './ComboboxBase.js'\nexport { ComboboxClearEvent, ComboboxCreateEvent } from './ComboboxEvents.js'\n\n/**\n * Combobox lets users choose one option (or several) from a list by typing to\n * filter, then picking with the keyboard or pointer. Use it when a [Select](/components/select/)\n * would be unwieldy because there are many options to scan.\n *\n * Combobox is a control only — it has no built-in label, hint or error. Compose\n * it inside a [Field](/components/field/) to give it a label, hint and error\n * message, the same way you would a native input.\n *\n * The committed `value` is an option's `value` (or an array of them with\n * `multiple`); the input is a filter/search field whose text is discarded on\n * commit. For a free-text input with suggestions where the typed text is the\n * value, use [Autocomplete](/components/autocomplete/) instead.\n *\n * @status draft\n * @category form\n * @lightDom true\n *\n * @slot start - Optional slot used to place an icon or prefix at the start of the control.\n * @slot end - Optional slot used to place an icon or suffix at the end of the control.\n *\n * @fires {NordEvent} change - Dispatched when the committed value changes via user interaction.\n * @fires {NordEvent} input - Dispatched as the user types into the search input.\n * @fires {NordEvent} open - Dispatched when the listbox is opened.\n * @fires {NordEvent} close - Dispatched when the listbox is closed.\n * @fires {ComboboxClearEvent} clear - Dispatched when the value is cleared via the clear button or `clear()`.\n * @fires {ComboboxCreateEvent} create - Dispatched when the user chooses the \"Create\" affordance in a `creatable` combobox.\n *\n * @localization clearLabel - Accessible label for the clear button.\n * @localization createLabel - Label for the \"Create\" affordance, given the current query.\n * @localization noResults - Message shown when no options match the query.\n *\n * @cssprop [--n-combobox-list-inline-size] - Controls the inline size, or width, of the dropdown list. Defaults to the width of the combobox control.\n * @cssprop [--n-combobox-block-size] - Controls the block size, or height, of the control. The medium default is `var(--n-space-xl)`; the s and l sizes scale from it.\n *\n * @attr {boolean} data-invalid - Present while the control is invalid (mirrors the `invalid` property). Style hook for the whole control.\n * @attr {boolean} data-focused - Present while the control has focus. Style hook for focus-within treatments.\n */\n@customElement('nord-combobox')\nexport default class Combobox extends ComboboxBase {\n  /**\n   * The value of the combobox. A single string when `multiple` is `false`,\n   * or an array of strings when `multiple` is `true`.\n   */\n  @property({ attribute: false })\n  // @ts-expect-error - intentionally widens the inherited `value: string` to support multiple selection\n  value: string | string[] = ''\n\n  /**\n   * Allows selecting more than one option. Selected options are shown as\n   * removable chips and the listbox stays open after each selection.\n   */\n  @property({ reflect: true, type: Boolean }) multiple = false\n\n  /**\n   * Shows a clear (✕) button while there is a value. Pressing it resets the\n   * value to `''` (or `[]` when `multiple`), then fires `clear` and `change`.\n   * Defaults to `true`.\n   *\n   * This prop only toggles the button. A single-select value can always be\n   * cleared by deleting the input text, regardless of this prop (Base UI\n   * parity).\n   */\n  @property({ reflect: true, type: Boolean }) clearable = true\n\n  /**\n   * Offers a \"Create\" affordance when the query does not exactly match an\n   * existing option. Choosing it (click or Enter) adds the typed value as an\n   * option and selects it (in `multiple` mode it is appended as a chip), and\n   * fires a cancelable `create` event. Call `event.preventDefault()` to opt out\n   * and handle creation yourself (e.g. to map the value to a different `value`).\n   */\n  @property({ reflect: true, type: Boolean }) creatable = false\n\n  /** Options contributed by declarative `<nord-combobox-option>` children. */\n  @state() private slottedOptions: ComboboxOption[] = []\n\n  /** Options the combobox created itself via the auto-add `creatable` flow. */\n  @state() private createdOptions: ComboboxOption[] = []\n\n  /** Registered declarative option elements (rebuilt into `slottedOptions`). */\n  private optionElements = new Set<Element>()\n\n  /** The registry the option/group children use to self-register (provide/inject). */\n  private optionRegistry: ComboboxRegistry = {\n    add: (option) => {\n      this.optionElements.add(option)\n      this.rebuildSlottedOptions()\n    },\n    remove: (option) => {\n      this.optionElements.delete(option)\n      this.rebuildSlottedOptions()\n    },\n    notify: () => this.rebuildSlottedOptions(),\n  }\n\n  private registryProvider = new ContextProvider(this, {\n    context: comboboxRegistryContext,\n    initialValue: this.optionRegistry,\n  })\n\n  connectedCallback() {\n    super.connectedCallback()\n    injectLightDomStyles(this, style)\n  }\n\n  /** Read a registered option element into a plain `ComboboxOption`. */\n  private readOptionElement(el: Element): ComboboxOption {\n    const group = el.closest('nord-combobox-group')?.getAttribute('label') || undefined\n    const label = el.getAttribute('label') ?? el.textContent?.trim() ?? ''\n    const option: ComboboxOption = {\n      value: el.getAttribute('value') ?? '',\n      label,\n      disabled: el.hasAttribute('disabled'),\n    }\n    if (group) {\n      option.group = group\n    }\n    // Custom markup (e.g. an avatar) becomes the rendered row content.\n    if (el.children.length > 0) {\n      option.html = el.innerHTML\n    }\n    return option\n  }\n\n  /** Rebuild `slottedOptions` from the registered elements, in DOM order. */\n  private rebuildSlottedOptions() {\n    const ordered = [...this.optionElements].sort((a, b) =>\n\n      a.compareDocumentPosition(b) & Node.DOCUMENT_POSITION_FOLLOWING ? -1 : 1,\n    )\n    this.slottedOptions = ordered.map(el => this.readOptionElement(el))\n  }\n\n  /** Cache for the merged option list so `filtered`'s identity check stays stable. */\n  private resolvedCache?: {\n    options: ComboboxOption[]\n    slotted: ComboboxOption[]\n    created: ComboboxOption[]\n    result: ComboboxOption[]\n  }\n\n  /**\n   * The options to render: the `.options` property when set (dynamic/async data),\n   * otherwise the declarative `<nord-combobox-option>` children, with any\n   * auto-created options merged on top.\n   */\n  protected override get resolvedOptions(): ComboboxOption[] {\n    const base = this.options.length ? this.options : this.slottedOptions\n    const created = this.createdOptions\n    const cache = this.resolvedCache\n    if (cache && cache.options === this.options && cache.slotted === this.slottedOptions && cache.created === created) {\n      return cache.result\n    }\n    const result = created.length ? [...base, ...created] : base\n    this.resolvedCache = { options: this.options, slotted: this.slottedOptions, created, result }\n    return result\n  }\n\n  /** Whether chip/array logic applies — i.e. `multiple` selection. */\n  private get isMultiple(): boolean {\n    return this.multiple\n  }\n\n  /**\n   * In `multiple` mode the input is always a pure filter (selections live in\n   * chips). In single-select it shows the live query only once the user types;\n   * until then it keeps the selected option's label visible and editable (Base\n   * UI parity — see `ComboboxBase.showsQueryInInput`).\n   */\n  protected override get showsQueryInInput(): boolean {\n    return this.isMultiple || this.queryDirty\n  }\n\n  protected override get inputPlaceholder(): string | undefined {\n    return this.isMultiple && this.hasValue ? undefined : this.placeholder\n  }\n\n  /** The index of the create row, or `-1` when it isn't shown. */\n  protected override get createIndex(): number {\n    return this.canCreate ? this.filteredOptions.length : -1\n  }\n\n  /** Whether the \"Create\" affordance should be offered for the current query. */\n  protected override get canCreate(): boolean {\n    const query = this.search.trim()\n\n    if (!this.creatable || !query) {\n      return false\n    }\n\n    // Don't offer to create something that already exists exactly.\n    return !this.resolvedOptions.some(\n      option => option.label.toLocaleLowerCase() === query.toLocaleLowerCase(),\n    )\n  }\n\n  protected override get showClear(): boolean {\n    return this.clearable && this.hasValue && !this.disabled\n  }\n\n  protected override get ariaMultiselectable(): 'true' | 'false' {\n    return this.isMultiple ? 'true' : 'false'\n  }\n\n  /**\n   * Clear the current value, firing `clear` then `change`.\n   */\n  override clear() {\n    this.value = this.isMultiple ? [] : ''\n    this.search = ''\n    this.queryDirty = false\n    this.dispatchEvent(new ComboboxClearEvent())\n    this.commit()\n    this.focus()\n  }\n\n  protected override selectOption(option: ComboboxOption) {\n    // Single-select behaves exactly like the base (set value, close, restore\n    // focus); only the multiple case — toggle membership, keep the popup open —\n    // differs, so handle that here and delegate the rest.\n    if (!this.isMultiple) {\n      return super.selectOption(option)\n    }\n\n    if (option.disabled) {\n      return\n    }\n\n    // Remember the label so it survives the option leaving the result set.\n    this.labelCache.set(option.value, option.label)\n\n    const next = this.values.includes(option.value)\n      ? this.values.filter(value => value !== option.value)\n      : [...this.values, option.value]\n\n    this.value = next\n    this.search = ''\n    this.queryDirty = false\n    this.commit()\n    // Keep the popup open after selection in multiple mode.\n    this.focus()\n  }\n\n  protected override onInput(input: HTMLInputElement): void {\n    // Base UI parity: fully deleting the single-select input text clears the\n    // committed selection (not just the filter). This is always available,\n    // independent of the `clearable` button. In multiple mode the selections\n    // live in chips, so an empty filter is not a clear (Backspace removes the\n    // last chip instead — see `onUnhandledKeydown`).\n    if (!this.isMultiple && input.value === '' && this.hasValue) {\n      this.value = ''\n      this.commit()\n    }\n  }\n\n  protected override emitCreate() {\n    const query = this.search.trim()\n\n    if (!query) {\n      return\n    }\n\n    /**\n     * Fired when the user chooses the create affordance, carrying the typed\n     * query. By default the combobox then adds the value as an option and selects\n     * it; call `event.preventDefault()` to opt out and handle creation yourself.\n     */\n    const proceed = this.dispatchEvent(new ComboboxCreateEvent(query))\n    if (!proceed) {\n      // Consumer opted out — leave options/value untouched (legacy behaviour).\n      return\n    }\n\n    const option: ComboboxOption = { value: query, label: query }\n\n    // Add to our own additive list so it survives `.options` reassignment and\n    // works regardless of the source (property, slotted, or external-filtering).\n    if (!this.resolvedOptions.some(o => o.value === option.value)) {\n      this.createdOptions = [...this.createdOptions, option]\n    }\n    this.labelCache.set(option.value, option.label)\n\n    // Select it: single sets the value and closes; multiple appends a chip,\n    // clears the query and keeps the popup open — same as picking any option.\n    this.selectOption(option)\n  }\n\n  protected override onUnhandledKeydown(e: KeyboardEvent) {\n    // In multiple mode, an empty query Backspace removes the last chip.\n    if (e.key === 'Backspace' && this.isMultiple && !this.search && this.values.length) {\n      this.removeValue(this.values[this.values.length - 1])\n    }\n  }\n\n  private removeValue(value: string) {\n    if (this.disabled) {\n      return\n    }\n\n    this.value = this.values.filter(v => v !== value)\n    this.commit()\n    this.focus()\n  }\n\n  /** Multiple mode renders selected options as removable chips before the input. */\n  protected override renderLeadingControl() {\n    if (!this.isMultiple) {\n      return nothing\n    }\n\n    return repeat(\n      this.values,\n      value => value,\n      (value) => {\n        return html`\n          <nord-tag\n            class=\"n-chip\"\n            size=\"s\"\n            variant=\"removable\"\n            ?disabled=${this.disabled}\n            @remove=${() => this.removeValue(value)}\n            @click=${(e: Event) => e.stopPropagation()}\n          >\n            ${this.labelFor(value)}\n          </nord-tag>\n        `\n      },\n    )\n  }\n\n  protected override renderCreate() {\n    const active = this.activeDescendant.activeIndex === this.createIndex\n\n    return html`\n      <div\n        id=${this.createId}\n        class=${classMap({ 'n-option': true, 'n-create': true, 'is-active': active })}\n        role=\"option\"\n        aria-selected=\"false\"\n        @click=${this.emitCreate}\n        @mousemove=${() => this.activeDescendant.setActiveIndex(this.createIndex)}\n      >\n        <nord-icon class=\"n-create-icon\" name=\"interface-add-small\"></nord-icon>\n        <span class=\"n-option-label\">${this.localize.term('createLabel', this.search.trim())}</span>\n        <nord-kbd class=\"n-create-kbd\" aria-hidden=\"true\">⏎</nord-kbd>\n      </div>\n    `\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'nord-combobox': Combobox\n  }\n}\n"],"names":["Icon","registerIcon","addIcon","Combobox","ComboboxBase","constructor","this","value","multiple","clearable","creatable","slottedOptions","createdOptions","optionElements","Set","optionRegistry","add","option","rebuildSlottedOptions","remove","delete","notify","registryProvider","ContextProvider","context","comboboxRegistryContext","initialValue","connectedCallback","super","injectLightDomStyles","style","readOptionElement","el","group","_a","closest","getAttribute","undefined","label","_d","_b","_c","textContent","trim","_e","disabled","hasAttribute","children","length","html","innerHTML","ordered","sort","a","b","compareDocumentPosition","Node","DOCUMENT_POSITION_FOLLOWING","map","resolvedOptions","base","options","created","cache","resolvedCache","slotted","result","isMultiple","showsQueryInInput","queryDirty","inputPlaceholder","hasValue","placeholder","createIndex","canCreate","filteredOptions","query","search","some","toLocaleLowerCase","showClear","ariaMultiselectable","clear","dispatchEvent","ComboboxClearEvent","commit","focus","selectOption","labelCache","set","next","values","includes","filter","onInput","input","emitCreate","ComboboxCreateEvent","o","onUnhandledKeydown","e","key","removeValue","v","renderLeadingControl","repeat","stopPropagation","labelFor","nothing","renderCreate","active","activeDescendant","activeIndex","createId","classMap","setActiveIndex","localize","term","__decorate","property","attribute","prototype","reflect","type","Boolean","state","customElement"],"mappings":"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"}