npm - @fremtind/jokul - Versions diffs - 5.2.3 → 6.0.0-next.1 - Mend

@fremtind/jokul 5.2.3 → 6.0.0-next.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (358) hide show

package/build/cjs/components/date-input/DateInput.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../../../clsx-E3yX_9sL.cjs"),o=require("react"),r=require("../../utilities/mergeRefs.cjs");require("../../utilities/polymorphism/SlotComponent.cjs");const i=require("../button/Button.cjs");require("../icon/Icon.cjs"),require("../icon/icons/animated/ArrowVerticalAnimated.cjs"),require("../icon/icons/animated/ArrowHorizontalAnimated.cjs"),require("../icon/icons/animated/PlusRemoveAnimated.cjs"),require("../icon/icons/ArrowDownIcon.cjs"),require("../icon/icons/ArrowLeftIcon.cjs"),require("../icon/icons/ArrowNorthEastIcon.cjs"),require("../icon/icons/ArrowRightIcon.cjs"),require("../icon/icons/ArrowUpIcon.cjs");const c=require("../icon/icons/CalendarIcon.cjs");require("../icon/icons/CheckIcon.cjs"),require("../icon/icons/ChevronDownIcon.cjs"),require("../icon/icons/ChevronLeftIcon.cjs"),require("../icon/icons/ChevronRightIcon.cjs"),require("../icon/icons/ChevronUpIcon.cjs"),require("../icon/icons/CloseIcon.cjs"),require("../icon/icons/CopyIcon.cjs"),require("../icon/icons/DotsIcon.cjs"),require("../icon/icons/DragIcon.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/GreenCheckIcon.cjs"),require("../icon/icons/HamburgerIcon.cjs"),require("../icon/icons/InfoIcon.cjs"),require("../icon/icons/LinkIcon.cjs"),require("../icon/icons/MinusIcon.cjs"),require("../icon/icons/OpenInNewIcon.cjs"),require("../icon/icons/PenIcon.cjs"),require("../icon/icons/PlusIcon.cjs"),require("../icon/icons/QuestionIcon.cjs"),require("../icon/icons/RedCrossIcon.cjs"),require("../icon/icons/SearchIcon.cjs"),require("../icon/icons/SuccessIcon.cjs"),require("../icon/icons/ThumbDownIcon.cjs"),require("../icon/icons/ThumbUpIcon.cjs"),require("../icon/icons/TrashCanIcon.cjs"),require("../icon/icons/WarningIcon.cjs"),require("../../hooks/useId/useId.cjs");const s=require("../input-group/InputGroup.cjs"),t=require("./calendar/Calendar.cjs"),a=require("./utils.cjs"),u=o.forwardRef((u,l)=>{const{max:d,min:p,defaultValue:j,value:q,name:I,onChange:m,onBlur:b,onClick:v,onFocus:h,id:C,"data-testautoid":g,className:w="",label:k,labelProps:y,helpLabel:f,errorLabel:x,supportLabelProps:A,tooltip:L,description:_,required:D,disabled:P,readOnly:N,autoComplete:R,inputMode:B,...M}=u,{inline:O,style:S,"data-size":E,...T}=M,V=o.useId(),z=C?`${C}-calendar`:`jkl-calendar-${V}`,G=void 0!==q,[H,U]=o.useState(j??""),F=G?q:H,$=a.toValidBoundary(p),Q=a.toValidBoundary(d),W=o.useRef(null),J=r.useMergeRefs(W,l),K=e=>{G\|\|U(e.target.value),m?.(e)},X=()=>{!G&&W.current&&U(W.current.value)};return e.jsx(s.InputGroup,{id:C,className:n.clsx("jkl-date-input",w),inline:O,style:S,"data-size":E,label:k,labelProps:y,helpLabel:f,errorLabel:x,supportLabelProps:A,tooltip:L,description:_,render:n=>e.jsxs("div",{className:"jkl-date-input__wrapper","data-invalid":n["aria-invalid"],children:[e.jsx("input",{ref:J,"data-testid":"jkl-date-input__input","data-testautoid":g,"data-empty":F?void 0:"true",className:"jkl-date-input__input",name:I,type:"date",...G?{value:q}:{defaultValue:j},max:Q,min:$,required:D,disabled:P,readOnly:N,autoComplete:R,inputMode:B,onChange:K,onFocus:h,onBlur:b,onClick:e=>{e.preventDefault(),v?.(e)},...T,...n}),e.jsx(i.Button,{type:"button",variant:"ghost",icon:e.jsx(c.CalendarIcon,{}),"aria-label":"Åpne kalender","data-testid":"jkl-date-input__trigger",className:"jkl-date-input__calendar-trigger",disabled:P\|\|N,onClick:X,popovertarget:z}),e.jsx(t.Calendar,{"data-testid":"jkl-calendar",id:z,value:F,min:$,max:Q,onChange:e=>(e=>{const n=W.current;if(!n)return;const o=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value")?.set;o?o.call(n,e):n.value=e,n.dispatchEvent(new Event("input",{bubbles:!0}))})(e.target.value),label:k,description:_,popover:"auto"})]})})});u.displayName="DateInput",exports.DateInput=u;
2	+ //# sourceMappingURL=DateInput.cjs.map

package/build/cjs/components/date-input/DateInput.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"DateInput.cjs","sources":["../../../../src/components/date-input/DateInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useId, useRef, useState } from \"react\";\nimport { useMergeRefs } from \"../../utilities/index.js\";\nimport { Button } from \"../button/index.js\";\nimport { CalendarIcon } from \"../icon/index.js\";\nimport { InputGroup } from \"../input-group/index.js\";\nimport { Calendar } from \"./calendar/Calendar.js\";\nimport type { DateInputProps } from \"./types.js\";\nimport { toValidBoundary } from \"./utils.js\";\n\nexport const DateInput = forwardRef<HTMLInputElement, DateInputProps>(\n (props, forwardedInputRef) => {\n const {\n max,\n min,\n defaultValue,\n value,\n name,\n onChange,\n onBlur,\n onClick,\n onFocus,\n id,\n \"data-testautoid\": testAutoId,\n className = \"\",\n label,\n labelProps,\n helpLabel,\n errorLabel,\n supportLabelProps,\n tooltip,\n description,\n required,\n disabled,\n readOnly,\n autoComplete,\n inputMode,\n ...rest\n } = props;\n\n // Skiller InputGroup-spesifikke props fra native input-attributter, slik\n // at vi ikke lekker f.eks. inline, data-size og style ned på <input>.\n const {\n inline,\n style,\n \"data-size\": dataSize,\n ...inputAttributes\n } = rest;\n\n const generatedCalendarId = useId();\n const calendarId = id\n ? `${id}-calendar`\n : `jkl-calendar-${generatedCalendarId}`;\n\n const isControlled = value !== undefined;\n\n // Intern state holder kalenderen i synk. I ukontrollert modus er selve\n // <input> ukontrollert (defaultValue), slik at react-hook-form (register)\n // kan skrive verdien via ref-en – f.eks. ved reset() og setValue().\n const [internalValue, setInternalValue] = useState<string>(\n defaultValue ?? \"\",\n );\n const currentValue = isControlled ? value : internalValue;\n\n // min/max kan komme inn som number eller dd.mm.yyyy (bl.a. via\n // react-hook-forms register). Både det native feltet og kalenderen\n // forholder seg til ISO-strenger.\n const minValue = toValidBoundary(min);\n const maxValue = toValidBoundary(max);\n\n // Samle-ref: forward til forbruker / react-hook-form, og behold internt\n // slik at vi kan lese og skrive verdien fra kalenderen.\n const inputRef = useRef<HTMLInputElement | null>(null);\n const setInputRef = useMergeRefs(inputRef, forwardedInputRef);\n\n const handleInputChange = (\n event: React.ChangeEvent<HTMLInputElement>,\n ) => {\n if (!isControlled) {\n setInternalValue(event.target.value);\n }\n onChange?.(event);\n };\n\n // Skriver en ny verdi inn i det native feltet og fyrer et ekte input-event.\n // Da flyter kalendervalg gjennom samme onChange som tastaturinntasting,\n // slik at også react-hook-form fanger endringen.\n const commitFromCalendar = (next: string) => {\n const input = inputRef.current;\n if (!input) {\n return;\n }\n const setNativeValue = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\",\n )?.set;\n if (setNativeValue) {\n setNativeValue.call(input, next);\n } else {\n input.value = next;\n }\n input.dispatchEvent(new Event(\"input\", { bubbles: true }));\n };\n\n // Leser gjeldende verdi fra feltet når kalenderen åpnes, slik at den\n // reflekterer eventuelle programmatiske skriv (reset/setValue) i\n // ukontrollert modus.\n const syncCalendarFromInput = () => {\n if (!isControlled && inputRef.current) {\n setInternalValue(inputRef.current.value);\n }\n };\n\n return (\n <InputGroup\n id={id}\n className={clsx(\"jkl-date-input\", className)}\n inline={inline}\n style={style}\n data-size={dataSize}\n label={label}\n labelProps={labelProps}\n helpLabel={helpLabel}\n errorLabel={errorLabel}\n supportLabelProps={supportLabelProps}\n tooltip={tooltip}\n description={description}\n render={(inputProps) => (\n <div\n className=\"jkl-date-input__wrapper\"\n data-invalid={inputProps[\"aria-invalid\"]}\n >\n <input\n ref={setInputRef}\n data-testid=\"jkl-date-input__input\"\n data-testautoid={testAutoId}\n data-empty={currentValue ? undefined : \"true\"}\n className=\"jkl-date-input__input\"\n name={name}\n type=\"date\"\n {...(isControlled ? { value } : { defaultValue })}\n max={maxValue}\n min={minValue}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n autoComplete={autoComplete}\n inputMode={inputMode}\n onChange={handleInputChange}\n onFocus={onFocus}\n onBlur={onBlur}\n onClick={(e) => {\n e.preventDefault();\n onClick?.(e);\n }}\n {...inputAttributes}\n {...inputProps}\n />\n <Button\n type=\"button\"\n variant=\"ghost\"\n icon={<CalendarIcon />}\n aria-label=\"Åpne kalender\"\n data-testid=\"jkl-date-input__trigger\"\n className=\"jkl-date-input__calendar-trigger\"\n disabled={disabled || readOnly}\n onClick={syncCalendarFromInput}\n // @ts-expect-error vet ikke hvorfor vi får typefeil her? kanskje på grunn av hvordan vi behandler polymorfisme?\n popovertarget={calendarId}\n />\n <Calendar\n data-testid=\"jkl-calendar\"\n id={calendarId}\n value={currentValue}\n min={minValue}\n max={maxValue}\n onChange={(e) => commitFromCalendar(e.target.value)}\n label={label}\n description={description}\n popover=\"auto\"\n />\n </div>\n )}\n />\n );\n },\n);\n\nDateInput.displayName = \"DateInput\";\n"],"names":["DateInput","forwardRef","props","forwardedInputRef","max","min","defaultValue","value","name","onChange","onBlur","onClick","onFocus","id","testAutoId","className","label","labelProps","helpLabel","errorLabel","supportLabelProps","tooltip","description","required","disabled","readOnly","autoComplete","inputMode","rest","inline","style","dataSize","inputAttributes","generatedCalendarId","useId","calendarId","isControlled","internalValue","setInternalValue","useState","currentValue","minValue","toValidBoundary","maxValue","inputRef","useRef","setInputRef","useMergeRefs","handleInputChange","event","target","syncCalendarFromInput","current","jsx","InputGroup","clsx","render","inputProps","jsxs","children","ref","type","e","preventDefault","Button","variant","icon","CalendarIcon","popovertarget","Calendar","next","input","setNativeValue","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","dispatchEvent","Event","bubbles","commitFromCalendar","popover","displayName"],"mappings":"q9DAUaA,EAAYC,EAAAA,WACrB,CAACC,EAAOC,KACJ,MACIC,IAAAA,EACAC,IAAAA,EACAC,aAAAA,EACAC,MAAAA,EACAC,KAAAA,EACAC,SAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,GAAAA,EACA,kBAAmBC,EACnBC,UAAAA,EAAY,GACZC,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,EACAC,YAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,aAAAA,EACAC,UAAAA,KACGC,GACH1B,GAKA2B,OAAAA,EACAC,MAAAA,EACA,YAAaC,KACVC,GACHJ,EAEEK,EAAsBC,EAAAA,QACtBC,EAAatB,EACb,GAAGA,aACH,gBAAgBoB,IAEhBG,OAAyB,IAAV7B,GAKd8B,EAAeC,GAAoBC,EAAAA,SACtCjC,GAAgB,IAEdkC,EAAeJ,EAAe7B,EAAQ8B,EAKtCI,EAAWC,EAAAA,gBAAgBrC,GAC3BsC,EAAWD,EAAAA,gBAAgBtC,GAI3BwC,EAAWC,EAAAA,OAAgC,MAC3CC,EAAcC,EAAAA,aAAaH,EAAUzC,GAErC6C,EACFC,IAEKb,GACDE,EAAiBW,EAAMC,OAAO3C,OAElCE,IAAWwC,IA0BTE,EAAwB,MACrBf,GAAgBQ,EAASQ,SAC1Bd,EAAiBM,EAASQ,QAAQ7C,QAI1C,OACI8C,EAAAA,IAACC,EAAAA,WAAA,CACGzC,GAAAA,EACAE,UAAWwC,EAAAA,KAAK,iBAAkBxC,GAClCc,OAAAA,EACAC,MAAAA,EACA,YAAWC,EACXf,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,EACAC,YAAAA,EACAkC,OAASC,GACLC,EAAAA,KAAC,MAAA,CACG3C,UAAU,0BACV,eAAc0C,EAAW,gBAEzBE,SAAA,CAAAN,EAAAA,IAAC,QAAA,CACGO,IAAKd,EACL,cAAY,wBACZ,kBAAiBhC,EACjB,aAAY0B,OAAe,EAAY,OACvCzB,UAAU,wBACVP,KAAAA,EACAqD,KAAK,UACAzB,EAAe,CAAE7B,MAAAA,GAAU,CAAED,aAAAA,GAClCF,IAAKuC,EACLtC,IAAKoC,EACLlB,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,aAAAA,EACAC,UAAAA,EACAlB,SAAUuC,EACVpC,QAAAA,EACAF,OAAAA,EACAC,QAAUmD,IACNA,EAAEC,iBACFpD,IAAUmD,OAEV9B,KACAyB,IAERJ,EAAAA,IAACW,EAAAA,OAAA,CACGH,KAAK,SACLI,QAAQ,QACRC,WAAOC,EAAAA,aAAA,IACP,aAAW,gBACX,cAAY,0BACZpD,UAAU,mCACVS,SAAUA,GAAYC,EACtBd,QAASwC,EAETiB,cAAejC,IAEnBkB,EAAAA,IAACgB,EAAAA,SAAA,CACG,cAAY,eACZxD,GAAIsB,EACJ5B,MAAOiC,EACPnC,IAAKoC,EACLrC,IAAKuC,EACLlC,SAAWqD,GAzFHQ,KACxB,MAAMC,EAAQ3B,EAASQ,QACvB,IAAKmB,EACD,OAEJ,MAAMC,EAAiBC,OAAOC,yBAC1BC,OAAOC,iBAAiBC,UACxB,UACDC,IACCN,EACAA,EAAeO,KAAKR,EAAOD,GAE3BC,EAAMhE,MAAQ+D,EAElBC,EAAMS,cAAc,IAAIC,MAAM,QAAS,CAAEC,SAAS,MA2EjBC,CAAmBrB,EAAEZ,OAAO3C,OAC7CS,MAAAA,EACAM,YAAAA,EACA8D,QAAQ,gBASpCpF,EAAUqF,YAAc"}

package/build/cjs/components/date-input/DateInput.d.cts ADDED Viewed

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+export declare const DateInput: React.ForwardRefExoticComponent<Omit<import('../input-group/types.js').InputGroupProps, "children" | "render"> & Omit<React.InputHTMLAttributes<HTMLInputElement>, "children" | "defaultValue" | "max" | "min" | "type" | "value"> & import('../../utilities/types.js').DataTestAutoId & {
+    value?: string;
+    defaultValue?: string;
+    min?: string | number;
+    max?: string | number;
+} & React.RefAttributes<HTMLInputElement>>;

package/build/cjs/components/date-input/calendar/Calendar.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),n=require("../../button/Button.cjs"),c=require("../../flex/Flex.cjs");require("../../icon/Icon.cjs"),require("../../icon/icons/animated/ArrowVerticalAnimated.cjs"),require("../../icon/icons/animated/ArrowHorizontalAnimated.cjs"),require("../../icon/icons/animated/PlusRemoveAnimated.cjs"),require("../../icon/icons/ArrowDownIcon.cjs");const o=require("../../icon/icons/ArrowLeftIcon.cjs");require("../../icon/icons/ArrowNorthEastIcon.cjs");const t=require("../../icon/icons/ArrowRightIcon.cjs");require("../../icon/icons/ArrowUpIcon.cjs"),require("../../icon/icons/CalendarIcon.cjs"),require("../../icon/icons/CheckIcon.cjs"),require("../../icon/icons/ChevronDownIcon.cjs"),require("../../icon/icons/ChevronLeftIcon.cjs"),require("../../icon/icons/ChevronRightIcon.cjs"),require("../../icon/icons/ChevronUpIcon.cjs"),require("../../icon/icons/CloseIcon.cjs"),require("../../icon/icons/CopyIcon.cjs"),require("../../icon/icons/DotsIcon.cjs"),require("../../icon/icons/DragIcon.cjs"),require("../../icon/icons/ErrorIcon.cjs"),require("../../icon/icons/GreenCheckIcon.cjs"),require("../../icon/icons/HamburgerIcon.cjs"),require("../../icon/icons/InfoIcon.cjs"),require("../../icon/icons/LinkIcon.cjs"),require("../../icon/icons/MinusIcon.cjs"),require("../../icon/icons/OpenInNewIcon.cjs"),require("../../icon/icons/PenIcon.cjs"),require("../../icon/icons/PlusIcon.cjs"),require("../../icon/icons/QuestionIcon.cjs"),require("../../icon/icons/RedCrossIcon.cjs"),require("../../icon/icons/SearchIcon.cjs"),require("../../icon/icons/SuccessIcon.cjs"),require("../../icon/icons/ThumbDownIcon.cjs"),require("../../icon/icons/ThumbUpIcon.cjs"),require("../../icon/icons/TrashCanIcon.cjs"),require("../../icon/icons/WarningIcon.cjs");const a=require("../../select/Select.cjs");require("../../table/DataTable.cjs");const i=require("../../table/Table.cjs");require("../../table/TableBody.cjs");const s=require("../../table/TableCaption.cjs");require("../../table/TableCell.cjs"),require("../../table/TableColumn.cjs"),require("../../table/TableColumnGroup.cjs"),require("../../table/tableContext.cjs"),require("../../table/tableSectionContext.cjs"),require("../../table/TableFooter.cjs"),require("../../table/TableHead.cjs"),require("../../table/TableHeader.cjs"),require("../../table/TablePagination.cjs"),require("../../table/TableRow.cjs"),require("../../table/ExpandableTableRow.cjs"),require("../../table/ExpandableTableRowController.cjs");const l=require("../../typography/Text.cjs");require("../../typography/Title.cjs");const u=require("../utils.cjs"),d=require("./CalendarWeek.cjs"),j=require("./utils.cjs"),b=b=>{const{max:p,min:q,value:h,id:m,popover:g="auto",onChange:I,label:x,description:w}=b,C=m??`jkl-calendar-${r.useId()}`,T=r.useRef(null),y=r.useRef(null),f=r.useRef(!1),[v,k]=r.useState(()=>j.clampDateToRange(j.isoToLocalDate(h)??new Date,q,p)),D=v.getMonth(),R=v.getFullYear(),S=u.toValidInputValue(h??""),A=u.toValidInputValue(v),M=r.useMemo(()=>j.getYearOptions(R,q,p),[R,q,p]),L=r.useMemo(()=>j.getSelectableMonths(R,q,p),[R,q,p]),{headers:N,weeks:E}=r.useMemo(()=>j.getCalendarTable(R,D),[R,D]);r.useEffect(()=>{const e=T.current;if(!e)return;const r=e=>{const{newState:r}=e;"open"===r&&y.current?.querySelector(`input[type="radio"][value="${A}"]`)?.focus()};return e.addEventListener("toggle",r),()=>e.removeEventListener("toggle",r)},[A]),r.useEffect(()=>{k(e=>j.clampDateToRange(j.isoToLocalDate(h)??e,q,p))},[h,q,p]),r.useEffect(()=>{f.current&&(f.current=!1,y.current?.querySelector(`input[type="radio"][value="${A}"]`)?.focus())},[A]);const F=(e,r)=>{const n=new Date(e.getFullYear(),e.getMonth()+r,1);return j.hasSelectableDateInMonth(n.getFullYear(),n.getMonth(),q,p)},$=e=>{const r=j.clampDateToRange(new Date(R,D+e,1),q,p);F(r,e)\|\|(f.current=!0),k(r)},P=F(v,-1),V=F(v,1);return e.jsxs("div",{ref:T,id:C,className:"jkl-calendar jkl-popover","data-testid":"jkl-calendar",popover:g,children:[e.jsxs("div",{className:"jkl-calendar__labels",children:[e.jsx(l.Text,{className:"jkl-label",short:!0,children:x}),e.jsx(l.Text,{className:"jkl-input-group-description",children:w})]}),e.jsxs(c.Flex,{justifyContent:"space-between",alignItems:"center",gap:"s",className:"jkl-calendar__navigation",children:[e.jsxs(c.Flex,{gap:"xs",wrap:"wrap","data-size":"small",children:[e.jsx(a.Select,{placeholder:"Måned",label:"Måned","data-testid":`${C}-month-select`,items:L.map(e=>j.months[e].toLowerCase()),labelProps:{srOnly:!0},width:"13ch",value:j.months[D].toLowerCase(),onChange:e=>k(j.clampDateToRange(new Date(R,j.months.findIndex(r=>r.toLowerCase()===e.target.value),1),q,p))}),e.jsx(a.Select,{placeholder:"År",label:"År","data-testid":`${C}-year-select`,items:M.map(e=>e.toString()),labelProps:{srOnly:!0},width:"4ch",value:R,onChange:e=>k(j.clampDateToRange(new Date(Number(e.target.value),D,1),q,p))})]}),e.jsxs(c.Flex,{gap:"xs",children:[e.jsx(n.Button,{type:"button","data-testid":`${C}-back-button`,variant:"ghost","aria-label":"Forrige måned",icon:e.jsx(o.ArrowLeftIcon,{}),disabled:!P,onClick:()=>$(-1)}),e.jsx(n.Button,{type:"button",variant:"ghost","data-testid":`${C}-forward-button`,icon:e.jsx(t.ArrowRightIcon,{}),"aria-label":"Neste måned",disabled:!V,onClick:()=>$(1)})]})]}),e.jsxs(i.Table,{caption:e.jsx(s.TableCaption,{srOnly:!0,children:"Kalender"}),"data-testid":"jkl-calendar-table",fullWidth:!0,children:[e.jsx("thead",{children:e.jsx("tr",{children:N.map(r=>e.jsx("th",{scope:"col","aria-label":r,children:e.jsx(l.Text,{bold:!0,children:r.charAt(0).toUpperCase()})},r))})}),e.jsx("tbody",{ref:y,onKeyDown:e=>{if("Enter"===e.key\|\|" "===e.key)return e.preventDefault(),void y.current?.querySelector(`input[type="radio"][value="${A}"]`)?.click();const r=j.getNextFocusableDate(e.key,e.shiftKey,v,q,p);r&&(e.preventDefault(),f.current=!0,k(r))},children:E.map((r,n)=>e.jsx(d.CalendarWeek,{week:r,weekIndex:n,year:R,month:D,name:`${C}-day`,selectedDate:u.toValidInputValue(S),focusedDate:A,min:q,max:p,onChange:I},`week-${n}`))})]})]})};b.displayName="Calendar",exports.Calendar=b;
2	+ //# sourceMappingURL=Calendar.cjs.map

package/build/cjs/components/date-input/calendar/Calendar.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Calendar.cjs","sources":["../../../../../src/components/date-input/calendar/Calendar.tsx"],"sourcesContent":["import React, { useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport { Button } from \"../../button/index.js\";\nimport { Flex } from \"../../flex/index.js\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../../icon/index.js\";\nimport { Select } from \"../../select/index.js\";\nimport { Table, TableCaption } from \"../../table/index.js\";\nimport { Text } from \"../../typography/index.js\";\nimport { toValidInputValue } from \"../utils.js\";\nimport { CalendarWeek } from \"./CalendarWeek.js\";\nimport type { CalendarProps } from \"./types.js\";\nimport {\n clampDateToRange,\n getCalendarTable,\n getNextFocusableDate,\n getSelectableMonths,\n getYearOptions,\n hasSelectableDateInMonth,\n isoToLocalDate,\n months,\n} from \"./utils.js\";\n\nexport const Calendar = (props: CalendarProps) => {\n const {\n max,\n min,\n value,\n id,\n popover = \"auto\",\n onChange,\n label,\n description,\n } = props;\n\n const calendarId = id ?? `jkl-calendar-${useId()}`;\n\n const rootRef = useRef<HTMLDivElement>(null);\n const gridRef = useRef<HTMLTableSectionElement>(null);\n const shouldMoveFocus = useRef(false);\n\n const [focusedDate, setFocusedDate] = useState<Date>(() =>\n clampDateToRange(isoToLocalDate(value) ?? new Date(), min, max),\n );\n\n const month = focusedDate.getMonth();\n const year = focusedDate.getFullYear();\n const day = toValidInputValue(value ?? \"\");\n const focusedIso = toValidInputValue(focusedDate);\n\n const yearOptions = useMemo(\n () => getYearOptions(year, min, max),\n [year, min, max],\n );\n\n const monthOptions = useMemo(\n () => getSelectableMonths(year, min, max),\n [year, min, max],\n );\n\n const { headers, weeks } = useMemo(\n () => getCalendarTable(year, month),\n [year, month],\n );\n\n useEffect(() => {\n const element = rootRef.current;\n if (!element) {\n return;\n }\n\n const handleToggle = (event: Event) => {\n const { newState } = event as Event & { newState?: string };\n if (newState !== \"open\") {\n return;\n }\n gridRef.current\n ?.querySelector<HTMLInputElement>(\n `input[type=\"radio\"][value=\"${focusedIso}\"]`,\n )\n ?.focus();\n };\n\n element.addEventListener(\"toggle\", handleToggle);\n return () => element.removeEventListener(\"toggle\", handleToggle);\n }, [focusedIso]);\n\n // Fokusdatoen må alltid være valgbar: ligger den utenfor min/max finnes det\n // ingen aktiv radio å flytte fokus til når popoveren åpnes. Klampes derfor\n // både når verdien og når grensene endrer seg.\n useEffect(() => {\n setFocusedDate((current) =>\n clampDateToRange(isoToLocalDate(value) ?? current, min, max),\n );\n }, [value, min, max]);\n\n useEffect(() => {\n if (!shouldMoveFocus.current) {\n return;\n }\n shouldMoveFocus.current = false;\n gridRef.current\n ?.querySelector<HTMLInputElement>(\n `input[type=\"radio\"][value=\"${focusedIso}\"]`,\n )\n ?.focus();\n }, [focusedIso]);\n\n const selectFocusedDate = () => {\n gridRef.current\n ?.querySelector<HTMLInputElement>(\n `input[type=\"radio\"][value=\"${focusedIso}\"]`,\n )\n ?.click();\n };\n\n const handleKeyDown = (\n event: React.KeyboardEvent<HTMLTableSectionElement>,\n ) => {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n selectFocusedDate();\n return;\n }\n\n const next = getNextFocusableDate(\n event.key,\n event.shiftKey,\n focusedDate,\n min,\n max,\n );\n if (!next) {\n return;\n }\n\n event.preventDefault();\n shouldMoveFocus.current = true;\n setFocusedDate(next);\n };\n\n const monthNavigationAvailable = (\n fromDate: Date,\n offset: number,\n ): boolean => {\n const adjacent = new Date(\n fromDate.getFullYear(),\n fromDate.getMonth() + offset,\n 1,\n );\n return hasSelectableDateInMonth(\n adjacent.getFullYear(),\n adjacent.getMonth(),\n min,\n max,\n );\n };\n\n const goToMonth = (offset: number) => {\n const target = clampDateToRange(\n new Date(year, month + offset, 1),\n min,\n max,\n );\n\n if (!monthNavigationAvailable(target, offset)) {\n shouldMoveFocus.current = true;\n }\n\n setFocusedDate(target);\n };\n\n const canGoToPreviousMonth = monthNavigationAvailable(focusedDate, -1);\n const canGoToNextMonth = monthNavigationAvailable(focusedDate, 1);\n\n return (\n <div\n ref={rootRef}\n id={calendarId}\n className=\"jkl-calendar jkl-popover\"\n data-testid=\"jkl-calendar\"\n // @ts-expect-error popover er ikke tilgjengelig i typene til React-versjonen vår\n popover={popover}\n >\n <div className=\"jkl-calendar__labels\">\n <Text className=\"jkl-label\" short>\n {label}\n </Text>\n <Text className=\"jkl-input-group-description\">\n {description}\n </Text>\n </div>\n <Flex\n justifyContent=\"space-between\"\n alignItems=\"center\"\n gap=\"s\"\n className=\"jkl-calendar__navigation\"\n >\n <Flex gap=\"xs\" wrap=\"wrap\" data-size=\"small\">\n <Select\n placeholder=\"Måned\"\n label=\"Måned\"\n data-testid={`${calendarId}-month-select`}\n items={monthOptions.map((index) =>\n months[index].toLowerCase(),\n )}\n labelProps={{ srOnly: true }}\n width=\"13ch\"\n value={months[month].toLowerCase()}\n onChange={(e) =>\n setFocusedDate(\n clampDateToRange(\n new Date(\n year,\n months.findIndex(\n (m) =>\n m.toLowerCase() ===\n e.target.value,\n ),\n 1,\n ),\n min,\n max,\n ),\n )\n }\n />\n <Select\n placeholder=\"År\"\n label=\"År\"\n data-testid={`${calendarId}-year-select`}\n items={yearOptions.map((y) => y.toString())}\n labelProps={{ srOnly: true }}\n width=\"4ch\"\n value={year}\n onChange={(e) =>\n setFocusedDate(\n clampDateToRange(\n new Date(Number(e.target.value), month, 1),\n min,\n max,\n ),\n )\n }\n />\n </Flex>\n <Flex gap=\"xs\">\n <Button\n type=\"button\"\n data-testid={`${calendarId}-back-button`}\n variant=\"ghost\"\n aria-label=\"Forrige måned\"\n icon={<ArrowLeftIcon />}\n disabled={!canGoToPreviousMonth}\n onClick={() => goToMonth(-1)}\n />\n <Button\n type=\"button\"\n variant=\"ghost\"\n data-testid={`${calendarId}-forward-button`}\n icon={<ArrowRightIcon />}\n aria-label=\"Neste måned\"\n disabled={!canGoToNextMonth}\n onClick={() => goToMonth(1)}\n />\n </Flex>\n </Flex>\n <Table\n caption={<TableCaption srOnly>Kalender</TableCaption>}\n data-testid=\"jkl-calendar-table\"\n fullWidth\n >\n <thead>\n <tr>\n {headers.map((weekday) => (\n <th key={weekday} scope=\"col\" aria-label={weekday}>\n <Text bold>\n {weekday.charAt(0).toUpperCase()}\n </Text>\n </th>\n ))}\n </tr>\n </thead>\n <tbody ref={gridRef} onKeyDown={handleKeyDown}>\n {weeks.map((week, weekIndex) => (\n <CalendarWeek\n // biome-ignore lint/suspicious/noArrayIndexKey: Index er dessverre eneste som gir mening.\n key={`week-${weekIndex}`}\n week={week}\n weekIndex={weekIndex}\n year={year}\n month={month}\n name={`${calendarId}-day`}\n selectedDate={toValidInputValue(day)}\n focusedDate={focusedIso}\n min={min}\n max={max}\n onChange={onChange}\n />\n ))}\n </tbody>\n </Table>\n </div>\n );\n};\n\nCalendar.displayName = \"Calendar\";\n"],"names":["Calendar","props","max","min","value","id","popover","onChange","label","description","calendarId","useId","rootRef","useRef","gridRef","shouldMoveFocus","focusedDate","setFocusedDate","useState","clampDateToRange","isoToLocalDate","Date","month","getMonth","year","getFullYear","day","toValidInputValue","focusedIso","yearOptions","useMemo","getYearOptions","monthOptions","getSelectableMonths","headers","weeks","getCalendarTable","useEffect","element","current","handleToggle","event","newState","querySelector","focus","addEventListener","removeEventListener","monthNavigationAvailable","fromDate","offset","adjacent","hasSelectableDateInMonth","goToMonth","target","canGoToPreviousMonth","canGoToNextMonth","jsxs","ref","className","children","jsx","Text","short","Flex","justifyContent","alignItems","gap","wrap","Select","placeholder","items","map","index","months","toLowerCase","labelProps","srOnly","width","e","findIndex","m","y","toString","Number","Button","type","variant","icon","ArrowLeftIcon","disabled","onClick","ArrowRightIcon","Table","caption","TableCaption","fullWidth","weekday","scope","bold","charAt","toUpperCase","onKeyDown","key","preventDefault","click","next","getNextFocusableDate","shiftKey","week","weekIndex","CalendarWeek","name","selectedDate","displayName"],"mappings":"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"}

package/build/cjs/components/date-input/calendar/Calendar.d.cts ADDED Viewed

@@ -0,0 +1,6 @@
+import { default as React } from 'react';
+import { CalendarProps } from './types.cjs';
+export declare const Calendar: {
+    (props: CalendarProps): React.JSX.Element;
+    displayName: string;
+};

package/build/cjs/components/date-input/calendar/CalendarDay.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const t=require("../../../utilities/formatters/date/formatDate.cjs");require("../../../utilities/polymorphism/SlotComponent.cjs");const r=require("../../typography/Text.cjs");require("../../typography/Title.cjs");const a=require("../utils.cjs"),s=require("./utils.cjs");exports.CalendarDay=({day:o,year:i,month:n,name:l,selectedDate:c,focusedDate:u,min:d,max:p,onChange:m})=>{const h=a.toValidInputValue(`${i}-${n+1}-${o}`);return e.jsx("td",{children:e.jsxs("label",{className:"jkl-button--calendar",children:[e.jsx("input",{className:"day",type:"radio",name:l,form:`${l}-standalone`,"aria-label":t.formatDate(new Date(i,n,o)),tabIndex:h===u?0:-1,disabled:s.isDateDisabled(h,d,p),value:h,checked:c===h,onChange:e=>m?.(e),onClick:e=>{const t=e.currentTarget.closest("[popover]");setTimeout(()=>{"function"==typeof t?.hidePopover&&t.hidePopover()},140)}}),e.jsx(r.Text,{as:"span",short:!0,"aria-hidden":"true",children:o})]})})};
2	+ //# sourceMappingURL=CalendarDay.cjs.map

package/build/cjs/components/date-input/calendar/CalendarDay.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CalendarDay.cjs","sources":["../../../../../src/components/date-input/calendar/CalendarDay.tsx"],"sourcesContent":["import React from \"react\";\nimport { formatDate } from \"../../../utilities/index.js\";\nimport { Text } from \"../../typography/index.js\";\nimport { toValidInputValue } from \"../utils.js\";\nimport { isDateDisabled } from \"./utils.js\";\n\nexport interface CalendarDayContext {\n year: number;\n month: number;\n name: string;\n selectedDate: string;\n focusedDate: string;\n min?: string;\n max?: string;\n onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;\n}\n\ninterface CalendarDayProps extends CalendarDayContext {\n day: number;\n}\n\nexport const CalendarDay = ({\n day,\n year,\n month,\n name,\n selectedDate,\n focusedDate,\n min,\n max,\n onChange,\n}: CalendarDayProps) => {\n const date = toValidInputValue(`${year}-${month + 1}-${day}`);\n\n return (\n <td>\n <label className=\"jkl-button--calendar\">\n <input\n className=\"day\"\n type=\"radio\"\n name={name}\n // Radioene grupperes bare internt i kalenderen. `form` peker\n // bevisst på en id som ikke finnes, slik at de ikke får en\n // form owner og dermed ikke sendes med i en omkringliggende\n // <form>. Grupperingen består siden alle radioene er uten\n // form owner i samme tre.\n form={`${name}-standalone`}\n aria-label={formatDate(new Date(year, month, day))}\n tabIndex={date === focusedDate ? 0 : -1}\n disabled={isDateDisabled(date, min, max)}\n value={date}\n checked={selectedDate === date}\n onChange={(event) => onChange?.(event)}\n onClick={(event) => {\n const popover =\n event.currentTarget.closest<HTMLDivElement>(\n \"[popover]\",\n );\n setTimeout(() => {\n if (typeof popover?.hidePopover === \"function\") {\n popover.hidePopover();\n }\n }, 140); // Det ser litt rart ut når kalenderen skjules samtidig som verdien bytter, så vi venter litt\n }}\n />\n <Text as=\"span\" short aria-hidden=\"true\">\n {day}\n </Text>\n </label>\n </td>\n );\n};\n"],"names":["day","year","month","name","selectedDate","focusedDate","min","max","onChange","date","toValidInputValue","jsx","children","jsxs","className","type","form","formatDate","Date","tabIndex","disabled","isDateDisabled","value","checked","event","onClick","popover","currentTarget","closest","setTimeout","hidePopover","Text","as","short"],"mappings":"waAqB2B,EACvBA,IAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,KAAAA,EACAC,aAAAA,EACAC,YAAAA,EACAC,IAAAA,EACAC,IAAAA,EACAC,SAAAA,MAEA,MAAMC,EAAOC,EAAAA,kBAAkB,GAAGT,KAAQC,EAAQ,KAAKF,KAEvD,OACIW,EAAAA,IAAC,KAAA,CACGC,SAAAC,EAAAA,KAAC,QAAA,CAAMC,UAAU,uBACbF,SAAA,CAAAD,EAAAA,IAAC,QAAA,CACGG,UAAU,MACVC,KAAK,QACLZ,KAAAA,EAMAa,KAAM,GAAGb,eACT,aAAYc,EAAAA,WAAW,IAAIC,KAAKjB,EAAMC,EAAOF,IAC7CmB,SAAUV,IAASJ,EAAc,GAAI,EACrCe,SAAUC,EAAAA,eAAeZ,EAAMH,EAAKC,GACpCe,MAAOb,EACPc,QAASnB,IAAiBK,EAC1BD,SAAWgB,GAAUhB,IAAWgB,GAChCC,QAAUD,IACN,MAAME,EACFF,EAAMG,cAAcC,QAChB,aAERC,WAAW,KAC6B,mBAAzBH,GAASI,aAChBJ,EAAQI,eAEb,QAGXnB,EAAAA,IAACoB,EAAAA,MAAKC,GAAG,OAAOC,OAAK,EAAC,cAAY,OAC7BrB,SAAAZ"}

package/build/cjs/components/date-input/calendar/CalendarDay.d.cts ADDED Viewed

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+export interface CalendarDayContext {
+    year: number;
+    month: number;
+    name: string;
+    selectedDate: string;
+    focusedDate: string;
+    min?: string;
+    max?: string;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+interface CalendarDayProps extends CalendarDayContext {
+    day: number;
+}
+export declare const CalendarDay: ({ day, year, month, name, selectedDate, focusedDate, min, max, onChange, }: CalendarDayProps) => React.JSX.Element;
+export {};

package/build/cjs/components/date-input/calendar/CalendarWeek.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("./CalendarDay.cjs");exports.CalendarWeek=({week:t,weekIndex:a,...l})=>e.jsx("tr",{children:t.map((t,s)=>t?e.jsx(r.CalendarDay,{day:t,...l},`cell-${a}-${s}`):e.jsx("td",{},`cell-${a}-${s}`))});
2	+ //# sourceMappingURL=CalendarWeek.cjs.map

package/build/cjs/components/date-input/calendar/CalendarWeek.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CalendarWeek.cjs","sources":["../../../../../src/components/date-input/calendar/CalendarWeek.tsx"],"sourcesContent":["import React from \"react\";\nimport { CalendarDay, type CalendarDayContext } from \"./CalendarDay.js\";\n\ninterface CalendarWeekProps extends CalendarDayContext {\n week: Array<number | null>;\n weekIndex: number;\n}\n\nexport const CalendarWeek = ({\n week,\n weekIndex,\n ...dayContext\n}: CalendarWeekProps) => (\n <tr>\n {week.map((day, dayIndex) =>\n day ? (\n <CalendarDay\n key={`cell-${weekIndex}-${dayIndex}`}\n day={day}\n {...dayContext}\n />\n ) : (\n <td key={`cell-${weekIndex}-${dayIndex}`} />\n ),\n )}\n </tr>\n);\n"],"names":["week","weekIndex","dayContext","jsx","children","map","day","dayIndex","CalendarDay"],"mappings":"gMAQ4B,EACxBA,KAAAA,EACAC,UAAAA,KACGC,KAEHC,EAAAA,IAAC,MACIC,SAAAJ,EAAKK,IAAI,CAACC,EAAKC,IACZD,EACIH,EAAAA,IAACK,EAAAA,YAAA,CAEGF,IAAAA,KACIJ,GAFC,QAAQD,KAAaM,KAK9BJ,EAAAA,IAAC,KAAA,GAAQ,QAAQF,KAAaM"}

package/build/cjs/components/date-input/calendar/CalendarWeek.d.cts ADDED Viewed

@@ -0,0 +1,8 @@
+import { default as React } from 'react';
+import { CalendarDayContext } from './CalendarDay.cjs';
+interface CalendarWeekProps extends CalendarDayContext {
+    week: Array<number | null>;
+    weekIndex: number;
+}
+export declare const CalendarWeek: ({ week, weekIndex, ...dayContext }: CalendarWeekProps) => React.JSX.Element;
+export {};

package/build/cjs/components/date-input/calendar/types.d.cts ADDED Viewed

@@ -0,0 +1,6 @@
+import { DateInputProps } from '../types.cjs';
+export type CalendarProps = Pick<DateInputProps, "value" | "onChange" | "id" | "label" | "description"> & {
+    min?: string;
+    max?: string;
+    popover?: "auto" | "manual";
+};

package/build/cjs/components/date-input/calendar/utils.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../utils.cjs"),t="nb-NO";function n(e){const t=new Intl.DateTimeFormat(e,{month:"long"});return Array.from({length:12},(e,n)=>t.format(new Date(2e3,n,1)))}const a=n(t),r=(e,t)=>{const n=new Date(e);return n.setDate(n.getDate()+t),n},o=(e,t)=>{const n=new Date(e.getFullYear(),e.getMonth()+t,1),a=new Date(n.getFullYear(),n.getMonth()+1,0).getDate();return n.setDate(Math.min(e.getDate(),a)),n},l=e=>{const t=new Date(e),n=(t.getDay()-1+7)%7;return t.setDate(t.getDate()-n),t},u=e=>r(l(e),6),s=t=>{const n=e.toValidInputValue(t);if(!n)return null;const[a,r,o]=n.split("-").map(Number);return new Date(a,r-1,o)},i=(t,n,a)=>{const r=e.toValidInputValue(t),o=n?e.toValidInputValue(n):"",l=a?e.toValidInputValue(a):"";return o&&r<o?s(o)??t:l&&r>l?s(l)??t:t},p=(t,n,a,r)=>{const o=e.toValidInputValue(new Date(t,n,1)),l=e.toValidInputValue(new Date(t,n+1,0)),u=a?e.toValidInputValue(a):"",s=r?e.toValidInputValue(r):"";return!(u&&l<u\|\|s&&o>s)},D=["PageUp","PageDown"],c=(e,t,n)=>{switch(e){case"ArrowLeft":return r(n,-1);case"ArrowRight":return r(n,1);case"ArrowUp":return r(n,-7);case"ArrowDown":return r(n,7);case"Home":return l(n);case"End":return u(n);case"PageUp":return o(n,t?-12:-1);case"PageDown":return o(n,t?12:1);default:return null}};exports.addDays=r,exports.addMonths=o,exports.clampDateToRange=i,exports.endOfWeek=u,exports.getCalendarTable=function(e,n){const a=new Date,r=Number.isFinite(e)?e:a.getFullYear(),o=Number.isFinite(n)?n:a.getMonth(),l=new Date(r,o+1,0).getDate(),u=(new Date(r,o,1).getDay()-1+7)%7,s=[...Array(u).fill(null),...Array.from({length:l},(e,t)=>t+1)];for(;s.length%7!=0;)s.push(null);const i=[];for(let e=0;e<s.length;e+=7)i.push(s.slice(e,e+7));const p=new Intl.DateTimeFormat(t,{weekday:"long"});return{headers:Array.from({length:7},(e,t)=>{const n=new Date(2024,0,7+(1+t)%7);return p.format(n)}),weeks:i}},exports.getDateForCalendarKey=c,exports.getMonthNames=n,exports.getNextFocusableDate=(e,t,n,a,r)=>{const o=c(e,t,n);return!o\|\|D.includes(e)&&!p(o.getFullYear(),o.getMonth(),a,r)?null:i(o,a,r)},exports.getSelectableMonths=(e,t,n)=>a.map((e,t)=>t).filter(a=>p(e,a,t,n)),exports.getYearOptions=function(t,n,a){const r=n?new Date(e.toValidInputValue(n)\|\|"").getUTCFullYear():Number.NaN,o=a?new Date(e.toValidInputValue(a)\|\|"").getUTCFullYear():Number.NaN,l=Number.isFinite(r)?r:t-5,u=Number.isFinite(o)?o:t+5,s=Math.min(l,t),i=Math.max(u,t),p=[];for(let e=s;e<=i;e++)p.push(e);return p},exports.hasSelectableDateInMonth=p,exports.isDateDisabled=(t,n,a)=>{if(t){const r=new Date(e.toValidInputValue(t)\|\|""),o=n?new Date(e.toValidInputValue(n)\|\|""):void 0,l=a?new Date(e.toValidInputValue(a)\|\|""):void 0;if(o&&r<o\|\|l&&r>l)return!0}return!1},exports.isoToLocalDate=s,exports.months=a,exports.startOfWeek=l;
2	+ //# sourceMappingURL=utils.cjs.map

package/build/cjs/components/date-input/calendar/utils.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.cjs","sources":["../../../../../src/components/date-input/calendar/utils.ts"],"sourcesContent":["import { toValidInputValue } from \"../utils.js\";\nimport type { CalendarProps } from \"./types.js\";\n\nconst NORWEGIAN_LOCALE = \"nb-NO\";\nconst WEEK_STARTS_ON = 1;\nexport function getCalendarTable(year: number, month: number) {\n const now = new Date();\n const y = Number.isFinite(year) ? year : now.getFullYear();\n const m = Number.isFinite(month) ? month : now.getMonth();\n\n const daysInMonth = new Date(y, m + 1, 0).getDate();\n const firstDay = new Date(y, m, 1).getDay(); // 0 = Sunday\n\n const leadingBlanks = (firstDay - WEEK_STARTS_ON + 7) % 7;\n\n const cells: Array<number | null> = [\n ...Array(leadingBlanks).fill(null),\n ...Array.from({ length: daysInMonth }, (_, i) => i + 1),\n ];\n\n while (cells.length % 7 !== 0) cells.push(null);\n\n const weeks: Array<Array<number | null>> = [];\n for (let i = 0; i < cells.length; i += 7) {\n weeks.push(cells.slice(i, i + 7));\n }\n\n const formatter = new Intl.DateTimeFormat(NORWEGIAN_LOCALE, {\n weekday: \"long\",\n });\n const headers = Array.from({ length: 7 }, (_, i) => {\n const d = new Date(2024, 0, 7 + ((WEEK_STARTS_ON + i) % 7));\n return formatter.format(d);\n });\n\n return { headers, weeks };\n}\n\nconst DEFAULT_YEARS_RANGE = 5;\nexport function getYearOptions(\n currentYear: number,\n min?: string,\n max?: string,\n): number[] {\n const parsedMinYear = min\n ? new Date(toValidInputValue(min) || \"\").getUTCFullYear()\n : Number.NaN;\n const parsedMaxYear = max\n ? new Date(toValidInputValue(max) || \"\").getUTCFullYear()\n : Number.NaN;\n\n const minYear = Number.isFinite(parsedMinYear)\n ? parsedMinYear\n : currentYear - DEFAULT_YEARS_RANGE;\n const maxYear = Number.isFinite(parsedMaxYear)\n ? parsedMaxYear\n : currentYear + DEFAULT_YEARS_RANGE;\n\n const startYear = Math.min(minYear, currentYear);\n const endYear = Math.max(maxYear, currentYear);\n\n const years: number[] = [];\n for (let year = startYear; year <= endYear; year++) {\n years.push(year);\n }\n return years;\n}\n\nexport function getMonthNames(locale: string): string[] {\n const formatter = new Intl.DateTimeFormat(locale, { month: \"long\" });\n return Array.from({ length: 12 }, (_, i) =>\n formatter.format(new Date(2000, i, 1)),\n );\n}\nexport const months = getMonthNames(NORWEGIAN_LOCALE);\n\nexport const isDateDisabled = (\n value: CalendarProps[\"value\"],\n min?: CalendarProps[\"min\"],\n max?: CalendarProps[\"max\"],\n): boolean => {\n if (value) {\n const date = new Date(toValidInputValue(value) || \"\");\n const minDate = min\n ? new Date(toValidInputValue(min) || \"\")\n : undefined;\n const maxDate = max\n ? new Date(toValidInputValue(max) || \"\")\n : undefined;\n if (minDate && date < minDate) return true;\n if (maxDate && date > maxDate) return true;\n }\n return false;\n};\n\nexport const addDays = (date: Date, amount: number): Date => {\n const next = new Date(date);\n next.setDate(next.getDate() + amount);\n return next;\n};\n\nexport const addMonths = (date: Date, amount: number): Date => {\n const first = new Date(date.getFullYear(), date.getMonth() + amount, 1);\n const lastDayOfMonth = new Date(\n first.getFullYear(),\n first.getMonth() + 1,\n 0,\n ).getDate();\n first.setDate(Math.min(date.getDate(), lastDayOfMonth));\n return first;\n};\n\nexport const startOfWeek = (date: Date): Date => {\n const next = new Date(date);\n const diff = (next.getDay() - WEEK_STARTS_ON + 7) % 7;\n next.setDate(next.getDate() - diff);\n return next;\n};\n\nexport const endOfWeek = (date: Date): Date => addDays(startOfWeek(date), 6);\n\nexport const isoToLocalDate = (value: string | undefined): Date | null => {\n const iso = toValidInputValue(value);\n if (!iso) return null;\n const [year, month, day] = iso.split(\"-\").map(Number);\n return new Date(year, month - 1, day);\n};\n\nexport const clampDateToRange = (\n date: Date,\n min?: string,\n max?: string,\n): Date => {\n const iso = toValidInputValue(date);\n const minIso = min ? toValidInputValue(min) : \"\";\n const maxIso = max ? toValidInputValue(max) : \"\";\n if (minIso && iso < minIso) return isoToLocalDate(minIso) ?? date;\n if (maxIso && iso > maxIso) return isoToLocalDate(maxIso) ?? date;\n return date;\n};\n\nexport const hasSelectableDateInMonth = (\n year: number,\n month: number,\n min?: string,\n max?: string,\n): boolean => {\n const firstIso = toValidInputValue(new Date(year, month, 1));\n const lastIso = toValidInputValue(new Date(year, month + 1, 0));\n const minIso = min ? toValidInputValue(min) : \"\";\n const maxIso = max ? toValidInputValue(max) : \"\";\n if (minIso && lastIso < minIso) return false;\n if (maxIso && firstIso > maxIso) return false;\n return true;\n};\n\nexport const getSelectableMonths = (\n year: number,\n min?: string,\n max?: string,\n): number[] =>\n months\n .map((_, index) => index)\n .filter((index) => hasSelectableDateInMonth(year, index, min, max));\n\nconst MONTH_CHANGE_KEYS = [\"PageUp\", \"PageDown\"];\nexport const getNextFocusableDate = (\n key: string,\n shiftKey: boolean,\n focusedDate: Date,\n min?: string,\n max?: string,\n): Date | null => {\n const naive = getDateForCalendarKey(key, shiftKey, focusedDate);\n if (!naive) {\n return null;\n }\n\n // Måneds-/årshopp inn i en helt disabla måned skal være en no-op,\n // på linje med de disabla ‹ ›-knappene.\n if (\n MONTH_CHANGE_KEYS.includes(key) &&\n !hasSelectableDateInMonth(\n naive.getFullYear(),\n naive.getMonth(),\n min,\n max,\n )\n ) {\n return null;\n }\n\n // Klamper til nærmeste valgbare dato (håndterer bl.a. at selve\n // måldagen kan være før min / etter max selv om måneden har gyldige dager).\n return clampDateToRange(naive, min, max);\n};\n\n// Mapper et tastetrykk til datoen navigasjonen skal flytte til.\n// Returnerer null for taster som ikke er navigasjon (håndteres i komponenten).\nexport const getDateForCalendarKey = (\n key: string,\n shiftKey: boolean,\n focusedDate: Date,\n): Date | null => {\n switch (key) {\n case \"ArrowLeft\":\n return addDays(focusedDate, -1);\n case \"ArrowRight\":\n return addDays(focusedDate, 1);\n case \"ArrowUp\":\n return addDays(focusedDate, -7);\n case \"ArrowDown\":\n return addDays(focusedDate, 7);\n case \"Home\":\n return startOfWeek(focusedDate);\n case \"End\":\n return endOfWeek(focusedDate);\n case \"PageUp\":\n return addMonths(focusedDate, shiftKey ? -12 : -1);\n case \"PageDown\":\n return addMonths(focusedDate, shiftKey ? 12 : 1);\n default:\n return null;\n }\n};\n"],"names":["NORWEGIAN_LOCALE","getMonthNames","locale","formatter","Intl","DateTimeFormat","month","Array","from","length","_","i","format","Date","months","addDays","date","amount","next","setDate","getDate","addMonths","first","getFullYear","getMonth","lastDayOfMonth","Math","min","startOfWeek","diff","getDay","endOfWeek","isoToLocalDate","value","iso","toValidInputValue","year","day","split","map","Number","clampDateToRange","max","minIso","maxIso","hasSelectableDateInMonth","firstIso","lastIso","MONTH_CHANGE_KEYS","getDateForCalendarKey","key","shiftKey","focusedDate","now","y","isFinite","m","daysInMonth","leadingBlanks","cells","fill","push","weeks","slice","weekday","headers","d","naive","includes","index","filter","currentYear","parsedMinYear","getUTCFullYear","NaN","parsedMaxYear","minYear","maxYear","startYear","endYear","years","minDate","maxDate"],"mappings":"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"}

package/build/cjs/components/date-input/calendar/utils.d.cts ADDED Viewed

@@ -0,0 +1,19 @@
+import { CalendarProps } from './types.cjs';
+export declare function getCalendarTable(year: number, month: number): {
+    headers: string[];
+    weeks: (number | null)[][];
+};
+export declare function getYearOptions(currentYear: number, min?: string, max?: string): number[];
+export declare function getMonthNames(locale: string): string[];
+export declare const months: string[];
+export declare const isDateDisabled: (value: CalendarProps["value"], min?: CalendarProps["min"], max?: CalendarProps["max"]) => boolean;
+export declare const addDays: (date: Date, amount: number) => Date;
+export declare const addMonths: (date: Date, amount: number) => Date;
+export declare const startOfWeek: (date: Date) => Date;
+export declare const endOfWeek: (date: Date) => Date;
+export declare const isoToLocalDate: (value: string | undefined) => Date | null;
+export declare const clampDateToRange: (date: Date, min?: string, max?: string) => Date;
+export declare const hasSelectableDateInMonth: (year: number, month: number, min?: string, max?: string) => boolean;
+export declare const getSelectableMonths: (year: number, min?: string, max?: string) => number[];
+export declare const getNextFocusableDate: (key: string, shiftKey: boolean, focusedDate: Date, min?: string, max?: string) => Date | null;
+export declare const getDateForCalendarKey: (key: string, shiftKey: boolean, focusedDate: Date) => Date | null;

package/build/cjs/components/date-input/index.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./DateInput.cjs"),e=require("./utils.cjs");exports.DateInput=t.DateInput,exports.toNorwegianDateFormat=e.toNorwegianDateFormat,exports.toValidInputValue=e.toValidInputValue;
2	+ //# sourceMappingURL=index.cjs.map

package/build/cjs/components/date-input/index.d.cts ADDED Viewed

@@ -0,0 +1,3 @@
+export { DateInput } from './DateInput.cjs';
+export type { DateInputProps } from './types.cjs';
+export { toValidInputValue, toNorwegianDateFormat } from './utils.cjs';

package/build/cjs/components/date-input/types.d.cts ADDED Viewed

@@ -0,0 +1,35 @@
+import { InputHTMLAttributes } from 'react';
+import { DataTestAutoId } from '../../utilities/types.cjs';
+import { InputGroupProps } from '../input-group/types.cjs';
+/**
+ * Props for `DateInput`. Komponenten bygger på et native `<input type="date">`,
+ * så verdier inn og ut er alltid ISO-formaterte datostrenger (`YYYY-MM-DD`).
+ * Hva brukeren ser i feltet styres av nettleseren og brukerens språk-/regioninnstillinger.
+ *
+ * Kan brukes både kontrollert (`value` + `onChange`) og ukontrollert (`defaultValue`,
+ * eller via react-hook-forms `register`).
+ */
+export type DateInputProps = Omit<InputGroupProps, "children" | "render"> & Omit<InputHTMLAttributes<HTMLInputElement>, "type" | "value" | "defaultValue" | "min" | "max" | "children"> & DataTestAutoId & {
+    /**
+     * Kontrollert verdi som ISO-datostreng (`YYYY-MM-DD`), f.eks. `"2026-08-13"`.
+     * Oppgis sammen med `onChange`. La stå udefinert for ukontrollert bruk.
+     */
+    value?: string;
+    /**
+     * Startverdi for ukontrollert bruk, som ISO-datostreng (`YYYY-MM-DD`).
+     * Brukes når feltet ikke er kontrollert, f.eks. sammen med `register`.
+     */
+    defaultValue?: string;
+    /**
+     * Tidligste valgbare dato som ISO-datostreng (`YYYY-MM-DD`). Datoer før
+     * denne gråes ut i kalenderen. `number` godtas for kompatibilitet med
+     * react-hook-forms `register`, men ISO-streng anbefales.
+     */
+    min?: string | number;
+    /**
+     * Seneste valgbare dato som ISO-datostreng (`YYYY-MM-DD`). Datoer etter
+     * denne gråes ut i kalenderen. `number` godtas for kompatibilitet med
+     * react-hook-forms `register`, men ISO-streng anbefales.
+     */
+    max?: string | number;
+};

package/build/cjs/components/date-input/utils.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=e=>{const t=Number(e);return Number.isFinite(t)?t<10?`0${t}`:`${t}`:""},t=e=>{const t=/^(\d{4})-(\d{2})-(\d{2})$/.exec(e);if(!t)return!1;const[,r,n,i]=t,u=Number(r),o=Number(n),a=Number(i),s=new Date(Date.UTC(u,o-1,a));return Number.isFinite(s.getTime())&&s.getUTCFullYear()===u&&s.getUTCMonth()===o-1&&s.getUTCDate()===a},r=r=>{let n="";if(r instanceof Date){return n=`${r.getFullYear()}-${e(r.getMonth()+1)}-${e(r.getDate())}`,t(n)?n:""}if(!r)return"";const i=/^(\d{1,2})\.(\d{1,2})\.(\d{4})$/.exec(r);if(i){const[,r,u,o]=i;return n=`${o}-${e(u)}-${e(r)}`,t(n)?n:""}const u=/^(\d{4})-(\d{1,2})-(\d{1,2})$/.exec(r);if(u){const[,r,i,o]=u;return n=`${r}-${e(i)}-${e(o)}`,t(n)?n:""}return""};exports.toNorwegianDateFormat=(e,r="nb-NO",n={day:"2-digit",month:"2-digit",year:"numeric"})=>{if(!t(e))return"";const[i,u,o]=e.split("-").map(Number),a=new Date(i,u-1,o);return Number.isFinite(a.getTime())&&a.getFullYear()===i&&a.getMonth()===u-1&&a.getDate()===o?a.toLocaleDateString(r,n):""},exports.toValidBoundary=e=>{if(null==e\|\|""===e)return;let t="";return t="number"==typeof e?Number.isFinite(e)?r(new Date(e)):"":r(e),""===t?void 0:t},exports.toValidInputValue=r;
2	+ //# sourceMappingURL=utils.cjs.map

package/build/cjs/components/date-input/utils.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"utils.cjs","sources":["../../../../src/components/date-input/utils.ts"],"sourcesContent":["const paddedNumber = (number: string | number): string => {\n const num = Number(number);\n if (!Number.isFinite(num)) return \"\";\n return num < 10 ? `0${num}` : `${num}`;\n};\n\nconst isValidIsoDate = (iso: string): boolean => {\n const match = /^(\\d{4})-(\\d{2})-(\\d{2})$/.exec(iso);\n if (!match) return false;\n\n const [, y, m, d] = match;\n const year = Number(y);\n const month = Number(m);\n const day = Number(d);\n\n const parsed = new Date(Date.UTC(year, month - 1, day));\n return (\n Number.isFinite(parsed.getTime()) &&\n parsed.getUTCFullYear() === year &&\n parsed.getUTCMonth() === month - 1 &&\n parsed.getUTCDate() === day\n );\n};\n\n/**\n * Normaliserer en dato til ISO-formatet `DateInput` forventer (`YYYY-MM-DD`).\n *\n * Godtar `Date`-objekter, ISO-strenger (`YYYY-MM-DD`) og norsk punktumformat\n * (`DD.MM.YYYY`). Ugyldige verdier gir tom streng (`\"\"`).\n *\n * @example\n * toValidInputValue(new Date(2026, 7, 13)); // \"2026-08-13\"\n * toValidInputValue(\"13.08.2026\"); // \"2026-08-13\"\n * toValidInputValue(\"ikke en dato\"); // \"\"\n */\nexport const toValidInputValue = (date: Date | string | undefined): string => {\n let iso = \"\";\n\n if (date instanceof Date) {\n const year = date.getFullYear();\n const month = paddedNumber(date.getMonth() + 1);\n const day = paddedNumber(date.getDate());\n iso = `${year}-${month}-${day}`;\n return isValidIsoDate(iso) ? iso : \"\";\n }\n\n if (!date) return \"\";\n\n const norwegianMatch = /^(\\d{1,2})\\.(\\d{1,2})\\.(\\d{4})$/.exec(date);\n if (norwegianMatch) {\n const [, day, month, year] = norwegianMatch;\n iso = `${year}-${paddedNumber(month)}-${paddedNumber(day)}`;\n return isValidIsoDate(iso) ? iso : \"\";\n }\n\n const isoMatch = /^(\\d{4})-(\\d{1,2})-(\\d{1,2})$/.exec(date);\n if (isoMatch) {\n const [, year, month, day] = isoMatch;\n iso = `${year}-${paddedNumber(month)}-${paddedNumber(day)}`;\n return isValidIsoDate(iso) ? iso : \"\";\n }\n\n return \"\";\n};\n\n/**\n * Gjør ISO-dato (`YYYY-MM-DD`) om til lesbar norsk dato. Overstyr med `options`. Ugyldig → `\"\"`.\n *\n * @example\n * toNorwegianDateFormat(\"2026-08-13\"); // \"13.08.2026\"\n * toNorwegianDateFormat(\"2026-08-13\", \"nb-NO\", { month: \"long\" }); // \"august\"\n */\nexport const toNorwegianDateFormat = (\n date: string,\n locale = \"nb-NO\",\n options: Intl.DateTimeFormatOptions = {\n day: \"2-digit\",\n month: \"2-digit\",\n year: \"numeric\",\n },\n): string => {\n if (!isValidIsoDate(date)) {\n return \"\";\n }\n\n const [year, month, day] = date.split(\"-\").map(Number);\n const parsed = new Date(year, month - 1, day);\n if (\n !Number.isFinite(parsed.getTime()) ||\n parsed.getFullYear() !== year ||\n parsed.getMonth() !== month - 1 ||\n parsed.getDate() !== day\n ) {\n return \"\";\n }\n return parsed.toLocaleDateString(locale, options);\n};\n\n/**\n * Normaliserer `min`/`max` til ISO-format (`YYYY-MM-DD`).\n *\n * `number` godtas fordi react-hook-forms `register()` typer `min`/`max` som\n * `string | number`. Tall tolkes som millisekunder siden epoch (`Date.now()`).\n * Verdier som ikke gir en gyldig dato blir `undefined`, slik at både det native\n * feltet og kalenderen ser bort fra grensen i stedet for å få en søppelverdi.\n *\n * @example\n * toValidBoundary(\"13.08.2026\"); // \"2026-08-13\"\n * toValidBoundary(Date.now()); // dagens dato som ISO\n * toValidBoundary(\"ikke en dato\"); // undefined\n */\nexport const toValidBoundary = (\n boundary: string | number | undefined,\n): string | undefined => {\n if (boundary === undefined || boundary === null || boundary === \"\") {\n return undefined;\n }\n\n let iso = \"\";\n if (typeof boundary === \"number\") {\n iso = Number.isFinite(boundary)\n ? toValidInputValue(new Date(boundary))\n : \"\";\n } else {\n iso = toValidInputValue(boundary);\n }\n\n return iso === \"\" ? undefined : iso;\n};\n"],"names":["paddedNumber","number","num","Number","isFinite","isValidIsoDate","iso","match","exec","y","m","d","year","month","day","parsed","Date","UTC","getTime","getUTCFullYear","getUTCMonth","getUTCDate","toValidInputValue","date","getFullYear","getMonth","getDate","norwegianMatch","isoMatch","locale","options","split","map","toLocaleDateString","boundary"],"mappings":"gFAAA,MAAMA,EAAgBC,IAClB,MAAMC,EAAMC,OAAOF,GACnB,OAAKE,OAAOC,SAASF,GACdA,EAAM,GAAK,IAAIA,IAAQ,GAAGA,IADC,IAIhCG,EAAkBC,IACpB,MAAMC,EAAQ,4BAA4BC,KAAKF,GAC/C,IAAKC,EAAO,OAAO,EAEnB,OAASE,EAAGC,EAAGC,GAAKJ,EACdK,EAAOT,OAAOM,GACdI,EAAQV,OAAOO,GACfI,EAAMX,OAAOQ,GAEbI,EAAS,IAAIC,KAAKA,KAAKC,IAAIL,EAAMC,EAAQ,EAAGC,IAClD,OACIX,OAAOC,SAASW,EAAOG,YACvBH,EAAOI,mBAAqBP,GAC5BG,EAAOK,gBAAkBP,EAAQ,GACjCE,EAAOM,eAAiBP,GAenBQ,EAAqBC,IAC9B,IAAIjB,EAAM,GAEV,GAAIiB,aAAgBP,KAAM,CAItB,OAAAV,EAAM,GAHOiB,EAAKC,iBACJxB,EAAauB,EAAKE,WAAa,MACjCzB,EAAauB,EAAKG,aAEvBrB,EAAeC,GAAOA,EAAM,EACvC,CAEA,IAAKiB,EAAM,MAAO,GAElB,MAAMI,EAAiB,kCAAkCnB,KAAKe,GAC9D,GAAII,EAAgB,CAChB,OAASb,EAAKD,EAAOD,GAAQe,EAC7B,OAAArB,EAAM,GAAGM,KAAQZ,EAAaa,MAAUb,EAAac,KAC9CT,EAAeC,GAAOA,EAAM,EACvC,CAEA,MAAMsB,EAAW,gCAAgCpB,KAAKe,GACtD,GAAIK,EAAU,CACV,OAAShB,EAAMC,EAAOC,GAAOc,EAC7B,OAAAtB,EAAM,GAAGM,KAAQZ,EAAaa,MAAUb,EAAac,KAC9CT,EAAeC,GAAOA,EAAM,EACvC,CAEA,MAAO,kCAU0B,CACjCiB,EACAM,EAAS,QACTC,EAAsC,CAClChB,IAAK,UACLD,MAAO,UACPD,KAAM,cAGV,IAAKP,EAAekB,GAChB,MAAO,GAGX,MAAOX,EAAMC,EAAOC,GAAOS,EAAKQ,MAAM,KAAKC,IAAI7B,QACzCY,EAAS,IAAIC,KAAKJ,EAAMC,EAAQ,EAAGC,GACzC,OACKX,OAAOC,SAASW,EAAOG,YACxBH,EAAOS,gBAAkBZ,GACzBG,EAAOU,aAAeZ,EAAQ,GAC9BE,EAAOW,YAAcZ,EAIlBC,EAAOkB,mBAAmBJ,EAAQC,GAF9B,4BAmBXI,IAEA,GAA2C,MAAbA,GAAkC,KAAbA,EAC/C,OAGJ,IAAI5B,EAAM,GACV,OACIA,EADoB,iBAAb4B,EACD/B,OAAOC,SAAS8B,GAChBZ,EAAkB,IAAIN,KAAKkB,IAC3B,GAEAZ,EAAkBY,GAGb,KAAR5B,OAAa,EAAYA"}

package/build/cjs/components/date-input/utils.d.cts ADDED Viewed

@@ -0,0 +1,34 @@
+/**
+ * Normaliserer en dato til ISO-formatet `DateInput` forventer (`YYYY-MM-DD`).
+ *
+ * Godtar `Date`-objekter, ISO-strenger (`YYYY-MM-DD`) og norsk punktumformat
+ * (`DD.MM.YYYY`). Ugyldige verdier gir tom streng (`""`).
+ *
+ * @example
+ * toValidInputValue(new Date(2026, 7, 13)); // "2026-08-13"
+ * toValidInputValue("13.08.2026");          // "2026-08-13"
+ * toValidInputValue("ikke en dato");        // ""
+ */
+export declare const toValidInputValue: (date: Date | string | undefined) => string;
+/**
+ * Gjør ISO-dato (`YYYY-MM-DD`) om til lesbar norsk dato. Overstyr med `options`. Ugyldig → `""`.
+ *
+ * @example
+ * toNorwegianDateFormat("2026-08-13");                    // "13.08.2026"
+ * toNorwegianDateFormat("2026-08-13", "nb-NO", { month: "long" }); // "august"
+ */
+export declare const toNorwegianDateFormat: (date: string, locale?: string, options?: Intl.DateTimeFormatOptions) => string;
+/**
+ * Normaliserer `min`/`max` til ISO-format (`YYYY-MM-DD`).
+ *
+ * `number` godtas fordi react-hook-forms `register()` typer `min`/`max` som
+ * `string | number`. Tall tolkes som millisekunder siden epoch (`Date.now()`).
+ * Verdier som ikke gir en gyldig dato blir `undefined`, slik at både det native
+ * feltet og kalenderen ser bort fra grensen i stedet for å få en søppelverdi.
+ *
+ * @example
+ * toValidBoundary("13.08.2026");            // "2026-08-13"
+ * toValidBoundary(Date.now());              // dagens dato som ISO
+ * toValidBoundary("ikke en dato");          // undefined
+ */
+export declare const toValidBoundary: (boundary: string | number | undefined) => string | undefined;

package/build/cjs/components/file/File.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../clsx-E3yX_9sL.cjs"),c=require("react"),n=require("../../utilities/formatters/bytes/formatBytes.cjs");require("../../utilities/polymorphism/SlotComponent.cjs");const o=require("../button/Button.cjs"),r=require("../file-input/internal/fileInputContext.cjs");require("../icon/Icon.cjs"),require("../icon/icons/animated/ArrowVerticalAnimated.cjs"),require("../icon/icons/animated/ArrowHorizontalAnimated.cjs"),require("../icon/icons/animated/PlusRemoveAnimated.cjs"),require("../icon/icons/ArrowDownIcon.cjs"),require("../icon/icons/ArrowLeftIcon.cjs"),require("../icon/icons/ArrowNorthEastIcon.cjs"),require("../icon/icons/ArrowRightIcon.cjs"),require("../icon/icons/ArrowUpIcon.cjs"),require("../icon/icons/CalendarIcon.cjs"),require("../icon/icons/CheckIcon.cjs"),require("../icon/icons/ChevronDownIcon.cjs"),require("../icon/icons/ChevronLeftIcon.cjs"),require("../icon/icons/ChevronRightIcon.cjs"),require("../icon/icons/ChevronUpIcon.cjs"),require("../icon/icons/CloseIcon.cjs"),require("../icon/icons/CopyIcon.cjs"),require("../icon/icons/DotsIcon.cjs"),require("../icon/icons/DragIcon.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/GreenCheckIcon.cjs"),require("../icon/icons/HamburgerIcon.cjs"),require("../icon/icons/InfoIcon.cjs"),require("../icon/icons/LinkIcon.cjs"),require("../icon/icons/MinusIcon.cjs"),require("../icon/icons/OpenInNewIcon.cjs"),require("../icon/icons/PenIcon.cjs"),require("../icon/icons/PlusIcon.cjs"),require("../icon/icons/QuestionIcon.cjs"),require("../icon/icons/RedCrossIcon.cjs"),require("../icon/icons/SearchIcon.cjs"),require("../icon/icons/SuccessIcon.cjs"),require("../icon/icons/ThumbDownIcon.cjs"),require("../icon/icons/ThumbUpIcon.cjs");const s=require("../icon/icons/TrashCanIcon.cjs");require("../icon/icons/WarningIcon.cjs"),require("../../hooks/useId/useId.cjs");const t=require("../input-group/SupportLabel.cjs");require("../input-group/InputGroup.cjs");const l=require("../link/Link.cjs");exports.File=u=>{const{children:a,className:j,fileName:q,fileType:I,fileSize:m,path:p,file:_,state:d,errorLabel:h="Feil",onRemove:f,variant:x="list",...k}=u,b=`jkl-file-preview-${c.useId()}`,C=`${b}-support`,v=r.useFileInputContext(),N=I.startsWith("image/")&&(_?URL.createObjectURL(_):p),g=e.jsxs("div",{id:b,className:i.clsx(j,"jkl-file",`jkl-file--${x}`),"data-state":d,...k,children:[e.jsxs("div",{className:"jkl-file__content",children:[e.jsx("div",{className:"jkl-file__content__thumbnail","data-filetype":I,children:e.jsx("img",{src:N||void 0,alt:""})}),p?e.jsx("p",{className:"jkl-file__content__name",children:e.jsxs(l.Link,{href:p,children:[q," ",e.jsxs("span",{className:"jkl-file__content__name__size",children:["(",n.formatBytes(m),")"]})]})}):e.jsxs("p",{className:"jkl-file__content__name",children:[q," ",e.jsxs("span",{className:"jkl-file__content__name__size",children:["(",n.formatBytes(m),")"]})]}),f&&e.jsx(o.Button,{variant:"ghost",className:"jkl-file__content__button",onClick:f,title:`Fjern ${q}`,icon:e.jsx(s.TrashCanIcon,{})})]}),"error"===d&&h&&e.jsx(t.SupportLabel,{className:"jkl-file__support-label",id:C,label:h,labelType:"error"})]});return v?e.jsx("li",{children:g}):g};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../../../clsx-E3yX_9sL.cjs"),c=require("react"),n=require("../../utilities/formatters/bytes/formatBytes.cjs");require("../../utilities/polymorphism/SlotComponent.cjs");const r=require("../button/Button.cjs"),s=require("../file-input/internal/fileInputContext.cjs"),o=require("../flex/Flex.cjs");require("../icon/Icon.cjs"),require("../icon/icons/animated/ArrowVerticalAnimated.cjs"),require("../icon/icons/animated/ArrowHorizontalAnimated.cjs"),require("../icon/icons/animated/PlusRemoveAnimated.cjs"),require("../icon/icons/ArrowDownIcon.cjs"),require("../icon/icons/ArrowLeftIcon.cjs"),require("../icon/icons/ArrowNorthEastIcon.cjs"),require("../icon/icons/ArrowRightIcon.cjs"),require("../icon/icons/ArrowUpIcon.cjs"),require("../icon/icons/CalendarIcon.cjs"),require("../icon/icons/CheckIcon.cjs"),require("../icon/icons/ChevronDownIcon.cjs"),require("../icon/icons/ChevronLeftIcon.cjs"),require("../icon/icons/ChevronRightIcon.cjs"),require("../icon/icons/ChevronUpIcon.cjs"),require("../icon/icons/CloseIcon.cjs"),require("../icon/icons/CopyIcon.cjs"),require("../icon/icons/DotsIcon.cjs"),require("../icon/icons/DragIcon.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/GreenCheckIcon.cjs"),require("../icon/icons/HamburgerIcon.cjs"),require("../icon/icons/InfoIcon.cjs"),require("../icon/icons/LinkIcon.cjs"),require("../icon/icons/MinusIcon.cjs"),require("../icon/icons/OpenInNewIcon.cjs"),require("../icon/icons/PenIcon.cjs"),require("../icon/icons/PlusIcon.cjs"),require("../icon/icons/QuestionIcon.cjs"),require("../icon/icons/RedCrossIcon.cjs"),require("../icon/icons/SearchIcon.cjs"),require("../icon/icons/SuccessIcon.cjs"),require("../icon/icons/ThumbDownIcon.cjs"),require("../icon/icons/ThumbUpIcon.cjs");const t=require("../icon/icons/TrashCanIcon.cjs");require("../icon/icons/WarningIcon.cjs"),require("../../hooks/useId/useId.cjs");const l=require("../input-group/SupportLabel.cjs");require("../input-group/InputGroup.cjs");const a=require("../link/Link.cjs"),u=require("../typography/Text.cjs");require("../typography/Title.cjs");exports.File=j=>{const{children:q,hideThumbnail:I,className:p,fileName:m,fileType:h,fileSize:d,path:f,file:x,state:k,errorLabel:b="Feil",onRemove:g,variant:_="list",...C}=j,y=`jkl-file-preview-${c.useId()}`,w=`${y}-support`,N=s.useFileInputContext(),v=h.startsWith("image/")&&(x?URL.createObjectURL(x):f),T=e.jsxs("div",{id:y,className:i.clsx(p,"jkl-file",`jkl-file--${_}`),"data-state":k,...C,children:[e.jsxs(o.Flex,{gap:"8",direction:"card"===_?"column":"row",alignItems:"card"===_?"start":"center",className:"jkl-file__content",children:[!I&&e.jsx("div",{className:"jkl-file__thumbnail","data-filetype":h,children:v&&e.jsx("img",{src:v,alt:""})}),e.jsxs(o.Flex,{gap:"8",alignItems:"center",justifyContent:"space-between",className:"jkl-file__info",children:[f?e.jsx(u.Text,{size:"s",className:"jkl-file__name",children:e.jsxs(a.Link,{href:f,children:[m," ",e.jsxs("span",{className:"jkl-file__size",children:["(",n.formatBytes(d),")"]})]})}):e.jsxs(u.Text,{size:"s",className:"jkl-file__name",children:[m," ",e.jsxs("span",{className:"jkl-file__size",children:["(",n.formatBytes(d),")"]})]}),g&&e.jsx(r.Button,{variant:"ghost",className:"jkl-file__button",onClick:g,title:`Fjern ${m}`,icon:e.jsx(t.TrashCanIcon,{})})]})]}),"error"===k&&b&&e.jsx(l.SupportLabel,{className:"jkl-file__support-label",id:w,label:b,labelType:"error"})]});return N?e.jsx("li",{children:T}):T};
 //# sourceMappingURL=File.cjs.map

package/build/cjs/components/file/File.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"File.cjs","sources":["../../../../src/components/file/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport ~~React,~~ { type ComponentProps, type FC, useId } from \"react\";\nimport { formatBytes } from \"../../utilities/index.js\";\nimport { Button } from \"../button/index.js\";\nimport { useFileInputContext } from \"../file-input/internal/fileInputContext.js\";\nimport { TrashCanIcon } from \"../icon/index.js\";\nimport { SupportLabel } from \"../input-group/index.js\";\nimport { Link } from \"../link/index.js\";\nimport type { FileProps } from \"./types.js\";\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n const {\n children,\n className,\n fileName,\n fileType,\n fileSize,\n path,\n file,\n state,\n errorLabel = \"Feil\",\n onRemove,\n variant = \"list\",\n ...rest\n } = props;\n\n const id = `jkl-file-preview-${useId()}`;\n const supportId = `${id}-support`;\n\n const context = useFileInputContext();\n\n const imageSrc =\n fileType.startsWith(\"image/\") &&\n (file ? URL.createObjectURL(file) : path);\n\n const fileComponent = (\n <div\n id={id}\n className={clsx(className, \"jkl-file\", `jkl-file--${variant}`)}\n data-state={state}\n {...rest}\n >\n <~~div~~ className={\"jkl-file__content\"}>\n <div\n className=\"jkl-~~file__content__thumbnail~~\"\n data-filetype={fileType}\n >\n <img src={imageSrc ~~\|\| undefined~~} alt=\"\" ~~/>\~~n </div>\n {path ? (\n <p className=\"jkl-~~file__content__name~~\">\n <Link href={path}>\n {fileName}{\" \"}\n <span className=\"jkl-~~file__content__name__size~~\">\n ({formatBytes(fileSize)})\n </span>\n </Link>\n </p>\n ) : (\n <p className=\"jkl-~~file__content__name~~\">\n {fileName}{\" \"}\n <span className=\"jkl-~~file__content__name__size~~\">\n ({formatBytes(fileSize)})\n </span>\n </p>\n )}\n {onRemove && (\n <Button\n variant={\"ghost\"}\n className=\"jkl-~~file__content__button~~\"\n onClick={onRemove}\n title={`Fjern ${fileName}`}\n icon={<TrashCanIcon />}\n />\n )}\n </~~div~~>\n\n {state === \"error\" && errorLabel && (\n <SupportLabel\n className=\"jkl-file__support-label\"\n id={supportId}\n label={errorLabel}\n labelType={\"error\"}\n />\n )}\n </div>\n );\n\n return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["props","children","className","fileName","fileType","fileSize","path","file","state","errorLabel","onRemove","variant","rest","id","useId","supportId","context","useFileInputContext","imageSrc","startsWith","URL","createObjectURL","fileComponent","jsxs","clsx","jsx","src","alt","Link","href","formatBytes","Button","onClick","title","icon","TrashCanIcon","SupportLabel","label","labelType"],"mappings":"~~+jEAU4DA~~,IACxD,MACIC,~~SAAAA~~,EACAC,UAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,WAAAA,EAAa,OACbC,SAAAA,EACAC,QAAAA,EAAU,UACPC,~~GACHZ~~,~~EAEEa~~,EAAK,oBAAoBC,EAAAA,UACzBC,EAAY,GAAGF,YAEfG,EAAUC,EAAAA,sBAEVC,EACFd,EAASe,WAAW,YACnBZ,EAAOa,IAAIC,gBAAgBd,GAAQD,GAElCgB,EACFC,EAAAA,KAAC,MAAA,CACGV,GAAAA,EACAX,UAAWsB,EAAAA,KAAKtB,EAAW,WAAY,aAAaS,KACpD,aAAYH,KACRI,~~EAEJX~~,SAAA,~~CAAAsB~~,EAAAA,~~KAAC~~,~~MAAA~~,~~CAAIrB~~,UAAW,~~oBACZD~~,SAAA,~~CAAAwB~~,EAAAA,IAAC,MAAA,~~CACGvB~~,UAAU~~,+BACV~~,gBAAeE,~~EAEfH~~,~~eAAC~~,MAAA,~~CAAIyB~~,~~IAAKR~~,~~QAAY~~,~~EAAWS~~,IAAI,~~OAExCrB~~,~~QACI~~,~~IAAA~~,~~CAAEJ~~,UAAU,~~0BACTD~~,~~SAAAsB~~,EAAAA,~~KAACK~~,EAAAA,KAAA,CAAKC,~~KAAMvB~~,~~EACPL~~,SAAA,~~CAAAE~~,EAAU,IACXoB,EAAAA,KAAC,OAAA,CAAKrB,UAAU,~~gCAAgCD~~,SAAA,CAAA,~~IAC1C6B~~,EAAAA,~~YAAYzB~~,GAAU,YAKpCkB,EAAAA,~~KAAC~~,~~IAAA~~,~~CAAErB~~,UAAU,~~0BACRD~~,SAAA,~~CAAAE~~,EAAU,IACXoB,EAAAA,KAAC,OAAA,CAAKrB,UAAU,~~gCAAgCD~~,SAAA,CAAA,~~IAC1C6B~~,EAAAA,~~YAAYzB~~,GAAU,UAInCK,~~GACGe~~,EAAAA,~~IAACM~~,EAAAA,OAAA,~~CACGpB~~,QAAS,QACTT,UAAU,~~4BACV8B~~,~~QAAStB~~,~~EACTuB~~,MAAO,~~SAAS9B~~,~~IAChB+B~~,WAAOC,EAAAA,aAAA,CAAA,~~QAKR~~,~~UAAV3B~~,GAAqBC,~~GAClBgB~~,EAAAA,~~IAACW~~,EAAAA,aAAA,~~CACGlC~~,UAAU,0BACVW,GAAIE,~~EACJsB~~,~~MAAO5B~~,~~EACP6B~~,UAAW,aAM3B,~~OAAOtB~~,~~EAAUS~~,EAAAA,IAAC,KAAA,~~CAAIxB~~,~~SAAAqB~~,IAAsBA"}
1	+ {"version":3,"file":"File.cjs","sources":["../../../../src/components/file/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { type ComponentProps, type FC, useId } from \"react\";\nimport { formatBytes } from \"../../utilities/index.js\";\nimport { Button } from \"../button/index.js\";\nimport { useFileInputContext } from \"../file-input/internal/fileInputContext.js\";\nimport { Flex } from \"../flex/index.js\";\nimport { TrashCanIcon } from \"../icon/index.js\";\nimport { SupportLabel } from \"../input-group/index.js\";\nimport { Link } from \"../link/index.js\";\nimport { Text } from \"../typography/index.js\";\nimport type { FileProps } from \"./types.js\";\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n const {\n children: _,\n hideThumbnail,\n className,\n fileName,\n fileType,\n fileSize,\n path,\n file,\n state,\n errorLabel = \"Feil\",\n onRemove,\n variant = \"list\",\n ...rest\n } = props;\n\n const id = `jkl-file-preview-${useId()}`;\n const supportId = `${id}-support`;\n\n const context = useFileInputContext();\n\n const imageSrc =\n fileType.startsWith(\"image/\") &&\n (file ? URL.createObjectURL(file) : path);\n\n const fileComponent = (\n <div\n id={id}\n className={clsx(className, \"jkl-file\", `jkl-file--${variant}`)}\n data-state={state}\n {...rest}\n >\n <Flex\n gap=\"8\"\n direction={variant === \"card\" ? \"column\" : \"row\"}\n alignItems={variant === \"card\" ? \"start\" : \"center\"}\n className={\"jkl-file__content\"}\n >\n {!hideThumbnail && (\n <div\n className=\"jkl-file__thumbnail\"\n data-filetype={fileType}\n >\n {imageSrc && <img src={imageSrc} alt=\"\" />}\n </div>\n )}\n <Flex\n gap=\"8\"\n alignItems=\"center\"\n justifyContent=\"space-between\"\n className=\"jkl-file__info\"\n >\n {path ? (\n <Text size=\"s\" className=\"jkl-file__name\">\n <Link href={path}>\n {fileName}{\" \"}\n <span className=\"jkl-file__size\">\n ({formatBytes(fileSize)})\n </span>\n </Link>\n </Text>\n ) : (\n <Text size=\"s\" className=\"jkl-file__name\">\n {fileName}{\" \"}\n <span className=\"jkl-file__size\">\n ({formatBytes(fileSize)})\n </span>\n </Text>\n )}\n {onRemove && (\n <Button\n variant={\"ghost\"}\n className=\"jkl-file__button\"\n onClick={onRemove}\n title={`Fjern ${fileName}`}\n icon={<TrashCanIcon />}\n />\n )}\n </Flex>\n </Flex>\n\n {state === \"error\" && errorLabel && (\n <SupportLabel\n className=\"jkl-file__support-label\"\n id={supportId}\n label={errorLabel}\n labelType={\"error\"}\n />\n )}\n </div>\n );\n\n return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["props","children","_","hideThumbnail","className","fileName","fileType","fileSize","path","file","state","errorLabel","onRemove","variant","rest","id","useId","supportId","context","useFileInputContext","imageSrc","startsWith","URL","createObjectURL","fileComponent","jsxs","clsx","Flex","gap","direction","alignItems","jsx","src","alt","justifyContent","Text","size","Link","href","formatBytes","Button","onClick","title","icon","TrashCanIcon","SupportLabel","label","labelType"],"mappings":"oqEAY4DA,IACxD,MACIC,SAAUC,EACVC,cAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,MAAAA,EACAC,WAAAA,EAAa,OACbC,SAAAA,EACAC,QAAAA,EAAU,UACPC,GACHd,EAEEe,EAAK,oBAAoBC,EAAAA,UACzBC,EAAY,GAAGF,YAEfG,EAAUC,EAAAA,sBAEVC,EACFd,EAASe,WAAW,YACnBZ,EAAOa,IAAIC,gBAAgBd,GAAQD,GAElCgB,EACFC,EAAAA,KAAC,MAAA,CACGV,GAAAA,EACAX,UAAWsB,EAAAA,KAAKtB,EAAW,WAAY,aAAaS,KACpD,aAAYH,KACRI,EAEJb,SAAA,CAAAwB,EAAAA,KAACE,EAAAA,KAAA,CACGC,IAAI,IACJC,UAAuB,SAAZhB,EAAqB,SAAW,MAC3CiB,WAAwB,SAAZjB,EAAqB,QAAU,SAC3CT,UAAW,oBAEVH,SAAA,EAACE,GACE4B,EAAAA,IAAC,MAAA,CACG3B,UAAU,sBACV,gBAAeE,EAEdL,YAAY8B,EAAAA,IAAC,MAAA,CAAIC,IAAKZ,EAAUa,IAAI,OAG7CR,EAAAA,KAACE,EAAAA,KAAA,CACGC,IAAI,IACJE,WAAW,SACXI,eAAe,gBACf9B,UAAU,iBAETH,SAAA,CAAAO,EACGuB,EAAAA,IAACI,EAAAA,MAAKC,KAAK,IAAIhC,UAAU,iBACrBH,SAAAwB,EAAAA,KAACY,EAAAA,KAAA,CAAKC,KAAM9B,EACPP,SAAA,CAAAI,EAAU,IACXoB,EAAAA,KAAC,OAAA,CAAKrB,UAAU,iBAAiBH,SAAA,CAAA,IAC3BsC,EAAAA,YAAYhC,GAAU,YAKpCkB,EAAAA,KAACU,EAAAA,MAAKC,KAAK,IAAIhC,UAAU,iBACpBH,SAAA,CAAAI,EAAU,IACXoB,EAAAA,KAAC,OAAA,CAAKrB,UAAU,iBAAiBH,SAAA,CAAA,IAC3BsC,EAAAA,YAAYhC,GAAU,UAInCK,GACGmB,EAAAA,IAACS,EAAAA,OAAA,CACG3B,QAAS,QACTT,UAAU,mBACVqC,QAAS7B,EACT8B,MAAO,SAASrC,IAChBsC,WAAOC,EAAAA,aAAA,CAAA,WAMZ,UAAVlC,GAAqBC,GAClBoB,EAAAA,IAACc,EAAAA,aAAA,CACGzC,UAAU,0BACVW,GAAIE,EACJ6B,MAAOnC,EACPoC,UAAW,aAM3B,OAAO7B,EAAUa,EAAAA,IAAC,KAAA,CAAI9B,SAAAuB,IAAsBA"}

package/build/cjs/components/file/types.d.cts CHANGED Viewed

@@ -1,10 +1,15 @@
-import { MouseEvent } from 'react';
+import { MouseEvent, ReactNode } from 'react';
 export type FileProps = {
     fileName: string;
     fileType: string;
     fileSize: number;
     path?: string;
     errorLabel?: string;
+    /**
+     * Du kan skjule forhåndsvisning av bilde/filendelse for å spare plass
+     * @default false
+     */
+    hideThumbnail?: boolean;
     state?: "error" | "loading";
     /**
      * Velg hvordan filene skal vises for brukeren
@@ -17,4 +22,8 @@ export type FileProps = {
      * Gjør det mulig å vise en knapp for fjerning av filene ved filopplasting
      */
     onRemove?: (e: MouseEvent<HTMLButtonElement>) => void;
+    /**
+     * @deprecated Blir ikke brukt, vil fjernes i neste major-release
+     */
+    children?: ReactNode;
 };

package/build/cjs/components/search/Search.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),s=require("react"),t=require("../../utilities/mergeRefs.cjs");require("../../hooks/useId/useId.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/SuccessIcon.cjs"),require("../icon/icons/WarningIcon.cjs");const c=require("../input-group/InputGroup.cjs"),l=require("./SearchButton.cjs"),n=s.forwardRef(function(l,n){const{label:o="Søk",className:a,errorLabel:i,helpLabel:u,labelProps:p={srOnly:!0},supportLabelProps:d,tooltip:b,description:h,name:j="q",placeholder:m="Søk",spellCheck:f=!1,icon:k="search",children:q,value:x,...g}=l,y={label:o,errorLabel:i,helpLabel:u,labelProps:p,supportLabelProps:d,tooltip:b,description:h},I=s.useRef(null),S=t.mergeRefs(I,n),v=()=>{if(I.current){Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value")?.set?.call(I.current,"");const e=new Event("change",{bubbles:!0});I.current.dispatchEvent(e),I.current.focus()}};return e.jsxs("div",{className:r.clsx("jkl-search",a),children:[e.jsx(c.InputGroup,{...y,label:o,"data-testid":"jkl-search",render:r=>e.jsxs("div",{className:"input-wrapper","data-icon":k,children:[e.jsx("input",{ref:S,type:"search",name:j,placeholder:m,spellCheck:f,...r,...g}),e.jsx("button",{className:"clear-button",type:"button",onClick:v,children:e.jsx("span",{className:"jkl-sr-only",children:"Tilbakestill søkefeltet"})})]})}),q]})});n.Button=l.SearchButton,exports.Search=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),s=require("react"),t=require("../../utilities/mergeRefs.cjs");require("../../hooks/useId/useId.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/SuccessIcon.cjs"),require("../icon/icons/WarningIcon.cjs");const c=require("../input-group/InputGroup.cjs"),l=require("./SearchButton.cjs"),n=s.forwardRef(function(l,n){const{label:o="Søk",className:a,errorLabel:i,helpLabel:u,labelProps:p={srOnly:!0},supportLabelProps:b,tooltip:d,description:h,name:j="q",placeholder:k="Søk",spellCheck:m=!1,icon:f="search",children:q,...x}=l,g={label:o,errorLabel:i,helpLabel:u,labelProps:p,supportLabelProps:b,tooltip:d,description:h},y=s.useRef(null),I=t.mergeRefs(y,n),S=s.useCallback(()=>{if(y.current){Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,"value")?.set?.call(y.current,"");const e=new Event("change",{bubbles:!0});y.current.dispatchEvent(e),y.current.focus()}},[]);return e.jsxs("div",{className:r.clsx("jkl-search",a),children:[e.jsx(c.InputGroup,{...g,label:o,"data-testid":"jkl-search",render:r=>e.jsxs("div",{className:"input-wrapper","data-icon":f,children:[e.jsx("input",{ref:I,type:"search",name:j,placeholder:k,spellCheck:m,...r,...x}),e.jsx("button",{className:"clear-button",type:"button",onClick:S,children:e.jsx("span",{className:"jkl-sr-only",children:"Tilbakestill søkefeltet"})})]})}),q]})});n.Button=l.SearchButton,exports.Search=n;
 //# sourceMappingURL=Search.cjs.map

package/build/cjs/components/search/Search.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Search.cjs","sources":["../../../../src/components/search/Search.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useRef } from \"react\";\nimport { mergeRefs } from \"../../utilities/mergeRefs.js\";\nimport { InputGroup } from \"../input-group/index.js\";\nimport { SearchButton } from \"./SearchButton.js\";\nimport type { SearchInputProps } from \"./types.js\";\n\nexport const Search = forwardRef<HTMLInputElement, SearchInputProps>(\n function Search(props, forwardedRef): React.JSX.Element {\n const {\n label = \"Søk\",\n className,\n errorLabel,\n helpLabel,\n labelProps = { srOnly: true },\n supportLabelProps,\n tooltip,\n description,\n name = \"q\",\n placeholder = \"Søk\",\n spellCheck = false,\n icon = \"search\",\n children,\n ~~value,\n~~ ...rest\n } = props;\n\n const inputGroupProps = {\n label,\n errorLabel,\n helpLabel,\n labelProps,\n supportLabelProps,\n tooltip,\n description,\n };\n\n const internalRef = useRef<HTMLInputElement>(null);\n const ref = mergeRefs(internalRef, forwardedRef);\n\n const ~~handleClick~~ = () => {\n if (internalRef.current) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\",\n )?.set;\n nativeInputValueSetter?.call(internalRef.current, \"\");\n const event = new Event(\"change\", { bubbles: true });\n internalRef.current.dispatchEvent(event);\n internalRef.current.focus();\n }\n };\n\n return (\n <div className={clsx(\"jkl-search\", className)}>\n <InputGroup\n {...inputGroupProps}\n label={label}\n data-testid=\"jkl-search\"\n render={(inputProps) => (\n <div className=\"input-wrapper\" data-icon={icon}>\n <input\n ref={ref}\n type=\"search\"\n name={name}\n placeholder={placeholder}\n spellCheck={spellCheck}\n {...inputProps}\n {...rest}\n />\n <button\n className=\"clear-button\"\n type=\"button\"\n onClick={~~handleClick~~}\n >\n <span className=\"jkl-sr-only\">\n Tilbakestill søkefeltet\n </span>\n </button>\n </div>\n )}\n />\n {children}\n </div>\n );\n },\n) as ReturnType<typeof forwardRef<HTMLInputElement, SearchInputProps>> & {\n Button: typeof SearchButton;\n};\n\nSearch.Button = SearchButton;\n"],"names":["Search","forwardRef","props","forwardedRef","label","className","errorLabel","helpLabel","labelProps","srOnly","supportLabelProps","tooltip","description","name","placeholder","spellCheck","icon","children","~~value","~~rest","inputGroupProps","internalRef","useRef","ref","mergeRefs","~~handleClick~~","current","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","event","Event","bubbles","dispatchEvent","focus","clsx","jsx","InputGroup","render","inputProps","jsxs","type","onClick","Button","SearchButton"],"mappings":"4cAOaA,EAASC,EAAAA,WAClB,SAAgBC,EAAOC,GACnB,MACIC,MAAAA,EAAQ,MACRC,UAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,WAAAA,EAAa,CAAEC,QAAQ,GACvBC,kBAAAA,EACAC,QAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,IACPC,YAAAA,EAAc,MACdC,WAAAA,GAAa,EACbC,KAAAA,EAAO,SACPC,SAAAA,~~EACAC,MAAAA,~~KACGC,~~GACHjB~~,~~EAEEkB~~,EAAkB,~~CACpBhB~~,MAAAA,EACAE,WAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAE,kBAAAA,EACAC,QAAAA,EACAC,YAAAA,~~GAGES~~,EAAcC,EAAAA,OAAyB,MACvCC,EAAMC,EAAAA,UAAUH,~~EAAalB~~,~~GAE7BsB~~,~~EAAc~~,~~KAChB~~,~~GAAIJ~~,~~EAAYK~~,QAAS,CACUC,OAAOC,yBAClCC,OAAOC,iBAAiBC,UACxB,UACDC,KACqBC,~~KAAKZ~~,~~EAAYK~~,QAAS,IAClD,MAAMQ,EAAQ,IAAIC,MAAM,SAAU,CAAEC,SAAS,~~IAC7Cf~~,~~EAAYK~~,QAAQW,cAAcH,~~GAClCb~~,~~EAAYK~~,QAAQY,OACxB,~~GAGJ~~,cACK,MAAA,CAAIjC,UAAWkC,EAAAA,KAAK,aAAclC,GAC/BY,SAAA,CAAAuB,EAAAA,IAACC,EAAAA,WAAA,~~IACOrB~~,~~EACJhB~~,MAAAA,EACA,cAAY,aACZsC,OAASC,GACLC,EAAAA,KAAC,OAAIvC,UAAU,gBAAgB,YAAWW,EACtCC,SAAA,CAAAuB,EAAAA,IAAC,QAAA,~~CACGjB~~,IAAAA,~~EACAsB~~,KAAK,SACLhC,KAAAA,EACAC,YAAAA,EACAC,WAAAA,KACI4B,~~KACAxB~~,~~IAERqB~~,EAAAA,IAAC,SAAA,CACGnC,UAAU,eACVwC,KAAK,SACLC,~~QAASrB~~,~~EAETR~~,SAAAuB,EAAAA,IAAC,OAAA,CAAKnC,UAAU,cAAcY,SAAA,mCAO7CA,IAGb,GAKJjB,EAAO+C,OAASC,EAAAA"}
1	+ {"version":3,"file":"Search.cjs","sources":["../../../../src/components/search/Search.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback, useRef } from \"react\";\nimport { mergeRefs } from \"../../utilities/mergeRefs.js\";\nimport { InputGroup } from \"../input-group/index.js\";\nimport { SearchButton } from \"./SearchButton.js\";\nimport type { SearchInputProps } from \"./types.js\";\n\nexport const Search = forwardRef<HTMLInputElement, SearchInputProps>(\n function Search(props, forwardedRef): React.JSX.Element {\n const {\n label = \"Søk\",\n className,\n errorLabel,\n helpLabel,\n labelProps = { srOnly: true },\n supportLabelProps,\n tooltip,\n description,\n name = \"q\",\n placeholder = \"Søk\",\n spellCheck = false,\n icon = \"search\",\n children,\n ...rest\n } = props;\n\n const inputGroupProps = {\n label,\n errorLabel,\n helpLabel,\n labelProps,\n supportLabelProps,\n tooltip,\n description,\n };\n\n const internalRef = useRef<HTMLInputElement>(null);\n const ref = mergeRefs(internalRef, forwardedRef);\n\n const clearInput = useCallback(() => {\n if (internalRef.current) {\n const nativeInputValueSetter = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\",\n )?.set;\n nativeInputValueSetter?.call(internalRef.current, \"\");\n const event = new Event(\"change\", { bubbles: true });\n internalRef.current.dispatchEvent(event);\n internalRef.current.focus();\n }\n }, []);\n\n return (\n <div className={clsx(\"jkl-search\", className)}>\n <InputGroup\n {...inputGroupProps}\n label={label}\n data-testid=\"jkl-search\"\n render={(inputProps) => (\n <div className=\"input-wrapper\" data-icon={icon}>\n <input\n ref={ref}\n type=\"search\"\n name={name}\n placeholder={placeholder}\n spellCheck={spellCheck}\n {...inputProps}\n {...rest}\n />\n <button\n className=\"clear-button\"\n type=\"button\"\n onClick={clearInput}\n >\n <span className=\"jkl-sr-only\">\n Tilbakestill søkefeltet\n </span>\n </button>\n </div>\n )}\n />\n {children}\n </div>\n );\n },\n) as ReturnType<typeof forwardRef<HTMLInputElement, SearchInputProps>> & {\n Button: typeof SearchButton;\n};\n\nSearch.Button = SearchButton;\n"],"names":["Search","forwardRef","props","forwardedRef","label","className","errorLabel","helpLabel","labelProps","srOnly","supportLabelProps","tooltip","description","name","placeholder","spellCheck","icon","children","rest","inputGroupProps","internalRef","useRef","ref","mergeRefs","clearInput","useCallback","current","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","event","Event","bubbles","dispatchEvent","focus","clsx","jsx","InputGroup","render","inputProps","jsxs","type","onClick","Button","SearchButton"],"mappings":"4cAOaA,EAASC,EAAAA,WAClB,SAAgBC,EAAOC,GACnB,MACIC,MAAAA,EAAQ,MACRC,UAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,WAAAA,EAAa,CAAEC,QAAQ,GACvBC,kBAAAA,EACAC,QAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,IACPC,YAAAA,EAAc,MACdC,WAAAA,GAAa,EACbC,KAAAA,EAAO,SACPC,SAAAA,KACGC,GACHhB,EAEEiB,EAAkB,CACpBf,MAAAA,EACAE,WAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAE,kBAAAA,EACAC,QAAAA,EACAC,YAAAA,GAGEQ,EAAcC,EAAAA,OAAyB,MACvCC,EAAMC,EAAAA,UAAUH,EAAajB,GAE7BqB,EAAaC,EAAAA,YAAY,KAC3B,GAAIL,EAAYM,QAAS,CACUC,OAAOC,yBAClCC,OAAOC,iBAAiBC,UACxB,UACDC,KACqBC,KAAKb,EAAYM,QAAS,IAClD,MAAMQ,EAAQ,IAAIC,MAAM,SAAU,CAAEC,SAAS,IAC7ChB,EAAYM,QAAQW,cAAcH,GAClCd,EAAYM,QAAQY,OACxB,GACD,IAEH,cACK,MAAA,CAAIjC,UAAWkC,EAAAA,KAAK,aAAclC,GAC/BY,SAAA,CAAAuB,EAAAA,IAACC,EAAAA,WAAA,IACOtB,EACJf,MAAAA,EACA,cAAY,aACZsC,OAASC,GACLC,EAAAA,KAAC,OAAIvC,UAAU,gBAAgB,YAAWW,EACtCC,SAAA,CAAAuB,EAAAA,IAAC,QAAA,CACGlB,IAAAA,EACAuB,KAAK,SACLhC,KAAAA,EACAC,YAAAA,EACAC,WAAAA,KACI4B,KACAzB,IAERsB,EAAAA,IAAC,SAAA,CACGnC,UAAU,eACVwC,KAAK,SACLC,QAAStB,EAETP,SAAAuB,EAAAA,IAAC,OAAA,CAAKnC,UAAU,cAAcY,SAAA,mCAO7CA,IAGb,GAKJjB,EAAO+C,OAASC,EAAAA"}

package/build/cjs/components/select/Option.cjs ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../clsx-E3yX_9sL.cjs"),r=require("react"),s=require("../flex/Flex.cjs"),n=require("../typography/Text.cjs"),l=r.forwardRef(function(l,c){const{className:i="",multiple:o=!1,selected:a=!1,selectRef:u,label:d,description:p,media:f,value:x,...b}=l,j=r.useRef(null),m=r.useRef(null),h=r.useCallback(e=>{const t=e.target.closest("button");if(!t\|\|!u.current\|\|u.current.disabled)return;const r=Array.from(u.current.options).find(e=>e.value===t.value);r&&(r.selected=!o\|\|!r.selected,u.current.dispatchEvent(new Event("change",{bubbles:!0})))},[u,o]);return r.useEffect(()=>{if(!f\|\|!m.current\|\|!j.current)return;const e=m.current,t=j.current,r=new ResizeObserver(()=>{t.style.setProperty("--media-size",`${e.offsetHeight}px`)});return r.observe(e),()=>r.disconnect()},[f]),e.jsxs("button",{ref:c,role:"option",type:"button",className:t.clsx("jkl-option",i),value:x,"data-multiple":o\|\|void 0,"aria-selected":a,...b,onClick:e=>{b.onClick?.(e),h(e)},children:[e.jsxs(s.Flex,{as:"span",direction:"column",gap:"4",className:"jkl-option__label",ref:m,children:[e.jsx(n.Text,{short:!0,as:"span",children:d}),p&&e.jsx(n.Text,{short:!0,subdued:!0,as:"span",size:"xs",children:p})]}),f&&e.jsx("span",{className:"jkl-option__media",ref:j,children:f})]})});exports.Option=l;
2	+ //# sourceMappingURL=Option.cjs.map

package/build/cjs/components/select/Option.cjs.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Option.cjs","sources":["../../../../src/components/select/Option.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n type RefObject,\n type MouseEvent,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n} from \"react\";\nimport type { ValuePair } from \"../../utilities/valuePair.js\";\nimport { Flex } from \"../flex/Flex.js\";\nimport { Text } from \"../typography/Text.js\";\n\nexport type OptionProps = Omit<\n ComponentPropsWithoutRef<\"button\">,\n \"aria-selected\" | \"children\" | \"role\" | \"type\" | \"value\"\n> &\n ValuePair & {\n multiple?: boolean;\n selected?: boolean;\n selectRef: RefObject<HTMLSelectElement>;\n };\n\nexport const Option = forwardRef<HTMLButtonElement, OptionProps>(\n function Option(props, ref) {\n const {\n className = \"\",\n multiple = false,\n selected = false,\n selectRef,\n label,\n description,\n media,\n value,\n ...rest\n } = props;\n\n const mediaRef = useRef<HTMLSpanElement>(null);\n const labelRef = useRef<HTMLSpanElement>(null);\n\n const syncValueToSelect = useCallback(\n (event: KeyboardEvent | MouseEvent) => {\n const button = (\n event.target as HTMLElement\n ).closest<HTMLButtonElement>(\"button\");\n if (!button || !selectRef.current || selectRef.current.disabled)\n return;\n\n const option = Array.from(selectRef.current.options).find(\n (option) => option.value === button.value,\n );\n if (!option) return;\n\n option.selected = multiple ? !option.selected : true;\n selectRef.current.dispatchEvent(\n new Event(\"change\", { bubbles: true }),\n );\n },\n [selectRef, multiple],\n );\n\n useEffect(() => {\n if (!media || !labelRef.current || !mediaRef.current) return;\n const labelElement = labelRef.current;\n const mediaElement = mediaRef.current;\n const observer = new ResizeObserver(() => {\n mediaElement.style.setProperty(\n \"--media-size\",\n `${labelElement.offsetHeight}px`,\n );\n });\n observer.observe(labelElement);\n return () => observer.disconnect();\n }, [media]);\n\n return (\n <button\n ref={ref}\n // biome-ignore lint/a11y/useSemanticElements: vi kan ikke style option-elementet\n role=\"option\"\n type=\"button\"\n className={clsx(\"jkl-option\", className)}\n value={value}\n data-multiple={multiple || undefined}\n aria-selected={selected}\n {...rest}\n onClick={(event) => {\n rest.onClick?.(event);\n syncValueToSelect(event);\n }}\n >\n <Flex\n as=\"span\"\n direction=\"column\"\n gap=\"4\"\n className=\"jkl-option__label\"\n ref={labelRef}\n >\n <Text short as=\"span\">\n {label}\n </Text>\n {description && (\n <Text short subdued as=\"span\" size=\"xs\">\n {description}\n </Text>\n )}\n </Flex>\n {media && (\n <span className=\"jkl-option__media\" ref={mediaRef}>\n {media}\n </span>\n )}\n </button>\n );\n },\n);\n"],"names":["Option","forwardRef","props","ref","className","multiple","selected","selectRef","label","description","media","value","rest","mediaRef","useRef","labelRef","syncValueToSelect","useCallback","event","button","target","closest","current","disabled","option","Array","from","options","find","dispatchEvent","Event","bubbles","useEffect","labelElement","mediaElement","observer","ResizeObserver","style","setProperty","offsetHeight","observe","disconnect","jsxs","role","type","clsx","onClick","children","Flex","as","direction","gap","jsx","Text","short","subdued","size"],"mappings":"kPAwBaA,EAASC,EAAAA,WAClB,SAAgBC,EAAOC,GACnB,MACIC,UAAAA,EAAY,GACZC,SAAAA,GAAW,EACXC,SAAAA,GAAW,EACXC,UAAAA,EACAC,MAAAA,EACAC,YAAAA,EACAC,MAAAA,EACAC,MAAAA,KACGC,GACHV,EAEEW,EAAWC,EAAAA,OAAwB,MACnCC,EAAWD,EAAAA,OAAwB,MAEnCE,EAAoBC,EAAAA,YACrBC,IACG,MAAMC,EACFD,EAAME,OACRC,QAA2B,UAC7B,IAAKF,IAAWZ,EAAUe,SAAWf,EAAUe,QAAQC,SACnD,OAEJ,MAAMC,EAASC,MAAMC,KAAKnB,EAAUe,QAAQK,SAASC,KAChDJ,GAAWA,EAAOb,QAAUQ,EAAOR,OAEnCa,IAELA,EAAOlB,UAAWD,IAAYmB,EAAOlB,SACrCC,EAAUe,QAAQO,cACd,IAAIC,MAAM,SAAU,CAAEC,SAAS,OAGvC,CAACxB,EAAWF,IAGhB2B,OAAAA,EAAAA,UAAU,KACN,IAAKtB,IAAUK,EAASO,UAAYT,EAASS,QAAS,OACtD,MAAMW,EAAelB,EAASO,QACxBY,EAAerB,EAASS,QACxBa,EAAW,IAAIC,eAAe,KAChCF,EAAaG,MAAMC,YACf,eACA,GAAGL,EAAaM,oBAGxB,OAAAJ,EAASK,QAAQP,GACV,IAAME,EAASM,cACvB,CAAC/B,IAGAgC,EAAAA,KAAC,SAAA,CACGvC,IAAAA,EAEAwC,KAAK,SACLC,KAAK,SACLxC,UAAWyC,EAAAA,KAAK,aAAczC,GAC9BO,MAAAA,EACA,gBAAeN,QAAY,EAC3B,gBAAeC,KACXM,EACJkC,QAAU5B,IACNN,EAAKkC,UAAU5B,GACfF,EAAkBE,IAGtB6B,SAAA,CAAAL,EAAAA,KAACM,EAAAA,KAAA,CACGC,GAAG,OACHC,UAAU,SACVC,IAAI,IACJ/C,UAAU,oBACVD,IAAKY,EAELgC,SAAA,CAAAK,MAACC,EAAAA,KAAA,CAAKC,OAAK,EAACL,GAAG,OACVF,SAAAvC,IAEJC,GACG2C,EAAAA,IAACC,EAAAA,KAAA,CAAKC,OAAK,EAACC,SAAO,EAACN,GAAG,OAAOO,KAAK,KAC9BT,SAAAtC,OAIZC,GACG0C,EAAAA,IAAC,OAAA,CAAKhD,UAAU,oBAAoBD,IAAKU,EACpCkC,SAAArC,MAKrB"}

package/build/cjs/components/select/Option.d.cts ADDED Viewed

@@ -0,0 +1,12 @@
+import { ComponentPropsWithoutRef, RefObject } from 'react';
+import { ValuePair } from '../../utilities/valuePair.cjs';
+export type OptionProps = Omit<ComponentPropsWithoutRef<"button">, "aria-selected" | "children" | "role" | "type" | "value"> & ValuePair & {
+    multiple?: boolean;
+    selected?: boolean;
+    selectRef: RefObject<HTMLSelectElement>;
+};
+export declare const Option: import('react').ForwardRefExoticComponent<Omit<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children" | "role" | "aria-selected" | "type" | "value"> & ValuePair & {
+    multiple?: boolean;
+    selected?: boolean;
+    selectRef: RefObject<HTMLSelectElement>;
+} & import('react').RefAttributes<HTMLButtonElement>>;