@fremtind/jokul 0.64.2 → 0.66.1

package/build/cjs/components/icon/icons/ChevronLeftIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronLeftIcon.cjs","sources":["../../../../../src/components/icon/icons/ChevronLeftIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const ChevronLeftIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue314\"}</Icon>\n);\nChevronLeftIcon.displayName = \"ChevronLeftIcon\";\n"],"names":["ChevronLeftIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAAkCC,SAC1CC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAgBI,YAAc"}
+{"version":3,"file":"ChevronLeftIcon.cjs","sources":["../../../../../src/components/icon/icons/ChevronLeftIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ChevronLeftIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue314\"}</Icon>\n);\nChevronLeftIcon.displayName = \"ChevronLeftIcon\";\n"],"names":["ChevronLeftIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAAkCC,SAC1CC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAgBI,YAAc"}

package/build/cjs/components/icon/icons/ChevronRightIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="ChevronRightIcon",exports.ChevronRightIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="ChevronRightIcon",exports.ChevronRightIcon=t;
 //# sourceMappingURL=ChevronRightIcon.cjs.map

package/build/cjs/components/icon/icons/ChevronRightIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronRightIcon.cjs","sources":["../../../../../src/components/icon/icons/ChevronRightIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const ChevronRightIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue315\"}</Icon>\n);\nChevronRightIcon.displayName = \"ChevronRightIcon\";\n"],"names":["ChevronRightIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAAmCC,SAC3CC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAiBI,YAAc"}
+{"version":3,"file":"ChevronRightIcon.cjs","sources":["../../../../../src/components/icon/icons/ChevronRightIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ChevronRightIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue315\"}</Icon>\n);\nChevronRightIcon.displayName = \"ChevronRightIcon\";\n"],"names":["ChevronRightIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAAmCC,SAC3CC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAiBI,YAAc"}

package/build/cjs/components/icon/icons/ChevronUpIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="ChevronUpIcon",exports.ChevronUpIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="ChevronUpIcon",exports.ChevronUpIcon=o;
 //# sourceMappingURL=ChevronUpIcon.cjs.map

package/build/cjs/components/icon/icons/ChevronUpIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ChevronUpIcon.cjs","sources":["../../../../../src/components/icon/icons/ChevronUpIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const ChevronUpIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue316\"}</Icon>\n);\nChevronUpIcon.displayName = \"ChevronUpIcon\";\n"],"names":["ChevronUpIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}
+{"version":3,"file":"ChevronUpIcon.cjs","sources":["../../../../../src/components/icon/icons/ChevronUpIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ChevronUpIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue316\"}</Icon>\n);\nChevronUpIcon.displayName = \"ChevronUpIcon\";\n"],"names":["ChevronUpIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}

package/build/cjs/components/icon/icons/CloseIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Icon.cjs"),r=r=>e.jsx(o.Icon,{...r,children:""});r.displayName="CloseIcon",exports.CloseIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="CloseIcon",exports.CloseIcon=o;
 //# sourceMappingURL=CloseIcon.cjs.map

package/build/cjs/components/icon/icons/CloseIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CloseIcon.cjs","sources":["../../../../../src/components/icon/icons/CloseIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const CloseIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue5cd\"}</Icon>\n);\nCloseIcon.displayName = \"CloseIcon\";\n"],"names":["CloseIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA4BC,SACpCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAUI,YAAc"}
+{"version":3,"file":"CloseIcon.cjs","sources":["../../../../../src/components/icon/icons/CloseIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const CloseIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue5cd\"}</Icon>\n);\nCloseIcon.displayName = \"CloseIcon\";\n"],"names":["CloseIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA4BC,SACpCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAUI,YAAc"}

package/build/cjs/components/icon/icons/CopyIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Icon.cjs"),r=r=>e.jsx(o.Icon,{...r,children:""});r.displayName="CopyIcon",exports.CopyIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="CopyIcon",exports.CopyIcon=o;
 //# sourceMappingURL=CopyIcon.cjs.map

package/build/cjs/components/icon/icons/CopyIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"CopyIcon.cjs","sources":["../../../../../src/components/icon/icons/CopyIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const CopyIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue14d\"}</Icon>\n);\nCopyIcon.displayName = \"CopyIcon\";\n"],"names":["CopyIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}
+{"version":3,"file":"CopyIcon.cjs","sources":["../../../../../src/components/icon/icons/CopyIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const CopyIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue14d\"}</Icon>\n);\nCopyIcon.displayName = \"CopyIcon\";\n"],"names":["CopyIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}

package/build/cjs/components/icon/icons/DotsIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Icon.cjs"),r=r=>e.jsx(o.Icon,{...r,children:""});r.displayName="DotsIcon",exports.DotsIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="DotsIcon",exports.DotsIcon=t;
 //# sourceMappingURL=DotsIcon.cjs.map

package/build/cjs/components/icon/icons/DotsIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DotsIcon.cjs","sources":["../../../../../src/components/icon/icons/DotsIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const DotsIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue5d3\"}</Icon>\n);\nDotsIcon.displayName = \"DotsIcon\";\n"],"names":["DotsIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}
+{"version":3,"file":"DotsIcon.cjs","sources":["../../../../../src/components/icon/icons/DotsIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const DotsIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue5d3\"}</Icon>\n);\nDotsIcon.displayName = \"DotsIcon\";\n"],"names":["DotsIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}

package/build/cjs/components/icon/icons/DragIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="DragIcon",exports.DragIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="DragIcon",exports.DragIcon=t;
 //# sourceMappingURL=DragIcon.cjs.map

package/build/cjs/components/icon/icons/DragIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DragIcon.cjs","sources":["../../../../../src/components/icon/icons/DragIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const DragIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue945\"}</Icon>\n);\nDragIcon.displayName = \"DragIcon\";\n"],"names":["DragIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}
+{"version":3,"file":"DragIcon.cjs","sources":["../../../../../src/components/icon/icons/DragIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const DragIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue945\"}</Icon>\n);\nDragIcon.displayName = \"DragIcon\";\n"],"names":["DragIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}

package/build/cjs/components/icon/icons/ErrorIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),e=require("../Icon.cjs"),o=o=>r.jsx(e.Icon,{bold:!0,filled:!0,...o,children:""});o.displayName="ErrorIcon",exports.ErrorIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("react");const e=require("../Icon.cjs"),o=o=>r.jsx(e.Icon,{bold:!0,filled:!0,...o,children:""});o.displayName="ErrorIcon",exports.ErrorIcon=o;
 //# sourceMappingURL=ErrorIcon.cjs.map

package/build/cjs/components/icon/icons/ErrorIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorIcon.cjs","sources":["../../../../../src/components/icon/icons/ErrorIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const ErrorIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\uf8b6\"}\n    </Icon>\n);\nErrorIcon.displayName = \"ErrorIcon\";\n"],"names":["ErrorIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"8IAIaA,EAA4BC,GACpCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAAUO,YAAc"}
+{"version":3,"file":"ErrorIcon.cjs","sources":["../../../../../src/components/icon/icons/ErrorIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ErrorIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\uf8b6\"}\n    </Icon>\n);\nErrorIcon.displayName = \"ErrorIcon\";\n"],"names":["ErrorIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"qKAIaA,EAA4BC,GACpCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAAUO,YAAc"}

package/build/cjs/components/icon/icons/GreenCheckIcon.cjs

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

package/build/cjs/components/icon/icons/GreenCheckIcon.cjs.map

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

package/build/cjs/components/icon/icons/HamburgerIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="HamburgerIcon",exports.HamburgerIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="HamburgerIcon",exports.HamburgerIcon=t;
 //# sourceMappingURL=HamburgerIcon.cjs.map

package/build/cjs/components/icon/icons/HamburgerIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HamburgerIcon.cjs","sources":["../../../../../src/components/icon/icons/HamburgerIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const HamburgerIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue5d2\"}</Icon>\n);\nHamburgerIcon.displayName = \"HamburgerIcon\";\n"],"names":["HamburgerIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}
+{"version":3,"file":"HamburgerIcon.cjs","sources":["../../../../../src/components/icon/icons/HamburgerIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const HamburgerIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue5d2\"}</Icon>\n);\nHamburgerIcon.displayName = \"HamburgerIcon\";\n"],"names":["HamburgerIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}

package/build/cjs/components/icon/icons/InfoIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Icon.cjs"),r=r=>e.jsx(o.Icon,{bold:!0,filled:!0,...r,children:""});r.displayName="InfoIcon",exports.InfoIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{bold:!0,filled:!0,...o,children:""});o.displayName="InfoIcon",exports.InfoIcon=o;
 //# sourceMappingURL=InfoIcon.cjs.map

package/build/cjs/components/icon/icons/InfoIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"InfoIcon.cjs","sources":["../../../../../src/components/icon/icons/InfoIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const InfoIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\ue88e\"}\n    </Icon>\n);\nInfoIcon.displayName = \"InfoIcon\";\n"],"names":["InfoIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"8IAIaA,EAA2BC,GACnCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAASO,YAAc"}
+{"version":3,"file":"InfoIcon.cjs","sources":["../../../../../src/components/icon/icons/InfoIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const InfoIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\ue88e\"}\n    </Icon>\n);\nInfoIcon.displayName = \"InfoIcon\";\n"],"names":["InfoIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"qKAIaA,EAA2BC,GACnCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAASO,YAAc"}

package/build/cjs/components/icon/icons/LinkIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{...n,children:""});n.displayName="LinkIcon",exports.LinkIcon=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="LinkIcon",exports.LinkIcon=t;
 //# sourceMappingURL=LinkIcon.cjs.map

package/build/cjs/components/icon/icons/LinkIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"LinkIcon.cjs","sources":["../../../../../src/components/icon/icons/LinkIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const LinkIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue250\"}</Icon>\n);\nLinkIcon.displayName = \"LinkIcon\";\n"],"names":["LinkIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}
+{"version":3,"file":"LinkIcon.cjs","sources":["../../../../../src/components/icon/icons/LinkIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const LinkIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue250\"}</Icon>\n);\nLinkIcon.displayName = \"LinkIcon\";\n"],"names":["LinkIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}

package/build/cjs/components/icon/icons/MinusIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{...n,children:""});n.displayName="MinusIcon",exports.MinusIcon=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="MinusIcon",exports.MinusIcon=t;
 //# sourceMappingURL=MinusIcon.cjs.map

package/build/cjs/components/icon/icons/MinusIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"MinusIcon.cjs","sources":["../../../../../src/components/icon/icons/MinusIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const MinusIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue15b\"}</Icon>\n);\nMinusIcon.displayName = \"MinusIcon\";\n"],"names":["MinusIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA4BC,SACpCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAUI,YAAc"}
+{"version":3,"file":"MinusIcon.cjs","sources":["../../../../../src/components/icon/icons/MinusIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const MinusIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue15b\"}</Icon>\n);\nMinusIcon.displayName = \"MinusIcon\";\n"],"names":["MinusIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA4BC,SACpCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAUI,YAAc"}

package/build/cjs/components/icon/icons/OpenInNewIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("../Icon.cjs"),r=r=>e.jsx(n.Icon,{...r,children:""});r.displayName="OpenInNewIcon",exports.OpenInNewIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{...n,children:""});n.displayName="OpenInNewIcon",exports.OpenInNewIcon=n;
 //# sourceMappingURL=OpenInNewIcon.cjs.map

package/build/cjs/components/icon/icons/OpenInNewIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"OpenInNewIcon.cjs","sources":["../../../../../src/components/icon/icons/OpenInNewIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const OpenInNewIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue89e\"}</Icon>\n);\nOpenInNewIcon.displayName = \"OpenInNewIcon\";\n"],"names":["OpenInNewIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}
+{"version":3,"file":"OpenInNewIcon.cjs","sources":["../../../../../src/components/icon/icons/OpenInNewIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const OpenInNewIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue89e\"}</Icon>\n);\nOpenInNewIcon.displayName = \"OpenInNewIcon\";\n"],"names":["OpenInNewIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}

package/build/cjs/components/icon/icons/PenIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{...n,children:""});n.displayName="PenIcon",exports.PenIcon=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="PenIcon",exports.PenIcon=t;
 //# sourceMappingURL=PenIcon.cjs.map

package/build/cjs/components/icon/icons/PenIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PenIcon.cjs","sources":["../../../../../src/components/icon/icons/PenIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const PenIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\uf097\"}</Icon>\n);\nPenIcon.displayName = \"PenIcon\";\n"],"names":["PenIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA0BC,SAClCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAQI,YAAc"}
+{"version":3,"file":"PenIcon.cjs","sources":["../../../../../src/components/icon/icons/PenIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const PenIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\uf097\"}</Icon>\n);\nPenIcon.displayName = \"PenIcon\";\n"],"names":["PenIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA0BC,SAClCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAQI,YAAc"}

package/build/cjs/components/icon/icons/PlusIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="PlusIcon",exports.PlusIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="PlusIcon",exports.PlusIcon=t;
 //# sourceMappingURL=PlusIcon.cjs.map

package/build/cjs/components/icon/icons/PlusIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PlusIcon.cjs","sources":["../../../../../src/components/icon/icons/PlusIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const PlusIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue145\"}</Icon>\n);\nPlusIcon.displayName = \"PlusIcon\";\n"],"names":["PlusIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}
+{"version":3,"file":"PlusIcon.cjs","sources":["../../../../../src/components/icon/icons/PlusIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const PlusIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue145\"}</Icon>\n);\nPlusIcon.displayName = \"PlusIcon\";\n"],"names":["PlusIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA2BC,SACnCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAASI,YAAc"}

package/build/cjs/components/icon/icons/QuestionIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Icon.cjs"),r=r=>e.jsx(o.Icon,{...r,children:""});r.displayName="QuestionIcon",exports.QuestionIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="QuestionIcon",exports.QuestionIcon=t;
 //# sourceMappingURL=QuestionIcon.cjs.map

package/build/cjs/components/icon/icons/QuestionIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"QuestionIcon.cjs","sources":["../../../../../src/components/icon/icons/QuestionIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const QuestionIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8fd\"}</Icon>\n);\nQuestionIcon.displayName = \"QuestionIcon\";\n"],"names":["QuestionIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA+BC,SACvCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAaI,YAAc"}
+{"version":3,"file":"QuestionIcon.cjs","sources":["../../../../../src/components/icon/icons/QuestionIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const QuestionIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8fd\"}</Icon>\n);\nQuestionIcon.displayName = \"QuestionIcon\";\n"],"names":["QuestionIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA+BC,SACvCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAaI,YAAc"}

package/build/cjs/components/icon/icons/RedCrossIcon.cjs

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

package/build/cjs/components/icon/icons/RedCrossIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RedCrossIcon.cjs","sources":["../../../../../src/components/icon/icons/RedCrossIcon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { IconProps } from \"../types.js\";\n\n/*\n * NOTE: The green-check and red-cross icons also exists as a copy in the jkl-list package.\n *       If you're here to change them, consider changing them there as well, or\n *       finding a technical solution to sharing the SVG markup\n */\nexport const RedCrossIcon: FC<IconProps> = ({\n    as = \"div\",\n    bold = false,\n    className,\n    variant = \"inherit\",\n    \"data-testid\": testId,\n    style,\n    ...rest\n}) => {\n    const El = as;\n\n    return (\n        <El\n            className={clsx(\n                className,\n                \"jkl-icon\",\n                \"jkl-icon-red-cross\",\n                `jkl-icon--${variant}`,\n                {\n                    \"jkl-icon--bold\": bold,\n                },\n            )}\n            aria-hidden=\"true\"\n            style={style}\n            data-testid={testId}\n            {...rest}\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n                height=\"24px\"\n            >\n                <circle cx=\"12\" cy=\"12\" r=\"10\" />\n                <path d=\"m15.71 7.23 1.06 1.06-8.48 8.48-1.06-1.06 8.48-8.48Z\" />\n                <path d=\"m8.29 7.23 8.48 8.48-1.06 1.06L7.23 8.3l1.06-1.06Z\" />\n            </svg>\n        </El>\n    );\n};\nRedCrossIcon.displayName = \"RedCrossIcon\";\n"],"names":["RedCrossIcon","as","bold","className","variant","testId","style","rest","El","jsx","clsx","children","jsxs","xmlns","viewBox","width","height","cx","cy","r","d","displayName"],"mappings":"gKASaA,EAA8B,EACvCC,GAAAA,EAAK,MACLC,KAAAA,GAAO,EACPC,UAAAA,EACAC,QAAAA,EAAU,UACV,cAAeC,EACfC,MAAAA,KACGC,MAEH,MAAMC,EAAKP,EAGP,OAAAQ,EAAAA,IAACD,EAAA,CACGL,UAAWO,EAAAA,KACPP,EACA,WACA,qBACA,aAAaC,IACb,CACI,iBAAkBF,IAG1B,cAAY,OACZI,MAAAA,EACA,cAAaD,KACTE,EAEJI,SAAAC,EAAAA,KAAC,MAAA,CACGC,MAAM,6BACNC,QAAQ,YACRC,MAAM,OACNC,OAAO,OAEPL,SAAA,CAAAF,MAAC,UAAOQ,GAAG,KAAKC,GAAG,KAAKC,EAAE,OAC1BV,EAAAA,IAAC,OAAK,CAAAW,EAAE,yDACRX,EAAAA,IAAC,OAAK,CAAAW,EAAE,2DACZ,EAIZpB,EAAaqB,YAAc"}
+{"version":3,"file":"RedCrossIcon.cjs","sources":["../../../../../src/components/icon/icons/RedCrossIcon.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { IconProps } from \"../types.js\";\n\n/*\n * NOTE: The green-check and red-cross icons also exists as a copy in the jkl-list package.\n *       If you're here to change them, consider changing them there as well, or\n *       finding a technical solution to sharing the SVG markup\n */\nexport const RedCrossIcon: FC<IconProps> = ({\n    as = \"div\",\n    bold = false,\n    className,\n    variant = \"inherit\",\n    \"data-testid\": testId,\n    style,\n    ...rest\n}) => {\n    const El = as;\n\n    return (\n        <El\n            className={clsx(\n                className,\n                \"jkl-icon\",\n                \"jkl-icon-red-cross\",\n                `jkl-icon--${variant}`,\n                {\n                    \"jkl-icon--bold\": bold,\n                },\n            )}\n            aria-hidden=\"true\"\n            style={style}\n            data-testid={testId}\n            {...rest}\n        >\n            <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                viewBox=\"0 0 24 24\"\n                width=\"24px\"\n                height=\"24px\"\n            >\n                <circle cx=\"12\" cy=\"12\" r=\"10\" />\n                <path d=\"m15.71 7.23 1.06 1.06-8.48 8.48-1.06-1.06 8.48-8.48Z\" />\n                <path d=\"m8.29 7.23 8.48 8.48-1.06 1.06L7.23 8.3l1.06-1.06Z\" />\n            </svg>\n        </El>\n    );\n};\nRedCrossIcon.displayName = \"RedCrossIcon\";\n"],"names":["RedCrossIcon","as","bold","className","variant","testId","style","rest","El","jsx","clsx","children","jsxs","xmlns","viewBox","width","height","cx","cy","r","d","displayName"],"mappings":"iLASO,MAAMA,EAA8B,EACvCC,GAAAA,EAAK,MACLC,KAAAA,GAAO,EACPC,UAAAA,EACAC,QAAAA,EAAU,UACV,cAAeC,EACfC,MAAAA,KACGC,MAEH,MAAMC,EAAKP,EAGP,OAAAQ,EAAAA,IAACD,EAAA,CACGL,UAAWO,EAAAA,KACPP,EACA,WACA,qBACA,aAAaC,IACb,CACI,iBAAkBF,IAG1B,cAAY,OACZI,MAAAA,EACA,cAAaD,KACTE,EAEJI,SAAAC,EAAAA,KAAC,MAAA,CACGC,MAAM,6BACNC,QAAQ,YACRC,MAAM,OACNC,OAAO,OAEPL,SAAA,CAAAF,MAAC,UAAOQ,GAAG,KAAKC,GAAG,KAAKC,EAAE,OAC1BV,EAAAA,IAAC,OAAK,CAAAW,EAAE,yDACRX,EAAAA,IAAC,OAAK,CAAAW,EAAE,2DACZ,EAIZpB,EAAaqB,YAAc"}

package/build/cjs/components/icon/icons/SearchIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),c=c=>e.jsx(r.Icon,{...c,children:""});c.displayName="SearchIcon",exports.SearchIcon=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),c=c=>e.jsx(r.Icon,{...c,children:""});c.displayName="SearchIcon",exports.SearchIcon=c;
 //# sourceMappingURL=SearchIcon.cjs.map

package/build/cjs/components/icon/icons/SearchIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchIcon.cjs","sources":["../../../../../src/components/icon/icons/SearchIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const SearchIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8b6\"}</Icon>\n);\nSearchIcon.displayName = \"SearchIcon\";\n"],"names":["SearchIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA6BC,SACrCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAWI,YAAc"}
+{"version":3,"file":"SearchIcon.cjs","sources":["../../../../../src/components/icon/icons/SearchIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const SearchIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8b6\"}</Icon>\n);\nSearchIcon.displayName = \"SearchIcon\";\n"],"names":["SearchIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA6BC,SACrCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAWI,YAAc"}

package/build/cjs/components/icon/icons/SuccessIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../Icon.cjs"),r=r=>e.jsx(c.Icon,{bold:!0,filled:!0,...r,children:""});r.displayName="SuccessIcon",exports.SuccessIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const c=require("../Icon.cjs"),r=r=>e.jsx(c.Icon,{bold:!0,filled:!0,...r,children:""});r.displayName="SuccessIcon",exports.SuccessIcon=r;
 //# sourceMappingURL=SuccessIcon.cjs.map

package/build/cjs/components/icon/icons/SuccessIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SuccessIcon.cjs","sources":["../../../../../src/components/icon/icons/SuccessIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const SuccessIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\uf0be\"}\n    </Icon>\n);\nSuccessIcon.displayName = \"SuccessIcon\";\n"],"names":["SuccessIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"8IAIaA,EAA8BC,GACtCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAAYO,YAAc"}
+{"version":3,"file":"SuccessIcon.cjs","sources":["../../../../../src/components/icon/icons/SuccessIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const SuccessIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\uf0be\"}\n    </Icon>\n);\nSuccessIcon.displayName = \"SuccessIcon\";\n"],"names":["SuccessIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"qKAIaA,EAA8BC,GACtCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAAYO,YAAc"}

package/build/cjs/components/icon/icons/ThumbDownIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("../Icon.cjs"),r=r=>e.jsx(o.Icon,{...r,children:""});r.displayName="ThumbDownIcon",exports.ThumbDownIcon=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="ThumbDownIcon",exports.ThumbDownIcon=o;
 //# sourceMappingURL=ThumbDownIcon.cjs.map

package/build/cjs/components/icon/icons/ThumbDownIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ThumbDownIcon.cjs","sources":["../../../../../src/components/icon/icons/ThumbDownIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const ThumbDownIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8db\"}</Icon>\n);\nThumbDownIcon.displayName = \"ThumbDownIcon\";\n"],"names":["ThumbDownIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}
+{"version":3,"file":"ThumbDownIcon.cjs","sources":["../../../../../src/components/icon/icons/ThumbDownIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ThumbDownIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8db\"}</Icon>\n);\nThumbDownIcon.displayName = \"ThumbDownIcon\";\n"],"names":["ThumbDownIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAAgCC,SACxCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAcI,YAAc"}

package/build/cjs/components/icon/icons/ThumbUpIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),o=o=>e.jsx(r.Icon,{...o,children:""});o.displayName="ThumbUpIcon",exports.ThumbUpIcon=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="ThumbUpIcon",exports.ThumbUpIcon=t;
 //# sourceMappingURL=ThumbUpIcon.cjs.map

package/build/cjs/components/icon/icons/ThumbUpIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ThumbUpIcon.cjs","sources":["../../../../../src/components/icon/icons/ThumbUpIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const ThumbUpIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8dc\"}</Icon>\n);\nThumbUpIcon.displayName = \"ThumbUpIcon\";\n"],"names":["ThumbUpIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA8BC,SACtCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAYI,YAAc"}
+{"version":3,"file":"ThumbUpIcon.cjs","sources":["../../../../../src/components/icon/icons/ThumbUpIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ThumbUpIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue8dc\"}</Icon>\n);\nThumbUpIcon.displayName = \"ThumbUpIcon\";\n"],"names":["ThumbUpIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA8BC,SACtCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAYI,YAAc"}

package/build/cjs/components/icon/icons/TrashCanIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{...n,children:""});n.displayName="TrashCanIcon",exports.TrashCanIcon=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),t=t=>e.jsx(r.Icon,{...t,children:""});t.displayName="TrashCanIcon",exports.TrashCanIcon=t;
 //# sourceMappingURL=TrashCanIcon.cjs.map

package/build/cjs/components/icon/icons/TrashCanIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TrashCanIcon.cjs","sources":["../../../../../src/components/icon/icons/TrashCanIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const TrashCanIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue92e\"}</Icon>\n);\nTrashCanIcon.displayName = \"TrashCanIcon\";\n"],"names":["TrashCanIcon","props","Icon","children","displayName"],"mappings":"8IAIaA,EAA+BC,SACvCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAaI,YAAc"}
+{"version":3,"file":"TrashCanIcon.cjs","sources":["../../../../../src/components/icon/icons/TrashCanIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const TrashCanIcon: IconComponent = (props: IconProps) => (\n    <Icon {...props}>{\"\\ue92e\"}</Icon>\n);\nTrashCanIcon.displayName = \"TrashCanIcon\";\n"],"names":["TrashCanIcon","props","Icon","children","displayName"],"mappings":"qKAIaA,EAA+BC,SACvCC,EAAAA,KAAM,IAAGD,EAAQE,SAAS,MAE/BH,EAAaI,YAAc"}

package/build/cjs/components/icon/icons/WarningIcon.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{bold:!0,filled:!0,...n,children:""});n.displayName="WarningIcon",exports.WarningIcon=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");require("react");const r=require("../Icon.cjs"),n=n=>e.jsx(r.Icon,{bold:!0,filled:!0,...n,children:""});n.displayName="WarningIcon",exports.WarningIcon=n;
 //# sourceMappingURL=WarningIcon.cjs.map

package/build/cjs/components/icon/icons/WarningIcon.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"WarningIcon.cjs","sources":["../../../../../src/components/icon/icons/WarningIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport { type IconProps } from \"../types.js\";\n\nexport const WarningIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\uf083\"}\n    </Icon>\n);\nWarningIcon.displayName = \"WarningIcon\";\n"],"names":["WarningIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"8IAIaA,EAA8BC,GACtCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAAYO,YAAc"}
+{"version":3,"file":"WarningIcon.cjs","sources":["../../../../../src/components/icon/icons/WarningIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const WarningIcon: IconComponent = (props: IconProps) => (\n    <Icon bold filled {...props}>\n        {\"\\uf083\"}\n    </Icon>\n);\nWarningIcon.displayName = \"WarningIcon\";\n"],"names":["WarningIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"qKAIaA,EAA8BC,GACtCC,MAAAC,EAAAA,KAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SACL,MAEJN,EAAYO,YAAc"}

package/build/cjs/components/icon/icons/animated/ArrowHorizontalAnimated.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("../../../../../clsx-E3yX_9sL.cjs"),o=require("../ArrowLeftIcon.cjs"),i=require("../ArrowRightIcon.cjs"),e=({className:e,pointingRight:t,variant:l,bold:s=!1,...n})=>r.jsx("div",{...n,className:a.clsx("jkl-icon","jkl-icon--animated",{"jkl-icon--bold":s,[`jkl-icon--${l}`]:!!l},"jkl-animated-horizontal-arrows",e),children:r.jsxs("div",{className:"jkl-animated-horizontal-arrows__slider","data-show":t?"right":"left",children:[r.jsx(o.ArrowLeftIcon,{className:"jkl-animated-horizontal-arrows__arrow",variant:l,bold:s}),r.jsx(i.ArrowRightIcon,{className:"jkl-animated-horizontal-arrows__arrow",variant:l,bold:s})]})});e.displayName="ArrowHorizontalAnimated",exports.ArrowHorizontalAnimated=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("../../../../../clsx-E3yX_9sL.cjs");require("react");const o=require("../ArrowLeftIcon.cjs"),e=require("../ArrowRightIcon.cjs"),i=({className:i,pointingRight:t,variant:s,bold:l=!1,...n})=>r.jsx("div",{...n,className:a.clsx("jkl-icon","jkl-icon--animated",{"jkl-icon--bold":l,[`jkl-icon--${s}`]:!!s},"jkl-animated-horizontal-arrows",i),children:r.jsxs("div",{className:"jkl-animated-horizontal-arrows__slider","data-show":t?"right":"left",children:[r.jsx(o.ArrowLeftIcon,{className:"jkl-animated-horizontal-arrows__arrow",variant:s,bold:l}),r.jsx(e.ArrowRightIcon,{className:"jkl-animated-horizontal-arrows__arrow",variant:s,bold:l})]})});i.displayName="ArrowHorizontalAnimated",exports.ArrowHorizontalAnimated=i;
 //# sourceMappingURL=ArrowHorizontalAnimated.cjs.map

package/build/cjs/components/icon/icons/animated/ArrowHorizontalAnimated.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ArrowHorizontalAnimated.cjs","sources":["../../../../../../src/components/icon/icons/animated/ArrowHorizontalAnimated.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { IconVariant } from \"../../types.js\";\nimport { ArrowLeftIcon } from \"../ArrowLeftIcon.js\";\nimport { ArrowRightIcon } from \"../ArrowRightIcon.js\";\n\nexport interface ArrowHorizontalAnimatedProps {\n    className?: string;\n    pointingRight: boolean;\n    variant?: IconVariant;\n    bold?: boolean;\n}\n\nexport const ArrowHorizontalAnimated: FC<ArrowHorizontalAnimatedProps> = ({\n    className,\n    pointingRight,\n    variant,\n    bold = false,\n    ...rest\n}) => (\n    <div\n        {...rest}\n        className={clsx(\n            \"jkl-icon\",\n            \"jkl-icon--animated\",\n            { \"jkl-icon--bold\": bold, [`jkl-icon--${variant}`]: !!variant },\n            \"jkl-animated-horizontal-arrows\",\n            className,\n        )}\n    >\n        <div\n            className=\"jkl-animated-horizontal-arrows__slider\"\n            data-show={pointingRight ? \"right\" : \"left\"}\n        >\n            <ArrowLeftIcon\n                className=\"jkl-animated-horizontal-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n            <ArrowRightIcon\n                className=\"jkl-animated-horizontal-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n        </div>\n    </div>\n);\n\nArrowHorizontalAnimated.displayName = \"ArrowHorizontalAnimated\";\n"],"names":["ArrowHorizontalAnimated","className","pointingRight","variant","bold","rest","jsx","clsx","children","jsxs","ArrowLeftIcon","ArrowRightIcon","displayName"],"mappings":"wOAaaA,EAA4D,EACrEC,UAAAA,EACAC,cAAAA,EACAC,QAAAA,EACAC,KAAAA,GAAO,KACJC,KAEHC,EAAAA,IAAC,MAAA,IACOD,EACJJ,UAAWM,EAAAA,KACP,WACA,qBACA,CAAE,iBAAkBH,EAAM,CAAC,aAAaD,OAAcA,GACtD,iCACAF,GAGJO,SAAAC,EAAAA,KAAC,MAAA,CACGR,UAAU,yCACV,YAAWC,EAAgB,QAAU,OAErCM,SAAA,CAAAF,EAAAA,IAACI,EAAAA,cAAA,CACGT,UAAU,wCACVE,QAAAA,EACAC,KAAAA,IAEJE,EAAAA,IAACK,EAAAA,eAAA,CACGV,UAAU,wCACVE,QAAAA,EACAC,KAAAA,SAMhBJ,EAAwBY,YAAc"}
+{"version":3,"file":"ArrowHorizontalAnimated.cjs","sources":["../../../../../../src/components/icon/icons/animated/ArrowHorizontalAnimated.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { IconVariant } from \"../../types.js\";\nimport { ArrowLeftIcon } from \"../ArrowLeftIcon.js\";\nimport { ArrowRightIcon } from \"../ArrowRightIcon.js\";\n\nexport interface ArrowHorizontalAnimatedProps {\n    className?: string;\n    pointingRight: boolean;\n    variant?: IconVariant;\n    bold?: boolean;\n}\n\nexport const ArrowHorizontalAnimated: FC<ArrowHorizontalAnimatedProps> = ({\n    className,\n    pointingRight,\n    variant,\n    bold = false,\n    ...rest\n}) => (\n    <div\n        {...rest}\n        className={clsx(\n            \"jkl-icon\",\n            \"jkl-icon--animated\",\n            { \"jkl-icon--bold\": bold, [`jkl-icon--${variant}`]: !!variant },\n            \"jkl-animated-horizontal-arrows\",\n            className,\n        )}\n    >\n        <div\n            className=\"jkl-animated-horizontal-arrows__slider\"\n            data-show={pointingRight ? \"right\" : \"left\"}\n        >\n            <ArrowLeftIcon\n                className=\"jkl-animated-horizontal-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n            <ArrowRightIcon\n                className=\"jkl-animated-horizontal-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n        </div>\n    </div>\n);\n\nArrowHorizontalAnimated.displayName = \"ArrowHorizontalAnimated\";\n"],"names":["ArrowHorizontalAnimated","className","pointingRight","variant","bold","rest","jsx","clsx","children","jsxs","ArrowLeftIcon","ArrowRightIcon","displayName"],"mappings":"+PAaaA,EAA4D,EACrEC,UAAAA,EACAC,cAAAA,EACAC,QAAAA,EACAC,KAAAA,GAAO,KACJC,KAEHC,EAAAA,IAAC,MAAA,IACOD,EACJJ,UAAWM,EAAAA,KACP,WACA,qBACA,CAAE,iBAAkBH,EAAM,CAAC,aAAaD,OAAcA,GACtD,iCACAF,GAGJO,SAAAC,EAAAA,KAAC,MAAA,CACGR,UAAU,yCACV,YAAWC,EAAgB,QAAU,OAErCM,SAAA,CAAAF,EAAAA,IAACI,EAAAA,cAAA,CACGT,UAAU,wCACVE,QAAAA,EACAC,KAAAA,IAEJE,EAAAA,IAACK,EAAAA,eAAA,CACGV,UAAU,wCACVE,QAAAA,EACAC,KAAAA,SAMhBJ,EAAwBY,YAAc"}

package/build/cjs/components/icon/icons/animated/ArrowVerticalAnimated.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("../../../../../clsx-E3yX_9sL.cjs"),e=require("../ArrowDownIcon.cjs"),o=require("../ArrowUpIcon.cjs"),i=({className:i,pointingDown:s,variant:l,bold:c=!1,...n})=>r.jsx("div",{...n,className:a.clsx("jkl-icon","jkl-icon--animated",{"jkl-icon--bold":c,[`jkl-icon--${l}`]:!!l},"jkl-animated-vertical-arrows",i),children:r.jsxs("div",{className:"jkl-animated-vertical-arrows__slider","data-show":s?"down":"up",children:[r.jsx(o.ArrowUpIcon,{className:"jkl-animated-vertical-arrows__arrow",variant:l,bold:c}),r.jsx(e.ArrowDownIcon,{className:"jkl-animated-vertical-arrows__arrow",variant:l,bold:c})]})});i.displayName="ArrowVerticalAnimated",exports.ArrowVerticalAnimated=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),a=require("../../../../../clsx-E3yX_9sL.cjs");require("react");const e=require("../ArrowDownIcon.cjs"),o=require("../ArrowUpIcon.cjs"),i=({className:i,pointingDown:s,variant:c,bold:l=!1,...n})=>r.jsx("div",{...n,className:a.clsx("jkl-icon","jkl-icon--animated",{"jkl-icon--bold":l,[`jkl-icon--${c}`]:!!c},"jkl-animated-vertical-arrows",i),children:r.jsxs("div",{className:"jkl-animated-vertical-arrows__slider","data-show":s?"down":"up",children:[r.jsx(o.ArrowUpIcon,{className:"jkl-animated-vertical-arrows__arrow",variant:c,bold:l}),r.jsx(e.ArrowDownIcon,{className:"jkl-animated-vertical-arrows__arrow",variant:c,bold:l})]})});i.displayName="ArrowVerticalAnimated",exports.ArrowVerticalAnimated=i;
 //# sourceMappingURL=ArrowVerticalAnimated.cjs.map

package/build/cjs/components/icon/icons/animated/ArrowVerticalAnimated.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ArrowVerticalAnimated.cjs","sources":["../../../../../../src/components/icon/icons/animated/ArrowVerticalAnimated.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { IconVariant } from \"../../types.js\";\nimport { ArrowDownIcon } from \"../ArrowDownIcon.js\";\nimport { ArrowUpIcon } from \"../ArrowUpIcon.js\";\n\nexport interface ArrowVerticalAnimatedProps {\n    className?: string;\n    pointingDown: boolean;\n    variant?: IconVariant;\n    bold?: boolean;\n}\n\nexport const ArrowVerticalAnimated: FC<ArrowVerticalAnimatedProps> = ({\n    className,\n    pointingDown,\n    variant,\n    bold = false,\n    ...rest\n}) => (\n    <div\n        {...rest}\n        className={clsx(\n            \"jkl-icon\",\n            \"jkl-icon--animated\",\n            {\n                \"jkl-icon--bold\": bold,\n                [`jkl-icon--${variant}`]: !!variant,\n            },\n            \"jkl-animated-vertical-arrows\",\n            className,\n        )}\n    >\n        <div\n            className=\"jkl-animated-vertical-arrows__slider\"\n            data-show={pointingDown ? \"down\" : \"up\"}\n        >\n            <ArrowUpIcon\n                className=\"jkl-animated-vertical-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n            <ArrowDownIcon\n                className=\"jkl-animated-vertical-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n        </div>\n    </div>\n);\n\nArrowVerticalAnimated.displayName = \"ArrowVerticalAnimated\";\n"],"names":["ArrowVerticalAnimated","className","pointingDown","variant","bold","rest","jsx","clsx","children","jsxs","ArrowUpIcon","ArrowDownIcon","displayName"],"mappings":"qOAaaA,EAAwD,EACjEC,UAAAA,EACAC,aAAAA,EACAC,QAAAA,EACAC,KAAAA,GAAO,KACJC,KAEHC,EAAAA,IAAC,MAAA,IACOD,EACJJ,UAAWM,EAAAA,KACP,WACA,qBACA,CACI,iBAAkBH,EAClB,CAAC,aAAaD,OAAcA,GAEhC,+BACAF,GAGJO,SAAAC,EAAAA,KAAC,MAAA,CACGR,UAAU,uCACV,YAAWC,EAAe,OAAS,KAEnCM,SAAA,CAAAF,EAAAA,IAACI,EAAAA,YAAA,CACGT,UAAU,sCACVE,QAAAA,EACAC,KAAAA,IAEJE,EAAAA,IAACK,EAAAA,cAAA,CACGV,UAAU,sCACVE,QAAAA,EACAC,KAAAA,SAMhBJ,EAAsBY,YAAc"}
+{"version":3,"file":"ArrowVerticalAnimated.cjs","sources":["../../../../../../src/components/icon/icons/animated/ArrowVerticalAnimated.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { IconVariant } from \"../../types.js\";\nimport { ArrowDownIcon } from \"../ArrowDownIcon.js\";\nimport { ArrowUpIcon } from \"../ArrowUpIcon.js\";\n\nexport interface ArrowVerticalAnimatedProps {\n    className?: string;\n    pointingDown: boolean;\n    variant?: IconVariant;\n    bold?: boolean;\n}\n\nexport const ArrowVerticalAnimated: FC<ArrowVerticalAnimatedProps> = ({\n    className,\n    pointingDown,\n    variant,\n    bold = false,\n    ...rest\n}) => (\n    <div\n        {...rest}\n        className={clsx(\n            \"jkl-icon\",\n            \"jkl-icon--animated\",\n            {\n                \"jkl-icon--bold\": bold,\n                [`jkl-icon--${variant}`]: !!variant,\n            },\n            \"jkl-animated-vertical-arrows\",\n            className,\n        )}\n    >\n        <div\n            className=\"jkl-animated-vertical-arrows__slider\"\n            data-show={pointingDown ? \"down\" : \"up\"}\n        >\n            <ArrowUpIcon\n                className=\"jkl-animated-vertical-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n            <ArrowDownIcon\n                className=\"jkl-animated-vertical-arrows__arrow\"\n                variant={variant}\n                bold={bold}\n            />\n        </div>\n    </div>\n);\n\nArrowVerticalAnimated.displayName = \"ArrowVerticalAnimated\";\n"],"names":["ArrowVerticalAnimated","className","pointingDown","variant","bold","rest","jsx","clsx","children","jsxs","ArrowUpIcon","ArrowDownIcon","displayName"],"mappings":"4PAaaA,EAAwD,EACjEC,UAAAA,EACAC,aAAAA,EACAC,QAAAA,EACAC,KAAAA,GAAO,KACJC,KAEHC,EAAAA,IAAC,MAAA,IACOD,EACJJ,UAAWM,EAAAA,KACP,WACA,qBACA,CACI,iBAAkBH,EAClB,CAAC,aAAaD,OAAcA,GAEhC,+BACAF,GAGJO,SAAAC,EAAAA,KAAC,MAAA,CACGR,UAAU,uCACV,YAAWC,EAAe,OAAS,KAEnCM,SAAA,CAAAF,EAAAA,IAACI,EAAAA,YAAA,CACGT,UAAU,sCACVE,QAAAA,EACAC,KAAAA,IAEJE,EAAAA,IAACK,EAAAA,cAAA,CACGV,UAAU,sCACVE,QAAAA,EACAC,KAAAA,SAMhBJ,EAAsBY,YAAc"}

package/build/cjs/components/icon/icons/animated/PlusRemoveAnimated.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../../../clsx-E3yX_9sL.cjs"),l=require("../PlusIcon.cjs"),i=({className:i,isPlus:a,variant:c,bold:o=!1,...n})=>e.jsx("div",{...n,className:s.clsx("jkl-icon","jkl-icon--animated",{"jkl-icon--bold":o,[`jkl-icon--${c}`]:!!c},i),children:e.jsx(l.PlusIcon,{variant:c,bold:o,className:s.clsx("jkl-icons-animated__plus","jkl-icons-animated__plus--"+(a?"plus":"close"))})});i.displayName="PlusRemoveAnimated",exports.PlusRemoveAnimated=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../../../clsx-E3yX_9sL.cjs");require("react");const l=require("../PlusIcon.cjs"),i=({className:i,isPlus:a,variant:c,bold:o=!1,...n})=>e.jsx("div",{...n,className:s.clsx("jkl-icon","jkl-icon--animated",{"jkl-icon--bold":o,[`jkl-icon--${c}`]:!!c},i),children:e.jsx(l.PlusIcon,{variant:c,bold:o,className:s.clsx("jkl-icons-animated__plus","jkl-icons-animated__plus--"+(a?"plus":"close"))})});i.displayName="PlusRemoveAnimated",exports.PlusRemoveAnimated=i;
 //# sourceMappingURL=PlusRemoveAnimated.cjs.map

package/build/cjs/components/icon/icons/animated/PlusRemoveAnimated.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PlusRemoveAnimated.cjs","sources":["../../../../../../src/components/icon/icons/animated/PlusRemoveAnimated.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { IconVariant } from \"../../types.js\";\nimport { PlusIcon } from \"../PlusIcon.js\";\n\nexport interface PlusRemoveAnimatedProps {\n    className?: string;\n    isPlus: boolean;\n    variant?: IconVariant;\n    bold?: boolean;\n}\n\nexport const PlusRemoveAnimated: FC<PlusRemoveAnimatedProps> = ({\n    className,\n    isPlus,\n    variant,\n    bold = false,\n    ...rest\n}) => (\n    <div\n        {...rest}\n        className={clsx(\n            \"jkl-icon\",\n            \"jkl-icon--animated\",\n            {\n                \"jkl-icon--bold\": bold,\n                [`jkl-icon--${variant}`]: !!variant,\n            },\n            className,\n        )}\n    >\n        <PlusIcon\n            variant={variant}\n            bold={bold}\n            className={clsx(\n                \"jkl-icons-animated__plus\",\n                `jkl-icons-animated__plus--${isPlus ? \"plus\" : \"close\"}`,\n            )}\n        />\n    </div>\n);\n\nPlusRemoveAnimated.displayName = \"PlusRemoveAnimated\";\n"],"names":["PlusRemoveAnimated","className","isPlus","variant","bold","rest","jsx","clsx","children","PlusIcon","displayName"],"mappings":"gMAYaA,EAAkD,EAC3DC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,GAAO,KACJC,KAEHC,EAAAA,IAAC,MAAA,IACOD,EACJJ,UAAWM,EAAAA,KACP,WACA,qBACA,CACI,iBAAkBH,EAClB,CAAC,aAAaD,OAAcA,GAEhCF,GAGJO,SAAAF,EAAAA,IAACG,EAAAA,SAAA,CACGN,QAAAA,EACAC,KAAAA,EACAH,UAAWM,EAAAA,KACP,2BACA,8BAA6BL,EAAS,OAAS,cAM/DF,EAAmBU,YAAc"}
+{"version":3,"file":"PlusRemoveAnimated.cjs","sources":["../../../../../../src/components/icon/icons/animated/PlusRemoveAnimated.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { IconVariant } from \"../../types.js\";\nimport { PlusIcon } from \"../PlusIcon.js\";\n\nexport interface PlusRemoveAnimatedProps {\n    className?: string;\n    isPlus: boolean;\n    variant?: IconVariant;\n    bold?: boolean;\n}\n\nexport const PlusRemoveAnimated: FC<PlusRemoveAnimatedProps> = ({\n    className,\n    isPlus,\n    variant,\n    bold = false,\n    ...rest\n}) => (\n    <div\n        {...rest}\n        className={clsx(\n            \"jkl-icon\",\n            \"jkl-icon--animated\",\n            {\n                \"jkl-icon--bold\": bold,\n                [`jkl-icon--${variant}`]: !!variant,\n            },\n            className,\n        )}\n    >\n        <PlusIcon\n            variant={variant}\n            bold={bold}\n            className={clsx(\n                \"jkl-icons-animated__plus\",\n                `jkl-icons-animated__plus--${isPlus ? \"plus\" : \"close\"}`,\n            )}\n        />\n    </div>\n);\n\nPlusRemoveAnimated.displayName = \"PlusRemoveAnimated\";\n"],"names":["PlusRemoveAnimated","className","isPlus","variant","bold","rest","jsx","clsx","children","PlusIcon","displayName"],"mappings":"uNAYaA,EAAkD,EAC3DC,UAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,GAAO,KACJC,KAEHC,EAAAA,IAAC,MAAA,IACOD,EACJJ,UAAWM,EAAAA,KACP,WACA,qBACA,CACI,iBAAkBH,EAClB,CAAC,aAAaD,OAAcA,GAEhCF,GAGJO,SAAAF,EAAAA,IAACG,EAAAA,SAAA,CACGN,QAAAA,EACAC,KAAAA,EACAH,UAAWM,EAAAA,KACP,2BACA,8BAA6BL,EAAS,OAAS,cAM/DF,EAAmBU,YAAc"}

package/build/cjs/components/icon/stories/Icons.stories.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Icons.stories.cjs","sources":["../../../../../src/components/icon/development/internal/IconExample.tsx","../../../../../src/components/icon/development/internal/IconsExampleGrid.tsx","../../../../../src/components/icon/stories/Icons.stories.tsx"],"sourcesContent":["import React, { ReactNode } from \"react\";\n\ninterface Props extends React.HTMLAttributes<HTMLDivElement> {\n    name?: string;\n    renderIcon: () => ReactNode;\n}\n\nexport const IconExample: React.FC<Props> = ({\n    name,\n    renderIcon,\n    ...restProps\n}) => (\n    <div title={name || renderIcon.name} {...restProps}>\n        {renderIcon()}\n    </div>\n);\n","import React, { CSSProperties } from \"react\";\nimport \"./icons-example-grid.scss\";\nimport { WithChildren } from \"../../../../core/types.js\";\n\ninterface IconsExampleGridProps extends WithChildren {\n    columns: \"two\" | \"four\";\n    style?: CSSProperties;\n}\n\nexport const IconsExampleGrid: React.FC<IconsExampleGridProps> = ({\n    columns,\n    children,\n    ...rest\n}) => (\n    <div\n        className={`jkl-example-grid jkl-example-grid--${columns}-columns`}\n        {...rest}\n    >\n        {children}\n    </div>\n);\n","import { Meta, StoryObj } from \"@storybook/react\";\nimport React, { useState } from \"react\";\nimport { TextInput } from \"../../text-input/TextInput.js\";\nimport { IconExample } from \"../development/internal/IconExample.js\";\nimport { IconsExampleGrid } from \"../development/internal/IconsExampleGrid.js\";\nimport { Icon } from \"../Icon.js\";\nimport {\n    ArrowDownIcon,\n    ArrowLeftIcon,\n    ArrowNorthEastIcon,\n    ArrowRightIcon,\n    ArrowUpIcon,\n    CalendarIcon,\n    CheckIcon,\n    ChevronDownIcon,\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    ChevronUpIcon,\n    CloseIcon,\n    CopyIcon,\n    DotsIcon,\n    DragIcon,\n    ErrorIcon,\n    GreenCheckIcon,\n    HamburgerIcon,\n    InfoIcon,\n    LinkIcon,\n    MinusIcon,\n    OpenInNewIcon,\n    PenIcon,\n    PlusIcon,\n    QuestionIcon,\n    RedCrossIcon,\n    SearchIcon,\n    SuccessIcon,\n    ThumbDownIcon,\n    ThumbUpIcon,\n    TrashCanIcon,\n    WarningIcon,\n} from \"../index.js\";\nimport \"../styles/_index.scss\";\nimport \"../../text-input/styles/text-input.scss\";\nimport \"../../input-group/styles/_index.scss\";\n\nconst meta: Meta = {\n    title: \"Komponenter/Ikoner\",\n    component: Icon,\n    parameters: {\n        layout: \"centered\",\n    },\n    tags: [\"autodocs\"],\n    argTypes: {\n        variant: {\n            control: \"radio\",\n            options: [\"inherit\", \"medium\", \"small\"],\n        },\n    },\n} satisfies Meta<typeof Icon>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof Icon>;\n\nconst allIcons = [\n    ArrowDownIcon,\n    ArrowLeftIcon,\n    ArrowNorthEastIcon,\n    ArrowRightIcon,\n    ArrowUpIcon,\n    CalendarIcon,\n    CheckIcon,\n    ChevronDownIcon,\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    ChevronUpIcon,\n    CloseIcon,\n    CopyIcon,\n    DotsIcon,\n    DragIcon,\n    ErrorIcon,\n    GreenCheckIcon,\n    HamburgerIcon,\n    InfoIcon,\n    LinkIcon,\n    MinusIcon,\n    OpenInNewIcon,\n    PenIcon,\n    PlusIcon,\n    QuestionIcon,\n    RedCrossIcon,\n    SearchIcon,\n    SuccessIcon,\n    ThumbDownIcon,\n    ThumbUpIcon,\n    TrashCanIcon,\n    WarningIcon,\n];\n\nexport const Ikoner: Story = {\n    args: {\n        variant: \"small\",\n        bold: false,\n    },\n    render: ({ variant, bold }) => {\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        const [fontSize, setFontSize] = useState(\"1rem\");\n\n        return (\n            <div style={{ width: \"50vw\" }}>\n                {variant === \"inherit\" && (\n                    <TextInput\n                        label=\"Fontstørrelse\"\n                        className=\"jkl-spacing-24--bottom\"\n                        value={fontSize}\n                        onChange={(e) => setFontSize(e.target.value)}\n                        width=\"10ch\"\n                    />\n                )}\n                <IconsExampleGrid style={{ fontSize }} columns=\"four\">\n                    {allIcons.map((Ico) => (\n                        <IconExample\n                            style={{ justifySelf: \"center\" }}\n                            key={Ico.displayName}\n                            renderIcon={() => (\n                                <Ico bold={bold} variant={variant} />\n                            )}\n                            name={Ico.displayName}\n                        />\n                    ))}\n                </IconsExampleGrid>\n            </div>\n        );\n    },\n};\n"],"names":["IconExample","name","renderIcon","restProps","jsx","title","children","IconsExampleGrid","columns","rest","className","meta","component","Icon","parameters","layout","tags","argTypes","variant","control","options","allIcons","ArrowDownIcon","ArrowLeftIcon","ArrowNorthEastIcon","ArrowRightIcon","ArrowUpIcon","CalendarIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","ChevronUpIcon","CloseIcon","CopyIcon","DotsIcon","DragIcon","ErrorIcon","GreenCheckIcon","HamburgerIcon","InfoIcon","LinkIcon","MinusIcon","OpenInNewIcon","PenIcon","PlusIcon","QuestionIcon","RedCrossIcon","SearchIcon","SuccessIcon","ThumbDownIcon","ThumbUpIcon","TrashCanIcon","WarningIcon","Ikoner","args","bold","render","fontSize","setFontSize","useState","style","width","TextInput","label","value","onChange","e","target","map","Ico","justifySelf","displayName"],"mappings":"yoDAOO,MAAMA,EAA+B,EACxCC,KAAAA,EACAC,WAAAA,KACGC,KAEHC,MAAC,OAAIC,MAAOJ,GAAQC,EAAWD,QAAUE,EACpCG,SAAAJ,MCJIK,EAAoD,EAC7DC,QAAAA,EACAF,SAAAA,KACGG,KAEHL,EAAAA,IAAC,MAAA,CACGM,UAAW,sCAAsCF,eAC7CC,EAEHH,SAAAA,IC0BHK,EAAa,CACfN,MAAO,qBACPO,UAAWC,EAAAA,KACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,YACPC,SAAU,CACNC,QAAS,CACLC,QAAS,QACTC,QAAS,CAAC,UAAW,SAAU,YASrCC,EAAW,CACbC,EAAAA,cACAC,EAAAA,cACAC,EAAAA,mBACAC,EAAAA,eACAC,EAAAA,YACAC,EAAAA,aACAC,EAAAA,UACAC,EAAAA,gBACAC,EAAAA,gBACAC,EAAAA,iBACAC,EAAAA,cACAC,EAAAA,UACAC,EAAAA,SACAC,EAAAA,SACAC,EAAAA,SACAC,EAAAA,UACAC,EAAAA,eACAC,EAAAA,cACAC,EAAAA,SACAC,EAAAA,SACAC,EAAAA,UACAC,EAAAA,cACAC,EAAAA,QACAC,EAAAA,SACAC,EAAAA,aACAC,EAAAA,aACAC,EAAAA,WACAC,EAAAA,YACAC,EAAAA,cACAC,EAAAA,YACAC,EAAAA,aACAC,EAAAA,aAGSC,EAAgB,CACzBC,KAAM,CACFrC,QAAS,QACTsC,MAAM,GAEVC,OAAQ,EAAGvC,QAAAA,EAASsC,KAAAA,MAEhB,MAAOE,EAAUC,GAAeC,WAAS,QAEzC,cACK,MAAI,CAAAC,MAAO,CAAEC,MAAO,QAChBxD,SAAA,CAAY,YAAZY,GACGd,EAAAA,IAAC2D,EAAAA,UAAA,CACGC,MAAM,gBACNtD,UAAU,yBACVuD,MAAOP,EACPQ,SAAWC,GAAMR,EAAYQ,EAAEC,OAAOH,OACtCH,MAAM,SAGd1D,EAAAA,IAACG,EAAiB,CAAAsD,MAAO,CAAEH,SAAAA,GAAYlD,QAAQ,OAC1CF,SAAAe,EAASgD,KAAKC,GACXlE,EAAAA,IAACJ,EAAA,CACG6D,MAAO,CAAEU,YAAa,UAEtBrE,WAAY,IACPE,EAAAA,IAAAkE,EAAA,CAAId,KAAAA,EAAYtC,QAAAA,IAErBjB,KAAMqE,EAAIE,aAJLF,EAAIE,mBAQzB"}
+{"version":3,"file":"Icons.stories.cjs","sources":["../../../../../src/components/icon/development/internal/IconExample.tsx","../../../../../src/components/icon/development/internal/IconsExampleGrid.tsx","../../../../../src/components/icon/stories/Icons.stories.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\n\ninterface Props extends React.HTMLAttributes<HTMLDivElement> {\n    name?: string;\n    renderIcon: () => ReactNode;\n}\n\nexport const IconExample: React.FC<Props> = ({\n    name,\n    renderIcon,\n    ...restProps\n}) => (\n    <div title={name || renderIcon.name} {...restProps}>\n        {renderIcon()}\n    </div>\n);\n","import React, { type CSSProperties } from \"react\";\nimport \"./icons-example-grid.scss\";\nimport type { WithChildren } from \"../../../../core/types.js\";\n\ninterface IconsExampleGridProps extends WithChildren {\n    columns: \"two\" | \"four\";\n    style?: CSSProperties;\n}\n\nexport const IconsExampleGrid: React.FC<IconsExampleGridProps> = ({\n    columns,\n    children,\n    ...rest\n}) => (\n    <div\n        className={`jkl-example-grid jkl-example-grid--${columns}-columns`}\n        {...rest}\n    >\n        {children}\n    </div>\n);\n","import type { Meta, StoryObj } from \"@storybook/react\";\nimport React, { useState } from \"react\";\nimport { TextInput } from \"../../text-input/TextInput.js\";\nimport { Icon } from \"../Icon.js\";\nimport { IconExample } from \"../development/internal/IconExample.js\";\nimport { IconsExampleGrid } from \"../development/internal/IconsExampleGrid.js\";\nimport {\n    ArrowDownIcon,\n    ArrowLeftIcon,\n    ArrowNorthEastIcon,\n    ArrowRightIcon,\n    ArrowUpIcon,\n    CalendarIcon,\n    CheckIcon,\n    ChevronDownIcon,\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    ChevronUpIcon,\n    CloseIcon,\n    CopyIcon,\n    DotsIcon,\n    DragIcon,\n    ErrorIcon,\n    GreenCheckIcon,\n    HamburgerIcon,\n    InfoIcon,\n    LinkIcon,\n    MinusIcon,\n    OpenInNewIcon,\n    PenIcon,\n    PlusIcon,\n    QuestionIcon,\n    RedCrossIcon,\n    SearchIcon,\n    SuccessIcon,\n    ThumbDownIcon,\n    ThumbUpIcon,\n    TrashCanIcon,\n    WarningIcon,\n} from \"../index.js\";\nimport \"../styles/_index.scss\";\nimport \"../../text-input/styles/text-input.scss\";\nimport \"../../input-group/styles/_index.scss\";\n\nconst meta: Meta = {\n    title: \"Komponenter/Ikoner\",\n    component: Icon,\n    parameters: {\n        layout: \"centered\",\n    },\n    tags: [\"autodocs\"],\n    argTypes: {\n        variant: {\n            control: \"radio\",\n            options: [\"inherit\", \"medium\", \"small\"],\n        },\n    },\n} satisfies Meta<typeof Icon>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof Icon>;\n\nconst allIcons = [\n    ArrowDownIcon,\n    ArrowLeftIcon,\n    ArrowNorthEastIcon,\n    ArrowRightIcon,\n    ArrowUpIcon,\n    CalendarIcon,\n    CheckIcon,\n    ChevronDownIcon,\n    ChevronLeftIcon,\n    ChevronRightIcon,\n    ChevronUpIcon,\n    CloseIcon,\n    CopyIcon,\n    DotsIcon,\n    DragIcon,\n    ErrorIcon,\n    GreenCheckIcon,\n    HamburgerIcon,\n    InfoIcon,\n    LinkIcon,\n    MinusIcon,\n    OpenInNewIcon,\n    PenIcon,\n    PlusIcon,\n    QuestionIcon,\n    RedCrossIcon,\n    SearchIcon,\n    SuccessIcon,\n    ThumbDownIcon,\n    ThumbUpIcon,\n    TrashCanIcon,\n    WarningIcon,\n];\n\nexport const Ikoner: Story = {\n    args: {\n        variant: \"small\",\n        bold: false,\n    },\n    render: ({ variant, bold }) => {\n        // eslint-disable-next-line react-hooks/rules-of-hooks\n        const [fontSize, setFontSize] = useState(\"1rem\");\n\n        return (\n            <div style={{ width: \"50vw\" }}>\n                {variant === \"inherit\" && (\n                    <TextInput\n                        label=\"Fontstørrelse\"\n                        className=\"jkl-spacing-24--bottom\"\n                        value={fontSize}\n                        onChange={(e) => setFontSize(e.target.value)}\n                        width=\"10ch\"\n                    />\n                )}\n                <IconsExampleGrid style={{ fontSize }} columns=\"four\">\n                    {allIcons.map((Ico) => (\n                        <IconExample\n                            style={{ justifySelf: \"center\" }}\n                            key={Ico.displayName}\n                            renderIcon={() => (\n                                <Ico bold={bold} variant={variant} />\n                            )}\n                            name={Ico.displayName}\n                        />\n                    ))}\n                </IconsExampleGrid>\n            </div>\n        );\n    },\n};\n"],"names":["IconExample","name","renderIcon","restProps","jsx","title","children","IconsExampleGrid","columns","rest","className","meta","component","Icon","parameters","layout","tags","argTypes","variant","control","options","allIcons","ArrowDownIcon","ArrowLeftIcon","ArrowNorthEastIcon","ArrowRightIcon","ArrowUpIcon","CalendarIcon","CheckIcon","ChevronDownIcon","ChevronLeftIcon","ChevronRightIcon","ChevronUpIcon","CloseIcon","CopyIcon","DotsIcon","DragIcon","ErrorIcon","GreenCheckIcon","HamburgerIcon","InfoIcon","LinkIcon","MinusIcon","OpenInNewIcon","PenIcon","PlusIcon","QuestionIcon","RedCrossIcon","SearchIcon","SuccessIcon","ThumbDownIcon","ThumbUpIcon","TrashCanIcon","WarningIcon","Ikoner","args","bold","render","fontSize","setFontSize","useState","style","width","TextInput","label","value","onChange","e","target","map","Ico","justifySelf","displayName"],"mappings":"yoDAOO,MAAMA,EAA+B,EACxCC,KAAAA,EACAC,WAAAA,KACGC,KAEHC,MAAC,OAAIC,MAAOJ,GAAQC,EAAWD,QAAUE,EACpCG,SAAAJ,MCJIK,EAAoD,EAC7DC,QAAAA,EACAF,SAAAA,KACGG,KAEHL,EAAAA,IAAC,MAAA,CACGM,UAAW,sCAAsCF,eAC7CC,EAEHH,SAAAA,IC0BHK,EAAa,CACfN,MAAO,qBACPO,UAAWC,EAAAA,KACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,YACPC,SAAU,CACNC,QAAS,CACLC,QAAS,QACTC,QAAS,CAAC,UAAW,SAAU,YASrCC,EAAW,CACbC,EAAAA,cACAC,EAAAA,cACAC,EAAAA,mBACAC,EAAAA,eACAC,EAAAA,YACAC,EAAAA,aACAC,EAAAA,UACAC,EAAAA,gBACAC,EAAAA,gBACAC,EAAAA,iBACAC,EAAAA,cACAC,EAAAA,UACAC,EAAAA,SACAC,EAAAA,SACAC,EAAAA,SACAC,EAAAA,UACAC,EAAAA,eACAC,EAAAA,cACAC,EAAAA,SACAC,EAAAA,SACAC,EAAAA,UACAC,EAAAA,cACAC,EAAAA,QACAC,EAAAA,SACAC,EAAAA,aACAC,EAAAA,aACAC,EAAAA,WACAC,EAAAA,YACAC,EAAAA,cACAC,EAAAA,YACAC,EAAAA,aACAC,EAAAA,aAGSC,EAAgB,CACzBC,KAAM,CACFrC,QAAS,QACTsC,MAAM,GAEVC,OAAQ,EAAGvC,QAAAA,EAASsC,KAAAA,MAEhB,MAAOE,EAAUC,GAAeC,WAAS,QAEzC,cACK,MAAI,CAAAC,MAAO,CAAEC,MAAO,QAChBxD,SAAA,CAAY,YAAZY,GACGd,EAAAA,IAAC2D,EAAAA,UAAA,CACGC,MAAM,gBACNtD,UAAU,yBACVuD,MAAOP,EACPQ,SAAWC,GAAMR,EAAYQ,EAAEC,OAAOH,OACtCH,MAAM,SAGd1D,EAAAA,IAACG,EAAiB,CAAAsD,MAAO,CAAEH,SAAAA,GAAYlD,QAAQ,OAC1CF,SAAAe,EAASgD,KAAKC,GACXlE,EAAAA,IAACJ,EAAA,CACG6D,MAAO,CAAEU,YAAa,UAEtBrE,WAAY,IACPE,EAAAA,IAAAkE,EAAA,CAAId,KAAAA,EAAYtC,QAAAA,IAErBjB,KAAMqE,EAAIE,aAJLF,EAAIE,mBAQzB"}

package/build/cjs/components/icon-button/IconButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.cjs","sources":["../../../../src/components/icon-button/IconButton.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { IconButtonProps } from \"./types.js\";\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n    (props, ref) => {\n        const { className, children, density, ...rest } = props;\n        return (\n            <button\n                ref={ref}\n                type=\"button\"\n                className={clsx(\"jkl-icon-button\", className)}\n                data-testid=\"jkl-icon-button\"\n                data-density={density}\n                {...rest}\n            >\n                {children}\n            </button>\n        );\n    },\n);\n\nIconButton.displayName = \"IconButton\";\n"],"names":["IconButton","forwardRef","props","ref","className","children","density","rest","jsx","type","clsx","displayName"],"mappings":"6JAIaA,mBAAaC,YACtB,CAACC,EAAOC,KACJ,MAAQC,UAAAA,EAAWC,SAAAA,EAAUC,QAAAA,KAAYC,GAASL,EAE9C,OAAAM,EAAAA,IAAC,SAAA,CACGL,IAAAA,EACAM,KAAK,SACLL,UAAWM,EAAAA,KAAK,kBAAmBN,GACnC,cAAY,kBACZ,eAAcE,KACVC,EAEHF,SAAAA,GAAA,IAMjBL,EAAWW,YAAc"}
+{"version":3,"file":"IconButton.cjs","sources":["../../../../src/components/icon-button/IconButton.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport type { IconButtonProps } from \"./types.js\";\n\nexport const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(\n    (props, ref) => {\n        const { className, children, density, ...rest } = props;\n        return (\n            <button\n                ref={ref}\n                type=\"button\"\n                className={clsx(\"jkl-icon-button\", className)}\n                data-testid=\"jkl-icon-button\"\n                data-density={density}\n                {...rest}\n            >\n                {children}\n            </button>\n        );\n    },\n);\n\nIconButton.displayName = \"IconButton\";\n"],"names":["IconButton","forwardRef","props","ref","className","children","density","rest","jsx","type","clsx","displayName"],"mappings":"6JAIaA,mBAAaC,YACtB,CAACC,EAAOC,KACJ,MAAQC,UAAAA,EAAWC,SAAAA,EAAUC,QAAAA,KAAYC,GAASL,EAE9C,OAAAM,EAAAA,IAAC,SAAA,CACGL,IAAAA,EACAM,KAAK,SACLL,UAAWM,EAAAA,KAAK,kBAAmBN,GACnC,cAAY,kBACZ,eAAcE,KACVC,EAEHF,SAAAA,GAAA,IAMjBL,EAAWW,YAAc"}

package/build/cjs/components/icon-button/stories/IconButton.stories.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),t=require("../../icon/icons/PenIcon.cjs"),o=require("../IconButton.cjs"),n={title:"Komponenter/IconButton",component:o.IconButton,parameters:{layout:"centered"},tags:["autodocs"]},r={name:"IconButton",args:{children:e.jsx(t.PenIcon,{})},render:t=>e.jsx(o.IconButton,{...t})};exports.IconButtonStory=r,exports.default=n;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime");require("react");const t=require("../../icon/icons/PenIcon.cjs"),o=require("../IconButton.cjs"),n={title:"Komponenter/IconButton",component:o.IconButton,parameters:{layout:"centered"},tags:["autodocs"]},r={name:"IconButton",args:{children:e.jsx(t.PenIcon,{})},render:t=>e.jsx(o.IconButton,{...t})};exports.IconButtonStory=r,exports.default=n;
 //# sourceMappingURL=IconButton.stories.cjs.map

package/build/cjs/components/icon-button/stories/IconButton.stories.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.stories.cjs","sources":["../../../../../src/components/icon-button/stories/IconButton.stories.tsx"],"sourcesContent":["import { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { PenIcon } from \"../../icon/icons/PenIcon.js\";\nimport { IconButton } from \"../IconButton.js\";\nimport \"../styles/_index.scss\";\n\nconst meta: Meta = {\n    title: \"Komponenter/IconButton\",\n    component: IconButton,\n    parameters: {\n        layout: \"centered\",\n    },\n    tags: [\"autodocs\"],\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof IconButton>;\n\nexport const IconButtonStory: Story = {\n    name: \"IconButton\",\n    args: {\n        children: <PenIcon />,\n    },\n    render: (props) => <IconButton {...props} />,\n};\n"],"names":["meta","title","component","IconButton","parameters","layout","tags","IconButtonStory","name","args","children","PenIcon","render","props","jsx"],"mappings":"0NAMMA,EAAa,CACfC,MAAO,yBACPC,UAAWC,EAAAA,WACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,aAOEC,EAAyB,CAClCC,KAAM,aACNC,KAAM,CACFC,eAAWC,EAAQA,QAAA,KAEvBC,OAASC,GAAWC,EAAAA,IAAAX,EAAAA,WAAA,IAAeU"}
+{"version":3,"file":"IconButton.stories.cjs","sources":["../../../../../src/components/icon-button/stories/IconButton.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { PenIcon } from \"../../icon/icons/PenIcon.js\";\nimport { IconButton } from \"../IconButton.js\";\nimport \"../styles/_index.scss\";\n\nconst meta: Meta = {\n    title: \"Komponenter/IconButton\",\n    component: IconButton,\n    parameters: {\n        layout: \"centered\",\n    },\n    tags: [\"autodocs\"],\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof IconButton>;\n\nexport const IconButtonStory: Story = {\n    name: \"IconButton\",\n    args: {\n        children: <PenIcon />,\n    },\n    render: (props) => <IconButton {...props} />,\n};\n"],"names":["meta","title","component","IconButton","parameters","layout","tags","IconButtonStory","name","args","children","PenIcon","render","props","jsx"],"mappings":"iPAMMA,EAAa,CACfC,MAAO,yBACPC,UAAWC,EAAAA,WACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,aAOEC,EAAyB,CAClCC,KAAM,aACNC,KAAM,CACFC,eAAWC,EAAQA,QAAA,KAEvBC,OAASC,GAAWC,EAAAA,IAAAX,EAAAA,WAAA,IAAeU"}

package/build/cjs/components/image/Image.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../clsx-E3yX_9sL.cjs"),a=require("../../hooks/useElementDimensions/useElementDimensions.cjs"),i=require("./useImageLoadingStatus.cjs");exports.Image=({className:l,placeholder:t,alt:r,...m})=>{const[n,c]=i.useImageLoadingStatus(),[o,g]=a.useElementDimensions(400);return e.jsxs("div",{ref:o,className:s.clsx("jkl-image",l,{"jkl-image--loading":!c}),children:[e.jsx("img",{className:"jkl-image__placeholder",alt:r,src:t||m.src}),e.jsx("img",{alt:r,className:"jkl-image__image","data-testid":"jkl-image__image",ref:n,sizes:`${g.width}px`,loading:"lazy",decoding:"async",...m})]})};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../clsx-E3yX_9sL.cjs");require("react");const a=require("../../hooks/useElementDimensions/useElementDimensions.cjs"),i=require("./useImageLoadingStatus.cjs");exports.Image=({className:t,placeholder:l,alt:r,...m})=>{const[c,n]=i.useImageLoadingStatus(),[o,g]=a.useElementDimensions(400);return e.jsxs("div",{ref:o,className:s.clsx("jkl-image",t,{"jkl-image--loading":!n}),children:[e.jsx("img",{className:"jkl-image__placeholder",alt:r,src:l||m.src}),e.jsx("img",{alt:r,className:"jkl-image__image","data-testid":"jkl-image__image",ref:c,sizes:`${g.width}px`,loading:"lazy",decoding:"async",...m})]})};
 //# sourceMappingURL=Image.cjs.map

package/build/cjs/components/image/Image.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Image.cjs","sources":["../../../../src/components/image/Image.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { useElementDimensions } from \"../../hooks/useElementDimensions/useElementDimensions.js\";\nimport { ImageProps } from \"./types.js\";\nimport { useImageLoadingStatus } from \"./useImageLoadingStatus.js\";\n\nexport const Image: FC<ImageProps> = ({\n    className,\n    placeholder,\n    alt,\n    ...imageProperties\n}) => {\n    const [imageRef, imageLoaded] = useImageLoadingStatus();\n    const [containerRef, dimensions] =\n        useElementDimensions<HTMLDivElement>(400);\n\n    return (\n        <div\n            ref={containerRef}\n            className={clsx(\"jkl-image\", className, {\n                \"jkl-image--loading\": !imageLoaded,\n            })}\n        >\n            {/* Placeholder er bevisst uten loading og decoding for å vises umiddelbart */}\n            <img\n                className=\"jkl-image__placeholder\"\n                alt={alt}\n                src={placeholder || imageProperties.src}\n            />\n            <img\n                alt={alt}\n                className=\"jkl-image__image\"\n                data-testid=\"jkl-image__image\"\n                ref={imageRef}\n                sizes={`${dimensions.width}px`}\n                loading=\"lazy\"\n                decoding=\"async\"\n                {...imageProperties}\n            />\n        </div>\n    );\n};\n"],"names":["className","placeholder","alt","imageProperties","imageRef","imageLoaded","useImageLoadingStatus","containerRef","dimensions","useElementDimensions","jsxs","ref","clsx","children","jsx","src","sizes","width","loading","decoding"],"mappings":"2RAMqC,EACjCA,UAAAA,EACAC,YAAAA,EACAC,IAAAA,KACGC,MAEH,MAAOC,EAAUC,GAAeC,EAAsBA,yBAC/CC,EAAcC,GACjBC,uBAAqC,KAGrC,OAAAC,EAAAA,KAAC,MAAA,CACGC,IAAKJ,EACLP,UAAWY,EAAAA,KAAK,YAAaZ,EAAW,CACpC,sBAAuBK,IAI3BQ,SAAA,CAAAC,EAAAA,IAAC,MAAA,CACGd,UAAU,yBACVE,IAAAA,EACAa,IAAKd,GAAeE,EAAgBY,MAExCD,EAAAA,IAAC,MAAA,CACGZ,IAAAA,EACAF,UAAU,mBACV,cAAY,mBACZW,IAAKP,EACLY,MAAO,GAAGR,EAAWS,UACrBC,QAAQ,OACRC,SAAS,WACLhB,MACR"}
+{"version":3,"file":"Image.cjs","sources":["../../../../src/components/image/Image.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { useElementDimensions } from \"../../hooks/useElementDimensions/useElementDimensions.js\";\nimport type { ImageProps } from \"./types.js\";\nimport { useImageLoadingStatus } from \"./useImageLoadingStatus.js\";\n\nexport const Image: FC<ImageProps> = ({\n    className,\n    placeholder,\n    alt,\n    ...imageProperties\n}) => {\n    const [imageRef, imageLoaded] = useImageLoadingStatus();\n    const [containerRef, dimensions] =\n        useElementDimensions<HTMLDivElement>(400);\n\n    return (\n        <div\n            ref={containerRef}\n            className={clsx(\"jkl-image\", className, {\n                \"jkl-image--loading\": !imageLoaded,\n            })}\n        >\n            {/* Placeholder er bevisst uten loading og decoding for å vises umiddelbart */}\n            <img\n                className=\"jkl-image__placeholder\"\n                alt={alt}\n                src={placeholder || imageProperties.src}\n            />\n            {/* biome-ignore lint/a11y/useAltText: Den har da vitterlig en alt-attributt? */}\n            <img\n                alt={alt}\n                className=\"jkl-image__image\"\n                data-testid=\"jkl-image__image\"\n                ref={imageRef}\n                sizes={`${dimensions.width}px`}\n                loading=\"lazy\"\n                decoding=\"async\"\n                {...imageProperties}\n            />\n        </div>\n    );\n};\n"],"names":["className","placeholder","alt","imageProperties","imageRef","imageLoaded","useImageLoadingStatus","containerRef","dimensions","useElementDimensions","jsxs","ref","clsx","children","jsx","src","sizes","width","loading","decoding"],"mappings":"kTAMqC,EACjCA,UAAAA,EACAC,YAAAA,EACAC,IAAAA,KACGC,MAEH,MAAOC,EAAUC,GAAeC,EAAsBA,yBAC/CC,EAAcC,GACjBC,uBAAqC,KAGrC,OAAAC,EAAAA,KAAC,MAAA,CACGC,IAAKJ,EACLP,UAAWY,EAAAA,KAAK,YAAaZ,EAAW,CACpC,sBAAuBK,IAI3BQ,SAAA,CAAAC,EAAAA,IAAC,MAAA,CACGd,UAAU,yBACVE,IAAAA,EACAa,IAAKd,GAAeE,EAAgBY,MAGxCD,EAAAA,IAAC,MAAA,CACGZ,IAAAA,EACAF,UAAU,mBACV,cAAY,mBACZW,IAAKP,EACLY,MAAO,GAAGR,EAAWS,UACrBC,QAAQ,OACRC,SAAS,WACLhB,MACR"}

package/build/cjs/components/image/stories/Image.stories.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),t=require("../Image.cjs"),s="/images/dog-400.jpg",a={title:"Komponenter/Image",component:t.Image,parameters:{layout:"centered"},tags:["autodocs"],args:{src:s,srcSet:`${s} 400w, /images/dog-800.jpg 800w, /images/dog-1200.jpg 1200w, /images/dog-1920.jpg 1920w`,placeholder:"/images/thumbnail.jpg"},argTypes:{className:{control:"radio",options:["fluid","static"]}}},r={args:{className:"fluid"},render:s=>e.jsx("div",{style:{width:"50vw",height:"auto"},children:e.jsx(t.Image,{...s})})},i={args:{className:"static"},render:s=>e.jsx("div",{style:{width:"50vw",height:"auto"},children:e.jsx(t.Image,{...s})})};exports.Fluid=r,exports.Static=i,exports.default=a;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime");require("react");const t=require("../Image.cjs"),s="/images/dog-400.jpg",a={title:"Komponenter/Image",component:t.Image,parameters:{layout:"centered"},tags:["autodocs"],args:{src:s,srcSet:`${s} 400w, /images/dog-800.jpg 800w, /images/dog-1200.jpg 1200w, /images/dog-1920.jpg 1920w`,placeholder:"/images/thumbnail.jpg"},argTypes:{className:{control:"radio",options:["fluid","static"]}}},r={args:{className:"fluid"},render:s=>e.jsx("div",{style:{width:"50vw",height:"auto"},children:e.jsx(t.Image,{...s})})},i={args:{className:"static"},render:s=>e.jsx("div",{style:{width:"50vw",height:"auto"},children:e.jsx(t.Image,{...s})})};exports.Fluid=r,exports.Static=i,exports.default=a;
 //# sourceMappingURL=Image.stories.cjs.map

package/build/cjs/components/image/stories/Image.stories.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Image.stories.cjs","sources":["../../../../../src/components/image/stories/Image.stories.tsx"],"sourcesContent":["import { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Image } from \"../Image.js\";\nimport { ImageProps } from \"../types.js\";\nimport \"../styles/_index.scss\";\nimport \"./styles.scss\";\n\nconst dog400 = \"/images/dog-400.jpg\";\nconst dog800 = \"/images/dog-800.jpg\";\nconst dog1200 = \"/images/dog-1200.jpg\";\nconst dog1920 = \"/images/dog-1920.jpg\";\nconst thumbnail = \"/images/thumbnail.jpg\";\n\nexport default {\n    title: \"Komponenter/Image\",\n    component: Image,\n    parameters: {\n        layout: \"centered\",\n    },\n    tags: [\"autodocs\"],\n    args: {\n        src: dog400,\n        srcSet: `${dog400} 400w, ${dog800} 800w, ${dog1200} 1200w, ${dog1920} 1920w`,\n        placeholder: thumbnail,\n    },\n    argTypes: {\n        className: {\n            control: \"radio\",\n            options: [\"fluid\", \"static\"],\n        },\n    },\n} satisfies Meta<typeof Image>;\n\nexport const Fluid: StoryObj<ImageProps> = {\n    args: {\n        className: \"fluid\",\n    },\n    render: (props) => {\n        return (\n            <div style={{ width: \"50vw\", height: \"auto\" }}>\n                <Image {...props} />\n            </div>\n        );\n    },\n};\n\nexport const Static: StoryObj<ImageProps> = {\n    args: {\n        className: \"static\",\n    },\n    render: (props) => {\n        return (\n            <div style={{ width: \"50vw\", height: \"auto\" }}>\n                <Image {...props} />\n            </div>\n        );\n    },\n};\n"],"names":["dog400","Image_stories","title","component","Image","parameters","layout","tags","args","src","srcSet","placeholder","argTypes","className","control","options","Fluid","render","props","jsx","style","width","height","children","Static"],"mappings":"2KAOMA,EAAS,sBAMAC,EAAA,CACXC,MAAO,oBACPC,UAAWC,EAAAA,MACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,YACPC,KAAM,CACFC,IAAKT,EACLU,OAAQ,GAAGV,2FACXW,YAZU,yBAcdC,SAAU,CACNC,UAAW,CACPC,QAAS,QACTC,QAAS,CAAC,QAAS,aAKlBC,EAA8B,CACvCR,KAAM,CACFK,UAAW,SAEfI,OAASC,GAEAC,EAAAA,IAAA,MAAA,CAAIC,MAAO,CAAEC,MAAO,OAAQC,OAAQ,QACjCC,SAAAJ,EAAAA,IAACf,EAAOA,MAAA,IAAGc,OAMdM,EAA+B,CACxChB,KAAM,CACFK,UAAW,UAEfI,OAASC,GAEAC,EAAAA,IAAA,MAAA,CAAIC,MAAO,CAAEC,MAAO,OAAQC,OAAQ,QACjCC,SAAAJ,EAAAA,IAACf,EAAOA,MAAA,IAAGc"}
+{"version":3,"file":"Image.stories.cjs","sources":["../../../../../src/components/image/stories/Image.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport { Image } from \"../Image.js\";\nimport type { ImageProps } from \"../types.js\";\nimport \"../styles/_index.scss\";\nimport \"./styles.scss\";\n\nconst dog400 = \"/images/dog-400.jpg\";\nconst dog800 = \"/images/dog-800.jpg\";\nconst dog1200 = \"/images/dog-1200.jpg\";\nconst dog1920 = \"/images/dog-1920.jpg\";\nconst thumbnail = \"/images/thumbnail.jpg\";\n\nexport default {\n    title: \"Komponenter/Image\",\n    component: Image,\n    parameters: {\n        layout: \"centered\",\n    },\n    tags: [\"autodocs\"],\n    args: {\n        src: dog400,\n        srcSet: `${dog400} 400w, ${dog800} 800w, ${dog1200} 1200w, ${dog1920} 1920w`,\n        placeholder: thumbnail,\n    },\n    argTypes: {\n        className: {\n            control: \"radio\",\n            options: [\"fluid\", \"static\"],\n        },\n    },\n} satisfies Meta<typeof Image>;\n\nexport const Fluid: StoryObj<ImageProps> = {\n    args: {\n        className: \"fluid\",\n    },\n    render: (props) => {\n        return (\n            <div style={{ width: \"50vw\", height: \"auto\" }}>\n                <Image {...props} />\n            </div>\n        );\n    },\n};\n\nexport const Static: StoryObj<ImageProps> = {\n    args: {\n        className: \"static\",\n    },\n    render: (props) => {\n        return (\n            <div style={{ width: \"50vw\", height: \"auto\" }}>\n                <Image {...props} />\n            </div>\n        );\n    },\n};\n"],"names":["dog400","Image_stories","title","component","Image","parameters","layout","tags","args","src","srcSet","placeholder","argTypes","className","control","options","Fluid","render","props","jsx","style","width","height","children","Static"],"mappings":"kMAOMA,EAAS,sBAMAC,EAAA,CACXC,MAAO,oBACPC,UAAWC,EAAAA,MACXC,WAAY,CACRC,OAAQ,YAEZC,KAAM,CAAC,YACPC,KAAM,CACFC,IAAKT,EACLU,OAAQ,GAAGV,2FACXW,YAZU,yBAcdC,SAAU,CACNC,UAAW,CACPC,QAAS,QACTC,QAAS,CAAC,QAAS,aAKlBC,EAA8B,CACvCR,KAAM,CACFK,UAAW,SAEfI,OAASC,GAEAC,EAAAA,IAAA,MAAA,CAAIC,MAAO,CAAEC,MAAO,OAAQC,OAAQ,QACjCC,SAAAJ,EAAAA,IAACf,EAAOA,MAAA,IAAGc,OAMdM,EAA+B,CACxChB,KAAM,CACFK,UAAW,UAEfI,OAASC,GAEAC,EAAAA,IAAA,MAAA,CAAIC,MAAO,CAAEC,MAAO,OAAQC,OAAQ,QACjCC,SAAAJ,EAAAA,IAACf,EAAOA,MAAA,IAAGc"}