@fremtind/jokul 5.0.0-next.9 → 5.0.1

package/build/es/components/checkbox-panel/CheckboxPanel.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { CheckboxPanelProps } from './types.js';
-export declare const CheckboxPanel: (props: CheckboxPanelProps) => React.JSX.Element;
+export declare const CheckboxPanel: React.ForwardRefExoticComponent<CheckboxPanelProps & React.RefAttributes<HTMLInputElement>>;

package/build/es/components/checkbox-panel/CheckboxPanel.js

@@ -1,2 +1,2 @@
-import{jsx as t}from"react/jsx-runtime";import"react";import{InputPanel as e}from"../input-panel/InputPanel.js";const a=a=>t(e,{...a,type:"checkbox"});export{a as CheckboxPanel};
+import{jsx as r}from"react/jsx-runtime";import{forwardRef as e}from"react";import{InputPanel as t}from"../input-panel/InputPanel.js";const n=e(function(e,n){return r(t,{...e,ref:n,type:"checkbox"})});export{n as CheckboxPanel};
 //# sourceMappingURL=CheckboxPanel.js.map

package/build/es/components/checkbox-panel/CheckboxPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxPanel.js","sources":["../../../../src/components/checkbox-panel/CheckboxPanel.tsx"],"sourcesContent":["import React from \"react\";\nimport { InputPanel } from \"../input-panel/InputPanel.js\";\nimport type { CheckboxPanelProps } from \"./types.js\";\n\nexport const CheckboxPanel = (props: CheckboxPanelProps) => (\n    <InputPanel {...props} type=\"checkbox\" />\n);\n"],"names":["CheckboxPanel","props","jsx","InputPanel","type"],"mappings":"gHAIO,MAAMA,EAAiBC,GAC1BC,EAACC,MAAeF,EAAOG,KAAK"}
+{"version":3,"file":"CheckboxPanel.js","sources":["../../../../src/components/checkbox-panel/CheckboxPanel.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { InputPanel } from \"../input-panel/InputPanel.js\";\nimport type { CheckboxPanelProps } from \"./types.js\";\n\nexport const CheckboxPanel = forwardRef<HTMLInputElement, CheckboxPanelProps>(\n    function CheckboxPanel(props, ref) {\n        return <InputPanel {...props} ref={ref} type=\"checkbox\" />;\n    },\n);\n"],"names":["CheckboxPanel","forwardRef","props","ref","InputPanel","type"],"mappings":"qIAIO,MAAMA,EAAgBC,EACzB,SAAuBC,EAAOC,GAC1B,SAAQC,EAAA,IAAeF,EAAOC,IAAAA,EAAUE,KAAK,YACjD"}

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,4 @@
 export { ExpandablePanel } from './ExpandablePanel.js';
 export { Expander } from './Expander.js';
-export type { ExpandablePanelProps, ExpanderProps } from './types.js';
+export { Accordion } from './Accordion.js';
+export type { ExpandablePanelProps, ExpanderProps, AccordionProps, } from './types.js';

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

@@ -1,2 +1,2 @@
-import{ExpandablePanel as a}from"./ExpandablePanel.js";import{Expander as e}from"./Expander.js";export{a as ExpandablePanel,e as Expander};
+import{ExpandablePanel as a}from"./ExpandablePanel.js";import{Expander as o}from"./Expander.js";import{Accordion as r}from"./Accordion.js";export{r as Accordion,a as ExpandablePanel,o as Expander};
 //# sourceMappingURL=index.js.map

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/input-panel/InputPanel.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
-export declare const InputPanel: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "children"> & {
+export declare const InputPanel: React.ForwardRefExoticComponent<Omit<React.InputHTMLAttributes<HTMLInputElement>, "children"> & import('../../utilities/types.js').JokulModes & {
     label: string;
     type: "radio" | "checkbox";
     amount?: string;

package/build/es/components/input-panel/InputPanel.js

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as a}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as e}from"react";import{Checkbox as r}from"../checkbox/Checkbox.js";import{RadioButton as i}from"../radio-button/RadioButton.js";import"../../hooks/useId/useId.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/WarningIcon.js";import"../radio-button/radioGroupContext.js";import"../radio-button/BaseRadioButton.js";const t=e(function({className:e,description:t,type:s,label:c,amount:l,value:p=c,name:m="Panelvalg",children:d,extraLabel:u,alwaysOpen:j=!1,...h},x){return o("div",{className:n("jkl-input-panel",`jkl-${s}-panel`,e),ref:x,"data-always-open":j,children:[o("div",{className:"jkl-input-panel__header",children:["checkbox"===s&&a(r,{value:p?.toString(),name:m,...h,children:c}),"radio"===s&&a(i,{value:p?.toString(),name:m,...h,children:c}),(l||u)&&a("span",{className:"jkl-input-panel__header__amount",children:l||u})]}),(t||d)&&a("div",{className:"jkl-input-panel__description",children:t||d})]})});export{t as InputPanel};
+import{jsxs as a,jsx as e}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import{forwardRef as n}from"react";import{Checkbox as t}from"../checkbox/Checkbox.js";import{RadioButton as i}from"../radio-button/RadioButton.js";import"../../hooks/useId/useId.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/SuccessIcon.js";import"../icon/icons/WarningIcon.js";import"../radio-button/radioGroupContext.js";import"../radio-button/BaseRadioButton.js";const r=n(function({className:n,description:r,type:s,label:c,amount:l,value:d=c,name:m="Panelvalg",children:p,extraLabel:u,alwaysOpen:j=!1,"data-size":h,"data-theme":x,...f},k){return a("div",{className:o("jkl-input-panel",`jkl-${s}-panel`,n),"data-always-open":j,"data-size":h,"data-theme":x,children:[a("div",{className:"jkl-input-panel__header",children:["checkbox"===s&&e(t,{value:d?.toString(),name:m,ref:k,...f,children:c}),"radio"===s&&e(i,{value:d?.toString(),name:m,ref:k,...f,children:c}),(l||u)&&e("span",{className:"jkl-input-panel__header__amount",children:l||u})]}),(r||p)&&e("div",{className:"jkl-input-panel__description",children:r||p})]})});export{r as InputPanel};
 //# sourceMappingURL=InputPanel.js.map

package/build/es/components/input-panel/InputPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputPanel.js","sources":["../../../../src/components/input-panel/InputPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type ForwardedRef, forwardRef } from \"react\";\nimport { Checkbox } from \"../checkbox/index.js\";\nimport { RadioButton } from \"../radio-button/index.js\";\nimport type { InputPanelProps } from \"./types.js\";\n\nexport const InputPanel = forwardRef(function BasePanel(\n    {\n        className,\n        description,\n        type,\n        label,\n        amount,\n        value = label,\n        name = \"Panelvalg\",\n        children,\n        extraLabel,\n        alwaysOpen = false,\n        ...rest\n    }: InputPanelProps,\n    ref: ForwardedRef<HTMLInputElement>,\n) {\n    return (\n        <div\n            className={clsx(\"jkl-input-panel\", `jkl-${type}-panel`, className)}\n            ref={ref}\n            data-always-open={alwaysOpen}\n        >\n            <div className=\"jkl-input-panel__header\">\n                {type === \"checkbox\" && (\n                    <Checkbox value={value?.toString()} name={name} {...rest}>\n                        {label}\n                    </Checkbox>\n                )}\n                {type === \"radio\" && (\n                    <RadioButton\n                        value={value?.toString()}\n                        name={name}\n                        {...rest}\n                    >\n                        {label}\n                    </RadioButton>\n                )}\n                {(amount || extraLabel) && (\n                    <span className=\"jkl-input-panel__header__amount\">\n                        {amount || extraLabel}\n                    </span>\n                )}\n            </div>\n            {(description || children) && (\n                <div className=\"jkl-input-panel__description\">\n                    {description || children}\n                </div>\n            )}\n        </div>\n    );\n});\n"],"names":["InputPanel","forwardRef","className","description","type","label","amount","value","name","children","extraLabel","alwaysOpen","rest","ref","jsxs","clsx","jsx","Checkbox","toString","RadioButton"],"mappings":"2dAMO,MAAMA,EAAaC,EAAW,UAE7BC,UAAAA,EACAC,YAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EAAQF,EACRG,KAAAA,EAAO,YACPC,SAAAA,EACAC,WAAAA,EACAC,WAAAA,GAAa,KACVC,GAEPC,GAEA,OACIC,EAAC,MAAA,CACGZ,UAAWa,EAAK,kBAAmB,OAAOX,UAAcF,GACxDW,IAAAA,EACA,mBAAkBF,EAElBF,SAAA,CAAAK,EAAC,MAAA,CAAIZ,UAAU,0BACVO,SAAA,CAAS,aAATL,GACGY,EAACC,EAAA,CAASV,MAAOA,GAAOW,WAAYV,KAAAA,KAAgBI,EAC/CH,SAAAJ,IAGC,UAATD,GACGY,EAACG,EAAA,CACGZ,MAAOA,GAAOW,WACdV,KAAAA,KACII,EAEHH,SAAAJ,KAGPC,GAAUI,IACRM,EAAC,QAAKd,UAAU,kCACXO,YAAUC,QAIrBP,GAAeM,IACbO,EAAC,OAAId,UAAU,+BACVO,YAAeA,MAKpC"}
+{"version":3,"file":"InputPanel.js","sources":["../../../../src/components/input-panel/InputPanel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type ForwardedRef, forwardRef } from \"react\";\nimport { Checkbox } from \"../checkbox/index.js\";\nimport { RadioButton } from \"../radio-button/index.js\";\nimport type { InputPanelProps } from \"./types.js\";\n\nexport const InputPanel = forwardRef(function BasePanel(\n    {\n        className,\n        description,\n        type,\n        label,\n        amount,\n        value = label,\n        name = \"Panelvalg\",\n        children,\n        extraLabel,\n        alwaysOpen = false,\n        \"data-size\": dataSize,\n        \"data-theme\": dataTheme,\n        ...rest\n    }: InputPanelProps,\n    ref: ForwardedRef<HTMLInputElement>,\n) {\n    return (\n        <div\n            className={clsx(\"jkl-input-panel\", `jkl-${type}-panel`, className)}\n            data-always-open={alwaysOpen}\n            data-size={dataSize}\n            data-theme={dataTheme}\n        >\n            <div className=\"jkl-input-panel__header\">\n                {type === \"checkbox\" && (\n                    <Checkbox\n                        value={value?.toString()}\n                        name={name}\n                        ref={ref}\n                        {...rest}\n                    >\n                        {label}\n                    </Checkbox>\n                )}\n                {type === \"radio\" && (\n                    <RadioButton\n                        value={value?.toString()}\n                        name={name}\n                        ref={ref}\n                        {...rest}\n                    >\n                        {label}\n                    </RadioButton>\n                )}\n                {(amount || extraLabel) && (\n                    <span className=\"jkl-input-panel__header__amount\">\n                        {amount || extraLabel}\n                    </span>\n                )}\n            </div>\n            {(description || children) && (\n                <div className=\"jkl-input-panel__description\">\n                    {description || children}\n                </div>\n            )}\n        </div>\n    );\n});\n"],"names":["InputPanel","forwardRef","className","description","type","label","amount","value","name","children","extraLabel","alwaysOpen","dataSize","dataTheme","rest","ref","jsxs","clsx","jsx","Checkbox","toString","RadioButton"],"mappings":"2dAMO,MAAMA,EAAaC,EAAW,UAE7BC,UAAAA,EACAC,YAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EAAQF,EACRG,KAAAA,EAAO,YACPC,SAAAA,EACAC,WAAAA,EACAC,WAAAA,GAAa,EACb,YAAaC,EACb,aAAcC,KACXC,GAEPC,GAEA,OACIC,EAAC,MAAA,CACGd,UAAWe,EAAK,kBAAmB,OAAOb,UAAcF,GACxD,mBAAkBS,EAClB,YAAWC,EACX,aAAYC,EAEZJ,SAAA,CAAAO,EAAC,MAAA,CAAId,UAAU,0BACVO,SAAA,CAAS,aAATL,GACGc,EAACC,EAAA,CACGZ,MAAOA,GAAOa,WACdZ,KAAAA,EACAO,IAAAA,KACID,EAEHL,SAAAJ,IAGC,UAATD,GACGc,EAACG,EAAA,CACGd,MAAOA,GAAOa,WACdZ,KAAAA,EACAO,IAAAA,KACID,EAEHL,SAAAJ,KAGPC,GAAUI,IACRQ,EAAC,QAAKhB,UAAU,kCACXO,YAAUC,QAIrBP,GAAeM,IACbS,EAAC,OAAIhB,UAAU,+BACVO,YAAeA,MAKpC"}

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

@@ -1,5 +1,6 @@
 import { InputHTMLAttributes, ReactNode } from 'react';
-export type InputPanelProps = Omit<InputHTMLAttributes<HTMLInputElement>, "children"> & {
+import { JokulModes } from '../../utilities/types.js';
+export type InputPanelProps = Omit<InputHTMLAttributes<HTMLInputElement>, "children"> & JokulModes & {
     label: string;
     type: "radio" | "checkbox";
     /**

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/message/Message.js

@@ -1,2 +1,2 @@
-import{jsx as s,jsxs as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import i,{forwardRef as n}from"react";import{useId as l}from"../../hooks/useId/useId.js";import{ErrorIcon as r}from"../icon/icons/ErrorIcon.js";import{InfoIcon as c}from"../icon/icons/InfoIcon.js";import{SuccessIcon as o}from"../icon/icons/SuccessIcon.js";import{WarningIcon as m}from"../icon/icons/WarningIcon.js";import{DismissButton as t}from"./DismissButton.js";const d=e=>{switch(e){case"error":return s(r,{className:"jkl-message__icon"});case"info":return s(c,{className:"jkl-message__icon"});case"success":return s(o,{className:"jkl-message__icon"});case"warning":return s(m,{className:"jkl-message__icon"});default:return null}};function g(r){const c=n((n,c)=>{const{id:o,title:m,fullWidth:g,className:u="",dismissed:f,dismissAction:j,children:h,role:k,..._}=n,p=l(o||"jkl-message",{generateSuffix:!o}),N=i.Children.map(h,s=>"string"==typeof s)?.[0]?s("p",{children:h}):h;return e("div",{..._,id:o,ref:c,className:a("jkl-message",`jkl-message--${r}`,u,{"jkl-message--full":g,"jkl-message--dismissed":f}),role:k,children:[d(r),e("div",{className:"jkl-message__content","data-theme":"light",children:[m&&s("p",{className:"jkl-message__title",children:m}),s("div",{className:"jkl-message__message",children:N})]}),j?.handleDismiss&&s(t,{"data-theme":"light","aria-controls":p,className:"jkl-message__dismiss-button",label:j.buttonTitle||"Lukk",onClick:j.handleDismiss})]})});return c.displayName="Message",c}const u=n((n,r)=>{const{id:c,title:o,fullWidth:m,className:g="",dismissed:u,dismissAction:f,children:j,variant:h="info",role:k,..._}=n,p=l(c||"jkl-message",{generateSuffix:!c}),N=i.Children.map(j,s=>"string"==typeof s)?.[0]?s("p",{children:j}):j;return e("div",{..._,id:c,ref:r,className:a("jkl-message",`jkl-message--${h}`,g,{"jkl-message--full":m,"jkl-message--dismissed":u}),role:k,children:[d(h),e("div",{className:"jkl-message__content","data-theme":"light",children:[o&&s("p",{className:"jkl-message__title",children:o}),s("div",{className:"jkl-message__message",children:N})]}),f?.handleDismiss&&s(t,{"data-theme":"light","aria-controls":p,className:"jkl-message__dismiss-button",label:f.buttonTitle||"Lukk",onClick:f.handleDismiss})]})}),f=g("info");f.displayName="InfoMessage";const j=g("error");j.displayName="ErrorMessage";const h=g("warning");h.displayName="WarningMessage";const k=g("success");k.displayName="SuccessMessage";export{j as ErrorMessage,f as InfoMessage,u as Message,k as SuccessMessage,h as WarningMessage};
+import{jsx as s,jsxs as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import i,{forwardRef as n}from"react";import{useId as l}from"../../hooks/useId/useId.js";import{ErrorIcon as r}from"../icon/icons/ErrorIcon.js";import{InfoIcon as c}from"../icon/icons/InfoIcon.js";import{SuccessIcon as o}from"../icon/icons/SuccessIcon.js";import{WarningIcon as m}from"../icon/icons/WarningIcon.js";import{DismissButton as t}from"./DismissButton.js";const d=e=>{switch(e){case"error":return s(r,{className:"jkl-message__icon"});case"info":return s(c,{className:"jkl-message__icon"});case"success":return s(o,{className:"jkl-message__icon"});case"warning":return s(m,{className:"jkl-message__icon"});default:return null}};function g(r){const c=n((n,c)=>{const{id:o,title:m,fullWidth:g,className:u="",dismissed:f,dismissAction:j,children:k,role:h,..._}=n,p=l(o||"jkl-message",{generateSuffix:!o}),N=i.Children.map(k,s=>"string"==typeof s)?.[0]?s("p",{children:k}):k;return e("div",{..._,id:o,ref:c,className:a("jkl-message",`jkl-message--${r}`,u,{"jkl-message--full":g,"jkl-message--dismissed":f}),role:h,children:[d(r),e("div",{className:"jkl-message__content","data-theme":"light",children:[m&&s("p",{className:"jkl-message__title",children:m}),s("div",{className:"jkl-message__message",children:N})]}),j?.handleDismiss&&s(t,{"aria-controls":p,className:"jkl-message__dismiss-button",label:j.buttonTitle||"Lukk",onClick:j.handleDismiss})]})});return c.displayName="Message",c}const u=n((n,r)=>{const{id:c,title:o,fullWidth:m,className:g="",dismissed:u,dismissAction:f,children:j,variant:k="info",role:h,..._}=n,p=l(c||"jkl-message",{generateSuffix:!c}),N=i.Children.map(j,s=>"string"==typeof s)?.[0]?s("p",{children:j}):j;return e("div",{..._,id:c,ref:r,className:a("jkl-message",`jkl-message--${k}`,g,{"jkl-message--full":m,"jkl-message--dismissed":u}),role:h,children:[d(k),e("div",{className:"jkl-message__content","data-theme":"light",children:[o&&s("p",{className:"jkl-message__title",children:o}),s("div",{className:"jkl-message__message",children:N})]}),f?.handleDismiss&&s(t,{"aria-controls":p,className:"jkl-message__dismiss-button",label:f.buttonTitle||"Lukk",onClick:f.handleDismiss})]})}),f=g("info");f.displayName="InfoMessage";const j=g("error");j.displayName="ErrorMessage";const k=g("warning");k.displayName="WarningMessage";const h=g("success");h.displayName="SuccessMessage";export{j as ErrorMessage,f as InfoMessage,u as Message,h as SuccessMessage,k as WarningMessage};
 //# sourceMappingURL=Message.js.map

package/build/es/components/message/Message.js.map

@@ -1 +1 @@
-{"version":3,"file":"Message.js","sources":["../../../../src/components/message/Message.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ErrorIcon } from \"../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../icon/icons/WarningIcon.js\";\nimport { DismissButton } from \"./DismissButton.js\";\nimport type { MessageProps } from \"./types.js\";\n\nconst getIcon = (messageType: MessageProps[\"variant\"]) => {\n    switch (messageType) {\n        case \"error\":\n            return <ErrorIcon className=\"jkl-message__icon\" />;\n        case \"info\":\n            return <InfoIcon className=\"jkl-message__icon\" />;\n        case \"success\":\n            return <SuccessIcon className=\"jkl-message__icon\" />;\n        case \"warning\":\n            return <WarningIcon className=\"jkl-message__icon\" />;\n        default:\n            return null;\n    }\n};\n\nfunction messageFactory(messageType: MessageProps[\"variant\"]) {\n    const Message = forwardRef<HTMLDivElement, MessageProps>((props, ref) => {\n        const {\n            id,\n            title,\n            fullWidth,\n            className = \"\",\n            dismissed,\n            dismissAction,\n            children,\n            role,\n            ...rest\n        } = props;\n\n        const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n        const hasStringChild = React.Children.map(\n            children,\n            (child) => typeof child === \"string\",\n        );\n        const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n        return (\n            <div\n                {...rest}\n                id={id}\n                ref={ref}\n                className={clsx(\n                    \"jkl-message\",\n                    `jkl-message--${messageType}`,\n                    className,\n                    {\n                        \"jkl-message--full\": fullWidth,\n                        \"jkl-message--dismissed\": dismissed,\n                    },\n                )}\n                role={role}\n            >\n                {getIcon(messageType)}\n                <div className=\"jkl-message__content\" data-theme=\"light\">\n                    {title && <p className=\"jkl-message__title\">{title}</p>}\n                    <div className=\"jkl-message__message\">{newChildren}</div>\n                </div>\n                {dismissAction?.handleDismiss && (\n                    <DismissButton\n                        data-theme=\"light\"\n                        aria-controls={boxId}\n                        className=\"jkl-message__dismiss-button\"\n                        label={dismissAction.buttonTitle || \"Lukk\"}\n                        onClick={dismissAction.handleDismiss}\n                    />\n                )}\n            </div>\n        );\n    });\n\n    Message.displayName = \"Message\";\n\n    return Message;\n}\n\nexport const Message = forwardRef<HTMLDivElement, MessageProps>(\n    (props, ref) => {\n        const {\n            id,\n            title,\n            fullWidth,\n            className = \"\",\n            dismissed,\n            dismissAction,\n            children,\n            variant = \"info\",\n            role,\n            ...rest\n        } = props;\n\n        const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n        const hasStringChild = React.Children.map(\n            children,\n            (child) => typeof child === \"string\",\n        );\n        const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n        return (\n            <div\n                {...rest}\n                id={id}\n                ref={ref}\n                className={clsx(\n                    \"jkl-message\",\n                    `jkl-message--${variant}`,\n                    className,\n                    {\n                        \"jkl-message--full\": fullWidth,\n                        \"jkl-message--dismissed\": dismissed,\n                    },\n                )}\n                role={role}\n            >\n                {getIcon(variant)}\n                <div className=\"jkl-message__content\" data-theme=\"light\">\n                    {title && <p className=\"jkl-message__title\">{title}</p>}\n                    <div className=\"jkl-message__message\">{newChildren}</div>\n                </div>\n                {dismissAction?.handleDismiss && (\n                    <DismissButton\n                        data-theme=\"light\"\n                        aria-controls={boxId}\n                        className=\"jkl-message__dismiss-button\"\n                        label={dismissAction.buttonTitle || \"Lukk\"}\n                        onClick={dismissAction.handleDismiss}\n                    />\n                )}\n            </div>\n        );\n    },\n);\n\n/**\n * @deprecated bruk Message med variant=\"info\"\n */\nexport const InfoMessage = messageFactory(\"info\");\nInfoMessage.displayName = \"InfoMessage\";\n/**\n * @deprecated bruk Message med variant=\"error\"\n */\nexport const ErrorMessage = messageFactory(\"error\");\nErrorMessage.displayName = \"ErrorMessage\";\n/**\n * @deprecated bruk Message med variant=\"warning\"\n */\nexport const WarningMessage = messageFactory(\"warning\");\nWarningMessage.displayName = \"WarningMessage\";\n/**\n * @deprecated bruk Message med variant=\"success\"\n */\nexport const SuccessMessage = messageFactory(\"success\");\nSuccessMessage.displayName = \"SuccessMessage\";\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","messageFactory","Message","forwardRef","props","ref","id","title","fullWidth","dismissed","dismissAction","children","role","rest","boxId","useId","generateSuffix","newChildren","React","Children","map","child","jsxs","clsx","handleDismiss","DismissButton","label","buttonTitle","onClick","displayName","variant","InfoMessage","ErrorMessage","WarningMessage","SuccessMessage"],"mappings":"8cAUA,MAAMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACD,OAAOC,EAACC,EAAA,CAAUC,UAAU,sBAChC,IAAK,OACD,OAAOF,EAACG,EAAA,CAASD,UAAU,sBAC/B,IAAK,UACD,OAAOF,EAACI,EAAA,CAAYF,UAAU,sBAClC,IAAK,UACD,OAAOF,EAACK,EAAA,CAAYH,UAAU,sBAClC,QACI,OAAO,OAInB,SAASI,EAAeP,GACpB,MAAMQ,EAAUC,EAAyC,CAACC,EAAOC,KAC7D,MACIC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAX,UAAAA,EAAY,GACZY,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,KAAAA,KACGC,GACHT,EAEEU,EAAQC,EAAMT,GAAM,cAAe,CAAEU,gBAAiBV,IAMtDW,EAJiBC,EAAMC,SAASC,IAClCT,EACCU,GAA2B,iBAAVA,KAEe,GAAK1B,EAAC,IAAA,CAAGgB,SAAAA,IAAgBA,EAE9D,OACIW,EAAC,MAAA,IACOT,EACJP,GAAAA,EACAD,IAAAA,EACAR,UAAW0B,EACP,cACA,gBAAgB7B,IAChBG,EACA,CACI,oBAAqBW,EACrB,yBAA0BC,IAGlCG,KAAAA,EAECD,SAAA,CAAAlB,EAAQC,GACT4B,EAAC,MAAA,CAAIzB,UAAU,uBAAuB,aAAW,QAC5Cc,SAAA,CAAAJ,GAASZ,EAAC,IAAA,CAAEE,UAAU,qBAAsBc,SAAAJ,IAC7CZ,EAAC,MAAA,CAAIE,UAAU,uBAAwBc,SAAAM,OAE1CP,GAAec,eACZ7B,EAAC8B,EAAA,CACG,aAAW,QACX,gBAAeX,EACfjB,UAAU,8BACV6B,MAAOhB,EAAciB,aAAe,OACpCC,QAASlB,EAAcc,qBAO3CtB,OAAAA,EAAQ2B,YAAc,UAEf3B,CACX,CAEO,MAAMA,EAAUC,EACnB,CAACC,EAAOC,KACJ,MACIC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAX,UAAAA,EAAY,GACZY,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAmB,QAAAA,EAAU,OACVlB,KAAAA,KACGC,GACHT,EAEEU,EAAQC,EAAMT,GAAM,cAAe,CAAEU,gBAAiBV,IAMtDW,EAJiBC,EAAMC,SAASC,IAClCT,EACCU,GAA2B,iBAAVA,KAEe,GAAK1B,EAAC,IAAA,CAAGgB,SAAAA,IAAgBA,EAE9D,OACIW,EAAC,MAAA,IACOT,EACJP,GAAAA,EACAD,IAAAA,EACAR,UAAW0B,EACP,cACA,gBAAgBO,IAChBjC,EACA,CACI,oBAAqBW,EACrB,yBAA0BC,IAGlCG,KAAAA,EAECD,SAAA,CAAAlB,EAAQqC,GACTR,EAAC,MAAA,CAAIzB,UAAU,uBAAuB,aAAW,QAC5Cc,SAAA,CAAAJ,GAASZ,EAAC,IAAA,CAAEE,UAAU,qBAAsBc,SAAAJ,IAC7CZ,EAAC,MAAA,CAAIE,UAAU,uBAAwBc,SAAAM,OAE1CP,GAAec,eACZ7B,EAAC8B,EAAA,CACG,aAAW,QACX,gBAAeX,EACfjB,UAAU,8BACV6B,MAAOhB,EAAciB,aAAe,OACpCC,QAASlB,EAAcc,qBAWlCO,EAAc9B,EAAe,QAC1C8B,EAAYF,YAAc,cAInB,MAAMG,EAAe/B,EAAe,SAC3C+B,EAAaH,YAAc,eAIpB,MAAMI,EAAiBhC,EAAe,WAC7CgC,EAAeJ,YAAc,iBAItB,MAAMK,EAAiBjC,EAAe,WAC7CiC,EAAeL,YAAc"}
+{"version":3,"file":"Message.js","sources":["../../../../src/components/message/Message.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ErrorIcon } from \"../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../icon/icons/WarningIcon.js\";\nimport { DismissButton } from \"./DismissButton.js\";\nimport type { MessageProps } from \"./types.js\";\n\nconst getIcon = (messageType: MessageProps[\"variant\"]) => {\n    switch (messageType) {\n        case \"error\":\n            return <ErrorIcon className=\"jkl-message__icon\" />;\n        case \"info\":\n            return <InfoIcon className=\"jkl-message__icon\" />;\n        case \"success\":\n            return <SuccessIcon className=\"jkl-message__icon\" />;\n        case \"warning\":\n            return <WarningIcon className=\"jkl-message__icon\" />;\n        default:\n            return null;\n    }\n};\n\nfunction messageFactory(messageType: MessageProps[\"variant\"]) {\n    const Message = forwardRef<HTMLDivElement, MessageProps>((props, ref) => {\n        const {\n            id,\n            title,\n            fullWidth,\n            className = \"\",\n            dismissed,\n            dismissAction,\n            children,\n            role,\n            ...rest\n        } = props;\n\n        const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n        const hasStringChild = React.Children.map(\n            children,\n            (child) => typeof child === \"string\",\n        );\n        const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n        return (\n            <div\n                {...rest}\n                id={id}\n                ref={ref}\n                className={clsx(\n                    \"jkl-message\",\n                    `jkl-message--${messageType}`,\n                    className,\n                    {\n                        \"jkl-message--full\": fullWidth,\n                        \"jkl-message--dismissed\": dismissed,\n                    },\n                )}\n                role={role}\n            >\n                {getIcon(messageType)}\n                <div className=\"jkl-message__content\" data-theme=\"light\">\n                    {title && <p className=\"jkl-message__title\">{title}</p>}\n                    <div className=\"jkl-message__message\">{newChildren}</div>\n                </div>\n                {dismissAction?.handleDismiss && (\n                    <DismissButton\n                        aria-controls={boxId}\n                        className=\"jkl-message__dismiss-button\"\n                        label={dismissAction.buttonTitle || \"Lukk\"}\n                        onClick={dismissAction.handleDismiss}\n                    />\n                )}\n            </div>\n        );\n    });\n\n    Message.displayName = \"Message\";\n\n    return Message;\n}\n\nexport const Message = forwardRef<HTMLDivElement, MessageProps>(\n    (props, ref) => {\n        const {\n            id,\n            title,\n            fullWidth,\n            className = \"\",\n            dismissed,\n            dismissAction,\n            children,\n            variant = \"info\",\n            role,\n            ...rest\n        } = props;\n\n        const boxId = useId(id || \"jkl-message\", { generateSuffix: !id });\n\n        const hasStringChild = React.Children.map(\n            children,\n            (child) => typeof child === \"string\",\n        );\n        const newChildren = hasStringChild?.[0] ? <p>{children}</p> : children;\n\n        return (\n            <div\n                {...rest}\n                id={id}\n                ref={ref}\n                className={clsx(\n                    \"jkl-message\",\n                    `jkl-message--${variant}`,\n                    className,\n                    {\n                        \"jkl-message--full\": fullWidth,\n                        \"jkl-message--dismissed\": dismissed,\n                    },\n                )}\n                role={role}\n            >\n                {getIcon(variant)}\n                <div className=\"jkl-message__content\" data-theme=\"light\">\n                    {title && <p className=\"jkl-message__title\">{title}</p>}\n                    <div className=\"jkl-message__message\">{newChildren}</div>\n                </div>\n                {dismissAction?.handleDismiss && (\n                    <DismissButton\n                        aria-controls={boxId}\n                        className=\"jkl-message__dismiss-button\"\n                        label={dismissAction.buttonTitle || \"Lukk\"}\n                        onClick={dismissAction.handleDismiss}\n                    />\n                )}\n            </div>\n        );\n    },\n);\n\n/**\n * @deprecated bruk Message med variant=\"info\"\n */\nexport const InfoMessage = messageFactory(\"info\");\nInfoMessage.displayName = \"InfoMessage\";\n/**\n * @deprecated bruk Message med variant=\"error\"\n */\nexport const ErrorMessage = messageFactory(\"error\");\nErrorMessage.displayName = \"ErrorMessage\";\n/**\n * @deprecated bruk Message med variant=\"warning\"\n */\nexport const WarningMessage = messageFactory(\"warning\");\nWarningMessage.displayName = \"WarningMessage\";\n/**\n * @deprecated bruk Message med variant=\"success\"\n */\nexport const SuccessMessage = messageFactory(\"success\");\nSuccessMessage.displayName = \"SuccessMessage\";\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","messageFactory","Message","forwardRef","props","ref","id","title","fullWidth","dismissed","dismissAction","children","role","rest","boxId","useId","generateSuffix","newChildren","React","Children","map","child","jsxs","clsx","handleDismiss","DismissButton","label","buttonTitle","onClick","displayName","variant","InfoMessage","ErrorMessage","WarningMessage","SuccessMessage"],"mappings":"8cAUA,MAAMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACD,OAAOC,EAACC,EAAA,CAAUC,UAAU,sBAChC,IAAK,OACD,OAAOF,EAACG,EAAA,CAASD,UAAU,sBAC/B,IAAK,UACD,OAAOF,EAACI,EAAA,CAAYF,UAAU,sBAClC,IAAK,UACD,OAAOF,EAACK,EAAA,CAAYH,UAAU,sBAClC,QACI,OAAO,OAInB,SAASI,EAAeP,GACpB,MAAMQ,EAAUC,EAAyC,CAACC,EAAOC,KAC7D,MACIC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAX,UAAAA,EAAY,GACZY,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAC,KAAAA,KACGC,GACHT,EAEEU,EAAQC,EAAMT,GAAM,cAAe,CAAEU,gBAAiBV,IAMtDW,EAJiBC,EAAMC,SAASC,IAClCT,EACCU,GAA2B,iBAAVA,KAEe,GAAK1B,EAAC,IAAA,CAAGgB,SAAAA,IAAgBA,EAE9D,OACIW,EAAC,MAAA,IACOT,EACJP,GAAAA,EACAD,IAAAA,EACAR,UAAW0B,EACP,cACA,gBAAgB7B,IAChBG,EACA,CACI,oBAAqBW,EACrB,yBAA0BC,IAGlCG,KAAAA,EAECD,SAAA,CAAAlB,EAAQC,GACT4B,EAAC,MAAA,CAAIzB,UAAU,uBAAuB,aAAW,QAC5Cc,SAAA,CAAAJ,GAASZ,EAAC,IAAA,CAAEE,UAAU,qBAAsBc,SAAAJ,IAC7CZ,EAAC,MAAA,CAAIE,UAAU,uBAAwBc,SAAAM,OAE1CP,GAAec,eACZ7B,EAAC8B,EAAA,CACG,gBAAeX,EACfjB,UAAU,8BACV6B,MAAOhB,EAAciB,aAAe,OACpCC,QAASlB,EAAcc,qBAO3CtB,OAAAA,EAAQ2B,YAAc,UAEf3B,CACX,CAEO,MAAMA,EAAUC,EACnB,CAACC,EAAOC,KACJ,MACIC,GAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAX,UAAAA,EAAY,GACZY,UAAAA,EACAC,cAAAA,EACAC,SAAAA,EACAmB,QAAAA,EAAU,OACVlB,KAAAA,KACGC,GACHT,EAEEU,EAAQC,EAAMT,GAAM,cAAe,CAAEU,gBAAiBV,IAMtDW,EAJiBC,EAAMC,SAASC,IAClCT,EACCU,GAA2B,iBAAVA,KAEe,GAAK1B,EAAC,IAAA,CAAGgB,SAAAA,IAAgBA,EAE9D,OACIW,EAAC,MAAA,IACOT,EACJP,GAAAA,EACAD,IAAAA,EACAR,UAAW0B,EACP,cACA,gBAAgBO,IAChBjC,EACA,CACI,oBAAqBW,EACrB,yBAA0BC,IAGlCG,KAAAA,EAECD,SAAA,CAAAlB,EAAQqC,GACTR,EAAC,MAAA,CAAIzB,UAAU,uBAAuB,aAAW,QAC5Cc,SAAA,CAAAJ,GAASZ,EAAC,IAAA,CAAEE,UAAU,qBAAsBc,SAAAJ,IAC7CZ,EAAC,MAAA,CAAIE,UAAU,uBAAwBc,SAAAM,OAE1CP,GAAec,eACZ7B,EAAC8B,EAAA,CACG,gBAAeX,EACfjB,UAAU,8BACV6B,MAAOhB,EAAciB,aAAe,OACpCC,QAASlB,EAAcc,qBAWlCO,EAAc9B,EAAe,QAC1C8B,EAAYF,YAAc,cAInB,MAAMG,EAAe/B,EAAe,SAC3C+B,EAAaH,YAAc,eAIpB,MAAMI,EAAiBhC,EAAe,WAC7CgC,EAAeJ,YAAc,iBAItB,MAAMK,EAAiBjC,EAAe,WAC7CiC,EAAeL,YAAc"}