npm - @fremtind/jokul - Versions diffs - 0.64.2 → 0.66.0 - Mend

@fremtind/jokul 0.64.2 → 0.66.0

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 (738) hide show

package/build/es/components/summary-table/stories/summary-table.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"summary-table.stories.js","sources":["../../../../../src/components/summary-table/stories/summary-table.stories.tsx"],"sourcesContent":["import { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { SummaryTable as SummaryTableComponent } from \"../SummaryTable.js\";\nimport { SummaryTableRow } from \"../SummaryTableRow.js\";\nimport \"../styles/_index.scss\";\n\nconst meta = {\n title: \"Komponenter/SummaryTable\",\n component: SummaryTableComponent,\n parameters: {\n layout: \"padded\",\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof SummaryTableComponent>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nconst SOFT_HYPHEN = \"\\u00AD\";\n\nexport const SummaryTable: Story = {\n args: {\n caption: \"Example\",\n header: [\"Product\", \"Price\"],\n body: (\n <>\n <SummaryTableRow\n header={`Uføre${SOFT_HYPHEN}pensjon`}\n content=\"340,00 kr/mnd\"\n />\n <SummaryTableRow\n className=\"summary-table-example__custom-row\"\n header={`Livs${SOFT_HYPHEN}forsikring`}\n content=\"Tatt ut av tilbudet\"\n />\n <SummaryTableRow\n header={`Innbo${SOFT_HYPHEN}forsikring`}\n content=\"122,00 kr/mnd\"\n />\n <SummaryTableRow\n header={`Reise${SOFT_HYPHEN}forsikring`}\n content=\"249,00 kr/mnd\"\n />\n <SummaryTableRow\n className=\"summary-table-example__custom-row\"\n header=\"Rabatt\"\n content=\"- 17,50 kr/mnd\"\n />\n </>\n ),\n footer: (\n <>\n <SummaryTableRow header=\"Total sum\" content=\"693,50 kr/mnd\" />\n <SummaryTableRow\n header={\n <span className=\"jkl-sr-only\">Total sum per år</span>\n }\n content=\"8322,50 kr/mnd\"\n />\n </>\n ),\n },\n};\n"],"names":["meta","title","component","SummaryTableComponent","parameters","layout","tags","SOFT_HYPHEN","SummaryTable","args","caption","header","body","jsxs","Fragment","children","jsx","SummaryTableRow","content","className","footer"],"mappings":"0KAMA,MAAMA,EAAO,CACTC,MAAO,2BACPC,UAAWC,EACXC,WAAY,CACRC,OAAQ,UAEZC,KAAM,CAAC,aAMLC,EAAc,IAEPC,EAAsB,CAC/BC,KAAM,CACFC,QAAS,UACTC,OAAQ,CAAC,UAAW,SACpBC,KAEQC,EAAAC,EAAA,CAAAC,SAAA,CAAAC,EAACC,EAAA,CACGN,OAAQ,QAAQJ,WAChBW,QAAQ,kBAEZF,EAACC,EAAA,CACGE,UAAU,oCACVR,OAAQ,OAAOJ,cACfW,QAAQ,wBAEZF,EAACC,EAAA,CACGN,OAAQ,QAAQJ,cAChBW,QAAQ,kBAEZF,EAACC,EAAA,CACGN,OAAQ,QAAQJ,cAChBW,QAAQ,kBAEZF,EAACC,EAAA,CACGE,UAAU,oCACVR,OAAO,SACPO,QAAQ,sBAIpBE,OAEQP,EAAAC,EAAA,CAAAC,SAAA,CAAAC,EAACC,EAAgB,CAAAN,OAAO,YAAYO,QAAQ,kBAC5CF,EAACC,EAAA,CACGN,OACIK,EAAC,OAAK,CAAAG,UAAU,cAAcJ,SAAgB,qBAElDG,QAAQ"}
1	+ {"version":3,"file":"summary-table.stories.js","sources":["../../../../../src/components/summary-table/stories/summary-table.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { SummaryTable as SummaryTableComponent } from \"../SummaryTable.js\";\nimport { SummaryTableRow } from \"../SummaryTableRow.js\";\nimport \"../styles/_index.scss\";\n\nconst meta = {\n title: \"Komponenter/SummaryTable\",\n component: SummaryTableComponent,\n parameters: {\n layout: \"padded\",\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof SummaryTableComponent>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nconst SOFT_HYPHEN = \"\\u00AD\";\n\nexport const SummaryTable: Story = {\n args: {\n caption: \"Example\",\n header: [\"Product\", \"Price\"],\n body: (\n <>\n <SummaryTableRow\n header={`Uføre${SOFT_HYPHEN}pensjon`}\n content=\"340,00 kr/mnd\"\n />\n <SummaryTableRow\n className=\"summary-table-example__custom-row\"\n header={`Livs${SOFT_HYPHEN}forsikring`}\n content=\"Tatt ut av tilbudet\"\n />\n <SummaryTableRow\n header={`Innbo${SOFT_HYPHEN}forsikring`}\n content=\"122,00 kr/mnd\"\n />\n <SummaryTableRow\n header={`Reise${SOFT_HYPHEN}forsikring`}\n content=\"249,00 kr/mnd\"\n />\n <SummaryTableRow\n className=\"summary-table-example__custom-row\"\n header=\"Rabatt\"\n content=\"- 17,50 kr/mnd\"\n />\n </>\n ),\n footer: (\n <>\n <SummaryTableRow header=\"Total sum\" content=\"693,50 kr/mnd\" />\n <SummaryTableRow\n header={\n <span className=\"jkl-sr-only\">Total sum per år</span>\n }\n content=\"8322,50 kr/mnd\"\n />\n </>\n ),\n },\n};\n"],"names":["meta","title","component","SummaryTableComponent","parameters","layout","tags","SOFT_HYPHEN","SummaryTable","args","caption","header","body","jsxs","Fragment","children","jsx","SummaryTableRow","content","className","footer"],"mappings":"0KAMA,MAAMA,EAAO,CACTC,MAAO,2BACPC,UAAWC,EACXC,WAAY,CACRC,OAAQ,UAEZC,KAAM,CAAC,aAMLC,EAAc,IAEPC,EAAsB,CAC/BC,KAAM,CACFC,QAAS,UACTC,OAAQ,CAAC,UAAW,SACpBC,KAEQC,EAAAC,EAAA,CAAAC,SAAA,CAAAC,EAACC,EAAA,CACGN,OAAQ,QAAQJ,WAChBW,QAAQ,kBAEZF,EAACC,EAAA,CACGE,UAAU,oCACVR,OAAQ,OAAOJ,cACfW,QAAQ,wBAEZF,EAACC,EAAA,CACGN,OAAQ,QAAQJ,cAChBW,QAAQ,kBAEZF,EAACC,EAAA,CACGN,OAAQ,QAAQJ,cAChBW,QAAQ,kBAEZF,EAACC,EAAA,CACGE,UAAU,oCACVR,OAAO,SACPO,QAAQ,sBAIpBE,OAEQP,EAAAC,EAAA,CAAAC,SAAA,CAAAC,EAACC,EAAgB,CAAAN,OAAO,YAAYO,QAAQ,kBAC5CF,EAACC,EAAA,CACGN,OACIK,EAAC,OAAK,CAAAG,UAAU,cAAcJ,SAAgB,qBAElDG,QAAQ"}

package/build/es/components/system-message/SystemMessage.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as s,jsxs as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import{useId as t}from"../../hooks/useId/useId.js";import{DismissButton as m}from"../message/DismissButton.js";import{MessageIcon as i}from"./common/MessageIcon.js";function n(n){return({id:o,className:r,density:d,maxContentWidth:l,paddingLeft:c,role:g="status",dismissed:y,dismissAction:u,children:j,...p})=>{const f=t(o||"jkl-system-message",{generateSuffix:!o});return s("div",{role:g,...p,id:f,className:a("jkl-system-message","jkl-system-message--"+n,r,{"jkl-system-message--dismissed":y}),"data-density":d,children:e("div",{className:"jkl-system-message__content","data-testid":"system-message-content","data-theme":"light",style:{maxWidth:l,paddingLeft:c},children:[s(i,{messageType:n}),s("span",{className:"jkl-system-message__message",children:j}),(null==u?void 0:u.handleDismiss)&&s(m,{"data-theme":"light","aria-controls":f,className:"jkl-system-message__dismiss-button",label:u.buttonTitle||"Lukk",onClick:u.handleDismiss})]})})}}const o=n("info");o.displayName="InfoSystemMessage";const r=n("error");r.displayName="ErrorSystemMessage";const d=n("warning");d.displayName="WarningSystemMessage";const l=n("success");l.displayName="SuccessSystemMessage";export{r as ErrorSystemMessage,o as InfoSystemMessage,l as SuccessSystemMessage,d as WarningSystemMessage};
+import{jsx as s,jsxs as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import{useId as t}from"../../hooks/useId/useId.js";import{DismissButton as m}from"../message/DismissButton.js";import{MessageIcon as i}from"./common/MessageIcon.js";function n(n){return({id:o,className:r,density:d,maxContentWidth:l,paddingLeft:c,role:g="status",dismissed:y,dismissAction:u,children:j,...p})=>{const f=t(o||"jkl-system-message",{generateSuffix:!o});return s("div",{role:g,...p,id:f,className:a("jkl-system-message",`jkl-system-message--${n}`,r,{"jkl-system-message--dismissed":y}),"data-density":d,children:e("div",{className:"jkl-system-message__content","data-testid":"system-message-content","data-theme":"light",style:{maxWidth:l,paddingLeft:c},children:[s(i,{messageType:n}),s("span",{className:"jkl-system-message__message",children:j}),(null==u?void 0:u.handleDismiss)&&s(m,{"data-theme":"light","aria-controls":f,className:"jkl-system-message__dismiss-button",label:u.buttonTitle||"Lukk",onClick:u.handleDismiss})]})})}}const o=n("info");o.displayName="InfoSystemMessage";const r=n("error");r.displayName="ErrorSystemMessage";const d=n("warning");d.displayName="WarningSystemMessage";const l=n("success");l.displayName="SuccessSystemMessage";export{r as ErrorSystemMessage,o as InfoSystemMessage,l as SuccessSystemMessage,d as WarningSystemMessage};
 //# sourceMappingURL=SystemMessage.js.map

package/build/es/components/system-message/SystemMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SystemMessage.js","sources":["../../../../src/components/system-message/SystemMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { DismissButton } from \"../message/DismissButton.js\";\nimport { MessageIcon } from \"./common/MessageIcon.js\";\nimport { SystemMessageProps } from \"./types.js\";\n\ntype messageTypes = \"info\" \| \"error\" \| \"success\" \| \"warning\";\n\nfunction systemFactory(\n messageType: messageTypes,\n): React.FC<SystemMessageProps> {\n const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n density,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n dismissAction,\n children,\n ...rest\n }) => {\n const systemId = useId(id \|\| \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n \"jkl-system-message~~--\" +~~ messageType,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n data-density={density}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n data-theme=\"light\"\n style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon messageType={messageType} />\n <span className=\"jkl-system-message__message\">\n {children}\n </span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n data-theme=\"light\"\n aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle \|\| \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n };\n return SystemMessage;\n}\n\nexport const InfoSystemMessage = systemFactory(\"info\");\nInfoSystemMessage.displayName = \"InfoSystemMessage\";\nexport const ErrorSystemMessage = systemFactory(\"error\");\nErrorSystemMessage.displayName = \"ErrorSystemMessage\";\nexport const WarningSystemMessage = systemFactory(\"warning\");\nWarningSystemMessage.displayName = \"WarningSystemMessage\";\nexport const SuccessSystemMessage = systemFactory(\"success\");\nSuccessSystemMessage.displayName = \"SuccessSystemMessage\";\n"],"names":["systemFactory","messageType","id","className","density","maxContentWidth","paddingLeft","role","dismissed","dismissAction","children","rest","systemId","useId","generateSuffix","jsx","clsx","jsxs","style","maxWidth","MessageIcon","handleDismiss","DismissButton","label","buttonTitle","onClick","InfoSystemMessage","displayName","ErrorSystemMessage","WarningSystemMessage","SuccessSystemMessage"],"mappings":"qQASA,SAASA,EACLC,GA2DO,MAzD6C,EAChDC,GAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAC,cAAAA,EACAC,SAAAA,KACGC,MAEGC,MAAAA,EAAWC,EAAMX,GAAM,qBAAsB,CAC/CY,gBAAiBZ,IAIjB,OAAAa,EAAC,MAAA,CACGR,KAAAA,KACII,EACJT,GAAIU,EACJT,UAAWa,EACP,qBACA,~~uBAAyBf~~,~~EACzBE~~,EACA,CACI,gCAAiCK,IAGzC,eAAcJ,EAEdM,SAAAO,EAAC,MAAA,CACGd,UAAU,8BACV,cAAY,yBACZ,aAAW,QACXe,MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,EAACK,GAAYnB,YAAAA,IACZc,EAAA,OAAA,CAAKZ,UAAU,8BACXO,SAAAA,KAEJ,MAAAD,OAAA,EAAAA,EAAeY,gBACZN,EAACO,EAAA,CACG,aAAW,QACX,gBAAeV,EACfT,UAAU,qCACVoB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,oBAGnC,CAKhB,CAEa,MAAAK,EAAoB1B,EAAc,QAC/C0B,EAAkBC,YAAc,oBACnB,MAAAC,EAAqB5B,EAAc,SAChD4B,EAAmBD,YAAc,qBACpB,MAAAE,EAAuB7B,EAAc,WAClD6B,EAAqBF,YAAc,uBACtB,MAAAG,EAAuB9B,EAAc,WAClD8B,EAAqBH,YAAc"}
1	+ {"version":3,"file":"SystemMessage.js","sources":["../../../../src/components/system-message/SystemMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { DismissButton } from \"../message/DismissButton.js\";\nimport { MessageIcon } from \"./common/MessageIcon.js\";\nimport type { SystemMessageProps } from \"./types.js\";\n\ntype messageTypes = \"info\" \| \"error\" \| \"success\" \| \"warning\";\n\nfunction systemFactory(\n messageType: messageTypes,\n): React.FC<SystemMessageProps> {\n const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n density,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n dismissAction,\n children,\n ...rest\n }) => {\n const systemId = useId(id \|\| \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${messageType}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n data-density={density}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n data-theme=\"light\"\n style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon messageType={messageType} />\n <span className=\"jkl-system-message__message\">\n {children}\n </span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n data-theme=\"light\"\n aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle \|\| \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n };\n return SystemMessage;\n}\n\nexport const InfoSystemMessage = systemFactory(\"info\");\nInfoSystemMessage.displayName = \"InfoSystemMessage\";\nexport const ErrorSystemMessage = systemFactory(\"error\");\nErrorSystemMessage.displayName = \"ErrorSystemMessage\";\nexport const WarningSystemMessage = systemFactory(\"warning\");\nWarningSystemMessage.displayName = \"WarningSystemMessage\";\nexport const SuccessSystemMessage = systemFactory(\"success\");\nSuccessSystemMessage.displayName = \"SuccessSystemMessage\";\n"],"names":["systemFactory","messageType","id","className","density","maxContentWidth","paddingLeft","role","dismissed","dismissAction","children","rest","systemId","useId","generateSuffix","jsx","clsx","jsxs","style","maxWidth","MessageIcon","handleDismiss","DismissButton","label","buttonTitle","onClick","InfoSystemMessage","displayName","ErrorSystemMessage","WarningSystemMessage","SuccessSystemMessage"],"mappings":"qQASA,SAASA,EACLC,GA2DO,MAzD6C,EAChDC,GAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAC,cAAAA,EACAC,SAAAA,KACGC,MAEGC,MAAAA,EAAWC,EAAMX,GAAM,qBAAsB,CAC/CY,gBAAiBZ,IAIjB,OAAAa,EAAC,MAAA,CACGR,KAAAA,KACII,EACJT,GAAIU,EACJT,UAAWa,EACP,qBACA,uBAAuBf,IACvBE,EACA,CACI,gCAAiCK,IAGzC,eAAcJ,EAEdM,SAAAO,EAAC,MAAA,CACGd,UAAU,8BACV,cAAY,yBACZ,aAAW,QACXe,MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,EAACK,GAAYnB,YAAAA,IACZc,EAAA,OAAA,CAAKZ,UAAU,8BACXO,SAAAA,KAEJ,MAAAD,OAAA,EAAAA,EAAeY,gBACZN,EAACO,EAAA,CACG,aAAW,QACX,gBAAeV,EACfT,UAAU,qCACVoB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,oBAGnC,CAKhB,CAEa,MAAAK,EAAoB1B,EAAc,QAC/C0B,EAAkBC,YAAc,oBACnB,MAAAC,EAAqB5B,EAAc,SAChD4B,EAAmBD,YAAc,qBACpB,MAAAE,EAAuB7B,EAAc,WAClD6B,EAAqBF,YAAc,uBACtB,MAAAG,EAAuB9B,EAAc,WAClD8B,EAAqBH,YAAc"}

package/build/es/components/system-message/common/DismissButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DismissButton.js","sources":["../../../../../src/components/system-message/common/DismissButton.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, forwardRef } from \"react\";\nimport { CloseIcon } from \"../../icon/icons/CloseIcon.js\";\n\nexport interface DismissButtonProps\n extends Exclude<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n label?: string;\n}\n\nexport const DismissButton = forwardRef<HTMLButtonElement, DismissButtonProps>(\n ({ label = \"Lukk\", ...rest }, ref) => {\n return (\n <button ref={ref} type=\"button\" title={label} {...rest}>\n <CloseIcon variant=\"small\" bold />\n <span className=\"jkl-sr-only\">{label}</span>\n </button>\n );\n },\n);\n\nDismissButton.displayName = \"DismissButton\";\n"],"names":["DismissButton","forwardRef","label","rest","ref","jsxs","type","title","children","jsx","CloseIcon","variant","bold","className","displayName"],"mappings":"+IAQO,MAAMA,EAAgBC,GACzB,EAAGC,MAAAA,EAAQ,UAAWC,GAAQC,IAEtBC,EAAC,UAAOD,IAAAA,EAAUE,KAAK,SAASC,MAAOL,KAAWC,EAC9CK,SAAA,CAAAC,EAACC,EAAU,CAAAC,QAAQ,QAAQC,MAAI,IAC9BH,EAAA,OAAA,CAAKI,UAAU,cAAeL,SAAMN,SAMrDF,EAAcc,YAAc"}
1	+ {"version":3,"file":"DismissButton.js","sources":["../../../../../src/components/system-message/common/DismissButton.tsx"],"sourcesContent":["import React, { type ButtonHTMLAttributes, forwardRef } from \"react\";\nimport { CloseIcon } from \"../../icon/icons/CloseIcon.js\";\n\nexport interface DismissButtonProps\n extends Exclude<ButtonHTMLAttributes<HTMLButtonElement>, \"disabled\"> {\n label?: string;\n}\n\nexport const DismissButton = forwardRef<HTMLButtonElement, DismissButtonProps>(\n ({ label = \"Lukk\", ...rest }, ref) => {\n return (\n <button ref={ref} type=\"button\" title={label} {...rest}>\n <CloseIcon variant=\"small\" bold />\n <span className=\"jkl-sr-only\">{label}</span>\n </button>\n );\n },\n);\n\nDismissButton.displayName = \"DismissButton\";\n"],"names":["DismissButton","forwardRef","label","rest","ref","jsxs","type","title","children","jsx","CloseIcon","variant","bold","className","displayName"],"mappings":"+IAQO,MAAMA,EAAgBC,GACzB,EAAGC,MAAAA,EAAQ,UAAWC,GAAQC,IAEtBC,EAAC,UAAOD,IAAAA,EAAUE,KAAK,SAASC,MAAOL,KAAWC,EAC9CK,SAAA,CAAAC,EAACC,EAAU,CAAAC,QAAQ,QAAQC,MAAI,IAC9BH,EAAA,OAAA,CAAKI,UAAU,cAAeL,SAAMN,SAMrDF,EAAcc,YAAc"}

package/build/es/components/system-message/common/MessageIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"MessageIcon.js","sources":["../../../../../src/components/system-message/common/MessageIcon.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { ErrorIcon } from \"../../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../../icon/icons/WarningIcon.js\";\n\ntype MessageTypes = \"info\" \| \"error\" \| \"success\" \| \"warning\";\n\ntype Props = {\n messageType: MessageTypes;\n};\n\nexport const MessageIcon: FC<Props> = ({ messageType }) => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-system-message__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-system-message__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-system-message__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-system-message__icon\" />;\n\n default:\n return null;\n }\n};\n"],"names":["MessageIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon"],"mappings":"sRAYO,MAAMA,EAAyB,EAAGC,YAAAA,MACrC,OAAQA,GACJ,IAAK,QACM,OAAAC,EAACC,EAAU,CAAAC,UAAU,6BAChC,IAAK,OACM,OAAAF,EAACG,EAAS,CAAAD,UAAU,6BAC/B,IAAK,UACM,OAAAF,EAACI,EAAY,CAAAF,UAAU,6BAClC,IAAK,UACM,OAAAF,EAACK,EAAY,CAAAH,UAAU,6BAElC,QACW,OAAA,KACf"}
1	+ {"version":3,"file":"MessageIcon.js","sources":["../../../../../src/components/system-message/common/MessageIcon.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport { ErrorIcon } from \"../../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../../icon/icons/WarningIcon.js\";\n\ntype MessageTypes = \"info\" \| \"error\" \| \"success\" \| \"warning\";\n\ntype Props = {\n messageType: MessageTypes;\n};\n\nexport const MessageIcon: FC<Props> = ({ messageType }) => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-system-message__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-system-message__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-system-message__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-system-message__icon\" />;\n\n default:\n return null;\n }\n};\n"],"names":["MessageIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon"],"mappings":"sRAYO,MAAMA,EAAyB,EAAGC,YAAAA,MACrC,OAAQA,GACJ,IAAK,QACM,OAAAC,EAACC,EAAU,CAAAC,UAAU,6BAChC,IAAK,OACM,OAAAF,EAACG,EAAS,CAAAD,UAAU,6BAC/B,IAAK,UACM,OAAAF,EAACI,EAAY,CAAAF,UAAU,6BAClC,IAAK,UACM,OAAAF,EAACK,EAAY,CAAAH,UAAU,6BAElC,QACW,OAAA,KACf"}

package/build/es/components/table/DataTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DataTable.js","sources":["../../../../src/components/table/DataTable.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { Table } from \"./Table.js\";\nimport { TableBody } from \"./TableBody.js\";\nimport { TableCaption } from \"./TableCaption.js\";\nimport { TableCell } from \"./TableCell.js\";\nimport { TableHead } from \"./TableHead.js\";\nimport { TableHeader } from \"./TableHeader.js\";\nimport { TableRow } from \"./TableRow.js\";\nimport { DataTableProps } from \"./types.js\";\n\nconst DataTable = forwardRef<HTMLTableElement, DataTableProps>(\n (\n { caption, columns, emptyTableText, rows, verticalAlign, ...rest },\n ref,\n ) => {\n return (\n <Table\n caption={<TableCaption srOnly>{caption}</TableCaption>}\n fullWidth={true}\n {...rest}\n ref={ref}\n >\n <TableHead>\n <TableRow>\n {columns.map((column, index) => (\n <TableHeader key={index} density=\"compact\" bold>\n {column}\n </TableHeader>\n ))}\n </TableRow>\n </TableHead>\n <TableBody>\n {rows.length === 0 && emptyTableText && (\n <TableRow>\n <TableCell colSpan={columns.length}>\n {emptyTableText}\n </TableCell>\n </TableRow>\n )}\n {rows.map((row, rowIndex) => (\n <TableRow key={rowIndex}>\n {row.map((cell, cellIndex) => (\n <TableCell\n key={cellIndex}\n data-th={columns[cellIndex]}\n verticalAlign={verticalAlign}\n >\n {cell}\n </TableCell>\n ))}\n </TableRow>\n ))}\n </TableBody>\n </Table>\n );\n },\n);\n\nDataTable.displayName = \"DataTable\";\n\nexport { DataTable };\n"],"names":["DataTable","forwardRef","caption","columns","emptyTableText","rows","verticalAlign","rest","ref","jsxs","Table","jsx","TableCaption","srOnly","children","fullWidth","TableHead","TableRow","map","column","index","TableHeader","density","bold","TableBody","length","TableCell","colSpan","row","rowIndex","cell","cellIndex","displayName"],"mappings":"kYAUA,MAAMA,EAAYC,GACd,EACMC,QAAAA,EAASC,QAAAA,EAASC,eAAAA,EAAgBC,KAAAA,EAAMC,cAAAA,KAAkBC,GAC5DC,IAGIC,EAACC,EAAA,CACGR,QAASS,EAACC,EAAa,CAAAC,QAAM,EAAEC,SAAQZ,IACvCa,WAAW,KACPR,EACJC,IAAAA,EAEAM,SAAA,CAAAH,EAACK,GACGF,SAACH,EAAAM,EAAA,CACIH,WAAQI,KAAI,CAACC,EAAQC,IAClBT,EAACU,EAAwB,CAAAC,QAAQ,UAAUC,MAAI,EAC1CT,YADaM,WAM7BI,EACI,CAAAV,SAAA,CAAgB,IAAXT,EAAAoB,QAAgBrB,GACjBO,EAAAM,EAAA,CACGH,SAACH,EAAAe,EAAA,CAAUC,QAASxB,EAAQsB,OACvBX,SAAAV,MAIZC,EAAKa,KAAI,CAACU,EAAKC,IACXlB,EAAAM,EAAA,CACIH,SAAIc,EAAAV,KAAI,CAACY,EAAMC,IACZpB,EAACe,EAAA,CAEG,UAASvB,EAAQ4B,GACjBzB,cAAAA,EAECQ,SAAAgB,GAJIC,MAHFF,aAkBvC7B,EAAUgC,YAAc"}
1	+ {"version":3,"file":"DataTable.js","sources":["../../../../src/components/table/DataTable.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { Table } from \"./Table.js\";\nimport { TableBody } from \"./TableBody.js\";\nimport { TableCaption } from \"./TableCaption.js\";\nimport { TableCell } from \"./TableCell.js\";\nimport { TableHead } from \"./TableHead.js\";\nimport { TableHeader } from \"./TableHeader.js\";\nimport { TableRow } from \"./TableRow.js\";\nimport type { DataTableProps } from \"./types.js\";\n\nconst DataTable = forwardRef<HTMLTableElement, DataTableProps>(\n (\n { caption, columns, emptyTableText, rows, verticalAlign, ...rest },\n ref,\n ) => {\n return (\n <Table\n caption={<TableCaption srOnly>{caption}</TableCaption>}\n fullWidth={true}\n {...rest}\n ref={ref}\n >\n <TableHead>\n <TableRow>\n {columns.map((column, index) => (\n <TableHeader key={index} density=\"compact\" bold>\n {column}\n </TableHeader>\n ))}\n </TableRow>\n </TableHead>\n <TableBody>\n {rows.length === 0 && emptyTableText && (\n <TableRow>\n <TableCell colSpan={columns.length}>\n {emptyTableText}\n </TableCell>\n </TableRow>\n )}\n {rows.map((row, rowIndex) => (\n <TableRow key={rowIndex}>\n {row.map((cell, cellIndex) => (\n <TableCell\n key={cellIndex}\n data-th={columns[cellIndex]}\n verticalAlign={verticalAlign}\n >\n {cell}\n </TableCell>\n ))}\n </TableRow>\n ))}\n </TableBody>\n </Table>\n );\n },\n);\n\nDataTable.displayName = \"DataTable\";\n\nexport { DataTable };\n"],"names":["DataTable","forwardRef","caption","columns","emptyTableText","rows","verticalAlign","rest","ref","jsxs","Table","jsx","TableCaption","srOnly","children","fullWidth","TableHead","TableRow","map","column","index","TableHeader","density","bold","TableBody","length","TableCell","colSpan","row","rowIndex","cell","cellIndex","displayName"],"mappings":"kYAUA,MAAMA,EAAYC,GACd,EACMC,QAAAA,EAASC,QAAAA,EAASC,eAAAA,EAAgBC,KAAAA,EAAMC,cAAAA,KAAkBC,GAC5DC,IAGIC,EAACC,EAAA,CACGR,QAASS,EAACC,EAAa,CAAAC,QAAM,EAAEC,SAAQZ,IACvCa,WAAW,KACPR,EACJC,IAAAA,EAEAM,SAAA,CAAAH,EAACK,GACGF,SAACH,EAAAM,EAAA,CACIH,WAAQI,KAAI,CAACC,EAAQC,IAClBT,EAACU,EAAwB,CAAAC,QAAQ,UAAUC,MAAI,EAC1CT,YADaM,WAM7BI,EACI,CAAAV,SAAA,CAAgB,IAAXT,EAAAoB,QAAgBrB,GACjBO,EAAAM,EAAA,CACGH,SAACH,EAAAe,EAAA,CAAUC,QAASxB,EAAQsB,OACvBX,SAAAV,MAIZC,EAAKa,KAAI,CAACU,EAAKC,IACXlB,EAAAM,EAAA,CACIH,SAAIc,EAAAV,KAAI,CAACY,EAAMC,IACZpB,EAACe,EAAA,CAEG,UAASvB,EAAQ4B,GACjBzB,cAAAA,EAECQ,SAAAgB,GAJIC,MAHFF,aAkBvC7B,EAAUgC,YAAc"}

package/build/es/components/table/ExpandableTableRow.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,Fragment as a,jsx as l}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import r,{forwardRef as n,useState as s,useEffect as d}from"react";import{useAnimatedHeight as t}from"../../hooks/useAnimatedHeight/useAnimatedHeight.js";import{useId as i}from"../../hooks/useId/useId.js";import{ExpandableTableRowController as p}from"./ExpandableTableRowController.js";import{TableRow as c}from"./TableRow.js";const b=n(((n,b)=>{const{className:m,clickable:x,children:w,expandedChildren:h,onToggle:j,colSpan:f=100,isOpen:k,...u}=n,[g,E]=s(k??!1);d((()=>{typeof k>"u"||E(k)}),[k]);const[R]=t(g,{timing:"expressive"}),T=()=>{const e=!g;j&&j(e),E(e)},C=o("jkl-table-row--expandable",m,{"jkl-table-row--expanded":g,"jkl-expandable-table-row--clickable-external":x}),y=o("jkl-expandable-table-row__expanded-row",{"jkl-expandable-table-row__expanded-row--expanded":g}),N=i("jkl-expandable-table-row"),_=i("jkl-expandable-table-row-controller");return e(a,{children:[l(c,{className:C,clickable:x??{onClick:()=>T()},...u,ref:b,children:r.Children.map(w,(e=>r.isValidElement(e)&&e.type==p?r.cloneElement(e,{isOpen:g,onClick:()=>T(),"aria-controls":N,id:_}):e))}),l("tr",{"aria-hidden":!g,children:l("td",{colSpan:f,children:l("div",{ref:R,className:y,id:N,"aria-labelledby":_,hidden:!g,role:"group",children:h})})})]})}));b.displayName="ExpandableTableRow";export{b as ExpandableTableRow};
+import{jsxs as e,Fragment as a,jsx as l}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import r,{forwardRef as n,useState as s,useEffect as d}from"react";import{useAnimatedHeight as t}from"../../hooks/useAnimatedHeight/useAnimatedHeight.js";import{useId as i}from"../../hooks/useId/useId.js";import{ExpandableTableRowController as p}from"./ExpandableTableRowController.js";import{TableRow as c}from"./TableRow.js";const b=n(((n,b)=>{const{className:m,clickable:x,children:w,expandedChildren:f,onToggle:h,colSpan:j=100,isOpen:k,...u}=n,[g,E]=s(k??!1);d((()=>{typeof k>"u"||E(k)}),[k]);const[R]=t(g,{timing:"expressive"}),T=()=>{const e=!g;h&&h(e),E(e)},C=o("jkl-table-row--expandable",m,{"jkl-table-row--expanded":g,"jkl-expandable-table-row--clickable-external":x}),y=o("jkl-expandable-table-row__expanded-row",{"jkl-expandable-table-row__expanded-row--expanded":g}),N=i("jkl-expandable-table-row"),_=i("jkl-expandable-table-row-controller");return e(a,{children:[l(c,{className:C,clickable:x??{onClick:()=>T()},...u,ref:b,children:r.Children.map(w,(e=>r.isValidElement(e)&&e.type===p?r.cloneElement(e,{isOpen:g,onClick:()=>T(),"aria-controls":N,id:_}):e))}),l("tr",{"aria-hidden":!g,children:l("td",{colSpan:j,children:l("fieldset",{ref:R,className:y,id:N,"aria-labelledby":_,hidden:!g,children:f})})})]})}));b.displayName="ExpandableTableRow";export{b as ExpandableTableRow};
 //# sourceMappingURL=ExpandableTableRow.js.map

package/build/es/components/table/ExpandableTableRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandableTableRow.js","sources":["../../../../src/components/table/ExpandableTableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ExpandableTableRowController } from \"./ExpandableTableRowController.js\";\nimport { TableRow } from \"./TableRow.js\";\nimport {\n ExpandableTableRowControllerProps,\n ExpandableTableRowProps,\n} from \"./types.js\";\n\nconst ExpandableTableRow = forwardRef<\n HTMLTableRowElement,\n ExpandableTableRowProps\n>((props, ref) => {\n const {\n className,\n clickable,\n children,\n expandedChildren,\n onToggle,\n colSpan = 100,\n isOpen: isOpenProp,\n ...rest\n } = props;\n\n const [isOpen, setIsOpen] = useState(isOpenProp ?? false);\n useEffect(() => {\n if (typeof isOpenProp === \"undefined\") {\n return;\n }\n setIsOpen(isOpenProp);\n }, [isOpenProp]);\n\n const [animationRef] = useAnimatedHeight<~~HTMLDivElement~~>(isOpen, {\n timing: \"expressive\",\n });\n\n const toggleOpen = () => {\n const newIsOpen = !isOpen;\n\n if (onToggle) {\n onToggle(newIsOpen);\n }\n\n setIsOpen(newIsOpen);\n };\n\n const tableRowClassName = clsx(\"jkl-table-row--expandable\", className, {\n [\"jkl-table-row--expanded\"]: isOpen,\n [\"jkl-expandable-table-row--clickable-external\"]: clickable,\n });\n const childWrapperClassName = clsx(\n \"jkl-expandable-table-row__expanded-row\",\n {\n [\"jkl-expandable-table-row__expanded-row--expanded\"]: isOpen,\n },\n );\n\n const tableRowId = useId(\"jkl-expandable-table-row\");\n const expandableTableRowControllerId = useId(\n \"jkl-expandable-table-row-controller\",\n );\n\n return (\n <>\n <TableRow\n className={tableRowClassName}\n clickable={\n clickable ?? {\n onClick: () => toggleOpen(),\n }\n }\n {...rest}\n ref={ref}\n >\n {React.Children.map(children, (child) => {\n if (\n React.isValidElement<ExpandableTableRowControllerProps>(\n child,\n ) &&\n child.type == ExpandableTableRowController\n ) {\n return React.cloneElement<ExpandableTableRowControllerProps>(\n child,\n {\n isOpen,\n onClick: () => toggleOpen(),\n \"aria-controls\": tableRowId,\n id: expandableTableRowControllerId,\n },\n );\n } ~~else {~~\n return child;\n ~~}\n~~ })}\n </TableRow>\n {/\n Use a table row with a single as wide as possible cell to contain content. This allows\n using useAnimatedHeight to animate the row height.\n /}\n <tr aria-hidden={!isOpen}>\n <td colSpan={colSpan}>\n <~~div~~\n ref={animationRef}\n className={childWrapperClassName}\n id={tableRowId}\n aria-labelledby={expandableTableRowControllerId}\n hidden={!isOpen}\n ~~role=\"group\"\n~~ >\n {expandedChildren}\n </~~div~~>\n </td>\n </tr>\n </>\n );\n});\n\nExpandableTableRow.displayName = \"ExpandableTableRow\";\n\nexport { ExpandableTableRow };\n"],"names":["ExpandableTableRow","forwardRef","props","ref","className","clickable","children","expandedChildren","onToggle","colSpan","isOpen","isOpenProp","rest","setIsOpen","useState","useEffect","animationRef","useAnimatedHeight","timing","toggleOpen","newIsOpen","tableRowClassName","clsx","childWrapperClassName","tableRowId","useId","expandableTableRowControllerId","jsxs","Fragment","jsx","TableRow","onClick","React","Children","map","child","isValidElement","type","ExpandableTableRowController","cloneElement","id","hidden","~~role","~~displayName"],"mappings":"qbAWA,MAAMA,EAAqBC,GAGzB,CAACC,EAAOC,KACA,MACFC,UAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,iBAAAA,EACAC,SAAAA,EACAC,QAAAA,EAAU,IACVC,OAAQC,KACLC,GACHV,GAEGQ,EAAQG,GAAaC,EAASH,IAAc,GACnDI,GAAU,YACKJ,EAAe,KAG1BE,EAAUF,EAAU,GACrB,CAACA,IAEJ,MAAOK,GAAgBC,~~EAAkCP~~,EAAQ,~~CAC7DQ~~,OAAQ,eAGNC,EAAa,KACf,MAAMC,GAAaV,EAEfF,GACAA,EAASY,GAGbP,EAAUO,EAAS,EAGjBC,EAAoBC,EAAK,4BAA6BlB,EAAW,CAClE,0BAA4BM,EAC5B,+CAAiDL,IAEhDkB,EAAwBD,EAC1B,yCACA,CACK,mDAAqDZ,IAIxDc,EAAaC,EAAM,4BACnBC,EAAiCD,EACnC,uCAGJ,OAEQE,EAAAC,EAAA,CAAAtB,SAAA,CAAAuB,EAACC,EAAA,CACG1B,UAAWiB,EACXhB,UACIA,GAAa,CACT0B,QAAS,IAAMZ,QAGnBP,EACJT,IAAAA,EAECG,SAAM0B,EAAAC,SAASC,IAAI5B,GAAW6B,GAEvBH,EAAMI,eACFD,IAEJA,EAAME,~~MAAQC~~,~~EAEPN~~,EAAMO,aACTJ,EACA,CACIzB,OAAAA,EACAqB,QAAS,IAAMZ,IACf,gBAAiBK,EACjBgB,GAAId,~~IAILS~~,~~QAQlB~~,KAAG,CAAA,eAAczB,EACdJ,SAAAuB,EAAC,MAAGpB,QAAAA,EACAH,SAAAuB,EAAC,~~MAAA~~,CACG1B,IAAKa,EACLZ,UAAWmB,EACXiB,GAAIhB,EACJ,kBAAiBE,EACjBe,QAAS/B,~~EACTgC~~,~~KAAK,QAEJpC,~~SAAAC,UAIjB,IAIRP,~~EAAmB2C~~,YAAc"}
1	+ {"version":3,"file":"ExpandableTableRow.js","sources":["../../../../src/components/table/ExpandableTableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ExpandableTableRowController } from \"./ExpandableTableRowController.js\";\nimport { TableRow } from \"./TableRow.js\";\nimport type {\n ExpandableTableRowControllerProps,\n ExpandableTableRowProps,\n} from \"./types.js\";\n\nconst ExpandableTableRow = forwardRef<\n HTMLTableRowElement,\n ExpandableTableRowProps\n>((props, ref) => {\n const {\n className,\n clickable,\n children,\n expandedChildren,\n onToggle,\n colSpan = 100,\n isOpen: isOpenProp,\n ...rest\n } = props;\n\n const [isOpen, setIsOpen] = useState(isOpenProp ?? false);\n useEffect(() => {\n if (typeof isOpenProp === \"undefined\") {\n return;\n }\n setIsOpen(isOpenProp);\n }, [isOpenProp]);\n\n const [animationRef] = useAnimatedHeight<HTMLFieldSetElement>(isOpen, {\n timing: \"expressive\",\n });\n\n const toggleOpen = () => {\n const newIsOpen = !isOpen;\n\n if (onToggle) {\n onToggle(newIsOpen);\n }\n\n setIsOpen(newIsOpen);\n };\n\n const tableRowClassName = clsx(\"jkl-table-row--expandable\", className, {\n [\"jkl-table-row--expanded\"]: isOpen,\n [\"jkl-expandable-table-row--clickable-external\"]: clickable,\n });\n const childWrapperClassName = clsx(\n \"jkl-expandable-table-row__expanded-row\",\n {\n [\"jkl-expandable-table-row__expanded-row--expanded\"]: isOpen,\n },\n );\n\n const tableRowId = useId(\"jkl-expandable-table-row\");\n const expandableTableRowControllerId = useId(\n \"jkl-expandable-table-row-controller\",\n );\n\n return (\n <>\n <TableRow\n className={tableRowClassName}\n clickable={\n clickable ?? {\n onClick: () => toggleOpen(),\n }\n }\n {...rest}\n ref={ref}\n >\n {React.Children.map(children, (child) => {\n if (\n React.isValidElement<ExpandableTableRowControllerProps>(\n child,\n ) &&\n child.type === ExpandableTableRowController\n ) {\n return React.cloneElement<ExpandableTableRowControllerProps>(\n child,\n {\n isOpen,\n onClick: () => toggleOpen(),\n \"aria-controls\": tableRowId,\n id: expandableTableRowControllerId,\n },\n );\n }\n\n return child;\n })}\n </TableRow>\n {/\n Use a table row with a single as wide as possible cell to contain content. This allows\n using useAnimatedHeight to animate the row height.\n /}\n <tr aria-hidden={!isOpen}>\n <td colSpan={colSpan}>\n <fieldset\n ref={animationRef}\n className={childWrapperClassName}\n id={tableRowId}\n aria-labelledby={expandableTableRowControllerId}\n hidden={!isOpen}\n >\n {expandedChildren}\n </fieldset>\n </td>\n </tr>\n </>\n );\n});\n\nExpandableTableRow.displayName = \"ExpandableTableRow\";\n\nexport { ExpandableTableRow };\n"],"names":["ExpandableTableRow","forwardRef","props","ref","className","clickable","children","expandedChildren","onToggle","colSpan","isOpen","isOpenProp","rest","setIsOpen","useState","useEffect","animationRef","useAnimatedHeight","timing","toggleOpen","newIsOpen","tableRowClassName","clsx","childWrapperClassName","tableRowId","useId","expandableTableRowControllerId","jsxs","Fragment","jsx","TableRow","onClick","React","Children","map","child","isValidElement","type","ExpandableTableRowController","cloneElement","id","hidden","displayName"],"mappings":"qbAWA,MAAMA,EAAqBC,GAGzB,CAACC,EAAOC,KACA,MACFC,UAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,iBAAAA,EACAC,SAAAA,EACAC,QAAAA,EAAU,IACVC,OAAQC,KACLC,GACHV,GAEGQ,EAAQG,GAAaC,EAASH,IAAc,GACnDI,GAAU,YACKJ,EAAe,KAG1BE,EAAUF,EAAU,GACrB,CAACA,IAEJ,MAAOK,GAAgBC,EAAuCP,EAAQ,CAClEQ,OAAQ,eAGNC,EAAa,KACf,MAAMC,GAAaV,EAEfF,GACAA,EAASY,GAGbP,EAAUO,EAAS,EAGjBC,EAAoBC,EAAK,4BAA6BlB,EAAW,CAClE,0BAA4BM,EAC5B,+CAAiDL,IAEhDkB,EAAwBD,EAC1B,yCACA,CACK,mDAAqDZ,IAIxDc,EAAaC,EAAM,4BACnBC,EAAiCD,EACnC,uCAGJ,OAEQE,EAAAC,EAAA,CAAAtB,SAAA,CAAAuB,EAACC,EAAA,CACG1B,UAAWiB,EACXhB,UACIA,GAAa,CACT0B,QAAS,IAAMZ,QAGnBP,EACJT,IAAAA,EAECG,SAAM0B,EAAAC,SAASC,IAAI5B,GAAW6B,GAEvBH,EAAMI,eACFD,IAEJA,EAAME,OAASC,EAERN,EAAMO,aACTJ,EACA,CACIzB,OAAAA,EACAqB,QAAS,IAAMZ,IACf,gBAAiBK,EACjBgB,GAAId,IAKTS,QAOd,KAAG,CAAA,eAAczB,EACdJ,SAAAuB,EAAC,MAAGpB,QAAAA,EACAH,SAAAuB,EAAC,WAAA,CACG1B,IAAKa,EACLZ,UAAWmB,EACXiB,GAAIhB,EACJ,kBAAiBE,EACjBe,QAAS/B,EAERJ,SAAAC,UAIjB,IAIRP,EAAmB0C,YAAc"}

package/build/es/components/table/ExpandableTableRowController.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExpandableTableRowController.js","sources":["../../../../src/components/table/ExpandableTableRowController.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { Expander } from \"../expander/Expander.js\";\nimport { TableCell } from \"./TableCell.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { ExpandableTableRowControllerProps } from \"./types.js\";\n\nconst ExpandableTableRowController = forwardRef<\n HTMLTableCellElement,\n ExpandableTableRowControllerProps\n>(\n (\n {\n isOpen,\n onClick,\n children,\n className,\n id,\n \"aria-controls\": ariaControls,\n ...rest\n },\n ref,\n ) => {\n if (isOpen === undefined \|\| typeof onClick !== \"function\") {\n throw new Error(\n \"ExpandableTableRowController must have ExpandableTableRow as parent\",\n );\n }\n\n const { collapseToList } = useTableContext();\n\n const dataTh = (rest as Record<string, string>)[\"data-th\"];\n\n // pick text from data-th if possible, but only if it's a list\n const showTextFromTh: string \| undefined = collapseToList\n ? dataTh\n : undefined;\n\n return (\n <TableCell\n className={clsx(\n \"jkl-table-cell--expand\",\n { [\"jkl-table-cell--expand-without-text\"]: !children },\n className,\n )}\n {...rest}\n ref={ref}\n >\n <Expander\n as=\"button\"\n className={clsx(\"jkl-table-row-expand-button\", {\n [\"jkl-table-row-expand-button--expanded\"]: isOpen,\n })}\n id={id}\n open={isOpen}\n aria-controls={ariaControls}\n aria-label={\n children ? undefined : dataTh \|\| \"Ekspander rad\"\n }\n onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n onClick();\n }}\n onKeyDown={(e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.stopPropagation();\n e.preventDefault();\n onClick();\n }\n }}\n >\n {/* show children. or try to use data-th if children is undefined */}\n {children ?? showTextFromTh}\n </Expander>\n </TableCell>\n );\n },\n);\n\nExpandableTableRowController.displayName = \"ExpandableTableRowController\";\n\nexport { ExpandableTableRowController };\n"],"names":["ExpandableTableRowController","forwardRef","isOpen","onClick","children","className","id","ariaControls","rest","ref","Error","collapseToList","useTableContext","dataTh","showTextFromTh","jsx","TableCell","clsx","Expander","as","open","e","stopPropagation","onKeyDown","key","preventDefault","displayName"],"mappings":"2QAOA,MAAMA,EAA+BC,GAIjC,EAEQC,OAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,GAAAA,EACA,gBAAiBC,KACdC,GAEPC,KAEIP,QAAW,IAAXA,GAA2C,mBAAZC,EAC/B,MAAM,IAAIO,MACN,uEAIF,MAAEC,eAAAA,GAAmBC,IAErBC,EAAUL,EAAgC,WAG1CM,EAAqCH,EACrCE,OACA,EAGF,OAAAE,EAACC,EAAA,CACGX,UAAWY,EACP,yBACA,CAAG,uCAAyCb,GAC5CC,MAEAG,EACJC,IAAAA,EAEAL,SAAAW,EAACG,EAAA,CACGC,GAAG,SACHd,UAAWY,EAAK,8BAA+B,CAC1C,wCAA0Cf,IAE/CI,GAAAA,EACAc,KAAMlB,EACN,gBAAeK,EACf,aACIH,OAAW,EAAYS,GAAU,gBAErCV,QAAUkB,IACNA,EAAEC,kBACMnB,KAEZoB,UAAYF,KACM,UAAVA,EAAEG,KAA6B,MAAVH,EAAEG,OACvBH,EAAEC,kBACFD,EAAEI,iBACMtB,MAKfC,SAAYA,GAAAU,KACjB,IAMhBd,EAA6B0B,YAAc"}
1	+ {"version":3,"file":"ExpandableTableRowController.js","sources":["../../../../src/components/table/ExpandableTableRowController.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { Expander } from \"../expander/Expander.js\";\nimport { TableCell } from \"./TableCell.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { ExpandableTableRowControllerProps } from \"./types.js\";\n\nconst ExpandableTableRowController = forwardRef<\n HTMLTableCellElement,\n ExpandableTableRowControllerProps\n>(\n (\n {\n isOpen,\n onClick,\n children,\n className,\n id,\n \"aria-controls\": ariaControls,\n ...rest\n },\n ref,\n ) => {\n if (isOpen === undefined \|\| typeof onClick !== \"function\") {\n throw new Error(\n \"ExpandableTableRowController must have ExpandableTableRow as parent\",\n );\n }\n\n const { collapseToList } = useTableContext();\n\n const dataTh = (rest as Record<string, string>)[\"data-th\"];\n\n // pick text from data-th if possible, but only if it's a list\n const showTextFromTh: string \| undefined = collapseToList\n ? dataTh\n : undefined;\n\n return (\n <TableCell\n className={clsx(\n \"jkl-table-cell--expand\",\n { [\"jkl-table-cell--expand-without-text\"]: !children },\n className,\n )}\n {...rest}\n ref={ref}\n >\n <Expander\n as=\"button\"\n className={clsx(\"jkl-table-row-expand-button\", {\n [\"jkl-table-row-expand-button--expanded\"]: isOpen,\n })}\n id={id}\n open={isOpen}\n aria-controls={ariaControls}\n aria-label={\n children ? undefined : dataTh \|\| \"Ekspander rad\"\n }\n onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n onClick();\n }}\n onKeyDown={(e: React.KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === \"Enter\" \|\| e.key === \" \") {\n e.stopPropagation();\n e.preventDefault();\n onClick();\n }\n }}\n >\n {/* show children. or try to use data-th if children is undefined */}\n {children ?? showTextFromTh}\n </Expander>\n </TableCell>\n );\n },\n);\n\nExpandableTableRowController.displayName = \"ExpandableTableRowController\";\n\nexport { ExpandableTableRowController };\n"],"names":["ExpandableTableRowController","forwardRef","isOpen","onClick","children","className","id","ariaControls","rest","ref","Error","collapseToList","useTableContext","dataTh","showTextFromTh","jsx","TableCell","clsx","Expander","as","open","e","stopPropagation","onKeyDown","key","preventDefault","displayName"],"mappings":"2QAOA,MAAMA,EAA+BC,GAIjC,EAEQC,OAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,GAAAA,EACA,gBAAiBC,KACdC,GAEPC,KAEIP,QAAW,IAAXA,GAA2C,mBAAZC,EAC/B,MAAM,IAAIO,MACN,uEAIF,MAAEC,eAAAA,GAAmBC,IAErBC,EAAUL,EAAgC,WAG1CM,EAAqCH,EACrCE,OACA,EAGF,OAAAE,EAACC,EAAA,CACGX,UAAWY,EACP,yBACA,CAAG,uCAAyCb,GAC5CC,MAEAG,EACJC,IAAAA,EAEAL,SAAAW,EAACG,EAAA,CACGC,GAAG,SACHd,UAAWY,EAAK,8BAA+B,CAC1C,wCAA0Cf,IAE/CI,GAAAA,EACAc,KAAMlB,EACN,gBAAeK,EACf,aACIH,OAAW,EAAYS,GAAU,gBAErCV,QAAUkB,IACNA,EAAEC,kBACMnB,KAEZoB,UAAYF,KACM,UAAVA,EAAEG,KAA6B,MAAVH,EAAEG,OACvBH,EAAEC,kBACFD,EAAEI,iBACMtB,MAKfC,SAAYA,GAAAU,KACjB,IAMhBd,EAA6B0B,YAAc"}

package/build/es/components/table/Table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.js","sources":["../../../../src/components/table/Table.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useState } from \"react\";\nimport { TableContextProvider } from \"./tableContext.js\";\nimport { TableProps } from \"./types.js\";\n\nconst Table = forwardRef<HTMLTableElement, TableProps>(\n (\n {\n className,\n caption,\n children,\n density,\n collapseToList = false,\n fullWidth = false,\n tabIndex,\n ...rest\n },\n ref,\n ) => {\n const [hasStickyHead, setHasStickyHead] = useState<boolean>(false);\n\n return (\n <TableContextProvider\n state={{ density, collapseToList, setHasStickyHead }}\n >\n <table\n className={clsx(\"jkl-table\", className, {\n [\"jkl-table--full-width\"]: fullWidth,\n [\"jkl-table--collapse-to-list\"]: collapseToList,\n })}\n {...rest}\n // For content in a scrollable table to be accessible with keyboard\n // navigation we need to set tabIndex\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={hasStickyHead ? 0 : tabIndex}\n ref={ref}\n >\n {caption}\n {children}\n </table>\n </TableContextProvider>\n );\n },\n);\n\nTable.displayName = \"Table\";\n\nexport { Table };\n"],"names":["Table","forwardRef","className","caption","children","density","collapseToList","fullWidth","tabIndex","rest","ref","hasStickyHead","setHasStickyHead","useState","jsx","TableContextProvider","state","jsxs","clsx","displayName"],"mappings":"0MAKA,MAAMA,EAAQC,GACV,EAEQC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,eAAAA,GAAiB,EACjBC,UAAAA,GAAY,EACZC,SAAAA,KACGC,GAEPC,KAEA,MAAOC,EAAeC,GAAoBC,GAAkB,GAGxD,OAAAC,EAACC,EAAA,CACGC,MAAO,CAAEX,QAAAA,EAASC,eAAAA,EAAgBM,iBAAAA,GAElCR,SAAAa,EAAC,QAAA,CACGf,UAAWgB,EAAK,YAAahB,EAAW,CACnC,wBAA0BK,EAC1B,8BAAgCD,OAEjCG,EAIJD,SAAUG,EAAgB,EAAIH,EAC9BE,IAAAA,EAECN,SAAA,CAAAD,EACAC,MACL,IAMhBJ,EAAMmB,YAAc"}
1	+ {"version":3,"file":"Table.js","sources":["../../../../src/components/table/Table.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useState } from \"react\";\nimport { TableContextProvider } from \"./tableContext.js\";\nimport type { TableProps } from \"./types.js\";\n\nconst Table = forwardRef<HTMLTableElement, TableProps>(\n (\n {\n className,\n caption,\n children,\n density,\n collapseToList = false,\n fullWidth = false,\n tabIndex,\n ...rest\n },\n ref,\n ) => {\n const [hasStickyHead, setHasStickyHead] = useState<boolean>(false);\n\n return (\n <TableContextProvider\n state={{ density, collapseToList, setHasStickyHead }}\n >\n <table\n className={clsx(\"jkl-table\", className, {\n [\"jkl-table--full-width\"]: fullWidth,\n [\"jkl-table--collapse-to-list\"]: collapseToList,\n })}\n {...rest}\n // For content in a scrollable table to be accessible with keyboard\n // navigation we need to set tabIndex\n // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex\n tabIndex={hasStickyHead ? 0 : tabIndex}\n ref={ref}\n >\n {caption}\n {children}\n </table>\n </TableContextProvider>\n );\n },\n);\n\nTable.displayName = \"Table\";\n\nexport { Table };\n"],"names":["Table","forwardRef","className","caption","children","density","collapseToList","fullWidth","tabIndex","rest","ref","hasStickyHead","setHasStickyHead","useState","jsx","TableContextProvider","state","jsxs","clsx","displayName"],"mappings":"0MAKA,MAAMA,EAAQC,GACV,EAEQC,UAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,eAAAA,GAAiB,EACjBC,UAAAA,GAAY,EACZC,SAAAA,KACGC,GAEPC,KAEA,MAAOC,EAAeC,GAAoBC,GAAkB,GAGxD,OAAAC,EAACC,EAAA,CACGC,MAAO,CAAEX,QAAAA,EAASC,eAAAA,EAAgBM,iBAAAA,GAElCR,SAAAa,EAAC,QAAA,CACGf,UAAWgB,EAAK,YAAahB,EAAW,CACnC,wBAA0BK,EAC1B,8BAAgCD,OAEjCG,EAIJD,SAAUG,EAAgB,EAAIH,EAC9BE,IAAAA,EAECN,SAAA,CAAAD,EACAC,MACL,IAMhBJ,EAAMmB,YAAc"}

package/build/es/components/table/TableBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableBody.js","sources":["../../../../src/components/table/TableBody.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport { TableBodyProps } from \"./types.js\";\n\nconst TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(\n (props, ref) => {\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: false,\n isTableBody: true,\n isTableFooter: false,\n }}\n >\n <tbody {...props} ref={ref} />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableBody.displayName = \"TableBody\";\n\nexport { TableBody };\n"],"names":["TableBody","forwardRef","props","ref","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","displayName"],"mappings":"kJAIA,MAAMA,EAAYC,GACd,CAACC,EAAOC,IAEAC,EAACC,EAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAACN,EAAA,QAAA,IAAUF,EAAOC,IAAAA,QAMlCH,EAAUW,YAAc"}
1	+ {"version":3,"file":"TableBody.js","sources":["../../../../src/components/table/TableBody.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport type { TableBodyProps } from \"./types.js\";\n\nconst TableBody = forwardRef<HTMLTableSectionElement, TableBodyProps>(\n (props, ref) => {\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: false,\n isTableBody: true,\n isTableFooter: false,\n }}\n >\n <tbody {...props} ref={ref} />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableBody.displayName = \"TableBody\";\n\nexport { TableBody };\n"],"names":["TableBody","forwardRef","props","ref","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","displayName"],"mappings":"kJAIA,MAAMA,EAAYC,GACd,CAACC,EAAOC,IAEAC,EAACC,EAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAACN,EAAA,QAAA,IAAUF,EAAOC,IAAAA,QAMlCH,EAAUW,YAAc"}

package/build/es/components/table/TableCaption.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableCaption.js","sources":["../../../../src/components/table/TableCaption.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { TableCaptionProps } from \"./types.js\";\n\nconst TableCaption = forwardRef<HTMLTableCaptionElement, TableCaptionProps>(\n ({ srOnly = true, ...rest }, ref) => {\n return (\n <caption\n className={clsx(\"jkl-table-caption\", {\n [\"jkl-table-caption--sr-only\"]: srOnly,\n })}\n {...rest}\n ref={ref}\n />\n );\n },\n);\n\nTableCaption.displayName = \"TableCaption\";\n\nexport { TableCaption };\n"],"names":["TableCaption","forwardRef","srOnly","rest","ref","jsx","className","clsx","displayName"],"mappings":"yHAIA,MAAMA,EAAeC,GACjB,EAAGC,OAAAA,GAAS,KAASC,GAAQC,IAErBC,EAAC,UAAA,CACGC,UAAWC,EAAK,oBAAqB,CAChC,6BAA+BL,OAEhCC,EACJC,IAAAA,MAMhBJ,EAAaQ,YAAc"}
1	+ {"version":3,"file":"TableCaption.js","sources":["../../../../src/components/table/TableCaption.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport type { TableCaptionProps } from \"./types.js\";\n\nconst TableCaption = forwardRef<HTMLTableCaptionElement, TableCaptionProps>(\n ({ srOnly = true, ...rest }, ref) => {\n return (\n <caption\n className={clsx(\"jkl-table-caption\", {\n [\"jkl-table-caption--sr-only\"]: srOnly,\n })}\n {...rest}\n ref={ref}\n />\n );\n },\n);\n\nTableCaption.displayName = \"TableCaption\";\n\nexport { TableCaption };\n"],"names":["TableCaption","forwardRef","srOnly","rest","ref","jsx","className","clsx","displayName"],"mappings":"yHAIA,MAAMA,EAAeC,GACjB,EAAGC,OAAAA,GAAS,KAASC,GAAQC,IAErBC,EAAC,UAAA,CACGC,UAAWC,EAAK,oBAAqB,CAChC,6BAA+BL,OAEhCC,EACJC,IAAAA,MAMhBJ,EAAaQ,YAAc"}

package/build/es/components/table/TableCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableCell.js","sources":["../../../../src/components/table/TableCell.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TableCellProps } from \"./types.js\";\n\nconst TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(\n (\n { align = \"left\", verticalAlign = \"top\", className, density, ...rest },\n ref,\n ) => {\n const { density: contextDensity } = useTableContext();\n return (\n <td\n className={clsx(\"jkl-table-cell\", className, {\n [\"jkl-table-cell--align-right\"]: align === \"right\",\n [\"jkl-table-cell--align-center\"]: align === \"center\",\n [\"jkl-table-cell--vertical-align-center\"]:\n verticalAlign === \"center\",\n })}\n {...rest}\n data-density={density \|\| contextDensity}\n ref={ref}\n />\n );\n },\n);\n\nTableCell.displayName = \"TableCell\";\n\nexport { TableCell };\n"],"names":["TableCell","forwardRef","align","verticalAlign","className","density","rest","ref","contextDensity","useTableContext","jsx","clsx","displayName"],"mappings":"6KAKA,MAAMA,EAAYC,GACd,EACMC,MAAAA,EAAQ,OAAQC,cAAAA,EAAgB,MAAOC,UAAAA,EAAWC,QAAAA,KAAYC,GAChEC,KAEA,MAAQF,QAASG,GAAmBC,IAEhC,OAAAC,EAAC,KAAA,CACGN,UAAWO,EAAK,iBAAkBP,EAAW,CACxC,8BAA0C,UAAVF,EAChC,+BAA2C,WAAVA,EACjC,wCACqB,WAAlBC,OAEJG,EACJ,eAAcD,GAAWG,EACzBD,IAAAA,GAAA,IAMhBP,EAAUY,YAAc"}
1	+ {"version":3,"file":"TableCell.js","sources":["../../../../src/components/table/TableCell.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableCellProps } from \"./types.js\";\n\nconst TableCell = forwardRef<HTMLTableCellElement, TableCellProps>(\n (\n { align = \"left\", verticalAlign = \"top\", className, density, ...rest },\n ref,\n ) => {\n const { density: contextDensity } = useTableContext();\n return (\n <td\n className={clsx(\"jkl-table-cell\", className, {\n [\"jkl-table-cell--align-right\"]: align === \"right\",\n [\"jkl-table-cell--align-center\"]: align === \"center\",\n [\"jkl-table-cell--vertical-align-center\"]:\n verticalAlign === \"center\",\n })}\n {...rest}\n data-density={density \|\| contextDensity}\n ref={ref}\n />\n );\n },\n);\n\nTableCell.displayName = \"TableCell\";\n\nexport { TableCell };\n"],"names":["TableCell","forwardRef","align","verticalAlign","className","density","rest","ref","contextDensity","useTableContext","jsx","clsx","displayName"],"mappings":"6KAKA,MAAMA,EAAYC,GACd,EACMC,MAAAA,EAAQ,OAAQC,cAAAA,EAAgB,MAAOC,UAAAA,EAAWC,QAAAA,KAAYC,GAChEC,KAEA,MAAQF,QAASG,GAAmBC,IAEhC,OAAAC,EAAC,KAAA,CACGN,UAAWO,EAAK,iBAAkBP,EAAW,CACxC,8BAA0C,UAAVF,EAChC,+BAA2C,WAAVA,EACjC,wCACqB,WAAlBC,OAEJG,EACJ,eAAcD,GAAWG,EACzBD,IAAAA,GAAA,IAMhBP,EAAUY,YAAc"}

package/build/es/components/table/TableColumn.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableColumn.js","sources":["../../../../src/components/table/TableColumn.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { TableColumnProps } from \"./types.js\";\n\nconst TableColumn = forwardRef<HTMLTableColElement, TableColumnProps>(\n (props, ref) => {\n return <col {...props} ref={ref} />;\n },\n);\n\nTableColumn.displayName = \"TableColumn\";\n\nexport { TableColumn };\n"],"names":["TableColumn","forwardRef","props","ref","jsx","displayName"],"mappings":"2EAGA,MAAMA,EAAcC,GAChB,CAACC,EAAOC,IACIC,EAAA,MAAA,IAAQF,EAAOC,IAAAA,MAI/BH,EAAYK,YAAc"}
1	+ {"version":3,"file":"TableColumn.js","sources":["../../../../src/components/table/TableColumn.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport type { TableColumnProps } from \"./types.js\";\n\nconst TableColumn = forwardRef<HTMLTableColElement, TableColumnProps>(\n (props, ref) => {\n return <col {...props} ref={ref} />;\n },\n);\n\nTableColumn.displayName = \"TableColumn\";\n\nexport { TableColumn };\n"],"names":["TableColumn","forwardRef","props","ref","jsx","displayName"],"mappings":"2EAGA,MAAMA,EAAcC,GAChB,CAACC,EAAOC,IACIC,EAAA,MAAA,IAAQF,EAAOC,IAAAA,MAI/BH,EAAYK,YAAc"}

package/build/es/components/table/TableColumnGroup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableColumnGroup.js","sources":["../../../../src/components/table/TableColumnGroup.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { TableColumnGroupProps } from \"./types.js\";\n\nconst TableColumnGroup = forwardRef<HTMLTableColElement, TableColumnGroupProps>(\n (props, ref) => {\n return <colgroup {...props} ref={ref} />;\n },\n);\n\nTableColumnGroup.displayName = \"TableColumnGroup\";\n\nexport { TableColumnGroup };\n"],"names":["TableColumnGroup","forwardRef","props","ref","jsx","displayName"],"mappings":"2EAGA,MAAMA,EAAmBC,GACrB,CAACC,EAAOC,IACIC,EAAA,WAAA,IAAaF,EAAOC,IAAAA,MAIpCH,EAAiBK,YAAc"}
1	+ {"version":3,"file":"TableColumnGroup.js","sources":["../../../../src/components/table/TableColumnGroup.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport type { TableColumnGroupProps } from \"./types.js\";\n\nconst TableColumnGroup = forwardRef<HTMLTableColElement, TableColumnGroupProps>(\n (props, ref) => {\n return <colgroup {...props} ref={ref} />;\n },\n);\n\nTableColumnGroup.displayName = \"TableColumnGroup\";\n\nexport { TableColumnGroup };\n"],"names":["TableColumnGroup","forwardRef","props","ref","jsx","displayName"],"mappings":"2EAGA,MAAMA,EAAmBC,GACrB,CAACC,EAAOC,IACIC,EAAA,WAAA,IAAaF,EAAOC,IAAAA,MAIpCH,EAAiBK,YAAc"}

package/build/es/components/table/TableFooter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableFooter.js","sources":["../../../../src/components/table/TableFooter.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport { TableFooterProps } from \"./types.js\";\n\nconst TableFooter = forwardRef<HTMLTableSectionElement, TableFooterProps>(\n ({ className, ...rest }, ref) => {\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: false,\n isTableBody: false,\n isTableFooter: true,\n }}\n >\n <tfoot\n className={clsx(\"jkl-table-foot\", className)}\n {...rest}\n ref={ref}\n />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableFooter.displayName = \"TableFooter\";\n\nexport { TableFooter };\n"],"names":["TableFooter","forwardRef","className","rest","ref","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","clsx","displayName"],"mappings":"gMAKA,MAAMA,EAAcC,GAChB,EAAGC,UAAAA,KAAcC,GAAQC,IAEjBC,EAACC,EAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAAAN,EAAC,QAAA,CACGH,UAAWU,EAAK,iBAAkBV,MAC9BC,EACJC,IAAAA,QAOpBJ,EAAYa,YAAc"}
1	+ {"version":3,"file":"TableFooter.js","sources":["../../../../src/components/table/TableFooter.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport type { TableFooterProps } from \"./types.js\";\n\nconst TableFooter = forwardRef<HTMLTableSectionElement, TableFooterProps>(\n ({ className, ...rest }, ref) => {\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: false,\n isTableBody: false,\n isTableFooter: true,\n }}\n >\n <tfoot\n className={clsx(\"jkl-table-foot\", className)}\n {...rest}\n ref={ref}\n />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableFooter.displayName = \"TableFooter\";\n\nexport { TableFooter };\n"],"names":["TableFooter","forwardRef","className","rest","ref","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","clsx","displayName"],"mappings":"gMAKA,MAAMA,EAAcC,GAChB,EAAGC,UAAAA,KAAcC,GAAQC,IAEjBC,EAACC,EAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAAAN,EAAC,QAAA,CACGH,UAAWU,EAAK,iBAAkBV,MAC9BC,EACJC,IAAAA,QAOpBJ,EAAYa,YAAc"}

package/build/es/components/table/TableHead.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableHead.js","sources":["../../../../src/components/table/TableHead.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport { TableHeadProps } from \"./types.js\";\n\nconst TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(\n ({ className, srOnly, sticky = false, ...rest }, ref) => {\n const { setHasStickyHead } = useTableContext();\n useEffect(() => {\n setHasStickyHead(sticky);\n }, [sticky, setHasStickyHead]);\n\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: true,\n isTableBody: false,\n isTableFooter: false,\n }}\n >\n <thead\n className={clsx(\"jkl-table-head\", className, {\n [\"jkl-table-head--sr-only\"]: srOnly,\n [\"jkl-table-head--sticky\"]: sticky,\n })}\n {...rest}\n ref={ref}\n />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableHead.displayName = \"TableHead\";\n\nexport { TableHead };\n"],"names":["TableHead","forwardRef","className","srOnly","sticky","rest","ref","setHasStickyHead","useTableContext","useEffect","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","clsx","displayName"],"mappings":"mQAMA,MAAMA,EAAYC,GACd,EAAGC,UAAAA,EAAWC,OAAAA,EAAQC,OAAAA,GAAS,KAAUC,GAAQC,KACvC,MAAEC,iBAAAA,GAAqBC,IAC7B,OAAAC,GAAU,KACNF,EAAiBH,EAAM,GACxB,CAACA,EAAQG,IAGRG,EAACC,EAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAAAN,EAAC,QAAA,CACGR,UAAWe,EAAK,iBAAkBf,EAAW,CACxC,0BAA4BC,EAC5B,yBAA2BC,OAE5BC,EACJC,IAAAA,KACJ,IAMhBN,EAAUkB,YAAc"}
1	+ {"version":3,"file":"TableHead.js","sources":["../../../../src/components/table/TableHead.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TableSectionContextProvider } from \"./tableSectionContext.js\";\nimport type { TableHeadProps } from \"./types.js\";\n\nconst TableHead = forwardRef<HTMLTableSectionElement, TableHeadProps>(\n ({ className, srOnly, sticky = false, ...rest }, ref) => {\n const { setHasStickyHead } = useTableContext();\n useEffect(() => {\n setHasStickyHead(sticky);\n }, [sticky, setHasStickyHead]);\n\n return (\n <TableSectionContextProvider\n state={{\n isTableHead: true,\n isTableBody: false,\n isTableFooter: false,\n }}\n >\n <thead\n className={clsx(\"jkl-table-head\", className, {\n [\"jkl-table-head--sr-only\"]: srOnly,\n [\"jkl-table-head--sticky\"]: sticky,\n })}\n {...rest}\n ref={ref}\n />\n </TableSectionContextProvider>\n );\n },\n);\n\nTableHead.displayName = \"TableHead\";\n\nexport { TableHead };\n"],"names":["TableHead","forwardRef","className","srOnly","sticky","rest","ref","setHasStickyHead","useTableContext","useEffect","jsx","TableSectionContextProvider","state","isTableHead","isTableBody","isTableFooter","children","clsx","displayName"],"mappings":"mQAMA,MAAMA,EAAYC,GACd,EAAGC,UAAAA,EAAWC,OAAAA,EAAQC,OAAAA,GAAS,KAAUC,GAAQC,KACvC,MAAEC,iBAAAA,GAAqBC,IAC7B,OAAAC,GAAU,KACNF,EAAiBH,EAAM,GACxB,CAACA,EAAQG,IAGRG,EAACC,EAAA,CACGC,MAAO,CACHC,aAAa,EACbC,aAAa,EACbC,eAAe,GAGnBC,SAAAN,EAAC,QAAA,CACGR,UAAWe,EAAK,iBAAkBf,EAAW,CACxC,0BAA4BC,EAC5B,yBAA2BC,OAE5BC,EACJC,IAAAA,KACJ,IAMhBN,EAAUkB,YAAc"}

package/build/es/components/table/TableHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableHeader.js","sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, MouseEventHandler } from \"react\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TableHeaderProps } from \"./types.js\";\n\nexport type TableSortDirection = \"asc\" \| \"desc\";\n\nconst TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(\n (props, ref) => {\n const {\n bold = true,\n density,\n sortable,\n className,\n scope = \"col\",\n srOnly,\n align = \"left\",\n children,\n onClick,\n ...rest\n } = props;\n const { density: contextDensity } = useTableContext();\n\n const handleClick: MouseEventHandler<HTMLTableCellElement> = (e) => {\n onClick?.(e);\n sortable?.onClick();\n };\n\n return (\n <th\n className={clsx(\"jkl-table-header\", className, {\n [\"jkl-table-header--bold\"]: bold,\n [\"jkl-table-header--align-right\"]: align === \"right\",\n [\"jkl-table-header--align-center\"]: align === \"center\",\n [\"jkl-table-header--sr-only\"]: srOnly,\n [\"jkl-table-header--sortable\"]:\n typeof sortable !== \"undefined\",\n })}\n scope={scope}\n onClick={handleClick}\n {...rest}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n {children}\n {sortable && (\n <div\n className={clsx(\"jkl-table-header__arrows\", {\n \"jkl-table-header__arrows--active\": Boolean(\n sortable.direction,\n ),\n })}\n >\n {sortable.direction && (\n <ArrowVerticalAnimated\n pointingDown={sortable.direction === \"desc\"}\n bold\n />\n )}\n </div>\n )}\n </th>\n );\n },\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nexport { TableHeader };\n"],"names":["TableHeader","forwardRef","props","ref","bold","density","sortable","className","scope","srOnly","align","children","onClick","rest","contextDensity","useTableContext","jsxs","clsx","e","jsx","direction","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"+QAQA,MAAMA,EAAcC,GAChB,CAACC,EAAOC,KACE,MACFC,KAAAA,GAAO,EACPC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,MAAAA,EAAQ,MACRC,OAAAA,EACAC,MAAAA,EAAQ,OACRC,SAAAA,EACAC,QAAAA,KACGC,GACHX,GACIG,QAASS,GAAmBC,IAQhC,OAAAC,EAAC,KAAA,CACGT,UAAWU,EAAK,mBAAoBV,EAAW,CAC1C,yBAA2BH,EAC3B,gCAA4C,UAAVM,EAClC,iCAA6C,WAAVA,EACnC,4BAA8BD,EAC9B,oCACUH,EAAa,MAE5BE,MAAAA,EACAI,QAhBsDM,IAC1D,MAAAN,GAAAA,EAAUM,GACV,MAAAZ,GAAAA,EAAUM,SAAA,KAeFC,EACJ,eAAcR,GAAWS,EACzBX,IAAAA,EAECQ,SAAA,CAAAA,EACAL,GACGa,EAAC,MAAA,CACGZ,UAAWU,EAAK,2BAA4B,CACxC,qCACIX,EAASc,YAIhBT,WAASS,WACND,EAACE,EAAA,CACGC,aAAqC,SAAvBhB,EAASc,UACvBhB,MAAI,QAGhB,IAOpBJ,EAAYuB,YAAc"}
1	+ {"version":3,"file":"TableHeader.js","sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, type MouseEventHandler } from \"react\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableHeaderProps } from \"./types.js\";\n\nexport type TableSortDirection = \"asc\" \| \"desc\";\n\nconst TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(\n (props, ref) => {\n const {\n bold = true,\n density,\n sortable,\n className,\n scope = \"col\",\n srOnly,\n align = \"left\",\n children,\n onClick,\n ...rest\n } = props;\n const { density: contextDensity } = useTableContext();\n\n const handleClick: MouseEventHandler<HTMLTableCellElement> = (e) => {\n onClick?.(e);\n sortable?.onClick();\n };\n\n return (\n <th\n className={clsx(\"jkl-table-header\", className, {\n [\"jkl-table-header--bold\"]: bold,\n [\"jkl-table-header--align-right\"]: align === \"right\",\n [\"jkl-table-header--align-center\"]: align === \"center\",\n [\"jkl-table-header--sr-only\"]: srOnly,\n [\"jkl-table-header--sortable\"]:\n typeof sortable !== \"undefined\",\n })}\n scope={scope}\n onClick={handleClick}\n {...rest}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n {children}\n {sortable && (\n <div\n className={clsx(\"jkl-table-header__arrows\", {\n \"jkl-table-header__arrows--active\": Boolean(\n sortable.direction,\n ),\n })}\n >\n {sortable.direction && (\n <ArrowVerticalAnimated\n pointingDown={sortable.direction === \"desc\"}\n bold\n />\n )}\n </div>\n )}\n </th>\n );\n },\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nexport { TableHeader };\n"],"names":["TableHeader","forwardRef","props","ref","bold","density","sortable","className","scope","srOnly","align","children","onClick","rest","contextDensity","useTableContext","jsxs","clsx","e","jsx","direction","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"+QAQA,MAAMA,EAAcC,GAChB,CAACC,EAAOC,KACE,MACFC,KAAAA,GAAO,EACPC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,MAAAA,EAAQ,MACRC,OAAAA,EACAC,MAAAA,EAAQ,OACRC,SAAAA,EACAC,QAAAA,KACGC,GACHX,GACIG,QAASS,GAAmBC,IAQhC,OAAAC,EAAC,KAAA,CACGT,UAAWU,EAAK,mBAAoBV,EAAW,CAC1C,yBAA2BH,EAC3B,gCAA4C,UAAVM,EAClC,iCAA6C,WAAVA,EACnC,4BAA8BD,EAC9B,oCACUH,EAAa,MAE5BE,MAAAA,EACAI,QAhBsDM,IAC1D,MAAAN,GAAAA,EAAUM,GACV,MAAAZ,GAAAA,EAAUM,SAAA,KAeFC,EACJ,eAAcR,GAAWS,EACzBX,IAAAA,EAECQ,SAAA,CAAAA,EACAL,GACGa,EAAC,MAAA,CACGZ,UAAWU,EAAK,2BAA4B,CACxC,qCACIX,EAASc,YAIhBT,WAASS,WACND,EAACE,EAAA,CACGC,aAAqC,SAAvBhB,EAASc,UACvBhB,MAAI,QAGhB,IAOpBJ,EAAYuB,YAAc"}

package/build/es/components/table/TablePagination.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as a,Fragment as i}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as t,useState as l,useCallback as r}from"react";import{useId as o}from"../../hooks/useId/useId.js";import{ChevronLeftIcon as s}from"../icon/icons/ChevronLeftIcon.js";import{ChevronRightIcon as c}from"../icon/icons/ChevronRightIcon.js";import{IconButton as p}from"../icon-button/IconButton.js";import{NativeSelect as m}from"../select/NativeSelect.js";import{TextInput as g}from"../text-input/TextInput.js";import{useTableContext as d}from"./tableContext.js";const b=t(((i,t)=>{const{activePage:b=0,totalNumberOfRows:h,rowsPerPage:k,rowsPerPageItems:v,className:_,density:j,id:f,withGoToPage:N=!1,onChange:C,onChangeRowsPerPage:P,labels:x={rowsPerPage:"Rader per side",previous:"Forrige",next:"Neste"},...I}=i,w=o(f||"jkl-table-pagination",{generateSuffix:!f}),{density:y}=d(),S=k<=0?1:Math.ceil(h/k),[A,M]=l(function(e,a,i){return a<e?e:a>i?i:a}(0,b,S-1)),T=r((e=>{const a=Number.parseInt(e.currentTarget.dataset.number);C(e,a,A),M(a),O(String(a+1))}),[C,M,A]),[R,O]=l(String(A+1)),L=r((e=>{O(e.target.value);try{const a=Number.parseInt(e.target.value)-1;if(Number.isNaN(a))return;a>=0&&a<S&&(C(e,a,A),M(a))}catch{return}}),[C,O,M,A,S]),$=r((e=>{if(0===A)return void C(e,A,A);const a=A-1;C(e,a,A),M(a),O(String(a+1))}),[C,M,A]),G=r((e=>{if(A===S-1)return void C(e,A,A);const a=A+1;C(e,a,A),M(a),O(String(a+1))}),[C,M,S,A]);return e("div",{className:n("jkl-table-pagination",_),...I,id:w,"data-density":j||y,ref:t,children:[a("div",{className:"jkl-table-pagination__left",children:e("div",{className:"jkl-table-pagination__picker jkl-table-pagination__picker--rows",children:[e("span",{className:"jkl-table-pagination__picker-label","aria-hidden":"true",children:[x.rowsPerPage,":"]}),a(m,{className:"jkl-table-pagination__picker-input",label:x.rowsPerPage,labelProps:{srOnly:!0},name:`${w}-rows-per-page`,items:v.map((e=>"number"==typeof e?String(e):{label:e.label,value:String(e.value)})),value:String(k),onChange:P,width:"min(8rem, 100%)",inline:!0})]})}),a("div",{className:"jkl-table-pagination__right",children:1!==S&&e("nav",{className:"jkl-table-pagination__nav",children:[N&&e("div",{className:"jkl-table-pagination__picker jkl-table-pagination__picker--page",children:[e("span",{className:"jkl-table-pagination__picker-label","aria-hidden":"true",children:["object"==typeof N?N.gotoLabel:"Gå til side",":"]}),a(g,{className:"jkl-table-pagination__picker-input",label:"object"==typeof N?N.gotoLabel:"Gå til side",labelProps:{srOnly:!0},name:`${w}-go-to-page`,value:R,width:"min(4rem, 100%)",onChange:L,"aria-invalid":R&&R!==String(A+1)?"true":void 0})]}),e("ul",{children:[a("li",{children:a(p,{className:"jkl-table-pagination__previous",title:x.previous,onClick:$,children:a(s,{})})}),a(u,{id:w,activePage:b,numberOfPages:S,onPageClick:T}),a("li",{children:a(p,{className:"jkl-table-pagination__next",title:x.next,onClick:G,children:a(c,{})})})]})]})})]})})),u=({id:t,activePage:l,numberOfPages:r,onPageClick:o})=>{if(r<=7)return a(i,{children:Array.from({length:r}).map(((e,i)=>a("li",{children:a("button",{className:n("jkl-table-pagination__page",{"jkl-table-pagination__page--active":l===i}),type:"button","data-number":i,onClick:o,children:i+1})},`${t}-page-${i}`)))});const s=l>3&&r>7,c=l<r-4&&r>7,p=Math.min(Math.max(l-2,1),r-6),m=Math.min(p+1,r-5),g=Math.min(m+1,r-4),d=Math.min(m+2,r-3),b=Math.min(m+3,r-2);return e(i,{children:[a("li",{children:a(h,{isActive:0===l,number:0,onClick:o})}),a("li",{children:s?a("span",{className:"jkl-table-pagination__ellipsis","aria-hidden":!0,children:"..."}):a(h,{isActive:l===p,number:p,onClick:o})}),a("li",{children:a(h,{isActive:l===m,number:m,onClick:o})}),a("li",{children:a(h,{isActive:l===g,number:g,onClick:o})}),a("li",{children:a(h,{isActive:l===d,number:d,onClick:o})}),a("li",{children:c?a("span",{className:"jkl-table-pagination__ellipsis","aria-hidden":!0,children:"..."}):a(h,{isActive:l===b,number:b,onClick:o})}),a("li",{children:a(h,{isActive:l===r-1,number:r-1,onClick:o})})]})},h=({isActive:e,number:i,onClick:t,...l})=>a("button",{className:n("jkl-table-pagination__page",{"jkl-table-pagination__page--active":e}),type:"button","data-number":i,onClick:t,...l,children:i+1});b.displayName="TablePagination";export{b as TablePagination};
+import{jsxs as e,jsx as a,Fragment as i}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{forwardRef as t,useState as l,useCallback as r}from"react";import{useId as o}from"../../hooks/useId/useId.js";import{IconButton as s}from"../icon-button/IconButton.js";import{ChevronLeftIcon as c}from"../icon/icons/ChevronLeftIcon.js";import{ChevronRightIcon as p}from"../icon/icons/ChevronRightIcon.js";import{NativeSelect as m}from"../select/NativeSelect.js";import{TextInput as g}from"../text-input/TextInput.js";import{useTableContext as d}from"./tableContext.js";const b=t(((i,t)=>{const{activePage:b=0,totalNumberOfRows:h,rowsPerPage:k,rowsPerPageItems:v,className:_,density:j,id:f,withGoToPage:N=!1,onChange:C,onChangeRowsPerPage:P,labels:x={rowsPerPage:"Rader per side",previous:"Forrige",next:"Neste"},...I}=i,w=o(f||"jkl-table-pagination",{generateSuffix:!f}),{density:y}=d(),S=k<=0?1:Math.ceil(h/k),[A,M]=l(function(e,a,i){return a<e?e:a>i?i:a}(0,b,S-1)),T=r((e=>{const a=Number.parseInt(e.currentTarget.dataset.number);C(e,a,A),M(a),O(String(a+1))}),[C,A]),[R,O]=l(String(A+1)),L=r((e=>{O(e.target.value);try{const a=Number.parseInt(e.target.value)-1;if(Number.isNaN(a))return;a>=0&&a<S&&(C(e,a,A),M(a))}catch{return}}),[C,A,S]),$=r((e=>{if(0===A)return void C(e,A,A);const a=A-1;C(e,a,A),M(a),O(String(a+1))}),[C,A]),G=r((e=>{if(A===S-1)return void C(e,A,A);const a=A+1;C(e,a,A),M(a),O(String(a+1))}),[C,S,A]);return e("div",{className:n("jkl-table-pagination",_),...I,id:w,"data-density":j||y,ref:t,children:[a("div",{className:"jkl-table-pagination__left",children:e("div",{className:"jkl-table-pagination__picker jkl-table-pagination__picker--rows",children:[e("span",{className:"jkl-table-pagination__picker-label","aria-hidden":"true",children:[x.rowsPerPage,":"]}),a(m,{className:"jkl-table-pagination__picker-input",label:x.rowsPerPage,labelProps:{srOnly:!0},name:`${w}-rows-per-page`,items:v.map((e=>"number"==typeof e?String(e):{label:e.label,value:String(e.value)})),value:String(k),onChange:P,width:"min(8rem, 100%)",inline:!0})]})}),a("div",{className:"jkl-table-pagination__right",children:1!==S&&e("nav",{className:"jkl-table-pagination__nav",children:[N&&e("div",{className:"jkl-table-pagination__picker jkl-table-pagination__picker--page",children:[e("span",{className:"jkl-table-pagination__picker-label","aria-hidden":"true",children:["object"==typeof N?N.gotoLabel:"Gå til side",":"]}),a(g,{className:"jkl-table-pagination__picker-input",label:"object"==typeof N?N.gotoLabel:"Gå til side",labelProps:{srOnly:!0},name:`${w}-go-to-page`,value:R,width:"min(4rem, 100%)",onChange:L,"aria-invalid":R&&R!==String(A+1)?"true":void 0})]}),e("ul",{children:[a("li",{children:a(s,{className:"jkl-table-pagination__previous",title:x.previous,onClick:$,children:a(c,{})})}),a(u,{id:w,activePage:b,numberOfPages:S,onPageClick:T}),a("li",{children:a(s,{className:"jkl-table-pagination__next",title:x.next,onClick:G,children:a(p,{})})})]})]})})]})})),u=({id:t,activePage:l,numberOfPages:r,onPageClick:o})=>{if(r<=7)return a(i,{children:Array.from({length:r}).map(((e,i)=>a("li",{children:a("button",{className:n("jkl-table-pagination__page",{"jkl-table-pagination__page--active":l===i}),type:"button","data-number":i,onClick:o,children:i+1})},`${t}-page-${i}`)))});const s=l>3&&r>7,c=l<r-4&&r>7,p=Math.min(Math.max(l-2,1),r-6),m=Math.min(p+1,r-5),g=Math.min(m+1,r-4),d=Math.min(m+2,r-3),b=Math.min(m+3,r-2);return e(i,{children:[a("li",{children:a(h,{isActive:0===l,number:0,onClick:o})}),a("li",{children:s?a("span",{className:"jkl-table-pagination__ellipsis","aria-hidden":!0,children:"..."}):a(h,{isActive:l===p,number:p,onClick:o})}),a("li",{children:a(h,{isActive:l===m,number:m,onClick:o})}),a("li",{children:a(h,{isActive:l===g,number:g,onClick:o})}),a("li",{children:a(h,{isActive:l===d,number:d,onClick:o})}),a("li",{children:c?a("span",{className:"jkl-table-pagination__ellipsis","aria-hidden":!0,children:"..."}):a(h,{isActive:l===b,number:b,onClick:o})}),a("li",{children:a(h,{isActive:l===r-1,number:r-1,onClick:o})})]})},h=({isActive:e,number:i,onClick:t,...l})=>a("button",{className:n("jkl-table-pagination__page",{"jkl-table-pagination__page--active":e}),type:"button","data-number":i,onClick:t,...l,children:i+1});b.displayName="TablePagination";export{b as TablePagination};
 //# sourceMappingURL=TablePagination.js.map

package/build/es/components/table/TablePagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TablePagination.js","sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useCallback,\n useState,\n type ChangeEventHandler,\n type FC,\n type MouseEventHandler,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { ChevronLeftIcon } from \"../icon/icons/ChevronLeftIcon.js\";\nimport { ChevronRightIcon } from \"../icon/icons/ChevronRightIcon.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { NativeSelect } from \"../select/NativeSelect.js\";\nimport { TextInput } from \"../text-input/TextInput.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { TablePaginationProps } from \"./types.js\";\n\nfunction clamp(min: number, num: number, max: number): number {\n if (num < min) {\n return min;\n } else if (num > max) {\n return max;\n }\n return num;\n}\n\nexport const TablePagination = forwardRef<HTMLDivElement, TablePaginationProps>(\n (props, ref) => {\n const {\n activePage = 0,\n totalNumberOfRows,\n rowsPerPage,\n rowsPerPageItems,\n className,\n density,\n id: idProp,\n withGoToPage = false,\n onChange,\n onChangeRowsPerPage,\n labels = {\n rowsPerPage: \"Rader per side\",\n previous: \"Forrige\",\n next: \"Neste\",\n },\n ...rest\n } = props;\n\n const id = useId(idProp \|\| \"jkl-table-pagination\", {\n generateSuffix: !idProp,\n });\n const { density: contextDensity } = useTableContext();\n\n const showAll = rowsPerPage <= 0;\n const numberOfPages = showAll\n ? 1\n : Math.ceil(totalNumberOfRows / rowsPerPage);\n\n const [currentPage, setCurrentPage] = useState(\n clamp(0, activePage, numberOfPages - 1),\n );\n\n const onPageClick: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n const toPage = Number.parseInt(\n e.currentTarget.dataset[\"number\"] as string,\n );\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, setCurrentPage, currentPage],\n );\n\n const [pagePickerValue, setPagePickerValue] = useState(\n String(currentPage + 1),\n );\n const onPageChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n setPagePickerValue(e.target.value);\n try {\n const toPage = Number.parseInt(e.target.value) - 1;\n if (Number.isNaN(toPage)) {\n return;\n }\n\n if (toPage >= 0 && toPage < numberOfPages) {\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n }\n } catch {\n return;\n }\n },\n [\n onChange,\n setPagePickerValue,\n setCurrentPage,\n currentPage,\n numberOfPages,\n ],\n );\n\n const onPrevious: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === 0) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage - 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, setCurrentPage, currentPage],\n );\n\n const onNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === numberOfPages - 1) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage + 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, setCurrentPage, numberOfPages, currentPage],\n );\n\n return (\n <div\n className={clsx(\"jkl-table-pagination\", className)}\n {...rest}\n id={id}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n <div className=\"jkl-table-pagination__left\">\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--rows\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {labels.rowsPerPage}:\n </span>\n <NativeSelect\n className=\"jkl-table-pagination__picker-input\"\n label={labels.rowsPerPage}\n labelProps={{ srOnly: true }}\n name={`${id}-rows-per-page`}\n items={rowsPerPageItems.map((i) =>\n typeof i === \"number\"\n ? String(i)\n : {\n label: i.label,\n value: String(i.value),\n },\n )}\n value={String(rowsPerPage)}\n onChange={onChangeRowsPerPage}\n width=\"min(8rem, 100%)\"\n inline\n />\n </div>\n </div>\n <div className=\"jkl-table-pagination__right\">\n {numberOfPages !== 1 && (\n <nav className=\"jkl-table-pagination__nav\">\n {withGoToPage && (\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--page\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"}\n :\n </span>\n {/* onChange først ved enter/submit */}\n <TextInput\n className=\"jkl-table-pagination__picker-input\"\n label={\n typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"\n }\n labelProps={{ srOnly: true }}\n name={`${id}-go-to-page`}\n value={pagePickerValue}\n width=\"min(4rem, 100%)\"\n onChange={onPageChange}\n aria-invalid={\n pagePickerValue &&\n pagePickerValue !==\n String(currentPage + 1)\n ? \"true\"\n : undefined\n }\n />\n </div>\n )}\n <ul>\n <li>\n <IconButton\n className=\"jkl-table-pagination__previous\"\n title={labels.previous}\n onClick={onPrevious}\n >\n <ChevronLeftIcon />\n </IconButton>\n </li>\n <PaginationPages\n id={id}\n activePage={activePage}\n numberOfPages={numberOfPages}\n onPageClick={onPageClick}\n />\n <li>\n <IconButton\n className=\"jkl-table-pagination__next\"\n title={labels.next}\n onClick={onNext}\n >\n <ChevronRightIcon />\n </IconButton>\n </li>\n </ul>\n </nav>\n )}\n </div>\n </div>\n );\n },\n);\n\nconst PaginationPages: FC<{\n id: string;\n activePage: number;\n numberOfPages: number;\n onPageClick: MouseEventHandler;\n}> = ({ id, activePage, numberOfPages, onPageClick }) => {\n if (numberOfPages <= 7) {\n return (\n <>\n {Array.from({ length: numberOfPages }).map((_, i) => (\n <li key={`${id}-page-${i}`}>\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\":\n activePage === i,\n })}\n type=\"button\"\n data-number={i}\n onClick={onPageClick}\n >\n {i + 1}\n </button>\n </li>\n ))}\n </>\n );\n }\n\n const showStartEllipsis = activePage > 3 && numberOfPages > 7;\n const showEndEllipsis = activePage < numberOfPages - 4 && numberOfPages > 7;\n\n const startEllipsis = Math.min(\n Math.max(activePage - 2, 1),\n numberOfPages - 6,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 5,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 4,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 3,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 2);\n\n return (\n <>\n <li>\n <PaginationPageButton\n isActive={activePage === 0}\n number={0}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showStartEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === startEllipsis}\n number={startEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberStart}\n number={centerPageNumberStart}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumber}\n number={centerPageNumber}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showEndEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === endEllipsis}\n number={endEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === numberOfPages - 1}\n number={numberOfPages - 1}\n onClick={onPageClick}\n />\n </li>\n </>\n );\n};\n\nconst PaginationPageButton: FC<{\n isActive: boolean;\n number: number;\n onClick: MouseEventHandler;\n}> = ({ isActive, number, onClick, ...rest }) => (\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\": isActive,\n })}\n type=\"button\"\n data-number={number}\n onClick={onClick}\n {...rest}\n >\n {number + 1}\n </button>\n);\n\nTablePagination.displayName = \"TablePagination\";\n"],"names":["TablePagination","forwardRef","props","ref","activePage","totalNumberOfRows","rowsPerPage","rowsPerPageItems","className","density","id","idProp","withGoToPage","onChange","onChangeRowsPerPage","labels","previous","next","rest","useId","generateSuffix","contextDensity","useTableContext","numberOfPages","Math","ceil","currentPage","setCurrentPage","useState","min","num","max","clamp","onPageClick","useCallback","e","toPage","Number","parseInt","currentTarget","dataset","number","setPagePickerValue","String","pagePickerValue","onPageChange","target","value","isNaN","onPrevious","onNext","jsxs","clsx","children","jsx","NativeSelect","label","labelProps","srOnly","name","items","map","i","width","inline","gotoLabel","TextInput","IconButton","title","onClick","ChevronLeftIcon","PaginationPages","ChevronRightIcon","Fragment","Array","from","length","_","type","showStartEllipsis","showEndEllipsis","startEllipsis","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","PaginationPageButton","isActive","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"TablePagination.js","sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useCallback,\n useState,\n type ChangeEventHandler,\n type FC,\n type MouseEventHandler,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { ChevronLeftIcon } from \"../icon/icons/ChevronLeftIcon.js\";\nimport { ChevronRightIcon } from \"../icon/icons/ChevronRightIcon.js\";\nimport { NativeSelect } from \"../select/NativeSelect.js\";\nimport { TextInput } from \"../text-input/TextInput.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TablePaginationProps } from \"./types.js\";\n\nfunction clamp(min: number, num: number, max: number): number {\n if (num < min) {\n return min;\n }\n\n if (num > max) {\n return max;\n }\n\n return num;\n}\n\nexport const TablePagination = forwardRef<HTMLDivElement, TablePaginationProps>(\n (props, ref) => {\n const {\n activePage = 0,\n totalNumberOfRows,\n rowsPerPage,\n rowsPerPageItems,\n className,\n density,\n id: idProp,\n withGoToPage = false,\n onChange,\n onChangeRowsPerPage,\n labels = {\n rowsPerPage: \"Rader per side\",\n previous: \"Forrige\",\n next: \"Neste\",\n },\n ...rest\n } = props;\n\n const id = useId(idProp \|\| \"jkl-table-pagination\", {\n generateSuffix: !idProp,\n });\n const { density: contextDensity } = useTableContext();\n\n const showAll = rowsPerPage <= 0;\n const numberOfPages = showAll\n ? 1\n : Math.ceil(totalNumberOfRows / rowsPerPage);\n\n const [currentPage, setCurrentPage] = useState(\n clamp(0, activePage, numberOfPages - 1),\n );\n\n const onPageClick: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n const toPage = Number.parseInt(\n e.currentTarget.dataset.number as string,\n );\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const [pagePickerValue, setPagePickerValue] = useState(\n String(currentPage + 1),\n );\n const onPageChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n setPagePickerValue(e.target.value);\n try {\n const toPage = Number.parseInt(e.target.value) - 1;\n if (Number.isNaN(toPage)) {\n return;\n }\n\n if (toPage >= 0 && toPage < numberOfPages) {\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n }\n } catch {\n return;\n }\n },\n [onChange, currentPage, numberOfPages],\n );\n\n const onPrevious: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === 0) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage - 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const onNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === numberOfPages - 1) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage + 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, numberOfPages, currentPage],\n );\n\n return (\n <div\n className={clsx(\"jkl-table-pagination\", className)}\n {...rest}\n id={id}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n <div className=\"jkl-table-pagination__left\">\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--rows\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {labels.rowsPerPage}:\n </span>\n <NativeSelect\n className=\"jkl-table-pagination__picker-input\"\n label={labels.rowsPerPage}\n labelProps={{ srOnly: true }}\n name={`${id}-rows-per-page`}\n items={rowsPerPageItems.map((i) =>\n typeof i === \"number\"\n ? String(i)\n : {\n label: i.label,\n value: String(i.value),\n },\n )}\n value={String(rowsPerPage)}\n onChange={onChangeRowsPerPage}\n width=\"min(8rem, 100%)\"\n inline\n />\n </div>\n </div>\n <div className=\"jkl-table-pagination__right\">\n {numberOfPages !== 1 && (\n <nav className=\"jkl-table-pagination__nav\">\n {withGoToPage && (\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--page\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"}\n :\n </span>\n {/* onChange først ved enter/submit */}\n <TextInput\n className=\"jkl-table-pagination__picker-input\"\n label={\n typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"\n }\n labelProps={{ srOnly: true }}\n name={`${id}-go-to-page`}\n value={pagePickerValue}\n width=\"min(4rem, 100%)\"\n onChange={onPageChange}\n aria-invalid={\n pagePickerValue &&\n pagePickerValue !==\n String(currentPage + 1)\n ? \"true\"\n : undefined\n }\n />\n </div>\n )}\n <ul>\n <li>\n <IconButton\n className=\"jkl-table-pagination__previous\"\n title={labels.previous}\n onClick={onPrevious}\n >\n <ChevronLeftIcon />\n </IconButton>\n </li>\n <PaginationPages\n id={id}\n activePage={activePage}\n numberOfPages={numberOfPages}\n onPageClick={onPageClick}\n />\n <li>\n <IconButton\n className=\"jkl-table-pagination__next\"\n title={labels.next}\n onClick={onNext}\n >\n <ChevronRightIcon />\n </IconButton>\n </li>\n </ul>\n </nav>\n )}\n </div>\n </div>\n );\n },\n);\n\nconst PaginationPages: FC<{\n id: string;\n activePage: number;\n numberOfPages: number;\n onPageClick: MouseEventHandler;\n}> = ({ id, activePage, numberOfPages, onPageClick }) => {\n if (numberOfPages <= 7) {\n return (\n <>\n {Array.from({ length: numberOfPages }).map((_, i) => (\n <li key={`${id}-page-${i}`}>\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\":\n activePage === i,\n })}\n type=\"button\"\n data-number={i}\n onClick={onPageClick}\n >\n {i + 1}\n </button>\n </li>\n ))}\n </>\n );\n }\n\n const showStartEllipsis = activePage > 3 && numberOfPages > 7;\n const showEndEllipsis = activePage < numberOfPages - 4 && numberOfPages > 7;\n\n const startEllipsis = Math.min(\n Math.max(activePage - 2, 1),\n numberOfPages - 6,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 5,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 4,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 3,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 2);\n\n return (\n <>\n <li>\n <PaginationPageButton\n isActive={activePage === 0}\n number={0}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showStartEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === startEllipsis}\n number={startEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberStart}\n number={centerPageNumberStart}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumber}\n number={centerPageNumber}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showEndEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === endEllipsis}\n number={endEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === numberOfPages - 1}\n number={numberOfPages - 1}\n onClick={onPageClick}\n />\n </li>\n </>\n );\n};\n\nconst PaginationPageButton: FC<{\n isActive: boolean;\n number: number;\n onClick: MouseEventHandler;\n}> = ({ isActive, number, onClick, ...rest }) => (\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\": isActive,\n })}\n type=\"button\"\n data-number={number}\n onClick={onClick}\n {...rest}\n >\n {number + 1}\n </button>\n);\n\nTablePagination.displayName = \"TablePagination\";\n"],"names":["TablePagination","forwardRef","props","ref","activePage","totalNumberOfRows","rowsPerPage","rowsPerPageItems","className","density","id","idProp","withGoToPage","onChange","onChangeRowsPerPage","labels","previous","next","rest","useId","generateSuffix","contextDensity","useTableContext","numberOfPages","Math","ceil","currentPage","setCurrentPage","useState","min","num","max","clamp","onPageClick","useCallback","e","toPage","Number","parseInt","currentTarget","dataset","number","setPagePickerValue","String","pagePickerValue","onPageChange","target","value","isNaN","onPrevious","onNext","jsxs","clsx","children","jsx","NativeSelect","label","labelProps","srOnly","name","items","map","i","width","inline","gotoLabel","TextInput","IconButton","title","onClick","ChevronLeftIcon","PaginationPages","ChevronRightIcon","Fragment","Array","from","length","_","type","showStartEllipsis","showEndEllipsis","startEllipsis","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","PaginationPageButton","isActive","displayName"],"mappings":"ykBA8BO,MAAMA,EAAkBC,GAC3B,CAACC,EAAOC,KACE,MACFC,WAAAA,EAAa,EACbC,kBAAAA,EACAC,YAAAA,EACAC,iBAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,GAAIC,EACJC,aAAAA,GAAe,EACfC,SAAAA,EACAC,oBAAAA,EACAC,OAAAA,EAAS,CACLT,YAAa,iBACbU,SAAU,UACVC,KAAM,YAEPC,GACHhB,EAEEQ,EAAKS,EAAMR,GAAU,uBAAwB,CAC/CS,gBAAiBT,KAEbF,QAASY,GAAmBC,IAG9BC,EADUjB,GAAe,EAEzB,EACAkB,KAAKC,KAAKpB,EAAoBC,IAE7BoB,EAAaC,GAAkBC,EA3C9C,SAAeC,EAAaC,EAAaC,GACrC,OAAID,EAAMD,EACCA,EAGPC,EAAMC,EACCA,EAGJD,CACX,CAkCYE,CAAM,EAAG5B,EAAYmB,EAAgB,IAGnCU,EAAoDC,GACrDC,IACG,MAAMC,EAASC,OAAOC,SAClBH,EAAEI,cAAcC,QAAQC,QAEnB5B,EAAAsB,EAAGC,EAAQV,GACpBC,EAAeS,GACIM,EAAAC,OAAOP,EAAS,GAAE,GAEzC,CAACvB,EAAUa,KAGRkB,EAAiBF,GAAsBd,EAC1Ce,OAAOjB,EAAc,IAEnBmB,EAAqDX,GACtDC,IACsBO,EAAAP,EAAEW,OAAOC,OACxB,IACA,MAAMX,EAASC,OAAOC,SAASH,EAAEW,OAAOC,OAAS,EAC7C,GAAAV,OAAOW,MAAMZ,GACb,OAGAA,GAAU,GAAKA,EAASb,IACfV,EAAAsB,EAAGC,EAAQV,GACpBC,EAAeS,GACnB,CACI,MACJ,MACJ,IAEJ,CAACvB,EAAUa,EAAaH,IAGtB0B,EAAmDf,GACpDC,IACG,GAAoB,IAAhBT,EAGA,YADSb,EAAAsB,EAAGT,EAAaA,GAG7B,MAAMU,EAASV,EAAc,EACpBb,EAAAsB,EAAGC,EAAQV,GACpBC,EAAeS,GACIM,EAAAC,OAAOP,EAAS,GAAE,GAEzC,CAACvB,EAAUa,IAGTwB,EAA+ChB,GAChDC,IACOT,GAAAA,IAAgBH,EAAgB,EAGhC,YADSV,EAAAsB,EAAGT,EAAaA,GAG7B,MAAMU,EAASV,EAAc,EACpBb,EAAAsB,EAAGC,EAAQV,GACpBC,EAAeS,GACIM,EAAAC,OAAOP,EAAS,GAAE,GAEzC,CAACvB,EAAUU,EAAeG,IAI1B,OAAAyB,EAAC,MAAA,CACG3C,UAAW4C,EAAK,uBAAwB5C,MACpCU,EACJR,GAAAA,EACA,eAAcD,GAAWY,EACzBlB,IAAAA,EAEAkD,SAAA,CAAAC,EAAC,OAAI9C,UAAU,6BACX6C,SAACF,EAAA,MAAA,CAAI3C,UAAU,kEACX6C,SAAA,CAAAF,EAAC,OAAA,CACG3C,UAAU,qCACV,cAAY,OAEX6C,SAAA,CAAOtC,EAAAT,YAAY,OAExBgD,EAACC,EAAA,CACG/C,UAAU,qCACVgD,MAAOzC,EAAOT,YACdmD,WAAY,CAAEC,QAAQ,GACtBC,KAAM,GAAGjD,kBACTkD,MAAOrD,EAAiBsD,KAAKC,GACZ,iBAANA,EACDnB,OAAOmB,GACP,CACIN,MAAOM,EAAEN,MACTT,MAAOJ,OAAOmB,EAAEf,UAG9BA,MAAOJ,OAAOrC,GACdO,SAAUC,EACViD,MAAM,kBACNC,QAAM,SAIlBV,EAAC,OAAI9C,UAAU,8BACV6C,SAAkB,OACfF,EAAC,MAAI,CAAA3C,UAAU,4BACV6C,SAAA,CACGzC,GAAAuC,EAAC,MAAI,CAAA3C,UAAU,kEACX6C,SAAA,CAAAF,EAAC,OAAA,CACG3C,UAAU,qCACV,cAAY,OAEX6C,SAAA,CAAwB,iBAAjBzC,EACFA,EAAaqD,UACb,cAAc,OAIxBX,EAACY,EAAA,CACG1D,UAAU,qCACVgD,MAC4B,iBAAjB5C,EACDA,EAAaqD,UACb,cAEVR,WAAY,CAAEC,QAAQ,GACtBC,KAAM,GAAGjD,eACTqC,MAAOH,EACPmB,MAAM,kBACNlD,SAAUgC,EACV,eACID,GACAA,IACID,OAAOjB,EAAc,GACnB,YACA,SAKrB,KACG,CAAA2B,SAAA,CAAAC,EAAC,KACG,CAAAD,SAAAC,EAACa,EAAA,CACG3D,UAAU,iCACV4D,MAAOrD,EAAOC,SACdqD,QAASpB,EAETI,WAACiB,EAAgB,QAGzBhB,EAACiB,EAAA,CACG7D,GAAAA,EACAN,WAAAA,EACAmB,cAAAA,EACAU,YAAAA,MAEH,KACG,CAAAoB,SAAAC,EAACa,EAAA,CACG3D,UAAU,6BACV4D,MAAOrD,EAAOE,KACdoD,QAASnB,EAETG,WAACmB,EAAiB,kBAM1C,IAMVD,EAKD,EAAG7D,GAAAA,EAAIN,WAAAA,EAAYmB,cAAAA,EAAeU,YAAAA,MACnC,GAAIV,GAAiB,EAGR,OAAA+B,EAAAmB,EAAA,CAAApB,SAAAqB,MAAMC,KAAK,CAAEC,OAAQrD,IAAiBsC,KAAI,CAACgB,EAAGf,MAC1C,KACG,CAAAT,SAAAC,EAAC,SAAA,CACG9C,UAAW4C,EAAK,6BAA8B,CAC1C,qCACIhD,IAAe0D,IAEvBgB,KAAK,SACL,cAAahB,EACbO,QAASpC,EAERoB,SAAIS,EAAA,KAVJ,GAAGpD,UAAWoD,SAkBjC,MAAAiB,EAAoB3E,EAAa,GAAKmB,EAAgB,EACtDyD,EAAkB5E,EAAamB,EAAgB,GAAKA,EAAgB,EAEpE0D,EAAgBzD,KAAKK,IACvBL,KAAKO,IAAI3B,EAAa,EAAG,GACzBmB,EAAgB,GAEd2D,EAAwB1D,KAAKK,IAC/BoD,EAAgB,EAChB1D,EAAgB,GAEd4D,EAAmB3D,KAAKK,IAC1BqD,EAAwB,EACxB3D,EAAgB,GAEd6D,EAAsB5D,KAAKK,IAC7BqD,EAAwB,EACxB3D,EAAgB,GAEd8D,EAAc7D,KAAKK,IAAIqD,EAAwB,EAAG3D,EAAgB,GAExE,OAEQ4B,EAAAsB,EAAA,CAAApB,SAAA,CAAAC,EAAC,KACG,CAAAD,SAAAC,EAACgC,EAAA,CACGC,SAAyB,IAAfnF,EACVqC,OAAQ,EACR4B,QAASpC,MAGjBqB,EAAC,MACID,SACG0B,EAAAzB,EAAC,OAAA,CACG9C,UAAU,iCACV,eAAW,EAEV6C,SAAA,QAGLC,EAACgC,EAAA,CACGC,SAAUnF,IAAe6E,EACzBxC,OAAQwC,EACRZ,QAASpC,QAIpB,KACG,CAAAoB,SAAAC,EAACgC,EAAA,CACGC,SAAUnF,IAAe8E,EACzBzC,OAAQyC,EACRb,QAASpC,QAGhB,KACG,CAAAoB,SAAAC,EAACgC,EAAA,CACGC,SAAUnF,IAAe+E,EACzB1C,OAAQ0C,EACRd,QAASpC,QAGhB,KACG,CAAAoB,SAAAC,EAACgC,EAAA,CACGC,SAAUnF,IAAegF,EACzB3C,OAAQ2C,EACRf,QAASpC,MAGjBqB,EAAC,MACID,SACG2B,EAAA1B,EAAC,OAAA,CACG9C,UAAU,iCACV,eAAW,EAEV6C,SAAA,QAGLC,EAACgC,EAAA,CACGC,SAAUnF,IAAeiF,EACzB5C,OAAQ4C,EACRhB,QAASpC,QAIpB,KACG,CAAAoB,SAAAC,EAACgC,EAAA,CACGC,SAAUnF,IAAemB,EAAgB,EACzCkB,OAAQlB,EAAgB,EACxB8C,QAASpC,QAGrB,EAIFqD,EAID,EAAGC,SAAAA,EAAU9C,OAAAA,EAAQ4B,QAAAA,KAAYnD,KAClCoC,EAAC,SAAA,CACG9C,UAAW4C,EAAK,6BAA8B,CAC1C,qCAAsCmC,IAE1CT,KAAK,SACL,cAAarC,EACb4B,QAAAA,KACInD,EAEHmC,SAASZ,EAAA,IAIlBzC,EAAgBwF,YAAc"}

package/build/es/components/table/TableRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableRow.js","sources":["../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { useTableSectionContext } from \"./tableSectionContext.js\";\nimport { TableRowProps } from \"./types.js\";\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n ({ className, clickable, children, ...rest }, ref) => {\n const { density } = useTableContext();\n const { isTableBody } = useTableSectionContext();\n\n const [clicked, setClicked] = useState(clickable?.isClicked \|\| false);\n\n useEffect(() => {\n setClicked((prev) =>\n clickable?.isClicked !== undefined ? clickable.isClicked : prev,\n );\n }, [clickable?.isClicked]);\n\n if (isTableBody && clickable) {\n return (\n <tr\n onClick={function handleOnClick(e) {\n setClicked(!clicked);\n clickable.onClick(e);\n }}\n onKeyPress={function handleKeyPress(e) {\n if (e.key === \" \" \|\| e.key === \"Enter\") {\n e.preventDefault();\n setClicked(!clicked);\n clickable.onClick(e);\n }\n }}\n data-testid=\"jkl-clickable-table-row\"\n className={clsx(\n \"jkl-table-row\",\n \"jkl-table-row--clickable\",\n className,\n {\n [\"jkl-table-row--clicked\"]:\n clickable?.markClickedRows && clicked,\n },\n )}\n aria-label=\"Klikkbar rad\"\n aria-pressed={\n clickable?.markClickedRows\n ? clicked\n ? \"true\"\n : \"false\"\n : undefined\n }\n tabIndex={0}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children}\n </tr>\n );\n }\n\n return (\n <tr\n className={clsx(\"jkl-table-row\", className)}\n {...rest}\n ref={ref}\n data-density={density}\n >\n {children}\n </tr>\n );\n },\n);\n\nTableRow.displayName = \"TableRow\";\n\nexport { TableRow };\n"],"names":["TableRow","forwardRef","className","clickable","children","rest","ref","density","useTableContext","isTableBody","useTableSectionContext","clicked","setClicked","useState","isClicked","useEffect","prev","jsx","onClick","e","onKeyPress","key","preventDefault","clsx","markClickedRows","tabIndex","displayName"],"mappings":"4QAMA,MAAMA,EAAWC,GACb,EAAGC,UAAAA,EAAWC,UAAAA,EAAWC,SAAAA,KAAaC,GAAQC,KACpC,MAAEC,QAAAA,GAAYC,KACZC,YAAAA,GAAgBC,KAEjBC,EAASC,GAAcC,GAAS,MAAAV,OAAA,EAAAA,EAAWW,aAAa,GAQ/D,OANAC,GAAU,KACNH,GAAYI,QACiB,KAAzB,MAAAb,OAAA,EAAAA,EAAWW,WAA0BX,EAAUW,UAAYE,GAAA,GAEhE,CAAC,MAAAb,OAAAA,EAAAA,EAAWW,YAIPG,EAAC,KAFLR,GAAeN,EAEV,CACGe,QAAS,SAAuBC,GAC5BP,GAAYD,GACZR,EAAUe,QAAQC,EACtB,EACAC,WAAY,SAAwBD,IAClB,MAAVA,EAAEE,KAAyB,UAAVF,EAAEE,OACnBF,EAAEG,iBACFV,GAAYD,GACZR,EAAUe,QAAQC,GAE1B,EACA,cAAY,0BACZjB,UAAWqB,EACP,gBACA,2BACArB,EACA,CACK,0BACG,MAAAC,OAAAA,EAAAA,EAAWqB,kBAAmBb,IAG1C,aAAW,eACX,eACI,MAAAR,GAAAA,EAAWqB,gBACLb,EACI,OACA,aACJ,EAEVc,SAAU,KACNpB,EACJ,eAAcE,EACdD,IAAAA,EAECF,SAAAA,GAMR,CACGF,UAAWqB,EAAK,gBAAiBrB,MAC7BG,EACJC,IAAAA,EACA,eAAcC,EAEbH,SAAAA,GAAA,IAMjBJ,EAAS0B,YAAc"}
1	+ {"version":3,"file":"TableRow.js","sources":["../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { useTableSectionContext } from \"./tableSectionContext.js\";\nimport type { TableRowProps } from \"./types.js\";\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n ({ className, clickable, children, ...rest }, ref) => {\n const { density } = useTableContext();\n const { isTableBody } = useTableSectionContext();\n\n const [clicked, setClicked] = useState(clickable?.isClicked \|\| false);\n\n useEffect(() => {\n setClicked((prev) =>\n clickable?.isClicked !== undefined ? clickable.isClicked : prev,\n );\n }, [clickable?.isClicked]);\n\n if (isTableBody && clickable) {\n return (\n <tr\n onClick={function handleOnClick(e) {\n setClicked(!clicked);\n clickable.onClick(e);\n }}\n onKeyPress={function handleKeyPress(e) {\n if (e.key === \" \" \|\| e.key === \"Enter\") {\n e.preventDefault();\n setClicked(!clicked);\n clickable.onClick(e);\n }\n }}\n data-testid=\"jkl-clickable-table-row\"\n className={clsx(\n \"jkl-table-row\",\n \"jkl-table-row--clickable\",\n className,\n {\n [\"jkl-table-row--clicked\"]:\n clickable?.markClickedRows && clicked,\n },\n )}\n aria-label=\"Klikkbar rad\"\n aria-pressed={\n clickable?.markClickedRows\n ? clicked\n ? \"true\"\n : \"false\"\n : undefined\n }\n tabIndex={0}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children}\n </tr>\n );\n }\n\n return (\n <tr\n className={clsx(\"jkl-table-row\", className)}\n {...rest}\n ref={ref}\n data-density={density}\n >\n {children}\n </tr>\n );\n },\n);\n\nTableRow.displayName = \"TableRow\";\n\nexport { TableRow };\n"],"names":["TableRow","forwardRef","className","clickable","children","rest","ref","density","useTableContext","isTableBody","useTableSectionContext","clicked","setClicked","useState","isClicked","useEffect","prev","jsx","onClick","e","onKeyPress","key","preventDefault","clsx","markClickedRows","tabIndex","displayName"],"mappings":"4QAMA,MAAMA,EAAWC,GACb,EAAGC,UAAAA,EAAWC,UAAAA,EAAWC,SAAAA,KAAaC,GAAQC,KACpC,MAAEC,QAAAA,GAAYC,KACZC,YAAAA,GAAgBC,KAEjBC,EAASC,GAAcC,GAAS,MAAAV,OAAA,EAAAA,EAAWW,aAAa,GAQ/D,OANAC,GAAU,KACNH,GAAYI,QACiB,KAAzB,MAAAb,OAAA,EAAAA,EAAWW,WAA0BX,EAAUW,UAAYE,GAAA,GAEhE,CAAC,MAAAb,OAAAA,EAAAA,EAAWW,YAIPG,EAAC,KAFLR,GAAeN,EAEV,CACGe,QAAS,SAAuBC,GAC5BP,GAAYD,GACZR,EAAUe,QAAQC,EACtB,EACAC,WAAY,SAAwBD,IAClB,MAAVA,EAAEE,KAAyB,UAAVF,EAAEE,OACnBF,EAAEG,iBACFV,GAAYD,GACZR,EAAUe,QAAQC,GAE1B,EACA,cAAY,0BACZjB,UAAWqB,EACP,gBACA,2BACArB,EACA,CACK,0BACG,MAAAC,OAAAA,EAAAA,EAAWqB,kBAAmBb,IAG1C,aAAW,eACX,eACI,MAAAR,GAAAA,EAAWqB,gBACLb,EACI,OACA,aACJ,EAEVc,SAAU,KACNpB,EACJ,eAAcE,EACdD,IAAAA,EAECF,SAAAA,GAMR,CACGF,UAAWqB,EAAK,gBAAiBrB,MAC7BG,EACJC,IAAAA,EACA,eAAcC,EAEbH,SAAAA,GAAA,IAMjBJ,EAAS0B,YAAc"}

package/build/es/components/table/tableContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tableContext.js","sources":["../../../../src/components/table/tableContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport { TableContext, TableContextProviderProps } from \"./types.js\";\n\nconst tableContext = createContext<TableContext>({\n density: undefined,\n collapseToList: false,\n setHasStickyHead: () => {},\n});\n\nexport const useTableContext = (): TableContext => useContext(tableContext);\n\nexport const TableContextProvider: React.FC<TableContextProviderProps> = ({\n state,\n children,\n}) => <tableContext.Provider value={state}>{children}</tableContext.Provider>;\n"],"names":["tableContext","createContext","density","collapseToList","setHasStickyHead","useTableContext","useContext","TableContextProvider","state","children","Provider","value"],"mappings":"8FAGA,MAAMA,EAAeC,EAA4B,CAC7CC,aAAS,EACTC,gBAAgB,EAChBC,iBAAkB,SAGTC,EAAkB,IAAoBC,EAAWN,GAEjDO,EAA4D,EACrEC,MAAAA,EACAC,SAAAA,OACGT,EAAaU,SAAb,CAAsBC,MAAOH,EAAQC,SAAAA"}
1	+ {"version":3,"file":"tableContext.js","sources":["../../../../src/components/table/tableContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport type { TableContext, TableContextProviderProps } from \"./types.js\";\n\nconst tableContext = createContext<TableContext>({\n density: undefined,\n collapseToList: false,\n setHasStickyHead: () => {},\n});\n\nexport const useTableContext = (): TableContext => useContext(tableContext);\n\nexport const TableContextProvider: React.FC<TableContextProviderProps> = ({\n state,\n children,\n}) => <tableContext.Provider value={state}>{children}</tableContext.Provider>;\n"],"names":["tableContext","createContext","density","collapseToList","setHasStickyHead","useTableContext","useContext","TableContextProvider","state","children","Provider","value"],"mappings":"8FAGA,MAAMA,EAAeC,EAA4B,CAC7CC,aAAS,EACTC,gBAAgB,EAChBC,iBAAkB,SAGTC,EAAkB,IAAoBC,EAAWN,GAEjDO,EAA4D,EACrEC,MAAAA,EACAC,SAAAA,OACGT,EAAaU,SAAb,CAAsBC,MAAOH,EAAQC,SAAAA"}

package/build/es/components/table/tableSectionContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tableSectionContext.js","sources":["../../../../src/components/table/tableSectionContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport {\n TableSectionContext,\n TableSectionContextProviderProps,\n} from \"./types.js\";\n\nconst tableSectionContext = createContext<TableSectionContext>({\n isTableHead: false,\n isTableBody: false,\n isTableFooter: false,\n});\n\nexport const useTableSectionContext = (): TableSectionContext =>\n useContext(tableSectionContext);\n\nexport const TableSectionContextProvider: React.FC<\n TableSectionContextProviderProps\n> = ({ state, children }) => (\n <tableSectionContext.Provider value={state}>\n {children}\n </tableSectionContext.Provider>\n);\n"],"names":["tableSectionContext","createContext","isTableHead","isTableBody","isTableFooter","useTableSectionContext","useContext","TableSectionContextProvider","state","children","jsx","Provider","value"],"mappings":"8FAMA,MAAMA,EAAsBC,EAAmC,CAC3DC,aAAa,EACbC,aAAa,EACbC,eAAe,IAGNC,EAAyB,IAClCC,EAAWN,GAEFO,EAET,EAAGC,MAAAA,EAAOC,SAAAA,KACTC,EAAAV,EAAoBW,SAApB,CAA6BC,MAAOJ,EAChCC,SAAAA"}
1	+ {"version":3,"file":"tableSectionContext.js","sources":["../../../../src/components/table/tableSectionContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\";\nimport type {\n TableSectionContext,\n TableSectionContextProviderProps,\n} from \"./types.js\";\n\nconst tableSectionContext = createContext<TableSectionContext>({\n isTableHead: false,\n isTableBody: false,\n isTableFooter: false,\n});\n\nexport const useTableSectionContext = (): TableSectionContext =>\n useContext(tableSectionContext);\n\nexport const TableSectionContextProvider: React.FC<\n TableSectionContextProviderProps\n> = ({ state, children }) => (\n <tableSectionContext.Provider value={state}>\n {children}\n </tableSectionContext.Provider>\n);\n"],"names":["tableSectionContext","createContext","isTableHead","isTableBody","isTableFooter","useTableSectionContext","useContext","TableSectionContextProvider","state","children","jsx","Provider","value"],"mappings":"8FAMA,MAAMA,EAAsBC,EAAmC,CAC3DC,aAAa,EACbC,aAAa,EACbC,eAAe,IAGNC,EAAyB,IAClCC,EAAWN,GAEFO,EAET,EAAGC,MAAAA,EAAOC,SAAAA,KACTC,EAAAV,EAAoBW,SAApB,CAA6BC,MAAOJ,EAChCC,SAAAA"}

package/build/es/components/table/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import { TableSortDirection } from \"./TableHeader.js\";\n\nexport type TableSortProps = ReturnType<\n ReturnType<typeof useSortableTableHeader>[\"getSortProps\"]\n>[\"sortable\"];\n\nexport const useSortableTableHeader = (\n activeSortKey: string,\n activeSortDirection: TableSortDirection,\n onChange: (\n newSortKey: string,\n newSortDirection: TableSortDirection,\n ) => void,\n) => {\n const calculateNewSortParameters = (\n sortKey: string,\n ): TableSortDirection => {\n if (sortKey === activeSortKey && activeSortDirection === \"desc\") {\n return \"asc\";\n }\n\n return \"desc\";\n };\n\n const handleClick = (sortKey: string) => {\n const newSortParameters = calculateNewSortParameters(sortKey);\n onChange(sortKey, newSortParameters);\n };\n\n const getSortProps = (sortKey: string) => {\n return {\n sortable: {\n onClick: () => handleClick(sortKey),\n direction:\n activeSortKey === sortKey ? activeSortDirection : undefined,\n },\n };\n };\n\n return {\n getSortProps,\n };\n};\n"],"names":["useSortableTableHeader","activeSortKey","activeSortDirection","onChange","calculateNewSortParameters","handleClick","sortKey","newSortParameters","getSortProps","sortable","onClick","direction"],"mappings":"AAMO,MAAMA,EAAyB,CAClCC,EACAC,EACAC,KAKMC,MAUAC,EAAeC,IACXC,MAAAA,EAXyB,CAC/BD,GAEIA,IAAYL,GAAyC,SAAxBC,EACtB,MAGJ,OAImBE,CAA2BE,GACrDH,EAASG,EAASC,EAAiB,EAahC,MAAA,CACHC,aAXkBF,IACX,CACHG,SAAU,CACNC,QAAS,IAAML,EAAYC,GAC3BK,UACIV,IAAkBK,EAAUJ,OAAsB,KAM9D"}
1	+ {"version":3,"file":"utils.js","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import type { TableSortDirection } from \"./TableHeader.js\";\n\nexport type TableSortProps = ReturnType<\n ReturnType<typeof useSortableTableHeader>[\"getSortProps\"]\n>[\"sortable\"];\n\nexport const useSortableTableHeader = (\n activeSortKey: string,\n activeSortDirection: TableSortDirection,\n onChange: (\n newSortKey: string,\n newSortDirection: TableSortDirection,\n ) => void,\n) => {\n const calculateNewSortParameters = (\n sortKey: string,\n ): TableSortDirection => {\n if (sortKey === activeSortKey && activeSortDirection === \"desc\") {\n return \"asc\";\n }\n\n return \"desc\";\n };\n\n const handleClick = (sortKey: string) => {\n const newSortParameters = calculateNewSortParameters(sortKey);\n onChange(sortKey, newSortParameters);\n };\n\n const getSortProps = (sortKey: string) => {\n return {\n sortable: {\n onClick: () => handleClick(sortKey),\n direction:\n activeSortKey === sortKey ? activeSortDirection : undefined,\n },\n };\n };\n\n return {\n getSortProps,\n };\n};\n"],"names":["useSortableTableHeader","activeSortKey","activeSortDirection","onChange","calculateNewSortParameters","handleClick","sortKey","newSortParameters","getSortProps","sortable","onClick","direction"],"mappings":"AAMO,MAAMA,EAAyB,CAClCC,EACAC,EACAC,KAKMC,MAUAC,EAAeC,IACXC,MAAAA,EAXyB,CAC/BD,GAEIA,IAAYL,GAAyC,SAAxBC,EACtB,MAGJ,OAImBE,CAA2BE,GACrDH,EAASG,EAASC,EAAiB,EAahC,MAAA,CACHC,aAXkBF,IACX,CACHG,SAAU,CACNC,QAAS,IAAML,EAAYC,GAC3BK,UACIV,IAAkBK,EAAUJ,OAAsB,KAM9D"}

package/build/es/components/tabs/NavTab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavTab.js","sources":["../../../../src/components/tabs/NavTab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport { PolymorphicRef } from \"../../utilities/index.js\";\nimport { NavTabProps } from \"./types.js\";\n\ntype NavTabComponent = <ElementType extends React.ElementType = \"a\">(\n props: NavTabProps<ElementType>,\n) => React.ReactElement \| null;\n\nexport const NavTab = forwardRef(function NavTab<\n ElementType extends React.ElementType = \"a\",\n>(props: NavTabProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n as = \"a\",\n \"aria-selected\": selected,\n className,\n onBeforeKeyboardNavigation: onBeforeNavigate,\n ...rest\n } = props;\n\n const Component = as;\n\n const navigate = useCallback(\n (from: HTMLAnchorElement, to: HTMLAnchorElement) => {\n if (onBeforeNavigate) {\n // Åpne for å stoppe selve navigeringen hvis det skulle være behov for å gjøre noe custom med fokus og navigasjon\n const doNavigate = onBeforeNavigate(from, to);\n if (doNavigate === false) {\n return;\n }\n }\n\n to.focus();\n // Click brukes for å være router-agnostisk\n to.click();\n },\n [onBeforeNavigate],\n );\n\n const handleOnKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n navigate(current, prev as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.lastChild\n ?.previousSibling as HTMLAnchorElement,\n );\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"A\") {\n navigate(current, next as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.firstChild as HTMLAnchorElement,\n );\n }\n }\n },\n [navigate],\n );\n\n return (\n <Component\n ref={ref}\n {...rest}\n role=\"tab\"\n aria-selected={selected}\n className={clsx(\"jkl-tab\", className)}\n onKeyDown={handleOnKeyDown}\n // En faneliste skal være én fokuserbar gruppe.\n // Piltaster brukes for å veksle mellom faner.\n // Bare den aktive fanen skal være fokuserbar med tastatur.\n tabIndex={selected ? 0 : -1}\n />\n );\n}) as NavTabComponent;\n"],"names":["NavTab","forwardRef","props","ref","as","selected","className","onBeforeKeyboardNavigation","onBeforeNavigate","rest","Component","navigate","useCallback","from","to","focus","click","handleOnKeyDown","event","key","current","currentTarget","prev","previousSibling","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","clsx","onKeyDown","tabIndex"],"mappings":"0IASO,MAAMA,EAASC,GAAW,SAE/BC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,IACL,gBAAiBC,EACjBC,UAAAA,EACAC,2BAA4BC,KACzBC,GACHP,EAEEQ,EAAYN,EAEZO,EAAWC,GACb,CAACC,EAAyBC,KAClBN,IAGmB,IADAA,EAAiBK,EAAMC,KAM9CA,EAAGC,QAEHD,EAAGE,QAAM,GAEb,CAACR,IAGCS,EAAkBL,GACnBM,cACOA,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAG7BZ,EAASS,EADTE,IAKI,OAAAE,EAAA,OAAAC,EAAAL,EAAQM,sBAARD,EAAuBE,kBAAvBH,EACMD,iBAGlB,CAEIL,GAAc,eAAdA,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBO,EAAOV,EAAMG,cAAcQ,YAG7BD,GAA0B,MAAlBA,EAAKE,SACbnB,EAASS,EAASQ,GAElBjB,EACIS,EACA,OAAAW,EAAAX,EAAQM,oBAAR,EAAAK,EAAuBC,WAGnC,IAEJ,CAACrB,IAID,OAAAsB,EAACvB,EAAA,CACGP,IAAAA,KACIM,EACJyB,KAAK,MACL,gBAAe7B,EACfC,UAAW6B,EAAK,UAAW7B,GAC3B8B,UAAWnB,EAIXoB,SAAUhC,EAAW,GAAI,GAGrC"}
1	+ {"version":3,"file":"NavTab.js","sources":["../../../../src/components/tabs/NavTab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { NavTabProps } from \"./types.js\";\n\ntype NavTabComponent = <ElementType extends React.ElementType = \"a\">(\n props: NavTabProps<ElementType>,\n) => React.ReactElement \| null;\n\nexport const NavTab = forwardRef(function NavTab<\n ElementType extends React.ElementType = \"a\",\n>(props: NavTabProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n as = \"a\",\n \"aria-selected\": selected,\n className,\n onBeforeKeyboardNavigation: onBeforeNavigate,\n ...rest\n } = props;\n\n const Component = as;\n\n const navigate = useCallback(\n (from: HTMLAnchorElement, to: HTMLAnchorElement) => {\n if (onBeforeNavigate) {\n // Åpne for å stoppe selve navigeringen hvis det skulle være behov for å gjøre noe custom med fokus og navigasjon\n const doNavigate = onBeforeNavigate(from, to);\n if (doNavigate === false) {\n return;\n }\n }\n\n to.focus();\n // Click brukes for å være router-agnostisk\n to.click();\n },\n [onBeforeNavigate],\n );\n\n const handleOnKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n navigate(current, prev as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.lastChild\n ?.previousSibling as HTMLAnchorElement,\n );\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"A\") {\n navigate(current, next as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.firstChild as HTMLAnchorElement,\n );\n }\n }\n },\n [navigate],\n );\n\n return (\n <Component\n ref={ref}\n {...rest}\n role=\"tab\"\n aria-selected={selected}\n className={clsx(\"jkl-tab\", className)}\n onKeyDown={handleOnKeyDown}\n // En faneliste skal være én fokuserbar gruppe.\n // Piltaster brukes for å veksle mellom faner.\n // Bare den aktive fanen skal være fokuserbar med tastatur.\n tabIndex={selected ? 0 : -1}\n />\n );\n}) as NavTabComponent;\n"],"names":["NavTab","forwardRef","props","ref","as","selected","className","onBeforeKeyboardNavigation","onBeforeNavigate","rest","Component","navigate","useCallback","from","to","focus","click","handleOnKeyDown","event","key","current","currentTarget","prev","previousSibling","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","clsx","onKeyDown","tabIndex"],"mappings":"0IASO,MAAMA,EAASC,GAAW,SAE/BC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,IACL,gBAAiBC,EACjBC,UAAAA,EACAC,2BAA4BC,KACzBC,GACHP,EAEEQ,EAAYN,EAEZO,EAAWC,GACb,CAACC,EAAyBC,KAClBN,IAGmB,IADAA,EAAiBK,EAAMC,KAM9CA,EAAGC,QAEHD,EAAGE,QAAM,GAEb,CAACR,IAGCS,EAAkBL,GACnBM,cACOA,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAG7BZ,EAASS,EADTE,IAKI,OAAAE,EAAA,OAAAC,EAAAL,EAAQM,sBAARD,EAAuBE,kBAAvBH,EACMD,iBAGlB,CAEIL,GAAc,eAAdA,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBO,EAAOV,EAAMG,cAAcQ,YAG7BD,GAA0B,MAAlBA,EAAKE,SACbnB,EAASS,EAASQ,GAElBjB,EACIS,EACA,OAAAW,EAAAX,EAAQM,oBAAR,EAAAK,EAAuBC,WAGnC,IAEJ,CAACrB,IAID,OAAAsB,EAACvB,EAAA,CACGP,IAAAA,KACIM,EACJyB,KAAK,MACL,gBAAe7B,EACfC,UAAW6B,EAAK,UAAW7B,GAC3B8B,UAAWnB,EAIXoB,SAAUhC,EAAW,GAAI,GAGrC"}

package/build/es/components/tabs/NavTabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavTabs.js","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n \"aria-label\": ariaLabel,\n children,\n className,\n density = \"comfortable\",\n ...rest\n}: NavTabsProps) => {\n const [tabsRect, setTabsRect] = useState<DOMRect>();\n const [activeRect, setActiveRect] = useState<DOMRect>();\n\n const scrollRef = useRef<HTMLDivElement>(null);\n const tablistRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLElement>(null);\n\n const selectedIndex = React.Children.toArray(children).findIndex(\n (navTab) => {\n if (!React.isValidElement(navTab)) {\n return false;\n }\n return navTab.props[\"aria-selected\"] === true;\n },\n );\n\n useEffect(() => {\n if (tablistRef.current) {\n setTabsRect(tablistRef.current.getBoundingClientRect());\n }\n if (activeRef.current) {\n setActiveRect(activeRef.current.getBoundingClientRect());\n }\n }, [selectedIndex, density]);\n\n return (\n <div\n {...rest}\n data-layout-density={density}\n className={clsx(\"jkl-tabs\", className)}\n ref={scrollRef}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel}\n ref={tablistRef}\n className=\"jkl-tablist\"\n >\n {React.Children.map(children, (child, index) => {\n return React.isValidElement(child)\n ? React.cloneElement<any>(child, {\n ref:\n selectedIndex === index\n ? activeRef\n : undefined,\n })\n : null;\n })}\n <span\n className=\"jkl-tablist__indicator\"\n style={{\n left:\n (activeRect?.left \|\| 0) -\n (tabsRect?.left \|\| 0) +\n (scrollRef.current?.scrollLeft \|\| 0),\n bottom: -1,\n width:\n (activeRect?.width \|\| 0) -\n (density === \"compact\" ? 32 : 38),\n }}\n />\n </div>\n </div>\n );\n};\n"],"names":["NavTabs","ariaLabel","children","className","density","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","_a","scrollLeft","bottom","width"],"mappings":"+JAIO,MAAMA,EAAU,EACnB,aAAcC,EACdC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,iBACPC,YAEH,MAAOC,EAAUC,GAAeC,KACzBC,EAAYC,GAAiBF,IAE9BG,EAAYC,EAAuB,MACnCC,EAAaD,EAAuB,MACpCE,EAAYF,EAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQhB,GAAUiB,WAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,~~mBAI5B~~,OAAAC,GAAU,KACFV,EAAWW,SACCjB,EAAAM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACId,EAAAI,EAAUU,QAAQC,wBAAuB,GAE5D,CAACV,EAAeX,IAGfsB,EAAC,MAAA,IACOrB,EACJ,sBAAqBD,EACrBD,UAAWwB,EAAK,WAAYxB,GAC5ByB,IAAKjB,EAELT,SAAA2B,EAAC,MAAA,CACGC,KAAK,UACL,aAAY7B,EACZ2B,IAAKf,EACLV,UAAU,cAETD,SAAA,CAAAc,EAAMC,SAASc,IAAI7B,GAAU,CAAC8B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,OAEVY,EAAC,OAAA,CACGvB,UAAU,yBACVgC,MAAO,CACHC,OACK,MAAA3B,OAAA,EAAAA,EAAY2B,OAAQ,KACpB,MAAA9B,OAAA,EAAAA,EAAU8B,OAAQ,KAClB,OAAAC,EAAA1B,EAAUa,cAAV,EAAAa,EAAmBC,aAAc,GACtCC,QAAQ,EACRC,QACK,MAAA/B,OAAAA,EAAAA,EAAY+B,QAAS,IACT,YAAZpC,EAAwB,GAAK,WAG9C"}
1	+ {"version":3,"file":"NavTabs.js","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport type { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n \"aria-label\": ariaLabel,\n children,\n className,\n density = \"comfortable\",\n ...rest\n}: NavTabsProps) => {\n const [tabsRect, setTabsRect] = useState<DOMRect>();\n const [activeRect, setActiveRect] = useState<DOMRect>();\n\n const scrollRef = useRef<HTMLDivElement>(null);\n const tablistRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLElement>(null);\n\n const selectedIndex = React.Children.toArray(children).findIndex(\n (navTab) => {\n if (!React.isValidElement(navTab)) {\n return false;\n }\n return navTab.props[\"aria-selected\"] === true;\n },\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies:\n useEffect(() => {\n if (tablistRef.current) {\n setTabsRect(tablistRef.current.getBoundingClientRect());\n }\n if (activeRef.current) {\n setActiveRect(activeRef.current.getBoundingClientRect());\n }\n }, [selectedIndex, density]);\n\n return (\n <div\n {...rest}\n data-layout-density={density}\n className={clsx(\"jkl-tabs\", className)}\n ref={scrollRef}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel}\n ref={tablistRef}\n className=\"jkl-tablist\"\n >\n {React.Children.map(children, (child, index) => {\n return React.isValidElement(child)\n ? React.cloneElement<any>(child, {\n ref:\n selectedIndex === index\n ? activeRef\n : undefined,\n })\n : null;\n })}\n <span\n className=\"jkl-tablist__indicator\"\n style={{\n left:\n (activeRect?.left \|\| 0) -\n (tabsRect?.left \|\| 0) +\n (scrollRef.current?.scrollLeft \|\| 0),\n bottom: -1,\n width:\n (activeRect?.width \|\| 0) -\n (density === \"compact\" ? 32 : 38),\n }}\n />\n </div>\n </div>\n );\n};\n"],"names":["NavTabs","ariaLabel","children","className","density","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","_a","scrollLeft","bottom","width"],"mappings":"+JAIO,MAAMA,EAAU,EACnB,aAAcC,EACdC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,iBACPC,YAEH,MAAOC,EAAUC,GAAeC,KACzBC,EAAYC,GAAiBF,IAE9BG,EAAYC,EAAuB,MACnCC,EAAaD,EAAuB,MACpCE,EAAYF,EAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQhB,GAAUiB,WAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,mBAK5B,OAAAC,GAAU,KACFV,EAAWW,SACCjB,EAAAM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACId,EAAAI,EAAUU,QAAQC,wBAAuB,GAE5D,CAACV,EAAeX,IAGfsB,EAAC,MAAA,IACOrB,EACJ,sBAAqBD,EACrBD,UAAWwB,EAAK,WAAYxB,GAC5ByB,IAAKjB,EAELT,SAAA2B,EAAC,MAAA,CACGC,KAAK,UACL,aAAY7B,EACZ2B,IAAKf,EACLV,UAAU,cAETD,SAAA,CAAAc,EAAMC,SAASc,IAAI7B,GAAU,CAAC8B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,OAEVY,EAAC,OAAA,CACGvB,UAAU,yBACVgC,MAAO,CACHC,OACK,MAAA3B,OAAA,EAAAA,EAAY2B,OAAQ,KACpB,MAAA9B,OAAA,EAAAA,EAAU8B,OAAQ,KAClB,OAAAC,EAAA1B,EAAUa,cAAV,EAAAa,EAAmBC,aAAc,GACtCC,QAAQ,EACRC,QACK,MAAA/B,OAAAA,EAAAA,EAAY+B,QAAS,IACT,YAAZpC,EAAwB,GAAK,WAG9C"}

package/build/es/components/tabs/Tab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tab.js","sources":["../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { TabProps } from \"./types.js\";\n\n/*\n En Tab til bruk som element i TabList. Ikke funksjonell utenfor et TabList element.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tab = React.forwardRef<HTMLButtonElement, TabProps>(\n (props, ref) => {\n const classes = clsx(\"jkl-tab\", props.className);\n\n return (\n <button\n role=\"tab\"\n type=\"button\"\n ref={ref}\n {...props}\n className={classes}\n />\n );\n },\n);\n\nTab.displayName = \"Tab\";\n"],"names":["Tab","React","forwardRef","props","ref","classes","clsx","className","jsx","role","type","displayName"],"mappings":"2GASO,MAAMA,EAAMC,EAAMC,YACrB,CAACC,EAAOC,KACJ,MAAMC,EAAUC,EAAK,UAAWH,EAAMI,WAGlC,OAAAC,EAAC,SAAA,CACGC,KAAK,MACLC,KAAK,SACLN,IAAAA,KACID,EACJI,UAAWF,GAAA,IAM3BL,EAAIW,YAAc"}
1	+ {"version":3,"file":"Tab.js","sources":["../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabProps } from \"./types.js\";\n\n/*\n En Tab til bruk som element i TabList. Ikke funksjonell utenfor et TabList element.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tab = React.forwardRef<HTMLButtonElement, TabProps>(\n (props, ref) => {\n const classes = clsx(\"jkl-tab\", props.className);\n\n return (\n <button\n role=\"tab\"\n type=\"button\"\n ref={ref}\n {...props}\n className={classes}\n />\n );\n },\n);\n\nTab.displayName = \"Tab\";\n"],"names":["Tab","React","forwardRef","props","ref","classes","clsx","className","jsx","role","type","displayName"],"mappings":"2GASO,MAAMA,EAAMC,EAAMC,YACrB,CAACC,EAAOC,KACJ,MAAMC,EAAUC,EAAK,UAAWH,EAAMI,WAGlC,OAAAC,EAAC,SAAA,CACGC,KAAK,MACLC,KAAK,SACLN,IAAAA,KACID,EACJI,UAAWF,GAAA,IAM3BL,EAAIW,YAAc"}