@fremtind/jokul 5.0.0-next.9 → 5.0.0

package/build/es/components/datepicker/DatePicker.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{c as r}from"../../../clsx-BeLtu-UY.js";import{d as a,g as o}from"../../../utils-CcE6HjQp.js";import{forwardRef as n,useState as l,useRef as s,useCallback as i}from"react";import{flushSync as u}from"react-dom";import{formatDateString as c}from"../../utilities/formatters/date/formatDate.js";import{IconButton as d}from"../icon-button/IconButton.js";import{CalendarIcon as p}from"../icon/icons/CalendarIcon.js";import{InputGroup as m}from"../input-group/InputGroup.js";import{Popover as f}from"../popover/Popover.js";import{BaseTextInput as v}from"../text-input/BaseTextInput.js";import{Calendar as D}from"./internal/Calendar.js";import{parseDateString as h,formatInput as b}from"./utils.js";import{isWithinLowerBound as g,isWithinUpperBound as k}from"./validation.js";const j=n((n,j)=>{const{"data-testautoid":y,id:L,className:w="",label:x="Velg dato",labelProps:C,defaultValue:I,defaultShow:O=!1,value:P,disableBeforeDate:T,disableAfterDate:B,yearsToShow:E,name:_,helpLabel:S,errorLabel:N,invalid:R,days:U,months:V,monthLabel:F,yearLabel:K,placeholder:W="dd.mm.åååå",width:A="11.25rem",onChange:G,onBlur:H,onFocus:M,onKeyDown:q,action:$,showCalendarLabel:z="Åpne kalender",hideCalendarLabel:J="Lukk kalender",supportLabelProps:Q,tooltip:X,textInputProps:Y,description:Z,...ee}=n;"production"!==process.env.NODE_ENV&&P&&I&&console.warn("DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.");const te=h(T),re=te?a(te).startOf("day").toDate():void 0,ae=h(B),oe=ae?a(ae).startOf("day").toDate():void 0,[ne,le]=l(o(P,I,re,oe)),[se,ie]=l(null),[ue,ce]=l(O),de=s(null),pe=s(null),me=s(null),fe=s(null),ve=s(!1),De=i(e=>{fe.current=e,j&&("function"==typeof j?j(e):j.current=e)},[j]),he=i(e=>{M&&pe.current&&(pe.current.contains(e.relatedTarget)||M(e,ne,{error:se,value:e.target.value}))},[M,ne,se]),be=i(e=>{H&&H(e,ne,{error:se,value:e.target.value})},[H,ne,se]),ge=i(e=>{"Escape"===e.key&&(ce(!1),e.preventDefault(),e.stopPropagation()),$?.onKeyDown&&$.onKeyDown(e)},[$]),ke=i(e=>{const t=e.currentTarget.value,r=((e,t)=>{const r=e.replace(/\D/g,""),a=c(r,{partial:!0}),o=e.replace(/\D+$/,""),n=8===r.length?c(r):e,l=h(n)?n:null,s=t&&e!==r&&o===a&&void 0===h(e)&&null===l;return l??(s?r:e)})(t,ve.current);r!==t&&((e,t)=>{const r=Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,"value")?.set;r?r.call(e,t):e.value=t})(e.currentTarget,r);const a=t.replace(/\D/g,"");ve.current=t===a&&r===c(a)&&r!==t&&void 0!==h(r);const{date:o,error:n}=(({value:e,minDate:t,maxDate:r})=>{if(!e)return{date:null,error:null};const a=h(e);return a?t&&!g(a,t)?{date:a,error:"OUTSIDE_LOWER_BOUND"}:r&&!k(a,r)?{date:a,error:"OUTSIDE_UPPER_BOUND"}:{date:a,error:null}:{date:null,error:"WRONG_FORMAT"}})({value:r,minDate:re,maxDate:oe});o&&!n&&ce(!1),ie(n),le(o),G&&G(e,o,{error:n,value:r})},[G,re,oe]),je=i(e=>{u(()=>{ce(!ue)});const t=de.current,r=t&&t.querySelector('[aria-pressed="true"]');window.requestAnimationFrame(()=>r?.focus()),$?.onClick&&$.onClick(e)},[ue,$]),ye=i(({date:e})=>{if(ce(!1),le(e),fe.current){const t=fe.current;ve.current=!1,t.value=b(e);const r=document.createEvent("HTMLEvents");r.initEvent("input",!0,!1),t.dispatchEvent(r),t.focus(),G&&G(r,e,{error:null,value:t.value})}},[G]),Le=i(e=>{e.preventDefault(),ce(!1),me.current?.focus()},[]);return e(m,{id:L,className:r("jkl-datepicker",w),...ee,ref:pe,label:x,labelProps:C,helpLabel:S,errorLabel:N,supportLabelProps:Q,tooltip:X,description:Z,render:r=>e(v,{"data-focused":ue?"true":void 0,ref:De,"data-testid":"jkl-datepicker__input","data-testautoid":y,className:"jkl-datepicker__input",name:_,defaultValue:I,value:P,type:"text",placeholder:W,width:A,onFocus:he,onBlur:be,onChange:ke,actionButton:t(f,{positionReference:fe,open:ue,onOpenChange:()=>ce(!ue),offset:8,children:[e(f.Trigger,{...$,"data-testid":"jkl-datepicker__trigger",className:"jkl-text-input-action-button",title:ue?J:z,tabIndex:0,onClick:je,onKeyDown:ge,asChild:!0,children:e(d,{children:e(p,{})})}),e(f.Content,{initialFocus:-1,padding:24,children:e(D,{ref:de,date:ne,minDate:re,maxDate:oe,days:U,months:V,monthLabel:F,yearLabel:K,yearsToShow:E,onDateSelected:ye,onTabOutside:Le})})]}),...Y,...r,"aria-invalid":R||!!N})})});j.displayName="DatePicker";export{j as DatePicker};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{c as r}from"../../../clsx-BeLtu-UY.js";import{d as a,g as o}from"../../../utils-CtwpNW4I.js";import{forwardRef as n,useState as l,useRef as s,useCallback as i}from"react";import{flushSync as u}from"react-dom";import{formatDateString as c}from"../../utilities/formatters/date/formatDate.js";import{IconButton as d}from"../icon-button/IconButton.js";import{CalendarIcon as p}from"../icon/icons/CalendarIcon.js";import{InputGroup as m}from"../input-group/InputGroup.js";import{Popover as f}from"../popover/Popover.js";import{BaseTextInput as v}from"../text-input/BaseTextInput.js";import{Calendar as D}from"./internal/Calendar.js";import{parseDateString as h,formatInput as b}from"./utils.js";import{isWithinLowerBound as g,isWithinUpperBound as k}from"./validation.js";const j=n((n,j)=>{const{"data-testautoid":y,id:L,className:w="",label:x="Velg dato",labelProps:C,defaultValue:I,defaultShow:O=!1,value:P,disableBeforeDate:T,disableAfterDate:B,yearsToShow:E,name:_,helpLabel:S,errorLabel:N,invalid:R,days:U,months:V,monthLabel:F,yearLabel:K,placeholder:W="dd.mm.åååå",width:A="11.25rem",onChange:G,onBlur:H,onFocus:M,onKeyDown:q,action:$,showCalendarLabel:z="Åpne kalender",hideCalendarLabel:J="Lukk kalender",supportLabelProps:Q,tooltip:X,textInputProps:Y,description:Z,...ee}=n;"production"!==process.env.NODE_ENV&&P&&I&&console.warn("DatePicker må enten være controlled eller uncontrolled. Hvis du bruker defaultValue og value sammen vil defaultValue bli ignorert.");const te=h(T),re=te?a(te).startOf("day").toDate():void 0,ae=h(B),oe=ae?a(ae).startOf("day").toDate():void 0,[ne,le]=l(o(P,I,re,oe)),[se,ie]=l(null),[ue,ce]=l(O),de=s(null),pe=s(null),me=s(null),fe=s(null),ve=s(!1),De=i(e=>{fe.current=e,j&&("function"==typeof j?j(e):j.current=e)},[j]),he=i(e=>{M&&pe.current&&(pe.current.contains(e.relatedTarget)||M(e,ne,{error:se,value:e.target.value}))},[M,ne,se]),be=i(e=>{H&&H(e,ne,{error:se,value:e.target.value})},[H,ne,se]),ge=i(e=>{"Escape"===e.key&&(ce(!1),e.preventDefault(),e.stopPropagation()),$?.onKeyDown&&$.onKeyDown(e)},[$]),ke=i(e=>{const t=e.currentTarget.value,r=((e,t)=>{const r=e.replace(/\D/g,""),a=c(r,{partial:!0}),o=e.replace(/\D+$/,""),n=8===r.length?c(r):e,l=h(n)?n:null,s=t&&e!==r&&o===a&&void 0===h(e)&&null===l;return l??(s?r:e)})(t,ve.current);r!==t&&((e,t)=>{const r=Object.getOwnPropertyDescriptor(HTMLInputElement.prototype,"value")?.set;r?r.call(e,t):e.value=t})(e.currentTarget,r);const a=t.replace(/\D/g,"");ve.current=t===a&&r===c(a)&&r!==t&&void 0!==h(r);const{date:o,error:n}=(({value:e,minDate:t,maxDate:r})=>{if(!e)return{date:null,error:null};const a=h(e);return a?t&&!g(a,t)?{date:a,error:"OUTSIDE_LOWER_BOUND"}:r&&!k(a,r)?{date:a,error:"OUTSIDE_UPPER_BOUND"}:{date:a,error:null}:{date:null,error:"WRONG_FORMAT"}})({value:r,minDate:re,maxDate:oe});o&&!n&&ce(!1),ie(n),le(o),G&&G(e,o,{error:n,value:r})},[G,re,oe]),je=i(e=>{u(()=>{ce(!ue)});const t=de.current,r=t&&t.querySelector('[aria-pressed="true"]');window.requestAnimationFrame(()=>r?.focus()),$?.onClick&&$.onClick(e)},[ue,$]),ye=i(({date:e})=>{if(ce(!1),le(e),fe.current){const t=fe.current;ve.current=!1,t.value=b(e);const r=document.createEvent("HTMLEvents");r.initEvent("input",!0,!1),t.dispatchEvent(r),t.focus(),G&&G(r,e,{error:null,value:t.value})}},[G]),Le=i(e=>{e.preventDefault(),ce(!1),me.current?.focus()},[]);return e(m,{id:L,className:r("jkl-datepicker",w),...ee,ref:pe,label:x,labelProps:C,helpLabel:S,errorLabel:N,supportLabelProps:Q,tooltip:X,description:Z,render:r=>e(v,{"data-focused":ue?"true":void 0,ref:De,"data-testid":"jkl-datepicker__input","data-testautoid":y,className:"jkl-datepicker__input",name:_,defaultValue:I,value:P,type:"text",placeholder:W,width:A,onFocus:he,onBlur:be,onChange:ke,actionButton:t(f,{positionReference:fe,open:ue,onOpenChange:()=>ce(!ue),offset:8,children:[e(f.Trigger,{...$,"data-testid":"jkl-datepicker__trigger",className:"jkl-text-input-action-button",title:ue?J:z,tabIndex:0,onClick:je,onKeyDown:ge,asChild:!0,children:e(d,{children:e(p,{})})}),e(f.Content,{initialFocus:-1,padding:24,children:e(D,{ref:de,date:ne,minDate:re,maxDate:oe,days:U,months:V,monthLabel:F,yearLabel:K,yearsToShow:E,onDateSelected:ye,onTabOutside:Le})})]}),...Y,...r,"aria-invalid":R||!!N})})});j.displayName="DatePicker";export{j as DatePicker};
 //# sourceMappingURL=DatePicker.js.map

package/build/es/components/datepicker/internal/Calendar.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{forwardRef as a,useReducer as n,useEffect as r,useCallback as l,useRef as o}from"react";import{flushSync as s}from"react-dom";import{useId as d}from"../../../hooks/useId/useId.js";import{Button as c}from"../../button/Button.js";import{ArrowLeftIcon as i}from"../../icon/icons/ArrowLeftIcon.js";import{ArrowRightIcon as u}from"../../icon/icons/ArrowRightIcon.js";import{ChevronDownIcon as h}from"../../icon/icons/ChevronDownIcon.js";import{calendarReducer as m,calendarInitializer as f}from"./calendarReducer.js";import{useCalendar as g}from"./useCalendar.js";import{D as b,a as p,i as v,s as k,b as j,c as D,e as w,f as y}from"../../../../utils-CcE6HjQp.js";const M=["Januar","Februar","Mars","April","Mai","Juni","Juli","August","September","Oktober","November","Desember"],F=["man","tir","ons","tor","fre","lør","søn"],S=a((a,S)=>{const{date:A,defaultSelected:N,minDate:_,maxDate:$,days:x=F,months:C=M,monthLabel:E="Velg måned",yearLabel:Y="Velg år",yearsToShow:I=b,onTabOutside:O,...T}=a,R=d("jkl-calendar"),[{offset:L,selectedDate:q,shownDate:K},B]=n(m,p(A,N,_,$),f),J=K.getMonth(),P=K.getFullYear();r(()=>{B({type:"SET_SELECTED_DATE",newDate:p(A,N,_,$)})},[A,N,_,$]);const V=l(e=>{B({type:"SET_OFFSET",newOffset:e})},[]),{calendars:z,getBackProps:U,getDateProps:W,getForwardProps:G,handleOffsetChanged:H}=g({date:q,selected:q,minDate:_,maxDate:$,offset:L,onOffsetChanged:V,firstDayOfWeek:1,...T}),Q=o(null),X=l(e=>{if(!Q.current)return;const t=document.activeElement,a=Q.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]'),n=async e=>{t?.setAttribute("tabindex","-1"),e.setAttribute("tabindex","0"),e.focus()};a.forEach((r,l)=>{const o=l+e;if(r===t)if(o<=a.length-1&&o>=0)n(a[o]);else if(e<0){if(v({calendars:z,minDate:_})||(s(()=>{H(L-k({calendars:z,offset:1,minDate:_}))}),!Q.current))return;const e=Q.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[e.length+o]&&(e[0].setAttribute("tabindex","-1"),n(e[e.length+o]))}else{if(j({calendars:z,maxDate:$})||(s(()=>{H(L+D({calendars:z,offset:1,maxDate:$}))}),!Q.current))return;const e=Q.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[o-a.length]&&(e[0].setAttribute("tabindex","-1"),n(e[o-a.length]))}})},[H,L,z,$,_]),Z=l(e=>{switch(e.key){case"ArrowUp":X(-7),e.preventDefault();break;case"ArrowRight":X(1),e.preventDefault();break;case"ArrowDown":X(7),e.preventDefault();break;case"ArrowLeft":X(-1),e.preventDefault()}},[X]),ee=l(e=>{if("Tab"!==e.key)return;const t=Q.current?.querySelectorAll('button:not([disabled]):not([tabindex="-1"]), select');if(!t)return;const a=t[0],n=t[t.length-1];e.shiftKey||document.activeElement!==n?e.shiftKey&&document.activeElement===a&&(n.focus(),e.preventDefault()):(a.focus(),e.preventDefault())},[]),te=l(e=>{const{date:t,selected:a,selectable:n,prevMonth:r,nextMonth:l}=e;return!!n&&!(!a&&t.toString()!==_?.toString()&&(r||l||K.getFullYear()!==t.getFullYear()||q.getMonth()===t.getMonth()||1!==t.getDate()))},[K,_,q]),ae=l(()=>{_&&K.getFullYear()-_.getFullYear()===0&&K.getMonth()-_.getMonth()===1?document.querySelector(`[data-testid="${R}-forward-button"]`)?.focus():$&&$.getFullYear()-K.getFullYear()===0&&$.getMonth()-K.getMonth()===1&&document.querySelector(`[data-testid="${R}-back-button"]`)?.focus()},[_,$,K,R]),ne=l(e=>{if(4!==e.target.value.length)return;const t=Number.parseInt(e.target.value);if(Number.isNaN(t))return;let a=12*(t-K.getFullYear());const n=new Date(K.getFullYear(),K.getMonth()+a,K.getDate());$&&$.getFullYear()===n.getFullYear()&&$.getMonth()<n.getMonth()?a-=n.getMonth()-$.getMonth():_&&_.getFullYear()===n.getFullYear()&&_.getMonth()>n.getMonth()&&(a+=_.getMonth()-n.getMonth()),B({type:"ADD_OFFSET",addedOffset:a})},[K,_,$]),re=l(e=>{if(!q&&!A)return;const t=K.getFullYear()-(q||new Date).getFullYear(),a=Number.parseInt(e.target.value)-(q||new Date).getMonth();B({type:"SET_OFFSET",newOffset:12*t+a})},[q,A,K]),le=w(P,_,$,I),oe=y(P,C,_,$);return e("div",{ref:S,id:R,className:"jkl-calendar","data-testid":"jkl-calendar",children:t("div",{className:"jkl-calendar__padding",ref:Q,onKeyDown:ee,children:[t("fieldset",{className:"jkl-calendar-navigation",children:[t("div",{children:[e(c,{...U({calendars:z,onClick:ae}),"data-testid":`${R}-back-button`,variant:"ghost",icon:e(i,{variant:"medium",bold:!0})}),e(c,{...G({calendars:z,onClick:ae}),variant:"ghost","data-testid":`${R}-forward-button`,icon:e(u,{variant:"medium",bold:!0})})]}),t("div",{children:[t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:re,className:"jkl-calendar-navigation-dropdown__select","aria-label":E,value:J.toString(),children:oe.map(({label:t,value:a})=>e("option",{value:a,children:t},a))}),e(h,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]}),t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:ne,className:"jkl-calendar-navigation-dropdown__select","aria-label":Y,value:P.toString(),children:le.map(t=>e("option",{value:t,children:t},t))}),e(h,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]})]})]}),z.map(a=>t("table",{className:"jkl-calendar-table","data-testid":"jkl-datepicker-calendar",children:[t("caption",{className:"jkl-sr-only",children:[C[a.month],", ",a.year]}),e("thead",{children:e("tr",{children:x.map(t=>e("th",{children:t},`${a.month}${a.year}${t}`))})}),e("tbody",{"data-testid":"jkl-datepicker-dates",children:a.weeks.map((t,n)=>e("tr",{children:t.map((t,r)=>{const l=`${a.month}${a.year}${n}${r}`;if("string"==typeof t)return e("td",{className:"jkl-calendar__date jkl-calendar__date--empty",children:t},l);const{date:o,selectable:s,today:d,prevMonth:c,nextMonth:i}=t;return e("td",{children:e("button",{...W({dateObj:t}),type:"button",className:"jkl-calendar-date-button",tabIndex:te(t)?0:-1,"aria-label":`${o.getDate()}. ${C[o.getMonth()].toLowerCase()}`,"aria-current":d?"date":void 0,"data-adjacent":c||i?"true":void 0,disabled:!s,onKeyDown:Z,children:e("span",{"aria-hidden":"true",children:o.getDate()})})},l)})},`${a.month}${a.year}${n}`))})]},`${a.month}${a.year}`))]})})});S.displayName="Calendar";export{S as Calendar};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{forwardRef as a,useReducer as n,useEffect as r,useCallback as l,useRef as o}from"react";import{flushSync as s}from"react-dom";import{useId as d}from"../../../hooks/useId/useId.js";import{Button as c}from"../../button/Button.js";import{ArrowLeftIcon as i}from"../../icon/icons/ArrowLeftIcon.js";import{ArrowRightIcon as u}from"../../icon/icons/ArrowRightIcon.js";import{ChevronDownIcon as h}from"../../icon/icons/ChevronDownIcon.js";import{calendarReducer as m,calendarInitializer as f}from"./calendarReducer.js";import{useCalendar as g}from"./useCalendar.js";import{D as b,a as p,i as v,s as k,b as j,c as D,e as w,f as y}from"../../../../utils-CtwpNW4I.js";const M=["Januar","Februar","Mars","April","Mai","Juni","Juli","August","September","Oktober","November","Desember"],F=["man","tir","ons","tor","fre","lør","søn"],S=a((a,S)=>{const{date:A,defaultSelected:N,minDate:_,maxDate:$,days:x=F,months:C=M,monthLabel:E="Velg måned",yearLabel:Y="Velg år",yearsToShow:I=b,onTabOutside:O,...T}=a,R=d("jkl-calendar"),[{offset:L,selectedDate:q,shownDate:K},B]=n(m,p(A,N,_,$),f),J=K.getMonth(),P=K.getFullYear();r(()=>{B({type:"SET_SELECTED_DATE",newDate:p(A,N,_,$)})},[A,N,_,$]);const V=l(e=>{B({type:"SET_OFFSET",newOffset:e})},[]),{calendars:z,getBackProps:U,getDateProps:W,getForwardProps:G,handleOffsetChanged:H}=g({date:q,selected:q,minDate:_,maxDate:$,offset:L,onOffsetChanged:V,firstDayOfWeek:1,...T}),Q=o(null),X=l(e=>{if(!Q.current)return;const t=document.activeElement,a=Q.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]'),n=async e=>{t?.setAttribute("tabindex","-1"),e.setAttribute("tabindex","0"),e.focus()};a.forEach((r,l)=>{const o=l+e;if(r===t)if(o<=a.length-1&&o>=0)n(a[o]);else if(e<0){if(v({calendars:z,minDate:_})||(s(()=>{H(L-k({calendars:z,offset:1,minDate:_}))}),!Q.current))return;const e=Q.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[e.length+o]&&(e[0].setAttribute("tabindex","-1"),n(e[e.length+o]))}else{if(j({calendars:z,maxDate:$})||(s(()=>{H(L+D({calendars:z,offset:1,maxDate:$}))}),!Q.current))return;const e=Q.current.querySelectorAll('button.jkl-calendar-date-button:not([data-adjacent="true"]');e[o-a.length]&&(e[0].setAttribute("tabindex","-1"),n(e[o-a.length]))}})},[H,L,z,$,_]),Z=l(e=>{switch(e.key){case"ArrowUp":X(-7),e.preventDefault();break;case"ArrowRight":X(1),e.preventDefault();break;case"ArrowDown":X(7),e.preventDefault();break;case"ArrowLeft":X(-1),e.preventDefault()}},[X]),ee=l(e=>{if("Tab"!==e.key)return;const t=Q.current?.querySelectorAll('button:not([disabled]):not([tabindex="-1"]), select');if(!t)return;const a=t[0],n=t[t.length-1];e.shiftKey||document.activeElement!==n?e.shiftKey&&document.activeElement===a&&(n.focus(),e.preventDefault()):(a.focus(),e.preventDefault())},[]),te=l(e=>{const{date:t,selected:a,selectable:n,prevMonth:r,nextMonth:l}=e;return!!n&&!(!a&&t.toString()!==_?.toString()&&(r||l||K.getFullYear()!==t.getFullYear()||q.getMonth()===t.getMonth()||1!==t.getDate()))},[K,_,q]),ae=l(()=>{_&&K.getFullYear()-_.getFullYear()===0&&K.getMonth()-_.getMonth()===1?document.querySelector(`[data-testid="${R}-forward-button"]`)?.focus():$&&$.getFullYear()-K.getFullYear()===0&&$.getMonth()-K.getMonth()===1&&document.querySelector(`[data-testid="${R}-back-button"]`)?.focus()},[_,$,K,R]),ne=l(e=>{if(4!==e.target.value.length)return;const t=Number.parseInt(e.target.value);if(Number.isNaN(t))return;let a=12*(t-K.getFullYear());const n=new Date(K.getFullYear(),K.getMonth()+a,K.getDate());$&&$.getFullYear()===n.getFullYear()&&$.getMonth()<n.getMonth()?a-=n.getMonth()-$.getMonth():_&&_.getFullYear()===n.getFullYear()&&_.getMonth()>n.getMonth()&&(a+=_.getMonth()-n.getMonth()),B({type:"ADD_OFFSET",addedOffset:a})},[K,_,$]),re=l(e=>{if(!q&&!A)return;const t=K.getFullYear()-(q||new Date).getFullYear(),a=Number.parseInt(e.target.value)-(q||new Date).getMonth();B({type:"SET_OFFSET",newOffset:12*t+a})},[q,A,K]),le=w(P,_,$,I),oe=y(P,C,_,$);return e("div",{ref:S,id:R,className:"jkl-calendar","data-testid":"jkl-calendar",children:t("div",{className:"jkl-calendar__padding",ref:Q,onKeyDown:ee,children:[t("fieldset",{className:"jkl-calendar-navigation",children:[t("div",{children:[e(c,{...U({calendars:z,onClick:ae}),"data-testid":`${R}-back-button`,variant:"ghost",icon:e(i,{variant:"medium",bold:!0})}),e(c,{...G({calendars:z,onClick:ae}),variant:"ghost","data-testid":`${R}-forward-button`,icon:e(u,{variant:"medium",bold:!0})})]}),t("div",{children:[t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:re,className:"jkl-calendar-navigation-dropdown__select","aria-label":E,value:J.toString(),children:oe.map(({label:t,value:a})=>e("option",{value:a,children:t},a))}),e(h,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]}),t("div",{className:"jkl-calendar-navigation-dropdown",children:[e("select",{onChange:ne,className:"jkl-calendar-navigation-dropdown__select","aria-label":Y,value:P.toString(),children:le.map(t=>e("option",{value:t,children:t},t))}),e(h,{bold:!0,className:"jkl-calendar-navigation-dropdown__chevron"})]})]})]}),z.map(a=>t("table",{className:"jkl-calendar-table","data-testid":"jkl-datepicker-calendar",children:[t("caption",{className:"jkl-sr-only",children:[C[a.month],", ",a.year]}),e("thead",{children:e("tr",{children:x.map(t=>e("th",{children:t},`${a.month}${a.year}${t}`))})}),e("tbody",{"data-testid":"jkl-datepicker-dates",children:a.weeks.map((t,n)=>e("tr",{children:t.map((t,r)=>{const l=`${a.month}${a.year}${n}${r}`;if("string"==typeof t)return e("td",{className:"jkl-calendar__date jkl-calendar__date--empty",children:t},l);const{date:o,selectable:s,today:d,prevMonth:c,nextMonth:i}=t;return e("td",{children:e("button",{...W({dateObj:t}),type:"button",className:"jkl-calendar-date-button",tabIndex:te(t)?0:-1,"aria-label":`${o.getDate()}. ${C[o.getMonth()].toLowerCase()}`,"aria-current":d?"date":void 0,"data-adjacent":c||i?"true":void 0,disabled:!s,onKeyDown:Z,children:e("span",{"aria-hidden":"true",children:o.getDate()})})},l)})},`${a.month}${a.year}${n}`))})]},`${a.month}${a.year}`))]})})});S.displayName="Calendar";export{S as Calendar};
 //# sourceMappingURL=Calendar.js.map

package/build/es/components/datepicker/internal/useCalendar.js

@@ -1,2 +1,2 @@
-import{h as e,d as a,b as t,j as n,i as s,s as o,c as f}from"../../../../utils-CcE6HjQp.js";import{useState as l}from"react";function d(e){return void 0!==e}function i(e,{onClick:a,dateObj:t}){return{onClick:n(a,a=>{e(t,a)}),disabled:!t.selectable,"aria-pressed":t.selected,role:"button"}}function r({minDate:e,offsetMonth:a,handleOffsetChanged:t},{onClick:f,offset:l=1,calendars:d}){const i=`Gå tilbake ${l} måned${1===l?"":"er"}`;return{onClick:n(f,()=>{t(a-o({calendars:d,offset:l,minDate:e}))}),disabled:s({calendars:d,minDate:e}),"aria-label":i,title:i}}function c({maxDate:e,offsetMonth:a,handleOffsetChanged:s},{onClick:o,offset:l=1,calendars:d}){const i=`Gå frem ${l} måned${1===l?"":"er"}`;return{onClick:n(o,()=>{s(a+f({calendars:d,offset:l,maxDate:e}))}),disabled:t({calendars:d,maxDate:e}),"aria-label":i,title:i}}function u({date:t=a().startOf("day").toDate(),maxDate:n,minDate:s,monthsToDisplay:o=1,firstDayOfWeek:f=0,showOutsideDays:u=!0,offset:m,onDateSelected:D,onOffsetChanged:h,selected:b}){const[C,O]=l(0),k=function(e,a){return d(e)?e:a}(m,C);function g(e){d(m)||O(e),h(e)}return{calendars:e({date:t,selected:b,monthsToDisplay:o,minDate:s,maxDate:n,offset:k,firstDayOfWeek:f,showOutsideDays:u}),getDateProps:i.bind(null,D),getBackProps:r.bind(null,{minDate:s,offsetMonth:k,handleOffsetChanged:g}),getForwardProps:c.bind(null,{maxDate:n,offsetMonth:k,handleOffsetChanged:g}),handleOffsetChanged:g}}export{u as useCalendar};
+import{h as e,d as a,b as t,j as n,i as s,s as o,c as f}from"../../../../utils-CtwpNW4I.js";import{useState as l}from"react";function d(e){return void 0!==e}function i(e,{onClick:a,dateObj:t}){return{onClick:n(a,a=>{e(t,a)}),disabled:!t.selectable,"aria-pressed":t.selected,role:"button"}}function r({minDate:e,offsetMonth:a,handleOffsetChanged:t},{onClick:f,offset:l=1,calendars:d}){const i=`Gå tilbake ${l} måned${1===l?"":"er"}`;return{onClick:n(f,()=>{t(a-o({calendars:d,offset:l,minDate:e}))}),disabled:s({calendars:d,minDate:e}),"aria-label":i,title:i}}function c({maxDate:e,offsetMonth:a,handleOffsetChanged:s},{onClick:o,offset:l=1,calendars:d}){const i=`Gå frem ${l} måned${1===l?"":"er"}`;return{onClick:n(o,()=>{s(a+f({calendars:d,offset:l,maxDate:e}))}),disabled:t({calendars:d,maxDate:e}),"aria-label":i,title:i}}function u({date:t=a().startOf("day").toDate(),maxDate:n,minDate:s,monthsToDisplay:o=1,firstDayOfWeek:f=0,showOutsideDays:u=!0,offset:m,onDateSelected:D,onOffsetChanged:h,selected:b}){const[C,O]=l(0),k=function(e,a){return d(e)?e:a}(m,C);function g(e){d(m)||O(e),h(e)}return{calendars:e({date:t,selected:b,monthsToDisplay:o,minDate:s,maxDate:n,offset:k,firstDayOfWeek:f,showOutsideDays:u}),getDateProps:i.bind(null,D),getBackProps:r.bind(null,{minDate:s,offsetMonth:k,handleOffsetChanged:g}),getForwardProps:c.bind(null,{maxDate:n,offsetMonth:k,handleOffsetChanged:g}),handleOffsetChanged:g}}export{u as useCalendar};
 //# sourceMappingURL=useCalendar.js.map

package/build/es/components/datepicker/internal/utils.js

@@ -1,2 +1,2 @@
-import{D as a,c as s,j as t,l as e,m as i,h as o,g as n,a as r,f as d,e as l,i as c,b as g,k as m,s as p}from"../../../../utils-CcE6HjQp.js";import"react";import"../utils.js";export{a as DEFAULT_YEARS_TO_SHOW,s as addMonth,t as composeEventHandlers,e as dateHasChanged,i as dateIsOutsideRange,o as getCalendars,n as getInitialDate,r as getInitialDateShown,d as getMonthSelectOptions,l as getYearSelectOptions,c as isBackDisabled,g as isForwardDisabled,m as isSameDay,p as subtractMonth};
+import{D as a,c as s,j as t,k as e,l as i,h as o,g as n,a as r,f as d,e as l,i as c,b as g,m,s as p}from"../../../../utils-CtwpNW4I.js";import"react";import"../utils.js";export{a as DEFAULT_YEARS_TO_SHOW,s as addMonth,t as composeEventHandlers,e as dateHasChanged,i as dateIsOutsideRange,o as getCalendars,n as getInitialDate,r as getInitialDateShown,d as getMonthSelectOptions,l as getYearSelectOptions,c as isBackDisabled,g as isForwardDisabled,m as isSameDay,p as subtractMonth};
 //# sourceMappingURL=utils.js.map

package/build/es/components/expander/Accordion.d.ts

@@ -0,0 +1,2 @@
+import { AccordionProps } from './types.js';
+export declare const Accordion: ({ children, outlined, className, ...rest }: AccordionProps) => import("react").JSX.Element;

package/build/es/components/expander/Accordion.js

@@ -0,0 +1,2 @@
+import{jsx as c}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";const s=({children:s,outlined:a=!1,className:r,...e})=>c("section",{className:o("jkl-accordion",r),"data-outlined":a,...e,children:s});export{s as Accordion};
+//# sourceMappingURL=Accordion.js.map

package/build/es/components/expander/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.js","sources":["../../../../src/components/expander/Accordion.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport type { AccordionProps } from \"./types.js\";\n\nexport const Accordion = ({\n    children,\n    outlined = false,\n    className,\n    ...rest\n}: AccordionProps) => (\n    <section\n        className={clsx(\"jkl-accordion\", className)}\n        data-outlined={outlined}\n        {...rest}\n    >\n        {children}\n    </section>\n);\n"],"names":["Accordion","children","outlined","className","rest","jsx","clsx"],"mappings":"sFAGO,MAAMA,EAAY,EACrBC,SAAAA,EACAC,SAAAA,GAAW,EACXC,UAAAA,KACGC,KAEHC,EAAC,UAAA,CACGF,UAAWG,EAAK,gBAAiBH,GACjC,gBAAeD,KACXE,EAEHH,SAAAA"}

package/build/es/components/expander/ExpandablePanel.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import n,{useState as r,useRef as s,useImperativeHandle as o,useEffect as i}from"react";import{ExpandablePanelContent as l}from"./ExpandablePanelContent.js";import{Expander as d}from"./Expander.js";import{ExpanderContext as p}from"./context.js";const c=Object.assign(n.forwardRef(function(n,l){const{children:d,as:c="details",variant:m="fill",open:x,defaultOpen:f,onOpenChange:u,className:j,...v}=n,[E,b]=r(f||!1),[g,h]=r(!1),[k,C]=r(0),N=s();o(l,()=>N.current,[]);const P=c,_=typeof x<"u",w=_?x:E;return i(()=>{const e=e=>{b("open"===e.newState)},t=N.current;return t?.addEventListener("toggle",e),()=>t?.removeEventListener("toggle",e)},[]),e("div",{className:"jkl-expandable__wrapper",children:[t("div",{ref:e=>e?.setAttribute("inert","true"),className:"jkl-expandable__focus-container",style:{height:k}}),t(P,{ref:N,"data-testid":"jkl-expand-section",className:a("jkl-expandable",`jkl-expandable--${m}`,j),open:"details"===c?w||g:void 0,"data-visible-content":w||g,...v,children:t(p.Provider,{value:{open:w,onToggle:()=>{_?u?.(!w):b(e=>(u?.(!e),!e))},onTransitionEnd:h,onTransitionStart:e=>{e&&h(!0)},setExpanderHeight:C},children:d})})]})}),{Content:l,Header:d});export{c as ExpandablePanel};
+import{jsxs as e,jsx as n}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import t,{useState as r,useRef as s,useImperativeHandle as o,useEffect as l}from"react";import{ExpandablePanelContent as i}from"./ExpandablePanelContent.js";import{Expander as d}from"./Expander.js";import{ExpanderContext as p}from"./context.js";const c=Object.assign(t.forwardRef(function(t,i){const{children:d,as:c="details",outlined:m,open:x,defaultOpen:u,onOpenChange:f,className:j,...E}=t,[b,g]=r(u||!1),[v,h]=r(!1),[k,C]=r(0),N=s();o(i,()=>N.current,[]);const P=c,_=typeof x<"u",w=_?x:b;return l(()=>{const e=e=>{g("open"===e.newState)},n=N.current;return n?.addEventListener("toggle",e),()=>n?.removeEventListener("toggle",e)},[]),e("div",{className:"jkl-expandable-panel__wrapper",children:[n("div",{ref:e=>e?.setAttribute("inert","true"),className:"jkl-expandable-panel__focus-container",style:{height:k}}),n(P,{ref:N,"data-testid":"jkl-expand-section",className:a("jkl-expandable-panel",m&&"jkl-expandable-panel--outlined",j),open:"details"===c?w||v:void 0,"data-visible-content":w||v,...E,children:n(p.Provider,{value:{open:w,onToggle:()=>{_?f?.(!w):g(e=>(f?.(!e),!e))},onTransitionEnd:h,onTransitionStart:e=>{e&&h(!0)},setExpanderHeight:C},children:d})})]})}),{Content:i,Header:d});export{c as ExpandablePanel};
 //# sourceMappingURL=ExpandablePanel.js.map

package/build/es/components/expander/ExpandablePanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandablePanel.js","sources":["../../../../src/components/expander/ExpandablePanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useImperativeHandle, useRef, useState } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ExpandablePanelContent } from \"./ExpandablePanelContent.js\";\nimport { Expander } from \"./Expander.jsx\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n    ExpandablePanelComponent,\n    ExpandablePanelProps,\n} from \"./types.js\";\n\nexport const ExpandablePanel = Object.assign(\n    React.forwardRef(function ExpandablePanel<\n        ElementType extends React.ElementType = \"details\",\n    >(\n        props: ExpandablePanelProps<ElementType>,\n        ref?: PolymorphicRef<ElementType>,\n    ) {\n        const {\n            children,\n            as = \"details\",\n            variant = \"fill\",\n            open: controlledOpen,\n            defaultOpen,\n            onOpenChange,\n            className,\n            ...rest\n        } = props;\n\n        const [uncontrolledOpen, setUncontrolledOpen] = useState(\n            defaultOpen || false,\n        );\n        const [contentIsVisible, setContentIsVisible] = useState(false);\n        const [expanderHeight, setExpanderHeight] = useState(0);\n\n        const internalRef = useRef<HTMLDetailsElement>();\n        useImperativeHandle(ref, () => internalRef.current, []);\n\n        const El = as;\n        const isControlled = typeof controlledOpen !== \"undefined\";\n        const isOpen = isControlled ? controlledOpen : uncontrolledOpen;\n\n        const setVisibleIfOpening = (isOpening: boolean) => {\n            if (isOpening) {\n                setContentIsVisible(true);\n            }\n        };\n\n        const syncUncontrolledState = () => {\n            if (isControlled) {\n                onOpenChange?.(!isOpen);\n                return;\n            }\n            setUncontrolledOpen((previousValue) => {\n                onOpenChange?.(!previousValue);\n                return !previousValue;\n            });\n        };\n\n        useEffect(() => {\n            const callback = (e: ToggleEvent & { newState: string }) => {\n                setUncontrolledOpen(e.newState === \"open\");\n            };\n\n            const element = internalRef.current;\n\n            element?.addEventListener(\"toggle\", callback as EventListener);\n\n            return () =>\n                element?.removeEventListener(\n                    \"toggle\",\n                    callback as EventListener,\n                );\n        }, []);\n\n        return (\n            <div className=\"jkl-expandable__wrapper\">\n                <div\n                    /*\n                        Setter `inert` manuelt for å støtte både React 18 og 19.\n\n                        Dette unngår typefeil i React 18 og advarsler i React 19.\n                        Se: https://github.com/WICG/inert/issues/58\n                    */\n                    ref={(node) => node?.setAttribute(\"inert\", \"true\")}\n                    className=\"jkl-expandable__focus-container\"\n                    style={{ height: expanderHeight }}\n                />\n                <El\n                    ref={internalRef}\n                    data-testid={\"jkl-expand-section\"}\n                    className={clsx(\n                        \"jkl-expandable\",\n                        `jkl-expandable--${variant}`,\n                        className,\n                    )}\n                    open={\n                        /* for the animation to work in Safari we must ensure that\n                         * the element is open *before* the transition starts */\n                        as === \"details\"\n                            ? isOpen || contentIsVisible\n                            : undefined\n                    }\n                    /* this attribute is used for styling purposes */\n                    data-visible-content={isOpen || contentIsVisible}\n                    {...rest}\n                >\n                    <ExpanderContext.Provider\n                        value={{\n                            open: isOpen,\n                            onToggle: syncUncontrolledState,\n                            onTransitionEnd: setContentIsVisible,\n                            onTransitionStart: setVisibleIfOpening,\n                            setExpanderHeight,\n                        }}\n                    >\n                        {children}\n                    </ExpanderContext.Provider>\n                </El>\n            </div>\n        );\n    }),\n    { Content: ExpandablePanelContent, Header: Expander },\n) as ExpandablePanelComponent;\n"],"names":["ExpandablePanel","Object","assign","React","forwardRef","props","ref","children","as","variant","open","controlledOpen","defaultOpen","onOpenChange","className","rest","uncontrolledOpen","setUncontrolledOpen","useState","contentIsVisible","setContentIsVisible","expanderHeight","setExpanderHeight","internalRef","useRef","useImperativeHandle","current","El","isControlled","isOpen","useEffect","callback","e","newState","element","addEventListener","removeEventListener","jsxs","jsx","node","setAttribute","style","height","clsx","ExpanderContext","Provider","value","onToggle","previousValue","onTransitionEnd","onTransitionStart","isOpening","Content","ExpandablePanelContent","Header","Expander"],"mappings":"qVAWO,MAAMA,EAAkBC,OAAOC,OAClCC,EAAMC,WAAW,SAGbC,EACAC,GAEA,MACIC,SAAAA,EACAC,GAAAA,EAAK,UACLC,QAAAA,EAAU,OACVC,KAAMC,EACNC,YAAAA,EACAC,aAAAA,EACAC,UAAAA,KACGC,GACHV,GAEGW,EAAkBC,GAAuBC,EAC5CN,IAAe,IAEZO,EAAkBC,GAAuBF,GAAS,IAClDG,EAAgBC,GAAqBJ,EAAS,GAE/CK,EAAcC,IACpBC,EAAoBnB,EAAK,IAAMiB,EAAYG,QAAS,IAEpD,MAAMC,EAAKnB,EACLoB,SAAsBjB,EAAmB,IACzCkB,EAASD,EAAejB,EAAiBK,EAmB/C,OAAAc,EAAU,KACN,MAAMC,EAAYC,IACdf,EAAmC,SAAfe,EAAEC,WAGpBC,EAAUX,EAAYG,QAE5B,OAAAQ,GAASC,iBAAiB,SAAUJ,GAE7B,IACHG,GAASE,oBACL,SACAL,IAET,IAGCM,EAAC,MAAA,CAAIvB,UAAU,0BACXP,SAAA,CAAA+B,EAAC,MAAA,CAOGhC,IAAMiC,GAASA,GAAMC,aAAa,QAAS,QAC3C1B,UAAU,kCACV2B,MAAO,CAAEC,OAAQrB,KAErBiB,EAACX,EAAA,CACGrB,IAAKiB,EACL,cAAa,qBACbT,UAAW6B,EACP,iBACA,mBAAmBlC,IACnBK,GAEJJ,KAGW,YAAPF,EACMqB,GAAUV,OACV,EAGV,uBAAsBU,GAAUV,KAC5BJ,EAEJR,SAAA+B,EAACM,EAAgBC,SAAhB,CACGC,MAAO,CACHpC,KAAMmB,EACNkB,SA9DU,KACtBnB,EACAf,KAAgBgB,GAGpBZ,EAAqB+B,IACjBnC,KAAgBmC,IACRA,KAwDIC,gBAAiB7B,EACjB8B,kBAtESC,IACrBA,GACA/B,GAAoB,IAqERE,kBAAAA,GAGHf,SAAAA,QAKrB,GACA,CAAE6C,QAASC,EAAwBC,OAAQC"}
+{"version":3,"file":"ExpandablePanel.js","sources":["../../../../src/components/expander/ExpandablePanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useImperativeHandle, useRef, useState } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ExpandablePanelContent } from \"./ExpandablePanelContent.js\";\nimport { Expander } from \"./Expander.jsx\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n    ExpandablePanelComponent,\n    ExpandablePanelProps,\n} from \"./types.js\";\n\nexport const ExpandablePanel = Object.assign(\n    React.forwardRef(function ExpandablePanel<\n        ElementType extends React.ElementType = \"details\",\n    >(\n        props: ExpandablePanelProps<ElementType>,\n        ref?: PolymorphicRef<ElementType>,\n    ) {\n        const {\n            children,\n            as = \"details\",\n            outlined,\n            open: controlledOpen,\n            defaultOpen,\n            onOpenChange,\n            className,\n            ...rest\n        } = props;\n\n        const [uncontrolledOpen, setUncontrolledOpen] = useState(\n            defaultOpen || false,\n        );\n        const [contentIsVisible, setContentIsVisible] = useState(false);\n        const [expanderHeight, setExpanderHeight] = useState(0);\n\n        const internalRef = useRef<HTMLDetailsElement>();\n        useImperativeHandle(ref, () => internalRef.current, []);\n\n        const El = as;\n        const isControlled = typeof controlledOpen !== \"undefined\";\n        const isOpen = isControlled ? controlledOpen : uncontrolledOpen;\n\n        const setVisibleIfOpening = (isOpening: boolean) => {\n            if (isOpening) {\n                setContentIsVisible(true);\n            }\n        };\n\n        const syncUncontrolledState = () => {\n            if (isControlled) {\n                onOpenChange?.(!isOpen);\n                return;\n            }\n            setUncontrolledOpen((previousValue) => {\n                onOpenChange?.(!previousValue);\n                return !previousValue;\n            });\n        };\n\n        useEffect(() => {\n            const callback = (e: ToggleEvent & { newState: string }) => {\n                setUncontrolledOpen(e.newState === \"open\");\n            };\n\n            const element = internalRef.current;\n\n            element?.addEventListener(\"toggle\", callback as EventListener);\n\n            return () =>\n                element?.removeEventListener(\n                    \"toggle\",\n                    callback as EventListener,\n                );\n        }, []);\n\n        return (\n            <div className=\"jkl-expandable-panel__wrapper\">\n                <div\n                    /*\n                        Setter `inert` manuelt for å støtte både React 18 og 19.\n\n                        Dette unngår typefeil i React 18 og advarsler i React 19.\n                        Se: https://github.com/WICG/inert/issues/58\n                    */\n                    ref={(node) => node?.setAttribute(\"inert\", \"true\")}\n                    className=\"jkl-expandable-panel__focus-container\"\n                    style={{ height: expanderHeight }}\n                />\n                <El\n                    ref={internalRef}\n                    data-testid={\"jkl-expand-section\"}\n                    className={clsx(\n                        \"jkl-expandable-panel\",\n                        outlined && \"jkl-expandable-panel--outlined\",\n                        className,\n                    )}\n                    open={\n                        /* for the animation to work in Safari we must ensure that\n                         * the element is open *before* the transition starts */\n                        as === \"details\"\n                            ? isOpen || contentIsVisible\n                            : undefined\n                    }\n                    /* this attribute is used for styling purposes */\n                    data-visible-content={isOpen || contentIsVisible}\n                    {...rest}\n                >\n                    <ExpanderContext.Provider\n                        value={{\n                            open: isOpen,\n                            onToggle: syncUncontrolledState,\n                            onTransitionEnd: setContentIsVisible,\n                            onTransitionStart: setVisibleIfOpening,\n                            setExpanderHeight,\n                        }}\n                    >\n                        {children}\n                    </ExpanderContext.Provider>\n                </El>\n            </div>\n        );\n    }),\n    { Content: ExpandablePanelContent, Header: Expander },\n) as ExpandablePanelComponent;\n"],"names":["ExpandablePanel","Object","assign","React","forwardRef","props","ref","children","as","outlined","open","controlledOpen","defaultOpen","onOpenChange","className","rest","uncontrolledOpen","setUncontrolledOpen","useState","contentIsVisible","setContentIsVisible","expanderHeight","setExpanderHeight","internalRef","useRef","useImperativeHandle","current","El","isControlled","isOpen","useEffect","callback","e","newState","element","addEventListener","removeEventListener","jsxs","jsx","node","setAttribute","style","height","clsx","ExpanderContext","Provider","value","onToggle","previousValue","onTransitionEnd","onTransitionStart","isOpening","Content","ExpandablePanelContent","Header","Expander"],"mappings":"qVAWO,MAAMA,EAAkBC,OAAOC,OAClCC,EAAMC,WAAW,SAGbC,EACAC,GAEA,MACIC,SAAAA,EACAC,GAAAA,EAAK,UACLC,SAAAA,EACAC,KAAMC,EACNC,YAAAA,EACAC,aAAAA,EACAC,UAAAA,KACGC,GACHV,GAEGW,EAAkBC,GAAuBC,EAC5CN,IAAe,IAEZO,EAAkBC,GAAuBF,GAAS,IAClDG,EAAgBC,GAAqBJ,EAAS,GAE/CK,EAAcC,IACpBC,EAAoBnB,EAAK,IAAMiB,EAAYG,QAAS,IAEpD,MAAMC,EAAKnB,EACLoB,SAAsBjB,EAAmB,IACzCkB,EAASD,EAAejB,EAAiBK,EAmB/C,OAAAc,EAAU,KACN,MAAMC,EAAYC,IACdf,EAAmC,SAAfe,EAAEC,WAGpBC,EAAUX,EAAYG,QAE5B,OAAAQ,GAASC,iBAAiB,SAAUJ,GAE7B,IACHG,GAASE,oBACL,SACAL,IAET,IAGCM,EAAC,MAAA,CAAIvB,UAAU,gCACXP,SAAA,CAAA+B,EAAC,MAAA,CAOGhC,IAAMiC,GAASA,GAAMC,aAAa,QAAS,QAC3C1B,UAAU,wCACV2B,MAAO,CAAEC,OAAQrB,KAErBiB,EAACX,EAAA,CACGrB,IAAKiB,EACL,cAAa,qBACbT,UAAW6B,EACP,uBACAlC,GAAY,iCACZK,GAEJJ,KAGW,YAAPF,EACMqB,GAAUV,OACV,EAGV,uBAAsBU,GAAUV,KAC5BJ,EAEJR,SAAA+B,EAACM,EAAgBC,SAAhB,CACGC,MAAO,CACHpC,KAAMmB,EACNkB,SA9DU,KACtBnB,EACAf,KAAgBgB,GAGpBZ,EAAqB+B,IACjBnC,KAAgBmC,IACRA,KAwDIC,gBAAiB7B,EACjB8B,kBAtESC,IACrBA,GACA/B,GAAoB,IAqERE,kBAAAA,GAGHf,SAAAA,QAKrB,GACA,CAAE6C,QAASC,EAAwBC,OAAQC"}

package/build/es/components/expander/ExpandablePanelContent.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{c as t}from"../../../clsx-BeLtu-UY.js";import{useContext as n,useEffect as a}from"react";import{useAnimatedHeightBetween as r}from"../../hooks/useAnimatedHeight/useAnimatedHeightBetween.js";import{ExpanderContext as s}from"./context.js";const o=({className:o,children:i,...m})=>{const{open:d,onTransitionStart:c,onTransitionEnd:p}=n(s),[l]=r(d,{timing:"snappy",onTransitionStart:c,onTransitionEnd:p});return a(()=>{const e=l.current;d?e?.removeAttribute("inert"):e?.setAttribute("inert","true")},[d,l]),e("div",{ref:l,className:t("jkl-expandable__content",o),...m,"data-expanded":d,children:e("div",{className:"jkl-expandable__content-wrapper",children:i})})};o.displayName="ExpandablePanel.Content";export{o as ExpandablePanelContent};
+import{jsx as e}from"react/jsx-runtime";import{c as t}from"../../../clsx-BeLtu-UY.js";import{useContext as n,useEffect as a}from"react";import{useAnimatedHeightBetween as r}from"../../hooks/useAnimatedHeight/useAnimatedHeightBetween.js";import{ExpanderContext as s}from"./context.js";const o=({className:o,children:i,...m})=>{const{open:p,onTransitionStart:d,onTransitionEnd:c}=n(s),[l]=r(p,{timing:"snappy",onTransitionStart:d,onTransitionEnd:c});return a(()=>{const e=l.current;p?e?.removeAttribute("inert"):e?.setAttribute("inert","true")},[p,l]),e("div",{ref:l,className:t("jkl-expandable-panel__content",o),...m,"data-expanded":p,children:e("div",{className:"jkl-expandable-panel__content-wrapper",children:i})})};o.displayName="ExpandablePanel.Content";export{o as ExpandablePanelContent};
 //# sourceMappingURL=ExpandablePanelContent.js.map

package/build/es/components/expander/ExpandablePanelContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExpandablePanelContent.js","sources":["../../../../src/components/expander/ExpandablePanelContent.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useContext, useEffect } from \"react\";\nimport { useAnimatedHeightBetween } from \"../../hooks/useAnimatedHeight/useAnimatedHeightBetween.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n    ExpandableContext,\n    ExpandablePanelContentComponent,\n} from \"./types.js\";\n\nexport const ExpandablePanelContent: ExpandablePanelContentComponent = ({\n    className,\n    children,\n    ...rest\n}) => {\n    const { open, onTransitionStart, onTransitionEnd } =\n        useContext<ExpandableContext>(ExpanderContext);\n\n    const [animationRef] = useAnimatedHeightBetween<HTMLDivElement>(open, {\n        timing: \"snappy\",\n        onTransitionStart,\n        onTransitionEnd,\n    });\n\n    /*\n        Setter `inert` manuelt for å støtte både React 18 og 19.\n\n        Dette unngår typefeil i React 18 og advarsler i React 19.\n        Se: https://github.com/WICG/inert/issues/58\n    */\n    useEffect(() => {\n        const node = animationRef.current;\n\n        if (!open) {\n            node?.setAttribute(\"inert\", \"true\");\n        } else {\n            node?.removeAttribute(\"inert\");\n        }\n    }, [open, animationRef]);\n\n    return (\n        <div\n            ref={animationRef}\n            className={clsx(\"jkl-expandable__content\", className)}\n            {...rest}\n            data-expanded={open}\n        >\n            <div className=\"jkl-expandable__content-wrapper\">{children}</div>\n        </div>\n    );\n};\n\nExpandablePanelContent.displayName = \"ExpandablePanel.Content\";\n"],"names":["ExpandablePanelContent","className","children","rest","open","onTransitionStart","onTransitionEnd","useContext","ExpanderContext","animationRef","useAnimatedHeightBetween","timing","useEffect","node","current","removeAttribute","setAttribute","jsx","ref","clsx","displayName"],"mappings":"4RASO,MAAMA,EAA0D,EACnEC,UAAAA,EACAC,SAAAA,KACGC,MAEH,MAAQC,KAAAA,EAAMC,kBAAAA,EAAmBC,gBAAAA,GAC7BC,EAA8BC,IAE3BC,GAAgBC,EAAyCN,EAAM,CAClEO,OAAQ,SACRN,kBAAAA,EACAC,gBAAAA,IASJ,OAAAM,EAAU,KACN,MAAMC,EAAOJ,EAAaK,QAErBV,EAGDS,GAAME,gBAAgB,SAFtBF,GAAMG,aAAa,QAAS,SAIjC,CAACZ,EAAMK,IAGNQ,EAAC,MAAA,CACGC,IAAKT,EACLR,UAAWkB,EAAK,0BAA2BlB,MACvCE,EACJ,gBAAeC,EAEfF,SAAAe,EAAC,MAAA,CAAIhB,UAAU,kCAAmCC,SAAAA,OAK9DF,EAAuBoB,YAAc"}
+{"version":3,"file":"ExpandablePanelContent.js","sources":["../../../../src/components/expander/ExpandablePanelContent.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useContext, useEffect } from \"react\";\nimport { useAnimatedHeightBetween } from \"../../hooks/useAnimatedHeight/useAnimatedHeightBetween.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n    ExpandableContext,\n    ExpandablePanelContentComponent,\n} from \"./types.js\";\n\nexport const ExpandablePanelContent: ExpandablePanelContentComponent = ({\n    className,\n    children,\n    ...rest\n}) => {\n    const { open, onTransitionStart, onTransitionEnd } =\n        useContext<ExpandableContext>(ExpanderContext);\n\n    const [animationRef] = useAnimatedHeightBetween<HTMLDivElement>(open, {\n        timing: \"snappy\",\n        onTransitionStart,\n        onTransitionEnd,\n    });\n\n    /*\n        Setter `inert` manuelt for å støtte både React 18 og 19.\n\n        Dette unngår typefeil i React 18 og advarsler i React 19.\n        Se: https://github.com/WICG/inert/issues/58\n    */\n    useEffect(() => {\n        const node = animationRef.current;\n\n        if (!open) {\n            node?.setAttribute(\"inert\", \"true\");\n        } else {\n            node?.removeAttribute(\"inert\");\n        }\n    }, [open, animationRef]);\n\n    return (\n        <div\n            ref={animationRef}\n            className={clsx(\"jkl-expandable-panel__content\", className)}\n            {...rest}\n            data-expanded={open}\n        >\n            <div className=\"jkl-expandable-panel__content-wrapper\">\n                {children}\n            </div>\n        </div>\n    );\n};\n\nExpandablePanelContent.displayName = \"ExpandablePanel.Content\";\n"],"names":["ExpandablePanelContent","className","children","rest","open","onTransitionStart","onTransitionEnd","useContext","ExpanderContext","animationRef","useAnimatedHeightBetween","timing","useEffect","node","current","removeAttribute","setAttribute","jsx","ref","clsx","displayName"],"mappings":"4RASO,MAAMA,EAA0D,EACnEC,UAAAA,EACAC,SAAAA,KACGC,MAEH,MAAQC,KAAAA,EAAMC,kBAAAA,EAAmBC,gBAAAA,GAC7BC,EAA8BC,IAE3BC,GAAgBC,EAAyCN,EAAM,CAClEO,OAAQ,SACRN,kBAAAA,EACAC,gBAAAA,IASJ,OAAAM,EAAU,KACN,MAAMC,EAAOJ,EAAaK,QAErBV,EAGDS,GAAME,gBAAgB,SAFtBF,GAAMG,aAAa,QAAS,SAIjC,CAACZ,EAAMK,IAGNQ,EAAC,MAAA,CACGC,IAAKT,EACLR,UAAWkB,EAAK,gCAAiClB,MAC7CE,EACJ,gBAAeC,EAEfF,SAAAe,EAAC,MAAA,CAAIhB,UAAU,wCACVC,SAAAA,OAMjBF,EAAuBoB,YAAc"}

package/build/es/components/expander/Expander.js

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as n}from"react/jsx-runtime";import{c}from"../../../clsx-BeLtu-UY.js";import i,{useContext as s,useRef as r,useImperativeHandle as e,useEffect as t}from"react";import{ChevronDownIcon as p}from"../icon/icons/ChevronDownIcon.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import{ChevronUpIcon as m}from"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{ExpanderContext as a}from"./context.js";const j=i.forwardRef(function(i,j){const{children:I,as:l="summary",open:u,icon:d,className:h,onClick:f,expandDirection:x,...C}=i,w=l,{open:v,onToggle:A,setExpanderHeight:b}=s(a),g=r();e(j,()=>g.current,[]);const k=u||v,D="up"===x?m:p;return t(()=>{const o=new ResizeObserver(()=>{b(g.current?.offsetHeight||64)});return g.current?(o.observe(g.current),()=>o.disconnect()):()=>{}},[b]),o(w,{ref:g,className:c("jkl-expander",{"jkl-expander--open":k},h),..."button"===l?{type:C.type||"button"}:{},onClick:o=>{o.preventDefault(),A(),f?.(o)},...C,children:[d||null,n("span",{className:"jkl-expander__label",children:I}),n(D,{className:"jkl-expander__chevron"})]})});j.displayName="ExpandablePanel.Header";export{j as Expander};
+import{jsxs as o,jsx as n}from"react/jsx-runtime";import{c as i}from"../../../clsx-BeLtu-UY.js";import c,{useContext as s,useRef as r,useImperativeHandle as e,useEffect as t}from"react";import{ChevronDownIcon as p}from"../icon/icons/ChevronDownIcon.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import{ChevronUpIcon as m}from"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{ExpanderContext as a}from"./context.js";const j=c.forwardRef(function(c,j){const{children:I,as:l="summary",open:u,icon:d,className:f,onClick:h,expandDirection:x,...C}=c,w=l,{open:v,onToggle:b,setExpanderHeight:A}=s(a),g=r();e(j,()=>g.current,[]);const k="boolean"==typeof u,D=k?u:v,E="up"===x?m:p;return t(()=>{if(k)return;const o=new ResizeObserver(()=>{A(g.current?.offsetHeight||64)});return g.current?(o.observe(g.current),()=>o.disconnect()):()=>{}},[k,A]),o(w,{ref:g,className:i("jkl-expander",{"jkl-expander--open":D},f),..."button"===l?{type:C.type||"button"}:{},onClick:o=>{o.preventDefault(),k||b(),h?.(o)},...C,children:[d||null,n("span",{className:"jkl-expander__label",children:I}),n(E,{className:"jkl-expander__chevron"})]})});j.displayName="ExpandablePanel.Header";export{j as Expander};
 //# sourceMappingURL=Expander.js.map

package/build/es/components/expander/Expander.js.map

@@ -1 +1 @@
-{"version":3,"file":"Expander.js","sources":["../../../../src/components/expander/Expander.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n} from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronDownIcon } from \"../icon/icons/ChevronDownIcon.js\";\nimport { ChevronUpIcon } from \"../icon/index.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n    ExpandableContext,\n    ExpanderComponent,\n    ExpanderProps,\n} from \"./types.js\";\n\nexport const Expander = React.forwardRef(function Expander<\n    ElementType extends React.ElementType = \"summary\",\n>(props: ExpanderProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        children,\n        as = \"summary\",\n        open: controlledOpen,\n        icon,\n        className,\n        onClick,\n        expandDirection,\n        ...rest\n    } = props;\n    const El = as;\n\n    const {\n        open: contextOpen,\n        onToggle,\n        setExpanderHeight,\n    } = useContext<ExpandableContext>(ExpanderContext);\n\n    const internalRef = useRef<HTMLElement>();\n    useImperativeHandle(ref, () => internalRef.current, []);\n\n    const isOpen = controlledOpen || contextOpen;\n\n    const Chevron = expandDirection === \"up\" ? ChevronUpIcon : ChevronDownIcon;\n\n    useEffect(() => {\n        const observer = new ResizeObserver(() => {\n            // Default to 64 if the height can not be read because that is\n            // the height of the default summary element. In a custom component\n            // this means that the focus ring might be slightly misaligned but\n            // in most cases we will be able to read the ref correctly.\n            setExpanderHeight(internalRef.current?.offsetHeight || 64);\n        });\n        if (internalRef.current) {\n            observer.observe(internalRef.current);\n            return () => observer.disconnect();\n        }\n        return () => {};\n    }, [setExpanderHeight]);\n\n    return (\n        <El\n            ref={internalRef}\n            className={clsx(\n                \"jkl-expander\",\n                {\n                    \"jkl-expander--open\": isOpen,\n                },\n                className,\n            )}\n            // If the consumer uses the Expander as a button but does not\n            // supply a type, then we set type to \"button\"\n            {...(as === \"button\" ? { type: rest.type || \"button\" } : {})}\n            onClick={(e) => {\n                e.preventDefault();\n                onToggle();\n                onClick?.(e);\n            }}\n            {...rest}\n        >\n            {icon || null}\n            <span className=\"jkl-expander__label\">{children}</span>\n            <Chevron className=\"jkl-expander__chevron\" />\n        </El>\n    );\n}) as ExpanderComponent;\n\nExpander.displayName = \"ExpandablePanel.Header\";\n"],"names":["Expander","React","forwardRef","props","ref","children","as","open","controlledOpen","icon","className","onClick","expandDirection","rest","El","contextOpen","onToggle","setExpanderHeight","useContext","ExpanderContext","internalRef","useRef","useImperativeHandle","current","isOpen","Chevron","ChevronUpIcon","ChevronDownIcon","useEffect","observer","ResizeObserver","offsetHeight","observe","disconnect","jsxs","clsx","type","e","preventDefault","jsx","displayName"],"mappings":"goDAiBO,MAAMA,EAAWC,EAAMC,WAAW,SAEvCC,EAAmCC,GACjC,MACIC,SAAAA,EACAC,GAAAA,EAAK,UACLC,KAAMC,EACNC,KAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,KACGC,GACHV,EACEW,EAAKR,GAGPC,KAAMQ,EACNC,SAAAA,EACAC,kBAAAA,GACAC,EAA8BC,GAE5BC,EAAcC,IACpBC,EAAoBlB,EAAK,IAAMgB,EAAYG,QAAS,IAEpD,MAAMC,EAAShB,GAAkBO,EAE3BU,EAA8B,OAApBb,EAA2Bc,EAAgBC,EAE3D,OAAAC,EAAU,KACN,MAAMC,EAAW,IAAIC,eAAe,KAKhCb,EAAkBG,EAAYG,SAASQ,cAAgB,MAE3D,OAAIX,EAAYG,SACZM,EAASG,QAAQZ,EAAYG,SACtB,IAAMM,EAASI,cAEnB,QACR,CAAChB,IAGAiB,EAACpB,EAAA,CACGV,IAAKgB,EACLV,UAAWyB,EACP,eACA,CACI,qBAAsBX,GAE1Bd,MAIQ,WAAPJ,EAAkB,CAAE8B,KAAMvB,EAAKuB,MAAQ,UAAa,CAAA,EACzDzB,QAAU0B,IACNA,EAAEC,iBACFtB,IACAL,IAAU0B,OAEVxB,EAEHR,SAAA,CAAAI,GAAQ,KACT8B,EAAC,OAAA,CAAK7B,UAAU,sBAAuBL,SAAAA,IACvCkC,EAACd,EAAA,CAAQf,UAAU,4BAG/B,GAEAV,EAASwC,YAAc"}
+{"version":3,"file":"Expander.js","sources":["../../../../src/components/expander/Expander.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n} from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { ChevronDownIcon } from \"../icon/icons/ChevronDownIcon.js\";\nimport { ChevronUpIcon } from \"../icon/index.js\";\nimport { ExpanderContext } from \"./context.js\";\nimport type {\n    ExpandableContext,\n    ExpanderComponent,\n    ExpanderProps,\n} from \"./types.js\";\n\nexport const Expander = React.forwardRef(function Expander<\n    ElementType extends React.ElementType = \"summary\",\n>(props: ExpanderProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        children,\n        as = \"summary\",\n        open: controlledOpen,\n        icon,\n        className,\n        onClick,\n        expandDirection,\n        ...rest\n    } = props;\n    const El = as;\n\n    const {\n        open: contextOpen,\n        onToggle,\n        setExpanderHeight,\n    } = useContext<ExpandableContext>(ExpanderContext);\n\n    const internalRef = useRef<HTMLElement>();\n    useImperativeHandle(ref, () => internalRef.current, []);\n\n    // Når `open`-propen er satt eier konsumenten state-en og Expander er\n    // kontrollert. Da skal vi ikke arve verken visning eller toggle-callback\n    // fra et omkringliggende ExpandablePanel — ellers ville klikk på en\n    // nestet Expander også togglet panelet.\n    const isControlled = typeof controlledOpen === \"boolean\";\n    const isOpen = isControlled ? controlledOpen : contextOpen;\n\n    const Chevron = expandDirection === \"up\" ? ChevronUpIcon : ChevronDownIcon;\n\n    useEffect(() => {\n        // Kontrollert Expander skal være helt isolert fra et eventuelt\n        // omkringliggende ExpandablePanel — hverken state, klikk eller\n        // høyde-rapportering skal arve oppover. Hopp over måling slik at\n        // panel-headerens fokuscontainer ikke får raden sin høyde.\n        if (isControlled) return;\n\n        const observer = new ResizeObserver(() => {\n            // Default to 64 if the height can not be read because that is\n            // the height of the default summary element. In a custom component\n            // this means that the focus ring might be slightly misaligned but\n            // in most cases we will be able to read the ref correctly.\n            setExpanderHeight(internalRef.current?.offsetHeight || 64);\n        });\n        if (internalRef.current) {\n            observer.observe(internalRef.current);\n            return () => observer.disconnect();\n        }\n        return () => {};\n    }, [isControlled, setExpanderHeight]);\n\n    return (\n        <El\n            ref={internalRef}\n            className={clsx(\n                \"jkl-expander\",\n                {\n                    \"jkl-expander--open\": isOpen,\n                },\n                className,\n            )}\n            // If the consumer uses the Expander as a button but does not\n            // supply a type, then we set type to \"button\"\n            {...(as === \"button\" ? { type: rest.type || \"button\" } : {})}\n            onClick={(e) => {\n                e.preventDefault();\n                if (!isControlled) {\n                    onToggle();\n                }\n                onClick?.(e);\n            }}\n            {...rest}\n        >\n            {icon || null}\n            <span className=\"jkl-expander__label\">{children}</span>\n            <Chevron className=\"jkl-expander__chevron\" />\n        </El>\n    );\n}) as ExpanderComponent;\n\nExpander.displayName = \"ExpandablePanel.Header\";\n"],"names":["Expander","React","forwardRef","props","ref","children","as","open","controlledOpen","icon","className","onClick","expandDirection","rest","El","contextOpen","onToggle","setExpanderHeight","useContext","ExpanderContext","internalRef","useRef","useImperativeHandle","current","isControlled","isOpen","Chevron","ChevronUpIcon","ChevronDownIcon","useEffect","observer","ResizeObserver","offsetHeight","observe","disconnect","jsxs","clsx","type","e","preventDefault","jsx","displayName"],"mappings":"qoDAiBO,MAAMA,EAAWC,EAAMC,WAAW,SAEvCC,EAAmCC,GACjC,MACIC,SAAAA,EACAC,GAAAA,EAAK,UACLC,KAAMC,EACNC,KAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,KACGC,GACHV,EACEW,EAAKR,GAGPC,KAAMQ,EACNC,SAAAA,EACAC,kBAAAA,GACAC,EAA8BC,GAE5BC,EAAcC,IACpBC,EAAoBlB,EAAK,IAAMgB,EAAYG,QAAS,IAMpD,MAAMC,EAAyC,kBAAnBhB,EACtBiB,EAASD,EAAehB,EAAiBO,EAEzCW,EAA8B,OAApBd,EAA2Be,EAAgBC,EAE3D,OAAAC,EAAU,KAKN,GAAIL,EAAc,OAElB,MAAMM,EAAW,IAAIC,eAAe,KAKhCd,EAAkBG,EAAYG,SAASS,cAAgB,MAE3D,OAAIZ,EAAYG,SACZO,EAASG,QAAQb,EAAYG,SACtB,IAAMO,EAASI,cAEnB,QACR,CAACV,EAAcP,IAGdkB,EAACrB,EAAA,CACGV,IAAKgB,EACLV,UAAW0B,EACP,eACA,CACI,qBAAsBX,GAE1Bf,MAIQ,WAAPJ,EAAkB,CAAE+B,KAAMxB,EAAKwB,MAAQ,UAAa,CAAA,EACzD1B,QAAU2B,IACNA,EAAEC,iBACGf,GACDR,IAEJL,IAAU2B,OAEVzB,EAEHR,SAAA,CAAAI,GAAQ,KACT+B,EAAC,OAAA,CAAK9B,UAAU,sBAAuBL,SAAAA,IACvCmC,EAACd,EAAA,CAAQhB,UAAU,4BAG/B,GAEAV,EAASyC,YAAc"}

package/build/es/components/expander/index.d.ts

@@ -1,3 +1,3 @@
 export { ExpandablePanel } from './ExpandablePanel.js';
 export { Expander } from './Expander.js';
-export type { ExpandablePanelProps, ExpanderProps } from './types.js';
+export type { ExpandablePanelProps, ExpanderProps, AccordionProps, } from './types.js';

package/build/es/components/expander/types.d.ts

@@ -1,8 +1,8 @@
-import { ComponentProps, FC, RefObject } from 'react';
+import { ComponentProps, FC, HTMLAttributes, RefObject } from 'react';
 import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.js';
 export type ExpandablePanelContentComponent = FC<ComponentProps<"div"> & {}>;
 export type ExpandablePanelProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
-    variant?: "fill" | "stroke";
+    outlined?: boolean;
     open?: boolean;
     defaultOpen?: boolean;
     onOpenChange?: (open: boolean) => void;
@@ -27,4 +27,7 @@ export type ExpandableContext = {
     onTransitionEnd: (isOpen: boolean, ref: RefObject<HTMLElement | HTMLDetailsElement | null>) => void;
     setExpanderHeight: (height: number) => void;
 };
+export type AccordionProps = HTMLAttributes<HTMLDivElement> & {
+    outlined?: boolean;
+};
 export {};

package/build/es/components/icon/Icon.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.js';
 import { IconVariant } from './types.js';
-type IconComponentProps<ElementType extends Extract<React.ElementType, "span" | "div">> = PolymorphicPropsWithRef<ElementType, {
+type IconComponentProps<ElementType extends "span" | "div"> = PolymorphicPropsWithRef<ElementType, {
     "data-testid"?: string;
     /**
      * Størrelsesvarianten til ikonet. `"small"` er 16px med 20px bounding box, og `"medium"` er 20px med 24px bounding box.
@@ -17,7 +17,7 @@ type IconComponentProps<ElementType extends Extract<React.ElementType, "span" |
     className?: string;
     style?: React.CSSProperties;
 }>;
-export type IconComponent = (<ElementType extends Extract<React.ElementType, "span" | "div"> = "span">(props: IconComponentProps<ElementType>) => React.ReactElement | null) & {
+export type IconComponent = (<ElementType extends "span" | "div" = "span">(props: IconComponentProps<ElementType>) => React.ReactElement | null) & {
     displayName?: string;
 };
 export declare const Icon: IconComponent;

package/build/es/components/icon/Icon.js

@@ -1,2 +1,2 @@
-import{jsx as r}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import a from"react";const c=a.forwardRef(function(a,c){const{bold:i,children:n,className:e,filled:l,variant:s,...t}=a;return r("span",{"aria-hidden":!0,ref:c,className:o("jkl-icon",e,{"jkl-icon--filled":l,"jkl-icon--bold":i}),...t,children:n})});export{c as Icon};
+import{jsx as r}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import i from"react";const o=i.forwardRef(function(i,o){const{as:n="span",bold:s,children:c,className:e,filled:l,variant:t,...d}=i,f=a("jkl-icon",e,{"jkl-icon--filled":l,"jkl-icon--bold":s});return r("div"===n?"div":"span",{"aria-hidden":!0,ref:o,className:f,...d,children:c})});export{o as Icon};
 //# sourceMappingURL=Icon.js.map

package/build/es/components/icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sources":["../../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type {\n    PolymorphicPropsWithRef,\n    PolymorphicRef,\n} from \"../../utilities/polymorphism/polymorphism.js\";\nimport type { IconVariant } from \"./types.js\";\n\ntype IconComponentProps<\n    ElementType extends Extract<React.ElementType, \"span\" | \"div\">,\n> = PolymorphicPropsWithRef<\n    ElementType,\n    {\n        \"data-testid\"?: string;\n        /**\n         * Størrelsesvarianten til ikonet. `\"small\"` er 16px med 20px bounding box, og `\"medium\"` er 20px med 24px bounding box.\n         * `\"inherit\"` setter størrelsen til ikonet (ikke bounding box) lik skriftstørrelsen (1em).\n         */\n        variant?: IconVariant;\n        /**\n         * Angir om ikonet skal vises i fet versjon\n         * @default false\n         */\n        bold?: boolean;\n        filled?: boolean;\n        className?: string;\n        style?: React.CSSProperties;\n    }\n>;\n\nexport type IconComponent = (<\n    ElementType extends Extract<React.ElementType, \"span\" | \"div\"> = \"span\",\n>(\n    props: IconComponentProps<ElementType>,\n) => React.ReactElement | null) & { displayName?: string };\n\nexport const Icon: IconComponent = React.forwardRef(function Icon<\n    ElementType extends Extract<React.ElementType, \"span\" | \"div\"> = \"span\",\n>(props: IconComponentProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const { bold, children, className, filled, variant, ...iconProps } = props;\n\n    return (\n        <span\n            aria-hidden\n            ref={ref}\n            className={clsx(\"jkl-icon\", className, {\n                \"jkl-icon--filled\": filled,\n                \"jkl-icon--bold\": bold,\n            })}\n            {...iconProps}\n        >\n            {children}\n        </span>\n    );\n}) as IconComponent;\n"],"names":["Icon","React","forwardRef","props","ref","bold","children","className","filled","variant","iconProps","jsx","clsx"],"mappings":"2GAoCO,MAAMA,EAAsBC,EAAMC,WAAW,SAElDC,EAAwCC,GACtC,MAAQC,KAAAA,EAAMC,SAAAA,EAAUC,UAAAA,EAAWC,OAAAA,EAAQC,QAAAA,KAAYC,GAAcP,EAErE,OACIQ,EAAC,OAAA,CACG,eAAW,EACXP,IAAAA,EACAG,UAAWK,EAAK,WAAYL,EAAW,CACnC,mBAAoBC,EACpB,iBAAkBH,OAElBK,EAEHJ,SAAAA,GAGb"}
+{"version":3,"file":"Icon.js","sources":["../../../../src/components/icon/Icon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type {\n    PolymorphicPropsWithRef,\n    PolymorphicRef,\n} from \"../../utilities/polymorphism/polymorphism.js\";\nimport type { IconVariant } from \"./types.js\";\n\ntype IconComponentProps<\n    ElementType extends \"span\" | \"div\",\n> = PolymorphicPropsWithRef<\n    ElementType,\n    {\n        \"data-testid\"?: string;\n        /**\n         * Størrelsesvarianten til ikonet. `\"small\"` er 16px med 20px bounding box, og `\"medium\"` er 20px med 24px bounding box.\n         * `\"inherit\"` setter størrelsen til ikonet (ikke bounding box) lik skriftstørrelsen (1em).\n         */\n        variant?: IconVariant;\n        /**\n         * Angir om ikonet skal vises i fet versjon\n         * @default false\n         */\n        bold?: boolean;\n        filled?: boolean;\n        className?: string;\n        style?: React.CSSProperties;\n    }\n>;\n\nexport type IconComponent = (<\n    ElementType extends \"span\" | \"div\" = \"span\",\n>(\n    props: IconComponentProps<ElementType>,\n) => React.ReactElement | null) & { displayName?: string };\n\nexport const Icon: IconComponent = React.forwardRef(function Icon<\n    ElementType extends \"span\" | \"div\" = \"span\",\n>(props: IconComponentProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        as = \"span\",\n        bold,\n        children,\n        className,\n        filled,\n        variant,\n        ...iconProps\n    } = props;\n    const iconClassName = clsx(\"jkl-icon\", className, {\n        \"jkl-icon--filled\": filled,\n        \"jkl-icon--bold\": bold,\n    });\n\n    if (as === \"div\") {\n        return (\n            <div\n                aria-hidden\n                ref={ref as PolymorphicRef<\"div\">}\n                className={iconClassName}\n                {...(iconProps as React.HTMLAttributes<HTMLDivElement>)}\n            >\n                {children}\n            </div>\n        );\n    }\n\n    return (\n        <span\n            aria-hidden\n            ref={ref as PolymorphicRef<\"span\">}\n            className={iconClassName}\n            {...(iconProps as React.HTMLAttributes<HTMLSpanElement>)}\n        >\n            {children}\n        </span>\n    );\n}) as IconComponent;\n"],"names":["Icon","React","forwardRef","props","ref","as","bold","children","className","filled","variant","iconProps","iconClassName","clsx","jsx"],"mappings":"2GAoCO,MAAMA,EAAsBC,EAAMC,WAAW,SAElDC,EAAwCC,GACtC,MACIC,GAAAA,EAAK,OACLC,KAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,KACGC,GACHR,EACES,EAAgBC,EAAK,WAAYL,EAAW,CAC9C,mBAAoBC,EACpB,iBAAkBH,IAGtB,OAEQQ,EAFG,QAAPT,EAEK,MAYJ,OAZI,CACG,eAAW,EACXD,IAAAA,EACAI,UAAWI,KACND,EAEJJ,SAAAA,GAejB"}

package/build/es/components/icon/icons/GreenCheckIcon.d.ts

@@ -1,3 +1,2 @@
-import { FC } from 'react';
-import { IconProps } from '../types.js';
-export declare const GreenCheckIcon: FC<IconProps>;
+import { IconComponent } from '../Icon.js';
+export declare const GreenCheckIcon: IconComponent;

package/build/es/components/icon/icons/GreenCheckIcon.js

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as i}from"react/jsx-runtime";import{c}from"../../../../clsx-BeLtu-UY.js";import"react";const s=({as:s="div",bold:t=!1,className:a,variant:l="inherit","data-testid":r,style:n,...o})=>e(s,{className:c(a,"jkl-icon","jkl-icon-green-check",`jkl-icon--${l}`,{"jkl-icon--bold":t}),"aria-hidden":"true",style:n,"data-testid":r,...o,children:i("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"24px",height:"24px",children:[e("circle",{cx:"12",cy:"12",r:"10"}),e("path",{fillRule:"evenodd",d:"M17.52 9.54 10.7 16.2l-4.21-4.1 1.04-1.08 3.17 3.09 5.79-5.65 1.04 1.08Z",clipRule:"evenodd"})]})});s.displayName="GreenCheckIcon";export{s as GreenCheckIcon};
+import{jsx as c}from"react/jsx-runtime";import{c as e}from"../../../../clsx-BeLtu-UY.js";import"react";import{Icon as r}from"../Icon.js";const s=s=>c(r,{...s,className:e("jkl-icon-green-check",s.className),children:""});s.displayName="GreenCheckIcon";export{s as GreenCheckIcon};
 //# sourceMappingURL=GreenCheckIcon.js.map

package/build/es/components/icon/icons/GreenCheckIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"GreenCheckIcon.js","sources":["../../../../../src/components/icon/icons/GreenCheckIcon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { IconProps } from \"../types.js\";\n\n/*\n * NOTE: The green-check and red-cross icons also exists as a copy in the jkl-list package.\n *       If you're here to change them, consider changing them there as well, or\n *       finding a technical solution to sharing the SVG markup\n */\nexport const GreenCheckIcon: FC<IconProps> = ({\n    as = \"div\",\n    bold = false,\n    className,\n    variant = \"inherit\",\n    \"data-testid\": testId,\n    style,\n    ...rest\n}) => {\n    const El = as;\n\n    return (\n        <El\n            className={clsx(\n                className,\n                \"jkl-icon\",\n                \"jkl-icon-green-check\",\n                `jkl-icon--${variant}`,\n                {\n                    \"jkl-icon--bold\": bold,\n                },\n            )}\n            aria-hidden=\"true\"\n            style={style}\n            data-testid={testId}\n            {...rest}\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n                height=\"24px\"\n            >\n                <circle cx=\"12\" cy=\"12\" r=\"10\" />\n                <path\n                    fillRule=\"evenodd\"\n                    d=\"M17.52 9.54 10.7 16.2l-4.21-4.1 1.04-1.08 3.17 3.09 5.79-5.65 1.04 1.08Z\"\n                    clipRule=\"evenodd\"\n                />\n            </svg>\n        </El>\n    );\n};\nGreenCheckIcon.displayName = \"GreenCheckIcon\";\n"],"names":["GreenCheckIcon","as","bold","className","variant","testId","style","rest","jsx","clsx","children","jsxs","xmlns","viewBox","width","height","cx","cy","r","fillRule","d","clipRule","displayName"],"mappings":"4GASO,MAAMA,EAAgC,EACzCC,GAAAA,EAAK,MACLC,KAAAA,GAAO,EACPC,UAAAA,EACAC,QAAAA,EAAU,UACV,cAAeC,EACfC,MAAAA,KACGC,KAKCC,EAHOP,EAGN,CACGE,UAAWM,EACPN,EACA,WACA,uBACA,aAAaC,IACb,CACI,iBAAkBF,IAG1B,cAAY,OACZI,MAAAA,EACA,cAAaD,KACTE,EAEJG,SAAAC,EAAC,MAAA,CACGC,MAAM,6BACNC,QAAQ,YACRC,MAAM,OACNC,OAAO,OAEPL,SAAA,CAAAF,EAAC,UAAOQ,GAAG,KAAKC,GAAG,KAAKC,EAAE,OAC1BV,EAAC,OAAA,CACGW,SAAS,UACTC,EAAE,2EACFC,SAAS,iBAM7BrB,EAAesB,YAAc"}
+{"version":3,"file":"GreenCheckIcon.js","sources":["../../../../../src/components/icon/icons/GreenCheckIcon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const GreenCheckIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props} className={clsx(\"jkl-icon-green-check\", props.className)}>\n        {\"\\ue5ca\"}\n    </Icon>\n);\nGreenCheckIcon.displayName = \"GreenCheckIcon\";\n"],"names":["GreenCheckIcon","props","jsx","Icon","className","clsx","children","displayName"],"mappings":"yIAKO,MAAMA,EAAiCC,GAC1CC,EAACC,EAAA,IAASF,EAAOG,UAAWC,EAAK,uBAAwBJ,EAAMG,WAC1DE,SAAA,MAGTN,EAAeO,YAAc"}

package/build/es/components/icon/icons/RedCrossIcon.d.ts

@@ -1,3 +1,2 @@
-import { FC } from 'react';
-import { IconProps } from '../types.js';
-export declare const RedCrossIcon: FC<IconProps>;
+import { IconComponent } from '../Icon.js';
+export declare const RedCrossIcon: IconComponent;

package/build/es/components/icon/icons/RedCrossIcon.js

@@ -1,2 +1,2 @@
-import{jsx as s,jsxs as t}from"react/jsx-runtime";import{c as a}from"../../../../clsx-BeLtu-UY.js";import"react";const i=({as:i="div",bold:e=!1,className:r,variant:c="inherit","data-testid":o,style:d,...l})=>s(i,{className:a(r,"jkl-icon","jkl-icon-red-cross",`jkl-icon--${c}`,{"jkl-icon--bold":e}),"aria-hidden":"true",style:d,"data-testid":o,...l,children:t("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",width:"24px",height:"24px",children:[s("circle",{cx:"12",cy:"12",r:"10"}),s("path",{d:"m15.71 7.23 1.06 1.06-8.48 8.48-1.06-1.06 8.48-8.48Z"}),s("path",{d:"m8.29 7.23 8.48 8.48-1.06 1.06L7.23 8.3l1.06-1.06Z"})]})});i.displayName="RedCrossIcon";export{i as RedCrossIcon};
+import{jsx as s}from"react/jsx-runtime";import{c as o}from"../../../../clsx-BeLtu-UY.js";import"react";import{Icon as r}from"../Icon.js";const c=c=>s(r,{...c,className:o("jkl-icon-red-cross",c.className),children:""});c.displayName="RedCrossIcon";export{c as RedCrossIcon};
 //# sourceMappingURL=RedCrossIcon.js.map

package/build/es/components/icon/icons/RedCrossIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"RedCrossIcon.js","sources":["../../../../../src/components/icon/icons/RedCrossIcon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { IconProps } from \"../types.js\";\n\n/*\n * NOTE: The green-check and red-cross icons also exists as a copy in the jkl-list package.\n *       If you're here to change them, consider changing them there as well, or\n *       finding a technical solution to sharing the SVG markup\n */\nexport const RedCrossIcon: FC<IconProps> = ({\n    as = \"div\",\n    bold = false,\n    className,\n    variant = \"inherit\",\n    \"data-testid\": testId,\n    style,\n    ...rest\n}) => {\n    const El = as;\n\n    return (\n        <El\n            className={clsx(\n                className,\n                \"jkl-icon\",\n                \"jkl-icon-red-cross\",\n                `jkl-icon--${variant}`,\n                {\n                    \"jkl-icon--bold\": bold,\n                },\n            )}\n            aria-hidden=\"true\"\n            style={style}\n            data-testid={testId}\n            {...rest}\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n                height=\"24px\"\n            >\n                <circle cx=\"12\" cy=\"12\" r=\"10\" />\n                <path d=\"m15.71 7.23 1.06 1.06-8.48 8.48-1.06-1.06 8.48-8.48Z\" />\n                <path d=\"m8.29 7.23 8.48 8.48-1.06 1.06L7.23 8.3l1.06-1.06Z\" />\n            </svg>\n        </El>\n    );\n};\nRedCrossIcon.displayName = \"RedCrossIcon\";\n"],"names":["RedCrossIcon","as","bold","className","variant","testId","style","rest","jsx","clsx","children","jsxs","xmlns","viewBox","width","height","cx","cy","r","d","displayName"],"mappings":"iHASO,MAAMA,EAA8B,EACvCC,GAAAA,EAAK,MACLC,KAAAA,GAAO,EACPC,UAAAA,EACAC,QAAAA,EAAU,UACV,cAAeC,EACfC,MAAAA,KACGC,KAKCC,EAHOP,EAGN,CACGE,UAAWM,EACPN,EACA,WACA,qBACA,aAAaC,IACb,CACI,iBAAkBF,IAG1B,cAAY,OACZI,MAAAA,EACA,cAAaD,KACTE,EAEJG,SAAAC,EAAC,MAAA,CACGC,MAAM,6BACNC,QAAQ,YACRC,MAAM,OACNC,OAAO,OAEPL,SAAA,CAAAF,EAAC,UAAOQ,GAAG,KAAKC,GAAG,KAAKC,EAAE,OAC1BV,EAAC,OAAA,CAAKW,EAAE,yDACRX,EAAC,OAAA,CAAKW,EAAE,4DAKxBnB,EAAaoB,YAAc"}
+{"version":3,"file":"RedCrossIcon.js","sources":["../../../../../src/components/icon/icons/RedCrossIcon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const RedCrossIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props} className={clsx(\"jkl-icon-red-cross\", props.className)}>\n        {\"\\ue5cd\"}\n    </Icon>\n);\nRedCrossIcon.displayName = \"RedCrossIcon\";\n"],"names":["RedCrossIcon","props","jsx","Icon","className","clsx","children","displayName"],"mappings":"yIAKO,MAAMA,EAA+BC,GACxCC,EAACC,EAAA,IAASF,EAAOG,UAAWC,EAAK,qBAAsBJ,EAAMG,WACxDE,SAAA,MAGTN,EAAaO,YAAc"}

package/build/es/components/link-list/LinkList.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 import { LinkListProps } from './types.js';
 export declare const LinkList: {
-    ({ label, hideLabel, className, ...rest }: LinkListProps): React.JSX.Element;
+    ({ label, hideLabel, outlined, className, ...rest }: LinkListProps): React.JSX.Element;
     Link: React.ForwardRefExoticComponent<Omit<import('../../utilities/index.js').PolymorphicPropsWithRef<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>>;
 };

package/build/es/components/link-list/LinkList.js

@@ -1,2 +1,2 @@
-import{jsxs as l,jsx as s}from"react/jsx-runtime";import{c as i}from"../../../clsx-BeLtu-UY.js";import{useId as a}from"react";import{LinkListLink as e}from"./LinkListLink.js";const t=({label:e,hideLabel:t=!0,className:r,...n})=>{const m=a();return l("nav",{className:i("jkl-link-list",r),"aria-labelledby":`list-${m}-label`,children:[s("p",{className:"jkl-link-list-title",id:`list-${m}-label`,hidden:t,children:e}),s("ul",{"aria-labelledby":`list-${m}-label`,...n})]})};t.Link=e;export{t as LinkList};
+import{jsxs as l,jsx as i}from"react/jsx-runtime";import{c as s}from"../../../clsx-BeLtu-UY.js";import{useId as a}from"react";import{LinkListLink as e}from"./LinkListLink.js";const t=({label:e,hideLabel:t=!0,outlined:n=!1,className:r,...o})=>{const d=a();return l("nav",{className:s("jkl-link-list",r),"aria-labelledby":`list-${d}-label`,"data-outlined":n,children:[i("p",{className:"jkl-link-list-title",id:`list-${d}-label`,hidden:t,children:e}),i("ul",{"aria-labelledby":`list-${d}-label`,...o})]})};t.Link=e;export{t as LinkList};
 //# sourceMappingURL=LinkList.js.map

package/build/es/components/link-list/LinkList.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinkList.js","sources":["../../../../src/components/link-list/LinkList.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useId } from \"react\";\nimport { LinkListLink } from \"./LinkListLink.js\";\nimport type { LinkListProps } from \"./types.js\";\n\nexport const LinkList = ({\n    label,\n    hideLabel = true,\n    className,\n    ...rest\n}: LinkListProps): React.JSX.Element => {\n    const id = useId();\n\n    return (\n        <nav\n            className={clsx(\"jkl-link-list\", className)}\n            aria-labelledby={`list-${id}-label`}\n        >\n            <p\n                className=\"jkl-link-list-title\"\n                id={`list-${id}-label`}\n                hidden={hideLabel}\n            >\n                {label}\n            </p>\n            <ul aria-labelledby={`list-${id}-label`} {...rest} />\n        </nav>\n    );\n};\n\nLinkList.Link = LinkListLink;\n"],"names":["LinkList","label","hideLabel","className","rest","id","useId","jsxs","clsx","children","jsx","hidden","Link","LinkListLink"],"mappings":"+KAKO,MAAMA,EAAW,EACpBC,MAAAA,EACAC,UAAAA,GAAY,EACZC,UAAAA,KACGC,MAEH,MAAMC,EAAKC,IAEX,OACIC,EAAC,MAAA,CACGJ,UAAWK,EAAK,gBAAiBL,GACjC,kBAAiB,QAAQE,UAEzBI,SAAA,CAAAC,EAAC,IAAA,CACGP,UAAU,sBACVE,GAAI,QAAQA,UACZM,OAAQT,EAEPO,SAAAR,MAEJ,KAAA,CAAG,kBAAiB,QAAQI,aAAgBD,QAKzDJ,EAASY,KAAOC"}
+{"version":3,"file":"LinkList.js","sources":["../../../../src/components/link-list/LinkList.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useId } from \"react\";\nimport { LinkListLink } from \"./LinkListLink.js\";\nimport type { LinkListProps } from \"./types.js\";\n\nexport const LinkList = ({\n    label,\n    hideLabel = true,\n    outlined = false,\n    className,\n    ...rest\n}: LinkListProps): React.JSX.Element => {\n    const id = useId();\n\n    return (\n        <nav\n            className={clsx(\"jkl-link-list\", className)}\n            aria-labelledby={`list-${id}-label`}\n            data-outlined={outlined}\n        >\n            <p\n                className=\"jkl-link-list-title\"\n                id={`list-${id}-label`}\n                hidden={hideLabel}\n            >\n                {label}\n            </p>\n            <ul aria-labelledby={`list-${id}-label`} {...rest} />\n        </nav>\n    );\n};\n\nLinkList.Link = LinkListLink;\n"],"names":["LinkList","label","hideLabel","outlined","className","rest","id","useId","jsxs","clsx","children","jsx","hidden","Link","LinkListLink"],"mappings":"+KAKO,MAAMA,EAAW,EACpBC,MAAAA,EACAC,UAAAA,GAAY,EACZC,SAAAA,GAAW,EACXC,UAAAA,KACGC,MAEH,MAAMC,EAAKC,IAEX,OACIC,EAAC,MAAA,CACGJ,UAAWK,EAAK,gBAAiBL,GACjC,kBAAiB,QAAQE,UACzB,gBAAeH,EAEfO,SAAA,CAAAC,EAAC,IAAA,CACGP,UAAU,sBACVE,GAAI,QAAQA,UACZM,OAAQV,EAEPQ,SAAAT,MAEJ,KAAA,CAAG,kBAAiB,QAAQK,aAAgBD,QAKzDL,EAASa,KAAOC"}

package/build/es/components/link-list/types.d.ts

@@ -3,5 +3,6 @@ import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphi
 export type LinkListProps = HTMLAttributes<HTMLUListElement> & {
     label: string;
     hideLabel?: boolean;
+    outlined?: boolean;
 };
 export type LinkListLinkComponent = <ElementType extends React.ElementType = "a">(props: PolymorphicPropsWithRef<ElementType>) => React.ReactElement | null;

package/build/es/components/menu/Menu.js

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as s}from"react/jsx-runtime";import{useFloatingTree as t,useFloatingNodeId as n,useFloatingParentNodeId as o,useFloating as a,autoUpdate as r,offset as i,flip as l,shift as u,useInteractions as d,useHover as c,useClick as m,useDismiss as p,useRole as f,useListNavigation as g,safePolygon as h,useMergeRefs as v,useTransitionStyles as k,FloatingNode as x,FloatingPortal as y,FloatingFocusManager as P,FloatingTree as j}from"@floating-ui/react";import{c as F}from"../../../clsx-BeLtu-UY.js";import w,{forwardRef as I,useId as M,useRef as C,useState as E,useEffect as S}from"react";import{useBrowserPreferences as N}from"../../hooks/useBrowserPreferences/useBrowserPreferences.js";import"../../hooks/useScreen/useScreen.js";import"../../hooks/useId/useId.js";import{getThemeAndSize as O}from"../../utilities/getThemeAndSize.js";import{SlotComponent as R}from"../../utilities/polymorphism/SlotComponent.js";import{useMenuWideEvents as b}from"./useMenuWideEvents.js";function T(e,s=0){switch(e){case"top":default:return`0 ${s}px`;case"left":return`${s}px 0`;case"bottom":return`0 ${-s}px`;case"right":return-s+"px 0"}}const z=I((j,I)=>{const{children:z,className:A,initialPlacement:D,openOnHover:$=!1,keepOpenOnClickOutside:B=!1,triggerElement:H,isOpen:K,onToggle:V,...W}=j,q=`"jkl-menu"${M()}`,{prefersReducedMotion:L}=N(),U=t(),G=n(),J=o(),Q=null!=J,X=C([]),[Y,Z]=E(null),{allowHover:_,isOpen:ee,setIsOpen:se}=b(U,G,J),te=void 0!==K?K:ee;S(()=>V?.(te),[te,V]);const{refs:ne,placement:oe,context:ae,floatingStyles:re}=a({nodeId:G,open:te,onOpenChange:se,placement:D||(Q?"right-start":"bottom-start"),middleware:[i(2),l({fallbackAxisSideDirection:"end",crossAxis:!1}),u({padding:8})],whileElementsMounted:r}),{getReferenceProps:ie,getFloatingProps:le,getItemProps:ue}=d([c(ae,{enabled:$&&_,delay:{open:75},handleClose:h({requireIntent:!0,blockPointerEvents:!0})}),m(ae,{event:"mousedown"}),p(ae,{outsidePress:!B}),f(ae,{role:"menu"}),g(ae,{listRef:X,activeIndex:Y,nested:Q,onNavigate:Z})]),de=v([ne.setReference,I]),{theme:ce,size:me}=O(ne.reference.current),{isMounted:pe,styles:fe}=k(ae,{duration:{open:L?0:250,close:L?0:150},initial:({side:e})=>({opacity:0,translate:T(e,5)}),open:({side:e})=>({opacity:1,translate:T(e,0)}),close:({side:e})=>({opacity:0,translate:T(e,5)})});return e(x,{id:G,children:[w.isValidElement(H)&&s(R,{...ie({...W,ref:de,role:Q?"menuitem":void 0,"aria-controls":q,onClick(e){e.stopPropagation()}}),children:H}),pe&&s(y,{children:s(P,{context:ae,modal:!1,initialFocus:Q?-1:0,returnFocus:!Q,children:s("div",{className:F("jkl jkl-menu",A),"data-theme":ce,"data-size":me,role:"menu","data-placement":oe,"aria-live":"assertive","aria-hidden":!te,ref:ne.setFloating,...le({id:q,style:{...re,...fe}}),children:w.Children.map(z,(e,t)=>w.isValidElement(e)?s(R,{...ue({...e.props,tabIndex:Y===t?0:-1,role:"menuitem",ref(e){X.current[t]=e},onClick(e){e.defaultPrevented||U?.events.emit("click")},onKeyDown(s){e.props.onKeyDown?.(s),!s.defaultPrevented&&(U?.events.emit("keydown"),"menuitemcheckbox"===s.currentTarget.role&&"Enter"===s.key&&se(!1))},onMouseEnter(){_&&te&&Z(t)}}),children:e}):e)})})})]})});z.displayName="MenuComponent";const A=I((e,t)=>null===o()?s(j,{children:s(z,{ref:t,...e})}):s(z,{ref:t,...e}));A.displayName="Menu";export{A as Menu};
+import{jsxs as e,jsx as s}from"react/jsx-runtime";import{useFloatingTree as t,useFloatingNodeId as n,useFloatingParentNodeId as o,useFloating as a,autoUpdate as r,offset as i,flip as l,shift as u,useInteractions as d,useHover as c,safePolygon as m,useClick as p,useDismiss as f,useRole as g,useListNavigation as h,useMergeRefs as v,useTransitionStyles as k,FloatingNode as x,FloatingPortal as y,FloatingFocusManager as P,FloatingTree as j}from"@floating-ui/react";import{c as F}from"../../../clsx-BeLtu-UY.js";import w,{forwardRef as I,useId as M,useRef as C,useState as E,useEffect as S}from"react";import{useBrowserPreferences as N}from"../../hooks/useBrowserPreferences/useBrowserPreferences.js";import"../../hooks/useScreen/useScreen.js";import"../../hooks/useId/useId.js";import{getThemeAndSize as O}from"../../utilities/getThemeAndSize.js";import{SlotComponent as R}from"../../utilities/polymorphism/SlotComponent.js";import{useMenuWideEvents as b}from"./useMenuWideEvents.js";function T(e,s=0){switch(e){case"top":default:return`0 ${s}px`;case"left":return`${s}px 0`;case"bottom":return`0 ${-s}px`;case"right":return-s+"px 0"}}const z=I((j,I)=>{const{children:z,className:A,initialPlacement:D,openOnHover:$=!1,keepOpenOnClickOutside:B=!1,triggerElement:H,isOpen:K,onToggle:V,...W}=j,q=`"jkl-menu"${M()}`,{prefersReducedMotion:L}=N(),U=t(),G=n(),J=o(),Q=null!=J,X=C([]),[Y,Z]=E(null),{allowHover:_,isOpen:ee,setIsOpen:se}=b(U,G,J),te=void 0!==K?K:ee;S(()=>V?.(te),[te,V]);const{refs:ne,placement:oe,context:ae,floatingStyles:re}=a({nodeId:G,open:te,onOpenChange:se,placement:D||(Q?"right-start":"bottom-start"),middleware:[i(2),l({fallbackAxisSideDirection:"end",crossAxis:!1}),u({padding:8})],whileElementsMounted:r}),{getReferenceProps:ie,getFloatingProps:le,getItemProps:ue}=d([c(ae,{enabled:$&&_,delay:{open:75},handleClose:m({requireIntent:!0,blockPointerEvents:!0})}),p(ae,{event:"mousedown"}),f(ae,{outsidePress:!B}),g(ae,{role:"menu"}),h(ae,{listRef:X,activeIndex:Y,nested:Q,onNavigate:Z})]),de=v([ne.setReference,I]),{theme:ce,size:me}=O(ne.reference.current),{isMounted:pe,styles:fe}=k(ae,{duration:{open:L?0:250,close:L?0:150},initial:({side:e})=>({opacity:0,translate:T(e,5)}),open:({side:e})=>({opacity:1,translate:T(e,0)}),close:({side:e})=>({opacity:0,translate:T(e,5)})});return e(x,{id:G,children:[w.isValidElement(H)&&s(R,{...ie({...W,ref:de,role:Q?"menuitem":void 0,"aria-controls":q,onClick(e){e.stopPropagation()}}),children:H}),pe&&s(y,{children:s(P,{context:ae,modal:!1,initialFocus:Q?-1:0,returnFocus:!Q,children:s("div",{className:F("jkl jkl-menu",A),"data-theme":ce,"data-size":me,role:"menu","data-placement":oe,"aria-live":"assertive","aria-hidden":!te,ref:ne.setFloating,...le({id:q,style:{...re,...fe}}),children:w.Children.map(z,(e,t)=>w.isValidElement(e)?s(R,{...ue({...e.props,tabIndex:Y===t?0:-1,role:"menuitem",ref(e){X.current[t]=e},onClick(e){e.defaultPrevented||U?.events.emit("click")},onKeyDown(s){e.props.onKeyDown?.(s),!s.defaultPrevented&&(U?.events.emit("keydown"),"menuitemcheckbox"===s.currentTarget.role&&"Enter"===s.key&&se(!1))},onMouseEnter(){_&&te&&Z(t)}}),children:e}):e)})})})]})});z.displayName="MenuComponent";const A=I((e,t)=>null===o()?s(j,{children:s(z,{ref:t,...e})}):s(z,{ref:t,...e}));A.displayName="Menu";export{A as Menu};
 //# sourceMappingURL=Menu.js.map

package/build/es/components/number-input/NumberInput.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+export declare const NumberInput: React.ForwardRefExoticComponent<Omit<import('../input-group/types.js').InputGroupProps, "children" | "inline" | "render"> & Omit<React.InputHTMLAttributes<HTMLInputElement>, "children" | "type"> & {
+    align?: "left" | "right";
+    width?: string;
+    inputClassName?: string;
+    stepper?: boolean;
+} & React.RefAttributes<HTMLInputElement>>;

package/build/es/components/number-input/NumberInput.js

@@ -0,0 +1,2 @@
+import{jsx as n,jsxs as o}from"react/jsx-runtime";import{c as i}from"../../../clsx-BeLtu-UY.js";import{forwardRef as e,useRef as r,useState as t}from"react";import{mergeRefs as s}from"../../utilities/mergeRefs.js";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import{MinusIcon as c}from"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import{PlusIcon as a}from"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{InputGroup as p}from"../input-group/InputGroup.js";const m={decrement:{label:"Senk verdien",Icon:c},increment:{label:"Øk verdien",Icon:a}};function l({direction:o,disabled:i,onClick:e}){const{label:r,Icon:t}=m[o];return n("button",{type:"button",className:"jkl-button jkl-button--ghost","aria-label":r,"data-direction":o,onPointerDown:n=>n.preventDefault(),onClick:e,disabled:i,children:n("span",{"aria-hidden":"true",children:n(t,{})})})}const u=e((e,c)=>{const{"data-size":a,"data-testautoid":m,"data-testid":u,align:d="left",id:b,label:j,className:I,style:h,errorLabel:N,helpLabel:f,inputClassName:v,labelProps:w,supportLabelProps:k,stepper:C=!1,tooltip:g,description:y,width:A,onChange:_,...L}=e,P=r(null),D=s(P,c),[R,x]=t(L.defaultValue),E=void 0!==L.value?L.value:R,F=n=>{void 0===L.value&&x(n.target.value),_?.(n)},S=function(n){return"number"==typeof n?n:"string"==typeof n&&""!==n.trim()?Number(n):Number.NaN}(E),U=void 0!==L.min?Number(L.min):Number.NaN,z=void 0!==L.max?Number(L.max):Number.NaN,G=Number.isFinite(S)&&Number.isFinite(U)&&S<=U,O=Number.isFinite(S)&&Number.isFinite(z)&&S>=z,T=h||A?{...h,...A?{width:A}:void 0}:void 0,H={id:b,label:j,errorLabel:N,helpLabel:f,labelProps:w,supportLabelProps:k,tooltip:g,description:y},M=n=>{const o=P.current;if(!o||o.disabled||o.readOnly)return;const i=o.value;o.focus();try{"increment"===n?o.stepUp():o.stepDown()}catch{return}o.value!==i&&o.dispatchEvent(new Event("input",{bubbles:!0}))},V=L.disabled||L.readOnly;return n(p,{...H,className:i(I,"jkl-number-input"),"data-size":a,"data-testid":u??"jkl-number-input",render:e=>o("div",{className:i("jkl-number-input__wrapper",{"jkl-number-input__wrapper--stepper":C}),"data-invalid":e["aria-invalid"],style:T,children:[C&&n(l,{direction:"decrement",disabled:V||G,onClick:()=>M("decrement")}),n("input",{...e,...L,ref:D,type:"number",onChange:F,className:i("jkl-number-input__input",{"jkl-number-input__input--stepper":C,"jkl-number-input__input--align-right":!C&&"right"===d},v),"data-testautoid":m}),C&&n(l,{direction:"increment",disabled:V||O,onClick:()=>M("increment")})]})})});u.displayName="NumberInput";export{u as NumberInput};
+//# sourceMappingURL=NumberInput.js.map

package/build/es/components/number-input/NumberInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberInput.js","sources":["../../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type ComponentType,\n    forwardRef,\n    useRef,\n    useState,\n} from \"react\";\nimport { mergeRefs } from \"../../utilities/mergeRefs.js\";\nimport { MinusIcon, PlusIcon } from \"../icon/index.js\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport type { NumberInputProps } from \"./types.js\";\n\ntype NumberInputValue = string | number | readonly string[] | undefined;\n\ntype StepDirection = \"increment\" | \"decrement\";\n\nconst stepperConfig: Record<\n    StepDirection,\n    { label: string; Icon: ComponentType }\n> = {\n    decrement: { label: \"Senk verdien\", Icon: MinusIcon },\n    increment: { label: \"Øk verdien\", Icon: PlusIcon },\n};\n\nfunction toNumeric(value: NumberInputValue): number {\n    if (typeof value === \"number\") {\n        return value;\n    }\n    if (typeof value === \"string\" && value.trim() !== \"\") {\n        return Number(value);\n    }\n    return Number.NaN;\n}\n\ntype StepperButtonProps = {\n    direction: StepDirection;\n    disabled: boolean;\n    onClick: () => void;\n};\n\nfunction StepperButton({ direction, disabled, onClick }: StepperButtonProps) {\n    const { label, Icon } = stepperConfig[direction];\n\n    return (\n        <button\n            type=\"button\"\n            className=\"jkl-button jkl-button--ghost\"\n            aria-label={label}\n            data-direction={direction}\n            onPointerDown={(event) => event.preventDefault()}\n            onClick={onClick}\n            disabled={disabled}\n        >\n            <span aria-hidden=\"true\">\n                <Icon />\n            </span>\n        </button>\n    );\n}\n\nexport const NumberInput = forwardRef<HTMLInputElement, NumberInputProps>(\n    (props, ref) => {\n        const {\n            \"data-size\": dataSize,\n            \"data-testautoid\": testAutoId,\n            \"data-testid\": dataTestId,\n            align = \"left\",\n            id,\n            label,\n            className,\n            style,\n            errorLabel,\n            helpLabel,\n            inputClassName,\n            labelProps,\n            supportLabelProps,\n            stepper = false,\n            tooltip,\n            description,\n            width,\n            onChange,\n            ...rest\n        } = props;\n        const internalRef = useRef<HTMLInputElement>(null);\n        const mergedRef = mergeRefs(internalRef, ref);\n        const [uncontrolledValue, setUncontrolledValue] =\n            useState<NumberInputValue>(rest.defaultValue);\n\n        // I kontrollert bruk må vi lese direkte fra `value` for at disabled-\n        // state på stepper-knappene skal følge prop-en i samme render. Bruker\n        // intern state som fallback for ukontrollert bruk.\n        const effectiveValue =\n            rest.value !== undefined ? rest.value : uncontrolledValue;\n\n        const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n            if (rest.value === undefined) {\n                setUncontrolledValue(event.target.value);\n            }\n            onChange?.(event);\n        };\n\n        const numericValue = toNumeric(effectiveValue);\n        const minNumeric =\n            rest.min !== undefined ? Number(rest.min) : Number.NaN;\n        const maxNumeric =\n            rest.max !== undefined ? Number(rest.max) : Number.NaN;\n        const isAtOrBelowMin =\n            Number.isFinite(numericValue) &&\n            Number.isFinite(minNumeric) &&\n            numericValue <= minNumeric;\n        const isAtOrAboveMax =\n            Number.isFinite(numericValue) &&\n            Number.isFinite(maxNumeric) &&\n            numericValue >= maxNumeric;\n\n        const inputWrapperStyle =\n            style || width\n                ? {\n                      ...style,\n                      ...(width ? { width } : undefined),\n                  }\n                : undefined;\n        const inputGroupProps = {\n            id,\n            label,\n            errorLabel,\n            helpLabel,\n            labelProps,\n            supportLabelProps,\n            tooltip,\n            description,\n        };\n\n        const triggerStep = (direction: StepDirection) => {\n            const input = internalRef.current;\n\n            if (!input || input.disabled || input.readOnly) {\n                return;\n            }\n\n            const previousValue = input.value;\n            input.focus();\n\n            try {\n                if (direction === \"increment\") {\n                    input.stepUp();\n                } else {\n                    input.stepDown();\n                }\n            } catch {\n                return;\n            }\n\n            if (input.value === previousValue) {\n                return;\n            }\n\n            input.dispatchEvent(new Event(\"input\", { bubbles: true }));\n        };\n\n        const stepperDisabled = rest.disabled || rest.readOnly;\n\n        return (\n            <InputGroup\n                {...inputGroupProps}\n                className={clsx(className, \"jkl-number-input\")}\n                data-size={dataSize}\n                data-testid={dataTestId ?? \"jkl-number-input\"}\n                render={(inputProps) => (\n                    <div\n                        className={clsx(\"jkl-number-input__wrapper\", {\n                            \"jkl-number-input__wrapper--stepper\": stepper,\n                        })}\n                        data-invalid={inputProps[\"aria-invalid\"]}\n                        style={inputWrapperStyle}\n                    >\n                        {stepper && (\n                            <StepperButton\n                                direction=\"decrement\"\n                                disabled={stepperDisabled || isAtOrBelowMin}\n                                onClick={() => triggerStep(\"decrement\")}\n                            />\n                        )}\n                        <input\n                            {...inputProps}\n                            {...rest}\n                            ref={mergedRef}\n                            type=\"number\"\n                            onChange={handleChange}\n                            className={clsx(\n                                \"jkl-number-input__input\",\n                                {\n                                    \"jkl-number-input__input--stepper\": stepper,\n                                    \"jkl-number-input__input--align-right\":\n                                        !stepper && align === \"right\",\n                                },\n                                inputClassName,\n                            )}\n                            data-testautoid={testAutoId}\n                        />\n                        {stepper && (\n                            <StepperButton\n                                direction=\"increment\"\n                                disabled={stepperDisabled || isAtOrAboveMax}\n                                onClick={() => triggerStep(\"increment\")}\n                            />\n                        )}\n                    </div>\n                )}\n            />\n        );\n    },\n);\n\nNumberInput.displayName = \"NumberInput\";\n"],"names":["stepperConfig","decrement","label","Icon","MinusIcon","increment","PlusIcon","StepperButton","direction","disabled","onClick","jsx","type","className","onPointerDown","event","preventDefault","children","NumberInput","forwardRef","props","ref","dataSize","testAutoId","dataTestId","align","id","style","errorLabel","helpLabel","inputClassName","labelProps","supportLabelProps","stepper","tooltip","description","width","onChange","rest","internalRef","useRef","mergedRef","mergeRefs","uncontrolledValue","setUncontrolledValue","useState","defaultValue","effectiveValue","value","handleChange","target","numericValue","trim","Number","NaN","toNumeric","minNumeric","min","maxNumeric","max","isAtOrBelowMin","isFinite","isAtOrAboveMax","inputWrapperStyle","inputGroupProps","triggerStep","input","current","readOnly","previousValue","focus","stepUp","stepDown","dispatchEvent","Event","bubbles","stepperDisabled","InputGroup","clsx","render","inputProps","jsxs","displayName"],"mappings":"iqDAgBA,MAAMA,EAGF,CACAC,UAAW,CAAEC,MAAO,eAAgBC,KAAMC,GAC1CC,UAAW,CAAEH,MAAO,aAAcC,KAAMG,IAmB5C,SAASC,GAAgBC,UAAAA,EAAWC,SAAAA,EAAUC,QAAAA,IAC1C,MAAQR,MAAAA,EAAOC,KAAAA,GAASH,EAAcQ,GAEtC,OACIG,EAAC,SAAA,CACGC,KAAK,SACLC,UAAU,+BACV,aAAYX,EACZ,iBAAgBM,EAChBM,cAAgBC,GAAUA,EAAMC,iBAChCN,QAAAA,EACAD,SAAAA,EAEAQ,WAAC,OAAA,CAAK,cAAY,OACdA,SAAAN,EAACR,SAIjB,CAEO,MAAMe,EAAcC,EACvB,CAACC,EAAOC,KACJ,MACI,YAAaC,EACb,kBAAmBC,EACnB,cAAeC,EACfC,MAAAA,EAAQ,OACRC,GAAAA,EACAxB,MAAAA,EACAW,UAAAA,EACAc,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,GAAU,EACVC,QAAAA,EACAC,YAAAA,EACAC,MAAAA,EACAC,SAAAA,KACGC,GACHlB,EACEmB,EAAcC,EAAyB,MACvCC,EAAYC,EAAUH,EAAalB,IAClCsB,EAAmBC,GACtBC,EAA2BP,EAAKQ,cAK9BC,OACa,IAAfT,EAAKU,MAAsBV,EAAKU,MAAQL,EAEtCM,EAAgBlC,SACC,IAAfuB,EAAKU,OACLJ,EAAqB7B,EAAMmC,OAAOF,OAEtCX,IAAWtB,IAGToC,EA7Ed,SAAmBH,GACf,MAAqB,iBAAVA,EACAA,EAEU,iBAAVA,GAAuC,KAAjBA,EAAMI,OAC5BC,OAAOL,GAEXK,OAAOC,GAClB,CAqE6BC,CAAUR,GACzBS,OACW,IAAblB,EAAKmB,IAAoBJ,OAAOf,EAAKmB,KAAOJ,OAAOC,IACjDI,OACW,IAAbpB,EAAKqB,IAAoBN,OAAOf,EAAKqB,KAAON,OAAOC,IACjDM,EACFP,OAAOQ,SAASV,IAChBE,OAAOQ,SAASL,IAChBL,GAAgBK,EACdM,EACFT,OAAOQ,SAASV,IAChBE,OAAOQ,SAASH,IAChBP,GAAgBO,EAEdK,EACFpC,GAASS,EACH,IACOT,KACCS,EAAQ,CAAEA,MAAAA,QAAU,QAE5B,EACJ4B,EAAkB,CACpBtC,GAAAA,EACAxB,MAAAA,EACA0B,WAAAA,EACAC,UAAAA,EACAE,WAAAA,EACAC,kBAAAA,EACAE,QAAAA,EACAC,YAAAA,GAGE8B,EAAezD,IACjB,MAAM0D,EAAQ3B,EAAY4B,QAE1B,IAAKD,GAASA,EAAMzD,UAAYyD,EAAME,SAClC,OAGJ,MAAMC,EAAgBH,EAAMlB,MAC5BkB,EAAMI,QAEN,IACsB,cAAd9D,EACA0D,EAAMK,SAENL,EAAMM,UAEd,CAAA,MACI,MACJ,CAEIN,EAAMlB,QAAUqB,GAIpBH,EAAMO,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,MAGhDC,EAAkBtC,EAAK7B,UAAY6B,EAAK8B,SAE9C,OACIzD,EAACkE,EAAA,IACOb,EACJnD,UAAWiE,EAAKjE,EAAW,oBAC3B,YAAWS,EACX,cAAaE,GAAc,mBAC3BuD,OAASC,GACLC,EAAC,MAAA,CACGpE,UAAWiE,EAAK,4BAA6B,CACzC,qCAAsC7C,IAE1C,eAAc+C,EAAW,gBACzBrD,MAAOoC,EAEN9C,SAAA,CAAAgB,GACGtB,EAACJ,EAAA,CACGC,UAAU,YACVC,SAAUmE,GAAmBhB,EAC7BlD,QAAS,IAAMuD,EAAY,eAGnCtD,EAAC,QAAA,IACOqE,KACA1C,EACJjB,IAAKoB,EACL7B,KAAK,SACLyB,SAAUY,EACVpC,UAAWiE,EACP,0BACA,CACI,mCAAoC7C,EACpC,wCACKA,GAAqB,UAAVR,GAEpBK,GAEJ,kBAAiBP,IAEpBU,GACGtB,EAACJ,EAAA,CACGC,UAAU,YACVC,SAAUmE,GAAmBd,EAC7BpD,QAAS,IAAMuD,EAAY,sBAU3D/C,EAAYgE,YAAc"}

package/build/es/components/number-input/index.d.ts

@@ -0,0 +1,2 @@
+export { NumberInput } from './NumberInput.js';
+export type { NumberInputProps } from './types.js';

package/build/es/components/number-input/index.js

@@ -0,0 +1,2 @@
+import{NumberInput as r}from"./NumberInput.js";export{r as NumberInput};
+//# sourceMappingURL=index.js.map

package/build/es/components/number-input/index.js.map

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

package/build/es/components/number-input/types.d.ts

@@ -0,0 +1,20 @@
+import { InputHTMLAttributes } from 'react';
+import { InputGroupProps } from '../input-group/types.js';
+export type NumberInputProps = Omit<InputGroupProps, "children" | "inline" | "render"> & Omit<InputHTMLAttributes<HTMLInputElement>, "children" | "type"> & {
+    /**
+     * Justerer teksten i inputfeltet.
+     * @default "left"
+     */
+    align?: "left" | "right";
+    /**
+     * CSS-verdi for bredden til input-feltet.
+     */
+    width?: string;
+    inputClassName?: string;
+    /**
+     * Viser knapper på hver side av feltet som bruker native stepping.
+     * Respekterer `min`, `max` og `step`.
+     * @default false
+     */
+    stepper?: boolean;
+};

package/build/es/components/number-input/types.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.js.map

package/build/es/components/number-input/types.js.map

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

package/build/es/components/popover/Popover.js

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{useMergeRefs as t,FloatingPortal as n,FloatingFocusManager as o,useFloating as s,autoUpdate as r,offset as a,flip as i,shift as l,useClick as c,useHover as u,useFocus as p,useDismiss as d,useRole as f,useInteractions as m}from"@floating-ui/react";import{c as g}from"../../../clsx-BeLtu-UY.js";import*as h from"react";import{getThemeAndSize as v}from"../../utilities/getThemeAndSize.js";const x=h.createContext(null),k=()=>{const e=h.useContext(x);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},F=({children:t,...n})=>{const o=(({open:e,onOpenChange:t,placement:n="bottom-start",strategy:o="absolute",modal:g=!0,offset:v=4,positionReference:x,hoverOptions:k,focusOptions:F,clickOptions:R,roleOptions:b,dismissOptions:C})=>{const[O,P]=h.useState(e),j=e??O,E=t??P,y=s({open:j,onOpenChange:E,placement:n,strategy:o,middleware:[a(v),i({padding:5,fallbackPlacements:["bottom","top"]}),l({padding:12})],whileElementsMounted:r}),w=y.context,z=c(w,{enabled:!1,...R}),M=u(w,{enabled:!1,...k}),N=p(w,{enabled:!1,...F}),S=d(w,C),T=f(w,b),A=m([z,S,N,M,T]);return h.useLayoutEffect(()=>{x&&y.refs.setPositionReference(x?.current)},[x,y.refs]),h.useMemo(()=>({open:j,onOpenChange:E,modal:g,...A,...y}),[j,E,g,A,y])})({...n});return e(x.Provider,{value:o,children:t})},R=h.forwardRef(function({children:n,asChild:o=!1,...s},r){const{refs:a,getReferenceProps:i,open:l,onOpenChange:c}=k(),u=n.ref,p=t([a.setReference,r,u]);return o&&h.isValidElement(n)?h.cloneElement(n,i({ref:p,...s,...n.props})):e("button",{ref:p,onClick:()=>c?.(!l),"aria-expanded":l,...i({...s,className:g("jkl-popover-trigger",s.className)}),children:n})}),b=h.forwardRef(function({style:s,className:r,padding:a=0,initialFocus:i=0,returnFocus:l=!0,...c},u){const{context:p,modal:d,refs:f,open:m,floatingStyles:x,getFloatingProps:F}=k(),R=t([f.setFloating,u]),b=f.reference.current,{theme:C,size:O}=v((j=b)&&"contextElement"in j?b.contextElement:b),P=h.useRef(null);var j;return h.useEffect(()=>{P.current=p.elements.domReference?.closest("[data-portal]")||document.body},[p.elements.domReference]),m?e(n,{root:P.current,children:e(o,{context:p,modal:d,initialFocus:i,returnFocus:l,children:e("div",{"data-theme":C,"data-size":O,className:g("jkl jkl-popover",r),ref:R,style:{...s,...x,"--popover-padding":`var(--jkl-spacing-${a})`},...F(c),children:c.children})})}):null});F.Trigger=R,F.Content=b;export{F as Popover,F as default};
+import{jsx as e}from"react/jsx-runtime";import{useMergeRefs as t,FloatingPortal as n,FloatingFocusManager as o,useFloating as s,autoUpdate as r,offset as a,flip as i,shift as l,useClick as c,useHover as u,useFocus as p,useDismiss as d,useRole as m,useInteractions as f}from"@floating-ui/react";import{c as g}from"../../../clsx-BeLtu-UY.js";import*as h from"react";import{getThemeAndSize as v}from"../../utilities/getThemeAndSize.js";const b=h.createContext(null),x=()=>{const e=h.useContext(b);if(null==e)throw new Error("Popover komponenter må brukes innenfor en <Popover /> komponent");return e},k=({children:t,...n})=>{const o=(({open:e,onOpenChange:t,placement:n="bottom-start",strategy:o="absolute",modal:g=!0,offset:v=4,positionReference:b,onPlacementChange:x,hoverOptions:k,focusOptions:C,clickOptions:F,roleOptions:P,dismissOptions:R})=>{const[y,E]=h.useState(e),O=e??y,j=t??E,w=s({open:O,onOpenChange:j,placement:n,strategy:o,middleware:[a(v),i({padding:5,fallbackPlacements:["bottom","top"]}),l({padding:12})],whileElementsMounted:r}),z=w.context,M=c(z,{enabled:!1,...F}),N=u(z,{enabled:!1,...k}),S=p(z,{enabled:!1,...C}),T=d(z,R),A=m(z,P),L=f([M,T,S,N,A]);return h.useLayoutEffect(()=>{b&&w.refs.setPositionReference(b?.current)},[b,w.refs]),h.useLayoutEffect(()=>{O&&x?.(w.placement)},[O,w.placement,x]),h.useMemo(()=>({open:O,onOpenChange:j,modal:g,...L,...w}),[O,j,g,L,w])})({...n});return e(b.Provider,{value:o,children:t})},C=h.forwardRef(function({children:n,asChild:o=!1,...s},r){const{refs:a,getReferenceProps:i,open:l,onOpenChange:c}=x(),u=n.ref,p=t([a.setReference,r,u]);return o&&h.isValidElement(n)?h.cloneElement(n,i({ref:p,...s,...n.props})):e("button",{ref:p,onClick:()=>c?.(!l),"aria-expanded":l,...i({...s,className:g("jkl-popover-trigger",s.className)}),children:n})}),F=h.forwardRef(function({style:s,className:r,padding:a=0,initialFocus:i=0,returnFocus:l=!0,...c},u){const{context:p,modal:d,refs:m,open:f,floatingStyles:b,getFloatingProps:k,isPositioned:C}=x(),F=t([m.setFloating,u]),P=m.reference.current,{theme:R,size:y}=v((O=P)&&"contextElement"in O?P.contextElement:P),E=h.useRef(null);var O;return h.useEffect(()=>{E.current=p.elements.domReference?.closest("[data-portal]")||document.body},[p.elements.domReference]),f?e(n,{root:E.current,children:e(o,{context:p,modal:d,initialFocus:i,returnFocus:l,children:e("div",{"data-theme":R,"data-size":y,className:g("jkl jkl-popover",r),ref:F,style:{...s,...b,"--popover-padding":`var(--jkl-spacing-${a})`,visibility:d||C?"visible":"hidden"},...k(c),children:c.children})})}):null});k.Trigger=C,k.Content=F;export{k as Popover,k as default};
 //# sourceMappingURL=Popover.js.map