@fremtind/jokul 1.5.0 → 1.5.1

package/build/cjs/components/help/Help.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");require("react");const o=require("../button/Button.cjs"),r=require("../icon/Icon.cjs");exports.BETA_Help=({position:i="top",buttonText:s="Hjelp",showButtonText:n=!1,iconPosition:a="left",children:l,...c})=>e.jsxs(e.Fragment,{children:[e.jsx(o.Button,{...c,title:s||c.title,iconPosition:a,variant:"ghost",className:t.clsx("jkl-help-trigger",c.className),icon:e.jsx(r.Icon,{"aria-hidden":"true",children:"help"}),"data-testid":"jkl-help-trigger",popovertarget:`${s}-popover`,style:{anchorName:`${s}-popover`},children:n&&s}),e.jsx("output",{"aria-live":"assertive",children:e.jsx("div",{"data-position":i,"data-theme":"dark",popover:"auto",id:`${s}-popover`,className:"jkl-help-popover",style:{positionAnchor:`${s}-popover`},children:l})})]});
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../clsx-E3yX_9sL.cjs");require("react");const o=require("../button/Button.cjs"),r=require("../icon/Icon.cjs");exports.BETA_Help=({position:i="top",buttonText:s="Hjelp",showButtonText:n=!1,iconPosition:l="left",children:c,...p})=>e.jsxs(e.Fragment,{children:[e.jsx(o.Button,{...p,title:s||p.title,iconPosition:l,variant:"ghost",className:t.clsx("jkl-help-trigger",p.className),icon:e.jsx(r.Icon,{"aria-hidden":"true",children:"help"}),"data-testid":"jkl-help-trigger",popovertarget:`${s}-popover`,style:{anchorName:`${s}-popover`},children:n&&s}),e.jsx("output",{"aria-live":"assertive",children:e.jsx("div",{"data-position":i,popover:"auto",id:`${s}-popover`,className:"jkl-help-popover",style:{positionAnchor:`${s}-popover`},children:c})})]});
 //# sourceMappingURL=Help.cjs.map

package/build/cjs/components/help/Help.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Help.cjs","sources":["../../../../src/components/help/Help.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Button } from \"../button/index.js\";\nimport { Icon } from \"../icon/Icon.js\";\nimport type { HelpProps } from \"./types.js\";\n\nexport const BETA_Help = ({\n    position = \"top\",\n    buttonText = \"Hjelp\",\n    showButtonText = false,\n    iconPosition = \"left\",\n    children,\n    ...rest\n}: HelpProps) => {\n    return (\n        <>\n            <Button\n                {...rest}\n                title={buttonText || rest.title}\n                iconPosition={iconPosition}\n                variant=\"ghost\"\n                className={clsx(\"jkl-help-trigger\", rest.className)}\n                icon={<Icon aria-hidden=\"true\">help</Icon>}\n                data-testid=\"jkl-help-trigger\"\n                // @ts-ignore\n                popovertarget={`${buttonText}-popover`}\n                // @ts-ignore\n                style={{ anchorName: `${buttonText}-popover` }}\n            >\n                {showButtonText && buttonText}\n            </Button>\n\n            <output aria-live=\"assertive\">\n                <div\n                    data-position={position}\n                    data-theme=\"dark\"\n                    popover=\"auto\"\n                    id={`${buttonText}-popover`}\n                    className=\"jkl-help-popover\"\n                    // @ts-ignore\n                    style={{ positionAnchor: `${buttonText}-popover` }}\n                >\n                    {children}\n                </div>\n            </output>\n        </>\n    );\n};\n"],"names":["position","buttonText","showButtonText","iconPosition","children","rest","jsxs","Fragment","jsx","Button","title","variant","className","clsx","icon","Icon","popovertarget","style","anchorName","popover","id","positionAnchor"],"mappings":"sQAMyB,EACrBA,SAAAA,EAAW,MACXC,WAAAA,EAAa,QACbC,eAAAA,GAAiB,EACjBC,aAAAA,EAAe,OACfC,SAAAA,KACGC,KAIKC,EAAAA,KAAAC,WAAA,CAAAH,SAAA,CAAAI,EAAAA,IAACC,EAAAA,OAAA,IACOJ,EACJK,MAAOT,GAAcI,EAAKK,MAC1BP,aAAAA,EACAQ,QAAQ,QACRC,UAAWC,EAAAA,KAAK,mBAAoBR,EAAKO,WACzCE,KAAMN,EAAAA,IAACO,OAAK,CAAA,cAAY,OAAOX,SAAI,SACnC,cAAY,mBAEZY,cAAe,GAAGf,YAElBgB,MAAO,CAAEC,WAAY,GAAGjB,aAEvBG,SAAkBF,GAAAD,IAGvBO,EAAAA,IAAC,SAAO,CAAA,YAAU,YACdJ,SAAAI,EAAAA,IAAC,MAAA,CACG,gBAAeR,EACf,aAAW,OACXmB,QAAQ,OACRC,GAAI,GAAGnB,YACPW,UAAU,mBAEVK,MAAO,CAAEI,eAAgB,GAAGpB,aAE3BG,SAAAA"}
+{"version":3,"file":"Help.cjs","sources":["../../../../src/components/help/Help.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Button } from \"../button/index.js\";\nimport { Icon } from \"../icon/Icon.js\";\nimport type { HelpProps } from \"./types.js\";\n\nexport const BETA_Help = ({\n    position = \"top\",\n    buttonText = \"Hjelp\",\n    showButtonText = false,\n    iconPosition = \"left\",\n    children,\n    ...rest\n}: HelpProps) => {\n    return (\n        <>\n            <Button\n                {...rest}\n                title={buttonText || rest.title}\n                iconPosition={iconPosition}\n                variant=\"ghost\"\n                className={clsx(\"jkl-help-trigger\", rest.className)}\n                icon={<Icon aria-hidden=\"true\">help</Icon>}\n                data-testid=\"jkl-help-trigger\"\n                // @ts-ignore\n                popovertarget={`${buttonText}-popover`}\n                // @ts-ignore\n                style={{ anchorName: `${buttonText}-popover` }}\n            >\n                {showButtonText && buttonText}\n            </Button>\n\n            <output aria-live=\"assertive\">\n                <div\n                    data-position={position}\n                    popover=\"auto\"\n                    id={`${buttonText}-popover`}\n                    className=\"jkl-help-popover\"\n                    // @ts-ignore\n                    style={{ positionAnchor: `${buttonText}-popover` }}\n                >\n                    {children}\n                </div>\n            </output>\n        </>\n    );\n};\n"],"names":["position","buttonText","showButtonText","iconPosition","children","rest","jsxs","Fragment","jsx","Button","title","variant","className","clsx","icon","Icon","popovertarget","style","anchorName","popover","id","positionAnchor"],"mappings":"sQAMyB,EACrBA,SAAAA,EAAW,MACXC,WAAAA,EAAa,QACbC,eAAAA,GAAiB,EACjBC,aAAAA,EAAe,OACfC,SAAAA,KACGC,KAIKC,EAAAA,KAAAC,WAAA,CAAAH,SAAA,CAAAI,EAAAA,IAACC,EAAAA,OAAA,IACOJ,EACJK,MAAOT,GAAcI,EAAKK,MAC1BP,aAAAA,EACAQ,QAAQ,QACRC,UAAWC,EAAAA,KAAK,mBAAoBR,EAAKO,WACzCE,KAAMN,EAAAA,IAACO,OAAK,CAAA,cAAY,OAAOX,SAAI,SACnC,cAAY,mBAEZY,cAAe,GAAGf,YAElBgB,MAAO,CAAEC,WAAY,GAAGjB,aAEvBG,SAAkBF,GAAAD,IAGvBO,EAAAA,IAAC,SAAO,CAAA,YAAU,YACdJ,SAAAI,EAAAA,IAAC,MAAA,CACG,gBAAeR,EACfmB,QAAQ,OACRC,GAAI,GAAGnB,YACPW,UAAU,mBAEVK,MAAO,CAAEI,eAAgB,GAAGpB,aAE3BG,SAAAA"}

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");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:n?"":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})]})};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../clsx-E3yX_9sL.cjs"),i=require("react"),a=require("../../hooks/useElementDimensions/useElementDimensions.cjs"),r=require("./useImageLoadingStatus.cjs"),t=require("../../utilities/polymorphism/mergeRefs.cjs");require("../../utilities/polymorphism/SlotComponent.cjs");const l=i.forwardRef((({className:i,placeholder:l,alt:m,...o},c)=>{const[n,g]=r.useImageLoadingStatus(),[u,d]=a.useElementDimensions(400),j=t.mergeRefs(c,n);return e.jsxs("div",{ref:u,className:s.clsx("jkl-image",i,{"jkl-image--loading":!g}),children:[e.jsx("img",{className:"jkl-image__placeholder",alt:g?"":m,src:l||o.src}),e.jsx("img",{alt:m,className:"jkl-image__image","data-testid":"jkl-image__image",ref:j,sizes:`${d.width}px`,decoding:"async",loading:"lazy",...o})]})}));l.displayName="Image",exports.Image=l;
 //# 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, { 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={imageLoaded ? \"\" : 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,2BACzBC,EAAcC,GACjBC,EAAAA,qBAAqC,KAGrC,OAAAC,EAAAA,KAAC,MAAA,CACGC,IAAKJ,EACLP,UAAWY,EAAAA,KAAK,YAAaZ,EAAW,CACpC,sBAAuBK,IAI3BQ,SAAA,CAAAC,EAAAA,IAAC,MAAA,CACGd,UAAU,yBACVE,IAAKG,EAAc,GAAKH,EACxBa,IAAKd,GAAeE,EAAgBY,MAGxCD,EAAAA,IAAC,MAAA,CACGZ,IAAAA,EACAF,UAAU,mBACV,cAAY,mBACZW,IAAKP,EACLY,MAAO,GAAGR,EAAWS,UACrBC,QAAQ,OACRC,SAAS,WACLhB,MAEZ"}
+{"version":3,"file":"Image.cjs","sources":["../../../../src/components/image/Image.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useElementDimensions } from \"../../hooks/useElementDimensions/useElementDimensions.js\";\nimport { useImageLoadingStatus } from \"./useImageLoadingStatus.js\";\nimport { mergeRefs } from \"../../utilities/index.js\";\nimport type { ImageProps } from \"./types.js\";\n\nexport const Image = forwardRef<HTMLImageElement, ImageProps>(\n    ({ className, placeholder, alt, ...imageProperties }, ref) => {\n        const [imageRef, imageLoaded] = useImageLoadingStatus();\n        const [containerRef, dimensions] =\n            useElementDimensions<HTMLDivElement>(400);\n\n        const mergedImageRef = mergeRefs(ref, imageRef);\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={imageLoaded ? \"\" : 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={mergedImageRef}\n                    sizes={`${dimensions.width}px`}\n                    decoding=\"async\"\n                    loading=\"lazy\"\n                    {...imageProperties}\n                />\n            </div>\n        );\n    },\n);\n\nImage.displayName = \"Image\";\n"],"names":["Image","forwardRef","className","placeholder","alt","imageProperties","ref","imageRef","imageLoaded","useImageLoadingStatus","containerRef","dimensions","useElementDimensions","mergedImageRef","mergeRefs","jsxs","clsx","children","jsx","src","sizes","width","decoding","loading","displayName"],"mappings":"kZAOO,MAAMA,EAAQC,EAAAA,YACjB,EAAGC,UAAAA,EAAWC,YAAAA,EAAaC,IAAAA,KAAQC,GAAmBC,KAClD,MAAOC,EAAUC,GAAeC,2BACzBC,EAAcC,GACjBC,EAAAA,qBAAqC,KAEnCC,EAAiBC,EAAAA,UAAUR,EAAKC,GAGlC,OAAAQ,EAAAA,KAAC,MAAA,CACGT,IAAKI,EACLR,UAAWc,EAAAA,KAAK,YAAad,EAAW,CACpC,sBAAuBM,IAI3BS,SAAA,CAAAC,EAAAA,IAAC,MAAA,CACGhB,UAAU,yBACVE,IAAKI,EAAc,GAAKJ,EACxBe,IAAKhB,GAAeE,EAAgBc,MAGxCD,EAAAA,IAAC,MAAA,CACGd,IAAAA,EACAF,UAAU,mBACV,cAAY,mBACZI,IAAKO,EACLO,MAAO,GAAGT,EAAWU,UACrBC,SAAS,QACTC,QAAQ,UACJlB,MAEZ,IAKZL,EAAMwB,YAAc"}

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

@@ -1,3 +1,2 @@
-import { FC } from 'react';
 import { ImageProps } from './types.cjs';
-export declare const Image: FC<ImageProps>;
+export declare const Image: import('react').ForwardRefExoticComponent<ImageProps & import('react').RefAttributes<HTMLImageElement>>;

package/build/es/components/help/Help.js

@@ -1,2 +1,2 @@
-import{jsxs as o,Fragment as t,jsx as e}from"react/jsx-runtime";import{c as r}from"../../../clsx-BeLtu-UY.js";import"react";import{Button as i}from"../button/Button.js";import{Icon as a}from"../icon/Icon.js";const s=({position:s="top",buttonText:p="Hjelp",showButtonText:n=!1,iconPosition:l="left",children:c,...h})=>o(t,{children:[e(i,{...h,title:p||h.title,iconPosition:l,variant:"ghost",className:r("jkl-help-trigger",h.className),icon:e(a,{"aria-hidden":"true",children:"help"}),"data-testid":"jkl-help-trigger",popovertarget:`${p}-popover`,style:{anchorName:`${p}-popover`},children:n&&p}),e("output",{"aria-live":"assertive",children:e("div",{"data-position":s,"data-theme":"dark",popover:"auto",id:`${p}-popover`,className:"jkl-help-popover",style:{positionAnchor:`${p}-popover`},children:c})})]});export{s as BETA_Help};
+import{jsxs as o,Fragment as t,jsx as e}from"react/jsx-runtime";import{c as i}from"../../../clsx-BeLtu-UY.js";import"react";import{Button as r}from"../button/Button.js";import{Icon as s}from"../icon/Icon.js";const p=({position:p="top",buttonText:a="Hjelp",showButtonText:n=!1,iconPosition:l="left",children:c,...h})=>o(t,{children:[e(r,{...h,title:a||h.title,iconPosition:l,variant:"ghost",className:i("jkl-help-trigger",h.className),icon:e(s,{"aria-hidden":"true",children:"help"}),"data-testid":"jkl-help-trigger",popovertarget:`${a}-popover`,style:{anchorName:`${a}-popover`},children:n&&a}),e("output",{"aria-live":"assertive",children:e("div",{"data-position":p,popover:"auto",id:`${a}-popover`,className:"jkl-help-popover",style:{positionAnchor:`${a}-popover`},children:c})})]});export{p as BETA_Help};
 //# sourceMappingURL=Help.js.map

package/build/es/components/help/Help.js.map

@@ -1 +1 @@
-{"version":3,"file":"Help.js","sources":["../../../../src/components/help/Help.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Button } from \"../button/index.js\";\nimport { Icon } from \"../icon/Icon.js\";\nimport type { HelpProps } from \"./types.js\";\n\nexport const BETA_Help = ({\n    position = \"top\",\n    buttonText = \"Hjelp\",\n    showButtonText = false,\n    iconPosition = \"left\",\n    children,\n    ...rest\n}: HelpProps) => {\n    return (\n        <>\n            <Button\n                {...rest}\n                title={buttonText || rest.title}\n                iconPosition={iconPosition}\n                variant=\"ghost\"\n                className={clsx(\"jkl-help-trigger\", rest.className)}\n                icon={<Icon aria-hidden=\"true\">help</Icon>}\n                data-testid=\"jkl-help-trigger\"\n                // @ts-ignore\n                popovertarget={`${buttonText}-popover`}\n                // @ts-ignore\n                style={{ anchorName: `${buttonText}-popover` }}\n            >\n                {showButtonText && buttonText}\n            </Button>\n\n            <output aria-live=\"assertive\">\n                <div\n                    data-position={position}\n                    data-theme=\"dark\"\n                    popover=\"auto\"\n                    id={`${buttonText}-popover`}\n                    className=\"jkl-help-popover\"\n                    // @ts-ignore\n                    style={{ positionAnchor: `${buttonText}-popover` }}\n                >\n                    {children}\n                </div>\n            </output>\n        </>\n    );\n};\n"],"names":["BETA_Help","position","buttonText","showButtonText","iconPosition","children","rest","jsxs","Fragment","jsx","Button","title","variant","className","clsx","icon","Icon","popovertarget","style","anchorName","popover","id","positionAnchor"],"mappings":"gNAMO,MAAMA,EAAY,EACrBC,SAAAA,EAAW,MACXC,WAAAA,EAAa,QACbC,eAAAA,GAAiB,EACjBC,aAAAA,EAAe,OACfC,SAAAA,KACGC,KAIKC,EAAAC,EAAA,CAAAH,SAAA,CAAAI,EAACC,EAAA,IACOJ,EACJK,MAAOT,GAAcI,EAAKK,MAC1BP,aAAAA,EACAQ,QAAQ,QACRC,UAAWC,EAAK,mBAAoBR,EAAKO,WACzCE,KAAMN,EAACO,EAAK,CAAA,cAAY,OAAOX,SAAI,SACnC,cAAY,mBAEZY,cAAe,GAAGf,YAElBgB,MAAO,CAAEC,WAAY,GAAGjB,aAEvBG,SAAkBF,GAAAD,IAGvBO,EAAC,SAAO,CAAA,YAAU,YACdJ,SAAAI,EAAC,MAAA,CACG,gBAAeR,EACf,aAAW,OACXmB,QAAQ,OACRC,GAAI,GAAGnB,YACPW,UAAU,mBAEVK,MAAO,CAAEI,eAAgB,GAAGpB,aAE3BG,SAAAA"}
+{"version":3,"file":"Help.js","sources":["../../../../src/components/help/Help.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Button } from \"../button/index.js\";\nimport { Icon } from \"../icon/Icon.js\";\nimport type { HelpProps } from \"./types.js\";\n\nexport const BETA_Help = ({\n    position = \"top\",\n    buttonText = \"Hjelp\",\n    showButtonText = false,\n    iconPosition = \"left\",\n    children,\n    ...rest\n}: HelpProps) => {\n    return (\n        <>\n            <Button\n                {...rest}\n                title={buttonText || rest.title}\n                iconPosition={iconPosition}\n                variant=\"ghost\"\n                className={clsx(\"jkl-help-trigger\", rest.className)}\n                icon={<Icon aria-hidden=\"true\">help</Icon>}\n                data-testid=\"jkl-help-trigger\"\n                // @ts-ignore\n                popovertarget={`${buttonText}-popover`}\n                // @ts-ignore\n                style={{ anchorName: `${buttonText}-popover` }}\n            >\n                {showButtonText && buttonText}\n            </Button>\n\n            <output aria-live=\"assertive\">\n                <div\n                    data-position={position}\n                    popover=\"auto\"\n                    id={`${buttonText}-popover`}\n                    className=\"jkl-help-popover\"\n                    // @ts-ignore\n                    style={{ positionAnchor: `${buttonText}-popover` }}\n                >\n                    {children}\n                </div>\n            </output>\n        </>\n    );\n};\n"],"names":["BETA_Help","position","buttonText","showButtonText","iconPosition","children","rest","jsxs","Fragment","jsx","Button","title","variant","className","clsx","icon","Icon","popovertarget","style","anchorName","popover","id","positionAnchor"],"mappings":"gNAMO,MAAMA,EAAY,EACrBC,SAAAA,EAAW,MACXC,WAAAA,EAAa,QACbC,eAAAA,GAAiB,EACjBC,aAAAA,EAAe,OACfC,SAAAA,KACGC,KAIKC,EAAAC,EAAA,CAAAH,SAAA,CAAAI,EAACC,EAAA,IACOJ,EACJK,MAAOT,GAAcI,EAAKK,MAC1BP,aAAAA,EACAQ,QAAQ,QACRC,UAAWC,EAAK,mBAAoBR,EAAKO,WACzCE,KAAMN,EAACO,EAAK,CAAA,cAAY,OAAOX,SAAI,SACnC,cAAY,mBAEZY,cAAe,GAAGf,YAElBgB,MAAO,CAAEC,WAAY,GAAGjB,aAEvBG,SAAkBF,GAAAD,IAGvBO,EAAC,SAAO,CAAA,YAAU,YACdJ,SAAAI,EAAC,MAAA,CACG,gBAAeR,EACfmB,QAAQ,OACRC,GAAI,GAAGnB,YACPW,UAAU,mBAEVK,MAAO,CAAEI,eAAgB,GAAGpB,aAE3BG,SAAAA"}

package/build/es/components/image/Image.d.ts

@@ -1,3 +1,2 @@
-import { FC } from 'react';
 import { ImageProps } from './types.js';
-export declare const Image: FC<ImageProps>;
+export declare const Image: import('react').ForwardRefExoticComponent<ImageProps & import('react').RefAttributes<HTMLImageElement>>;

package/build/es/components/image/Image.js

@@ -1,2 +1,2 @@
-import{jsxs as s,jsx as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import"react";import{useElementDimensions as m}from"../../hooks/useElementDimensions/useElementDimensions.js";import{useImageLoadingStatus as i}from"./useImageLoadingStatus.js";const t=({className:t,placeholder:l,alt:o,...r})=>{const[n,c]=i(),[g,d]=m(400);return s("div",{ref:g,className:a("jkl-image",t,{"jkl-image--loading":!c}),children:[e("img",{className:"jkl-image__placeholder",alt:c?"":o,src:l||r.src}),e("img",{alt:o,className:"jkl-image__image","data-testid":"jkl-image__image",ref:n,sizes:`${d.width}px`,loading:"lazy",decoding:"async",...r})]})};export{t as Image};
+import{jsxs as e,jsx as s}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import{forwardRef as m}from"react";import{useElementDimensions as i}from"../../hooks/useElementDimensions/useElementDimensions.js";import{useImageLoadingStatus as o}from"./useImageLoadingStatus.js";import{mergeRefs as t}from"../../utilities/polymorphism/mergeRefs.js";import"../../utilities/polymorphism/SlotComponent.js";const r=m((({className:m,placeholder:r,alt:l,...n},g)=>{const[p,c]=o(),[d,j]=i(400),f=t(g,p);return e("div",{ref:d,className:a("jkl-image",m,{"jkl-image--loading":!c}),children:[s("img",{className:"jkl-image__placeholder",alt:c?"":l,src:r||n.src}),s("img",{alt:l,className:"jkl-image__image","data-testid":"jkl-image__image",ref:f,sizes:`${j.width}px`,decoding:"async",loading:"lazy",...n})]})}));r.displayName="Image";export{r as Image};
 //# sourceMappingURL=Image.js.map

package/build/es/components/image/Image.js.map

@@ -1 +1 @@
-{"version":3,"file":"Image.js","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={imageLoaded ? \"\" : 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":["Image","className","placeholder","alt","imageProperties","imageRef","imageLoaded","useImageLoadingStatus","containerRef","dimensions","useElementDimensions","jsxs","ref","clsx","children","jsx","src","sizes","width","loading","decoding"],"mappings":"iRAMO,MAAMA,EAAwB,EACjCC,UAAAA,EACAC,YAAAA,EACAC,IAAAA,KACGC,MAEG,MAACC,EAAUC,GAAeC,KACzBC,EAAcC,GACjBC,EAAqC,KAGrC,OAAAC,EAAC,MAAA,CACGC,IAAKJ,EACLP,UAAWY,EAAK,YAAaZ,EAAW,CACpC,sBAAuBK,IAI3BQ,SAAA,CAAAC,EAAC,MAAA,CACGd,UAAU,yBACVE,IAAKG,EAAc,GAAKH,EACxBa,IAAKd,GAAeE,EAAgBY,MAGxCD,EAAC,MAAA,CACGZ,IAAAA,EACAF,UAAU,mBACV,cAAY,mBACZW,IAAKP,EACLY,MAAO,GAAGR,EAAWS,UACrBC,QAAQ,OACRC,SAAS,WACLhB,MAEZ"}
+{"version":3,"file":"Image.js","sources":["../../../../src/components/image/Image.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport { useElementDimensions } from \"../../hooks/useElementDimensions/useElementDimensions.js\";\nimport { useImageLoadingStatus } from \"./useImageLoadingStatus.js\";\nimport { mergeRefs } from \"../../utilities/index.js\";\nimport type { ImageProps } from \"./types.js\";\n\nexport const Image = forwardRef<HTMLImageElement, ImageProps>(\n    ({ className, placeholder, alt, ...imageProperties }, ref) => {\n        const [imageRef, imageLoaded] = useImageLoadingStatus();\n        const [containerRef, dimensions] =\n            useElementDimensions<HTMLDivElement>(400);\n\n        const mergedImageRef = mergeRefs(ref, imageRef);\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={imageLoaded ? \"\" : 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={mergedImageRef}\n                    sizes={`${dimensions.width}px`}\n                    decoding=\"async\"\n                    loading=\"lazy\"\n                    {...imageProperties}\n                />\n            </div>\n        );\n    },\n);\n\nImage.displayName = \"Image\";\n"],"names":["Image","forwardRef","className","placeholder","alt","imageProperties","ref","imageRef","imageLoaded","useImageLoadingStatus","containerRef","dimensions","useElementDimensions","mergedImageRef","mergeRefs","jsxs","clsx","children","jsx","src","sizes","width","decoding","loading","displayName"],"mappings":"kaAOO,MAAMA,EAAQC,GACjB,EAAGC,UAAAA,EAAWC,YAAAA,EAAaC,IAAAA,KAAQC,GAAmBC,KAClD,MAAOC,EAAUC,GAAeC,KACzBC,EAAcC,GACjBC,EAAqC,KAEnCC,EAAiBC,EAAUR,EAAKC,GAGlC,OAAAQ,EAAC,MAAA,CACGT,IAAKI,EACLR,UAAWc,EAAK,YAAad,EAAW,CACpC,sBAAuBM,IAI3BS,SAAA,CAAAC,EAAC,MAAA,CACGhB,UAAU,yBACVE,IAAKI,EAAc,GAAKJ,EACxBe,IAAKhB,GAAeE,EAAgBc,MAGxCD,EAAC,MAAA,CACGd,IAAAA,EACAF,UAAU,mBACV,cAAY,mBACZI,IAAKO,EACLO,MAAO,GAAGT,EAAWU,UACrBC,SAAS,QACTC,QAAQ,UACJlB,MAEZ,IAKZL,EAAMwB,YAAc"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fremtind/jokul",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "type": "module",
   "publishConfig": {
     "access": "public"

package/styles/components/card/card.css

@@ -80,6 +80,7 @@
   width: calc(100% + 2 * var(--padding, 0));
   aspect-ratio: var(--image-aspect-ratio, 3/2);
   margin-inline: var(--margin, 0);
+  object-fit: cover;
 }
 .jkl-card-image--top {
   margin-top: var(--margin, 0);

package/styles/components/card/card.min.css

@@ -1 +1 @@
-.jkl-card{--padding-s:var(--jkl-unit-05);--padding-m:var(--jkl-unit-15);--padding-l:var(--jkl-unit-20);--padding-xl:var(--jkl-unit-30);--border-radius:0.25rem;--border-color:#0000;--border-width:0.0625rem;--background-color:#0000;background-color:var(--background-color);box-sizing:border-box;color:var(--jkl-color-text-default);display:block;overflow:hidden;padding:var(--padding,var(--padding-s));position:relative;text-decoration:none}.jkl-card,.jkl-card:after{border-radius:var(--border-radius)}.jkl-card:after{border:var(--border-width) solid var(--border-color);content:"";inset:0;pointer-events:none;position:absolute;transition-duration:.1s;transition-property:border-color,border-size;transition-timing-function:ease}@media (min-width:680px){.jkl-card{--padding-s:var(--jkl-unit-10);--padding-m:var(--jkl-unit-20);--padding-l:var(--jkl-unit-30);--padding-xl:var(--jkl-unit-40)}}.jkl-card[data-padding=s]{--padding:var(--padding-s)}.jkl-card[data-padding=m]{--padding:var(--padding-m)}.jkl-card[data-padding=l]{--padding:var(--padding-l)}.jkl-card[data-padding=xl]{--padding:var(--padding-xl)}.jkl-card--high{--background-color:var(--jkl-color-background-container-high)}.jkl-card--low{--background-color:var(--jkl-color-background-container-low)}.jkl-card--outlined{--border-color:var(--jkl-color-border-separator)}.jkl-card[data-clickable=true]{cursor:pointer}.jkl-card[data-clickable=true]:hover{--border-color:var(--jkl-color-border-separator-hover);--border-width:0.125rem}.jkl-card[data-clickable=true]:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-card-image{--margin:calc(var(--padding, 0)*-1);aspect-ratio:var(--image-aspect-ratio,3/2);margin-inline:var(--margin,0);width:calc(100% + var(--padding, 0)*2)}.jkl-card-image--top{margin-top:var(--margin,0)}.jkl-card-image--bottom{margin-bottom:var(--margin,0)}.jkl-card-image--full{margin-block:var(--margin,0)}
+.jkl-card{--padding-s:var(--jkl-unit-05);--padding-m:var(--jkl-unit-15);--padding-l:var(--jkl-unit-20);--padding-xl:var(--jkl-unit-30);--border-radius:0.25rem;--border-color:#0000;--border-width:0.0625rem;--background-color:#0000;background-color:var(--background-color);box-sizing:border-box;color:var(--jkl-color-text-default);display:block;overflow:hidden;padding:var(--padding,var(--padding-s));position:relative;text-decoration:none}.jkl-card,.jkl-card:after{border-radius:var(--border-radius)}.jkl-card:after{border:var(--border-width) solid var(--border-color);content:"";inset:0;pointer-events:none;position:absolute;transition-duration:.1s;transition-property:border-color,border-size;transition-timing-function:ease}@media (min-width:680px){.jkl-card{--padding-s:var(--jkl-unit-10);--padding-m:var(--jkl-unit-20);--padding-l:var(--jkl-unit-30);--padding-xl:var(--jkl-unit-40)}}.jkl-card[data-padding=s]{--padding:var(--padding-s)}.jkl-card[data-padding=m]{--padding:var(--padding-m)}.jkl-card[data-padding=l]{--padding:var(--padding-l)}.jkl-card[data-padding=xl]{--padding:var(--padding-xl)}.jkl-card--high{--background-color:var(--jkl-color-background-container-high)}.jkl-card--low{--background-color:var(--jkl-color-background-container-low)}.jkl-card--outlined{--border-color:var(--jkl-color-border-separator)}.jkl-card[data-clickable=true]{cursor:pointer}.jkl-card[data-clickable=true]:hover{--border-color:var(--jkl-color-border-separator-hover);--border-width:0.125rem}.jkl-card[data-clickable=true]:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-card-image{--margin:calc(var(--padding, 0)*-1);aspect-ratio:var(--image-aspect-ratio,3/2);margin-inline:var(--margin,0);object-fit:cover;width:calc(100% + var(--padding, 0)*2)}.jkl-card-image--top{margin-top:var(--margin,0)}.jkl-card-image--bottom{margin-bottom:var(--margin,0)}.jkl-card-image--full{margin-block:var(--margin,0)}

package/styles/components/card/card.scss

@@ -87,6 +87,7 @@
     width: calc(100% + 2 * var(--padding, 0));
     aspect-ratio: var(--image-aspect-ratio, 3/2);
     margin-inline: var(--margin, 0);
+    object-fit: cover;
 
     &--top {
         margin-top: var(--margin, 0);

package/styles/components/checkbox/checkbox.css

@@ -33,7 +33,7 @@
     --jkl-checkbox-box-size: 1.125rem;
     --jkl-checkbox-line-height: 1.5rem;
   }
-  @keyframes jkl-checkbox-checked-uo1gune {
+  @keyframes jkl-checkbox-checked-udrzh3s {
     0% {
       width: 0;
       height: 0;
@@ -47,7 +47,7 @@
       height: 58%;
     }
   }
-  @keyframes jkl-checkbox-indeterminate-uo1gunk {
+  @keyframes jkl-checkbox-indeterminate-udrzh48 {
     0% {
       width: 0;
     }
@@ -76,11 +76,11 @@
     left: calc(-0.5 * var(--jkl-checkbox-box-size));
   }
   .jkl-checkbox__input:checked + .jkl-checkbox__label .jkl-checkbox__check-mark::after {
-    animation: jkl-checkbox-checked-uo1gune 150ms ease-in-out forwards;
+    animation: jkl-checkbox-checked-udrzh3s 150ms ease-in-out forwards;
     opacity: 1;
   }
   .jkl-checkbox__input:indeterminate:not(:checked) + .jkl-checkbox__label .jkl-checkbox__indeterminate-mark::after {
-    animation: jkl-checkbox-indeterminate-uo1gunk 150ms ease-in-out forwards;
+    animation: jkl-checkbox-indeterminate-udrzh48 150ms ease-in-out forwards;
     opacity: 1;
   }
   .jkl-checkbox__input:focus-visible + .jkl-checkbox__label {

package/styles/components/checkbox/checkbox.min.css

@@ -1 +1 @@
-@layer jokul.components{:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-font-size:var(--jkl-body-font-size);--jkl-checkbox-line-height:var(--jkl-body-line-height);--jkl-checkbox-font-weight:var(--jkl-body-font-weight);--jkl-checkbox-height:3rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:2rem}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-height:2.5rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:1.75rem}}[data-density=compact],[data-layout-density=compact]{--jkl-checkbox-font-size:var(--jkl-small-font-size);--jkl-checkbox-line-height:var(--jkl-small-line-height);--jkl-checkbox-font-weight:var(--jkl-small-font-weight);--jkl-checkbox-height:1.75rem;--jkl-checkbox-box-size:1.125rem;--jkl-checkbox-line-height:1.5rem}@keyframes jkl-checkbox-checked-uo1gune{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-uo1gunk{0%{width:0}to{width:66%}}.jkl-checkbox{--box-color:var(--jkl-color-border-action);--check-color:var(--jkl-color-border-action);--text-color:var(--jkl-color-text-default);--background-color:#0000;color:var(--text-color);display:flex;flex-wrap:wrap;font-size:var(--jkl-checkbox-font-size);font-weight:var(--jkl-checkbox-font-weight);line-height:var(--jkl-checkbox-line-height);min-height:var(--jkl-checkbox-height);position:relative}.jkl-checkbox__input{left:calc(var(--jkl-checkbox-box-size)*-.5);opacity:0;position:absolute;top:var(--jkl-checkbox-box-size)}.jkl-checkbox__input:checked+.jkl-checkbox__label .jkl-checkbox__check-mark:after{animation:jkl-checkbox-checked-uo1gune .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label .jkl-checkbox__indeterminate-mark:after{animation:jkl-checkbox-indeterminate-uo1gunk .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label{color:var(--jkl-checkbox-focus-color)}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label>.jkl-checkbox__mark{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-checkbox__input:disabled+.jkl-checkbox__label{color:var(--jkl-checkbox-disabled-color)}.jkl-checkbox__input:active{--background-color:var(--jkl-color-background-input-focus)}.jkl-checkbox__label{cursor:pointer;display:flex;flex-shrink:0;max-width:100%;min-width:0}.jkl-checkbox__label:active .jkl-checkbox__mark,.jkl-checkbox__label:hover .jkl-checkbox__mark{outline:1px solid var(--box-color)}.jkl-checkbox__text{margin:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-line-height))*.5) 0;transition-duration:.15s;transition-property:color;transition-timing-function:ease;translate:0 .0625rem}.jkl-checkbox__mark{box-sizing:border-box;height:var(--jkl-checkbox-box-size);margin-block:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-box-size))*.5);position:relative;width:var(--jkl-checkbox-box-size);-webkit-margin-end:var(--jkl-unit-10);align-self:flex-start;background-color:var(--background-color);border:1px solid;border-color:var(--box-color);border-radius:0;flex-shrink:0;margin-inline-end:var(--jkl-unit-10);outline:none;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-checkbox__mark{border:1px solid ButtonText;outline:revert}}.jkl-checkbox__check-mark:after{border-bottom:.125rem solid var(--check-color);border-left-width:.125rem;border-left:0 solid var(--check-color);border-right:.125rem solid var(--check-color);border-top-width:.125rem;border-top:0 solid var(--check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox__check-mark:after{border-color:ButtonText}}.jkl-checkbox__indeterminate-mark:after{--width:66%;--thickness:0.125rem;border-bottom:solid var(--thickness) var(--check-color);bottom:calc(50% - var(--thickness)/2);content:"";display:block;left:calc((100% - var(--width))/2);opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:var(--width)}@media screen and (forced-colors:active){.jkl-checkbox__indeterminate-mark:after{border-color:ButtonText}}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:calc(var(--jkl-unit-10)*3)}.jkl-checkbox--error{--background-color:var(--jkl-color-background-alert-error);--check-color:var(--jkl-color-text-on-alert)}}
+@layer jokul.components{:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-font-size:var(--jkl-body-font-size);--jkl-checkbox-line-height:var(--jkl-body-line-height);--jkl-checkbox-font-weight:var(--jkl-body-font-weight);--jkl-checkbox-height:3rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:2rem}@media (width >= 0) and (max-width:679px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-checkbox-height:2.5rem;--jkl-checkbox-box-size:1.5rem;--jkl-checkbox-line-height:1.75rem}}[data-density=compact],[data-layout-density=compact]{--jkl-checkbox-font-size:var(--jkl-small-font-size);--jkl-checkbox-line-height:var(--jkl-small-line-height);--jkl-checkbox-font-weight:var(--jkl-small-font-weight);--jkl-checkbox-height:1.75rem;--jkl-checkbox-box-size:1.125rem;--jkl-checkbox-line-height:1.5rem}@keyframes jkl-checkbox-checked-udrzh3s{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@keyframes jkl-checkbox-indeterminate-udrzh48{0%{width:0}to{width:66%}}.jkl-checkbox{--box-color:var(--jkl-color-border-action);--check-color:var(--jkl-color-border-action);--text-color:var(--jkl-color-text-default);--background-color:#0000;color:var(--text-color);display:flex;flex-wrap:wrap;font-size:var(--jkl-checkbox-font-size);font-weight:var(--jkl-checkbox-font-weight);line-height:var(--jkl-checkbox-line-height);min-height:var(--jkl-checkbox-height);position:relative}.jkl-checkbox__input{left:calc(var(--jkl-checkbox-box-size)*-.5);opacity:0;position:absolute;top:var(--jkl-checkbox-box-size)}.jkl-checkbox__input:checked+.jkl-checkbox__label .jkl-checkbox__check-mark:after{animation:jkl-checkbox-checked-udrzh3s .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:indeterminate:not(:checked)+.jkl-checkbox__label .jkl-checkbox__indeterminate-mark:after{animation:jkl-checkbox-indeterminate-udrzh48 .15s ease-in-out forwards;opacity:1}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label{color:var(--jkl-checkbox-focus-color)}.jkl-checkbox__input:focus-visible+.jkl-checkbox__label>.jkl-checkbox__mark{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-checkbox__input:disabled+.jkl-checkbox__label{color:var(--jkl-checkbox-disabled-color)}.jkl-checkbox__input:active{--background-color:var(--jkl-color-background-input-focus)}.jkl-checkbox__label{cursor:pointer;display:flex;flex-shrink:0;max-width:100%;min-width:0}.jkl-checkbox__label:active .jkl-checkbox__mark,.jkl-checkbox__label:hover .jkl-checkbox__mark{outline:1px solid var(--box-color)}.jkl-checkbox__text{margin:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-line-height))*.5) 0;transition-duration:.15s;transition-property:color;transition-timing-function:ease;translate:0 .0625rem}.jkl-checkbox__mark{box-sizing:border-box;height:var(--jkl-checkbox-box-size);margin-block:calc((var(--jkl-checkbox-height) - var(--jkl-checkbox-box-size))*.5);position:relative;width:var(--jkl-checkbox-box-size);-webkit-margin-end:var(--jkl-unit-10);align-self:flex-start;background-color:var(--background-color);border:1px solid;border-color:var(--box-color);border-radius:0;flex-shrink:0;margin-inline-end:var(--jkl-unit-10);outline:none;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}@media screen and (forced-colors:active){.jkl-checkbox__mark{border:1px solid ButtonText;outline:revert}}.jkl-checkbox__check-mark:after{border-bottom:.125rem solid var(--check-color);border-left-width:.125rem;border-left:0 solid var(--check-color);border-right:.125rem solid var(--check-color);border-top-width:.125rem;border-top:0 solid var(--check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox__check-mark:after{border-color:ButtonText}}.jkl-checkbox__indeterminate-mark:after{--width:66%;--thickness:0.125rem;border-bottom:solid var(--thickness) var(--check-color);bottom:calc(50% - var(--thickness)/2);content:"";display:block;left:calc((100% - var(--width))/2);opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:var(--width)}@media screen and (forced-colors:active){.jkl-checkbox__indeterminate-mark:after{border-color:ButtonText}}.jkl-checkbox--inline{display:inline-flex}.jkl-checkbox--inline:not(:last-of-type){margin-right:calc(var(--jkl-unit-10)*3)}.jkl-checkbox--error{--background-color:var(--jkl-color-background-alert-error);--check-color:var(--jkl-color-text-on-alert)}}

package/styles/components/checkbox-panel/checkbox-panel.css

@@ -64,7 +64,7 @@
   --outer-border-thickness: 0.125rem;
 }
 
-@keyframes jkl-checkbox-checked-u9okg6e {
+@keyframes jkl-checkbox-checked-ub3y1c5 {
   0% {
     width: 0;
     height: 0;
@@ -128,7 +128,7 @@
     }
   }
   .jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator::after {
-    animation: jkl-checkbox-checked-u9okg6e 150ms ease-in-out forwards;
+    animation: jkl-checkbox-checked-ub3y1c5 150ms ease-in-out forwards;
     opacity: 1;
   }
   .jkl-checkbox-panel:has([aria-invalid=true]) {

package/styles/components/checkbox-panel/checkbox-panel.min.css

@@ -1,3 +1,3 @@
-.jkl-input-panel{--outer-border-color:var(--jkl-color-border-input);--outer-border-thickness:0.0625rem;--background-color:#0000;background-color:var(--background-color);border-radius:4px;box-shadow:inset 0 0 0 var(--outer-border-thickness) var(--outer-border-color);cursor:pointer;padding-left:1rem}.jkl-input-panel__input{opacity:0;position:absolute;top:-6px}.jkl-input-panel__label{align-items:center;cursor:pointer;display:grid;gap:.5rem;grid-template-columns:-webkit-min-content fit-content(30%) 1fr;grid-template-columns:min-content fit-content(30%) 1fr}.jkl-input-panel__main-label{padding-block:1.5rem}.jkl-input-panel__extra-label{align-self:stretch;margin-left:1rem;margin-right:1rem}.jkl-input-panel__extra-label>:first-child{padding-right:1rem}.jkl-input-panel__extra-label--text{align-items:center;display:flex;height:100%}.jkl-input-panel__content{cursor:default;height:0;overflow:hidden;padding-right:1.5rem}.jkl-input-panel:has([aria-expanded=true]) .jkl-input-panel__content,.jkl-input-panel__content[data-alwaysopen=true]{height:auto;padding-bottom:24px}.jkl-input-panel:has(:focus-visible){outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-input-panel:has(:checked){--background-color:var(--jkl-color-background-container-high)}.jkl-input-panel:hover{--outer-border-color:var(--jkl-color-border-separator-hover);--outer-border-thickness:0.125rem}@keyframes jkl-checkbox-checked-u9okg6e{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@layer jokul.components{.jkl-checkbox-panel{--checkbox-background-color:#0000;--checkbox-box-color:var(--jkl-color-border-action);--checkbox-check-color:var(--jkl-color-border-action)}.jkl-checkbox-panel__decorator{background-color:var(--checkbox-background-color);border:1px solid;border-color:var(--checkbox-box-color);border-radius:0;box-sizing:border-box;height:var(--jkl-checkbox-box-size);outline:none;position:relative;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease;width:var(--jkl-checkbox-box-size)}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator{border:1px solid ButtonText;outline:revert}}.jkl-checkbox-panel__decorator:after{border-bottom:.125rem solid var(--checkbox-check-color);border-left-width:.125rem;border-left:0 solid var(--checkbox-check-color);border-right:.125rem solid var(--checkbox-check-color);border-top-width:.125rem;border-top:0 solid var(--checkbox-check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator:after{border-color:ButtonText}}.jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator:after{animation:jkl-checkbox-checked-u9okg6e .15s ease-in-out forwards;opacity:1}.jkl-checkbox-panel:has([aria-invalid=true]){--checkbox-background-color:var(
+.jkl-input-panel{--outer-border-color:var(--jkl-color-border-input);--outer-border-thickness:0.0625rem;--background-color:#0000;background-color:var(--background-color);border-radius:4px;box-shadow:inset 0 0 0 var(--outer-border-thickness) var(--outer-border-color);cursor:pointer;padding-left:1rem}.jkl-input-panel__input{opacity:0;position:absolute;top:-6px}.jkl-input-panel__label{align-items:center;cursor:pointer;display:grid;gap:.5rem;grid-template-columns:-webkit-min-content fit-content(30%) 1fr;grid-template-columns:min-content fit-content(30%) 1fr}.jkl-input-panel__main-label{padding-block:1.5rem}.jkl-input-panel__extra-label{align-self:stretch;margin-left:1rem;margin-right:1rem}.jkl-input-panel__extra-label>:first-child{padding-right:1rem}.jkl-input-panel__extra-label--text{align-items:center;display:flex;height:100%}.jkl-input-panel__content{cursor:default;height:0;overflow:hidden;padding-right:1.5rem}.jkl-input-panel:has([aria-expanded=true]) .jkl-input-panel__content,.jkl-input-panel__content[data-alwaysopen=true]{height:auto;padding-bottom:24px}.jkl-input-panel:has(:focus-visible){outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-input-panel:has(:checked){--background-color:var(--jkl-color-background-container-high)}.jkl-input-panel:hover{--outer-border-color:var(--jkl-color-border-separator-hover);--outer-border-thickness:0.125rem}@keyframes jkl-checkbox-checked-ub3y1c5{0%{height:0;width:0}40%{height:0;width:18%}to{height:58%;width:18%}}@layer jokul.components{.jkl-checkbox-panel{--checkbox-background-color:#0000;--checkbox-box-color:var(--jkl-color-border-action);--checkbox-check-color:var(--jkl-color-border-action)}.jkl-checkbox-panel__decorator{background-color:var(--checkbox-background-color);border:1px solid;border-color:var(--checkbox-box-color);border-radius:0;box-sizing:border-box;height:var(--jkl-checkbox-box-size);outline:none;position:relative;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease;width:var(--jkl-checkbox-box-size)}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator{border:1px solid ButtonText;outline:revert}}.jkl-checkbox-panel__decorator:after{border-bottom:.125rem solid var(--checkbox-check-color);border-left-width:.125rem;border-left:0 solid var(--checkbox-check-color);border-right:.125rem solid var(--checkbox-check-color);border-top-width:.125rem;border-top:0 solid var(--checkbox-check-color);bottom:42%;content:"";display:block;height:58%;left:18%;opacity:0;position:absolute;transform:rotate(45deg);transform-origin:bottom left;transition-duration:.15s;transition-property:opacity,border-color;transition-timing-function:ease;width:18%}@media screen and (forced-colors:active){.jkl-checkbox-panel__decorator:after{border-color:ButtonText}}.jkl-checkbox-panel:has(:checked) .jkl-checkbox-panel__decorator:after{animation:jkl-checkbox-checked-ub3y1c5 .15s ease-in-out forwards;opacity:1}.jkl-checkbox-panel:has([aria-invalid=true]){--checkbox-background-color:var(
         --jkl-color-background-alert-error
     );--checkbox-check-color:var(--jkl-color-text-on-alert)}}

package/styles/components/countdown/countdown.css

@@ -29,10 +29,10 @@
     }
   }
   .jkl-countdown__tracker {
-    animation: jkl-downcount-uv327o4 var(--duration) linear forwards;
+    animation: jkl-downcount-uldoerz var(--duration) linear forwards;
     animation-play-state: var(--play-state, running);
   }
-  @keyframes jkl-downcount-uv327o4 {
+  @keyframes jkl-downcount-uldoerz {
     from {
       width: 100%;
     }

package/styles/components/countdown/countdown.min.css

@@ -1 +1 @@
-@layer jokul.components{.jkl-countdown{--track-color:var(--jkl-color-border-separator);--bar-color:var(--jkl-color-border-input-focus);--bar-height:0.25rem;background-color:var(--track-color);border-radius:6.25rem;height:var(--bar-height);overflow:hidden;width:100%}.jkl-countdown__tracker{background-color:var(--bar-color);display:block;height:var(--bar-height)}@media screen and (forced-colors:active){.jkl-countdown{background-color:Canvas}.jkl-countdown__tracker{background-color:CanvasText}}.jkl-countdown__tracker{animation:jkl-downcount-uv327o4 var(--duration) linear forwards;animation-play-state:var(--play-state,running)}@keyframes jkl-downcount-uv327o4{0%{width:100%}to{width:0}}}
+@layer jokul.components{.jkl-countdown{--track-color:var(--jkl-color-border-separator);--bar-color:var(--jkl-color-border-input-focus);--bar-height:0.25rem;background-color:var(--track-color);border-radius:6.25rem;height:var(--bar-height);overflow:hidden;width:100%}.jkl-countdown__tracker{background-color:var(--bar-color);display:block;height:var(--bar-height)}@media screen and (forced-colors:active){.jkl-countdown{background-color:Canvas}.jkl-countdown__tracker{background-color:CanvasText}}.jkl-countdown__tracker{animation:jkl-downcount-uldoerz var(--duration) linear forwards;animation-play-state:var(--play-state,running)}@keyframes jkl-downcount-uldoerz{0%{width:100%}to{width:0}}}

package/styles/components/feedback/feedback.css

@@ -4,7 +4,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  */
-@keyframes jkl-show-uzsmu39 {
+@keyframes jkl-show-ujqwkdc {
   from {
     transform: translate3d(0, 0.5rem, 0);
     opacity: 0;
@@ -39,7 +39,7 @@
   }
 }
 .jkl-feedback__fade-in {
-  animation: jkl-show-uzsmu39 0.25s ease-out;
+  animation: jkl-show-ujqwkdc 0.25s ease-out;
 }
 .jkl-feedback__buttons {
   display: flex;

package/styles/components/feedback/feedback.min.css

@@ -1 +1 @@
-@keyframes jkl-show-uzsmu39{0%{opacity:0;transform:translate3d(0,.5rem,0)}}.jkl-feedback{max-width:34.375rem}.jkl-feedback__submit-wrapper{transition-duration:.25s;transition-property:height;transition-timing-function:ease;width:100%}.jkl-feedback__submit-wrapper--hidden{display:none}.jkl-feedback__step-counter{color:var(--jkl-color-text-subdued);font-size:1.125rem;font-weight:400;line-height:1.75rem;margin-bottom:calc(var(--jkl-unit-10)*2);--jkl-icon-weight:300}@media (min-width:680px){.jkl-feedback__step-counter{font-size:1.25rem;font-weight:400;line-height:2rem;--jkl-icon-weight:300}}.jkl-feedback__fade-in{animation:jkl-show-uzsmu39 .25s ease-out}.jkl-feedback__buttons{display:flex}.jkl-feedback-smileys{display:flex;flex-wrap:nowrap;gap:.75rem;justify-content:space-between;margin-top:.5rem;max-width:22.5rem;width:100%}.jkl-feedback-smiley-option{color:var(--jkl-color-text-subdued);cursor:pointer;display:inline-block;height:2.5rem;position:relative;transform:translateZ(0);transition-duration:.15s;transition-property:transform,color;transition-timing-function:ease;width:2.5rem}@media screen and (forced-colors:active){.jkl-feedback-smiley-option,.jkl-feedback-smiley-option path,.jkl-feedback-smiley-option svg{stroke:ButtonFace;fill:ButtonText}}.jkl-feedback-smiley-option:after,.jkl-feedback-smiley-option:before{border-radius:50%;content:"";opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity;transition-timing-function:ease}.jkl-feedback-smiley-option:after{box-shadow:0 0 0 .125rem currentColor;inset:-.125rem -.125rem -.125rem -.125rem}.jkl-feedback-smiley-option:before{box-shadow:0 .125rem 1.875rem #0000001a;inset:0}.jkl-feedback-smiley-option:hover{color:var(--jkl-color-text-default)}input:checked+.jkl-feedback-smiley-option{color:var(--jkl-color-text-default);transform:translate3d(0,-20%,0)}html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus+.jkl-feedback-smiley-option:after,input:checked+.jkl-feedback-smiley-option:before{opacity:1}
+@keyframes jkl-show-ujqwkdc{0%{opacity:0;transform:translate3d(0,.5rem,0)}}.jkl-feedback{max-width:34.375rem}.jkl-feedback__submit-wrapper{transition-duration:.25s;transition-property:height;transition-timing-function:ease;width:100%}.jkl-feedback__submit-wrapper--hidden{display:none}.jkl-feedback__step-counter{color:var(--jkl-color-text-subdued);font-size:1.125rem;font-weight:400;line-height:1.75rem;margin-bottom:calc(var(--jkl-unit-10)*2);--jkl-icon-weight:300}@media (min-width:680px){.jkl-feedback__step-counter{font-size:1.25rem;font-weight:400;line-height:2rem;--jkl-icon-weight:300}}.jkl-feedback__fade-in{animation:jkl-show-ujqwkdc .25s ease-out}.jkl-feedback__buttons{display:flex}.jkl-feedback-smileys{display:flex;flex-wrap:nowrap;gap:.75rem;justify-content:space-between;margin-top:.5rem;max-width:22.5rem;width:100%}.jkl-feedback-smiley-option{color:var(--jkl-color-text-subdued);cursor:pointer;display:inline-block;height:2.5rem;position:relative;transform:translateZ(0);transition-duration:.15s;transition-property:transform,color;transition-timing-function:ease;width:2.5rem}@media screen and (forced-colors:active){.jkl-feedback-smiley-option,.jkl-feedback-smiley-option path,.jkl-feedback-smiley-option svg{stroke:ButtonFace;fill:ButtonText}}.jkl-feedback-smiley-option:after,.jkl-feedback-smiley-option:before{border-radius:50%;content:"";opacity:0;position:absolute;transition-duration:.15s;transition-property:opacity;transition-timing-function:ease}.jkl-feedback-smiley-option:after{box-shadow:0 0 0 .125rem currentColor;inset:-.125rem -.125rem -.125rem -.125rem}.jkl-feedback-smiley-option:before{box-shadow:0 .125rem 1.875rem #0000001a;inset:0}.jkl-feedback-smiley-option:hover{color:var(--jkl-color-text-default)}input:checked+.jkl-feedback-smiley-option{color:var(--jkl-color-text-default);transform:translate3d(0,-20%,0)}html:not([data-mousenavigation]):not([data-touchnavigation]) input:focus+.jkl-feedback-smiley-option:after,input:checked+.jkl-feedback-smiley-option:before{opacity:1}

package/styles/components/file-input/file-input.css

@@ -148,7 +148,7 @@
 
 .jkl-link {
   --link-color: var(--jkl-color-text-default);
-  color: var(--link-color);
+  color: inherit;
   outline: none;
   text-decoration: none;
   transition-timing-function: ease;
@@ -159,7 +159,7 @@
   text-decoration: underline;
   text-underline-offset: 0.08lh;
   text-decoration-thickness: 0.05em;
-  text-decoration-color: rgba(from currentcolor r g b/0.7);
+  text-decoration-color: rgb(from currentColor r g b/70%);
 }
 .jkl-link__icon {
   margin-inline-start: 0.2em;
@@ -375,15 +375,15 @@
     animation: 2500ms linear infinite;
   }
   .jkl-loader__dot--left {
-    animation-name: jkl-loader-left-spin-uqwh942;
+    animation-name: jkl-loader-left-spin-uqqmzx0;
     margin-right: 1.71em;
   }
   .jkl-loader__dot--middle {
-    animation-name: jkl-loader-middle-spin-uqwh94x;
+    animation-name: jkl-loader-middle-spin-uqqmzxq;
     margin-right: 1.9em;
   }
   .jkl-loader__dot--right {
-    animation-name: jkl-loader-right-spin-uqwh95n;
+    animation-name: jkl-loader-right-spin-uqqmzy6;
   }
   @media screen and (forced-colors: active) {
     .jkl-loader__dot {
@@ -410,7 +410,7 @@
   .jkl-loader--small > .jkl-loader__dot--middle {
     margin-right: 0.3em;
   }
-  @keyframes jkl-loader-left-spin-uqwh942 {
+  @keyframes jkl-loader-left-spin-uqqmzx0 {
     0% {
       transform: rotate(0) scale(0);
     }
@@ -424,7 +424,7 @@
       transform: rotate(180deg) scale(0);
     }
   }
-  @keyframes jkl-loader-middle-spin-uqwh94x {
+  @keyframes jkl-loader-middle-spin-uqqmzxq {
     0% {
       transform: rotate(20deg) scale(0);
     }
@@ -441,7 +441,7 @@
       transform: rotate(200deg) scale(0);
     }
   }
-  @keyframes jkl-loader-right-spin-uqwh95n {
+  @keyframes jkl-loader-right-spin-uqqmzy6 {
     0% {
       transform: rotate(40deg) scale(0);
     }
@@ -489,7 +489,7 @@
     bottom: 0;
     width: 12.5rem;
     background: linear-gradient(89.17deg, rgba(249, 249, 249, 0) 0.8%, var(--jkl-skeleton-sweeper-color) 50.09%, rgba(249, 249, 249, 0) 96.31%);
-    animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uqwh960;
+    animation: var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uqqmzyv;
   }
   @media (width >= 0) and (max-width: 679px) {
     .jkl-skeleton-animation {
@@ -519,7 +519,7 @@
   @media screen and (forced-colors: active) {
     .jkl-skeleton-element {
       border: 1px solid CanvasText;
-      animation: 2s ease infinite jkl-blink-uqwh96s;
+      animation: 2s ease infinite jkl-blink-uqqmzz0;
     }
   }
   .jkl-skeleton-input {
@@ -573,10 +573,10 @@
   }
   @media screen and (forced-colors: active) {
     .jkl-skeleton-table {
-      animation: 2s ease-in-out infinite jkl-blink-uqwh96s;
+      animation: 2s ease-in-out infinite jkl-blink-uqqmzz0;
     }
   }
-  @keyframes jkl-sweep-uqwh960 {
+  @keyframes jkl-sweep-uqqmzyv {
     0% {
       transform: translateX(calc(0vw - 200px));
     }
@@ -584,7 +584,7 @@
       transform: translateX(calc(100vw + 400px));
     }
   }
-  @keyframes jkl-blink-uqwh96s {
+  @keyframes jkl-blink-uqqmzz0 {
     0% {
       opacity: 1;
     }

package/styles/components/file-input/file-input.min.css

@@ -1 +1 @@
-@charset "UTF-8";:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-file-padding:0.5rem;--jkl-file-thumbnail-width:calc(var(--jkl-unit-10)*7);--jkl-file-thumbnail-max-height:120px;--jkl-file-thumbnail-aspect-ratio:1;--jkl-file-gap:0.5rem calc(var(--jkl-unit-10)*2);--jkl-file-button-width:calc(var(--jkl-unit-10)*5)}[data-density=compact],[data-layout-density=compact]{--jkl-file-padding:0.5rem;--jkl-file-thumbnail-width:calc(var(--jkl-unit-10)*5);--jkl-file-thumbnail-max-height:80px;--jkl-file-thumbnail-aspect-ratio:1;--jkl-file-gap:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-file-button-width:calc(var(--jkl-unit-10)*4)}.jkl-file{--text-color:var(--jkl-color-text-default);--border:1px solid var(--jkl-color-border-separator);--border-radius:2px;--bg:#0000}.jkl-file__content{align-items:center;background:var(--bg);border:var(--border);border-radius:var(--border-radius);color:var(--jkl-color-text-default);display:grid;gap:var(--jkl-file-gap);grid-template-areas:"image text button";grid-template-columns:var(--jkl-file-thumbnail-width) 1fr var(--jkl-file-button-width);height:-webkit-fit-content;height:fit-content;padding:var(--jkl-file-padding);transition-duration:.1s;transition-property:background-color,border-color,color;transition-timing-function:ease}.jkl-file__content__name{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;grid-area:text;word-break:break-word}.jkl-file__content__name__size{word-break:keep-all}.jkl-file__content__delete{aspect-ratio:1;grid-area:button}.jkl-file__content__thumbnail{align-items:center;aspect-ratio:var(--jkl-file-thumbnail-aspect-ratio);background:var(--jkl-color-background-container-low);border-radius:2px;container-type:inline-size;display:flex;grid-area:image;justify-content:center;max-height:var(--jkl-file-thumbnail-max-height);object-fit:cover;overflow:hidden;position:relative;width:100%}.jkl-file__content__thumbnail img{z-index:0}.jkl-file__content__thumbnail img[src]{height:100%;object-fit:cover;width:100%}.jkl-file__content__thumbnail:after,.jkl-file__content__thumbnail:before{position:absolute;z-index:1}.jkl-file[class*=card]{--jkl-file-thumbnail-width:100%;--jkl-file-thumbnail-aspect-ratio:16/9}.jkl-file[class*=card] .jkl-file__content{grid-template-areas:"image image" "text button";grid-template-columns:1fr var(--jkl-file-button-width);grid-template-rows:var(--jkl-file-thumbnail-max-height) auto}.jkl-file:not([data-state*=loading]) .jkl-file__content__thumbnail:not(:has(img[src])):before{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;content:attr(data-filetype)}.jkl-file[data-state=loading]:not(:has(.jkl-file__support-label)) .jkl-file__content__thumbnail img{opacity:.25}.jkl-file[data-state=loading]:not(:has(.jkl-file__support-label)) .jkl-file__content__thumbnail:after{--scale:scale(0.3,0.3);--scale-end:scale(0.1,0.1);--rotation:45deg;animation:pulse 2.5s linear infinite forwards;aspect-ratio:1;background:var(--text-color);content:""/"Laster opp";height:100%;max-height:2lh;min-height:24px;transform:var(--scale) rotate(var(--rotation))}@keyframes pulse{0%{transform:var(--scale) rotate(var(--rotation))}50%{transform:var(--scale-end) rotate(calc(var(--rotation) + .5turn))}to{transform:var(--scale) rotate(calc(var(--rotation) + 1turn))}}.jkl-file[data-state=error]{--bg:var(--jkl-color-functional-error)}.jkl-file[data-state=error],.jkl-file[data-state=error] a,.jkl-file[data-state=error] a:hover,.jkl-file[data-state=error] button,.jkl-file[data-state=error] span{--text-color:var(--jkl-color-text-on-alert);--link-color:var(--text-color);--jkl-color-border-action:currentColor}.jkl-link{--link-color:var(--jkl-color-text-default);color:var(--link-color);outline:none;text-decoration:none;transition-duration:75ms;transition-property:color;transition-timing-function:ease}.jkl-link__content{text-decoration:underline;-webkit-text-decoration-color:rgba(from currentcolor r g b/.7);text-decoration-color:rgba(from currentcolor r g b/.7);text-decoration-thickness:.05em;text-underline-offset:.08lh}.jkl-link__icon{-webkit-margin-start:.2em;margin-inline-start:.2em;-webkit-margin-before:-.1em;margin-block-start:-.1em;vertical-align:middle}.jkl-link--external:after,.jkl-link[download]:after,.jkl-link[target=_blank]:after{--jkl-icon-fill:0;--jkl-icon-size:1em;--jkl-icon-opsz:20;content:"\e89e"/"(Åpnes i ny fane)";-webkit-margin-before:-.1em;margin-block-start:-.1em;-webkit-padding-start:.2em;display:inline-block;font-family:Fremtind Material Symbols,Fremtind Material Symbols Fallback,sans-serif;font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:var(--jkl-icon-size,1.5rem);font-variation-settings:"FILL" var(--jkl-icon-fill,0),"GRAD" var(--jkl-icon-grade,0),"opsz" var(--jkl-icon-opsz,24);font-weight:var(--jkl-icon-weight,300);line-height:1;padding-inline-start:.2em;vertical-align:middle;-webkit-font-smoothing:antialiased;display:inline;transition-duration:.15s;transition-property:font-variation-settings,transform;transition-timing-function:ease}.jkl-link[download]:after{content:"\f090"/"(Last ned fil)"}.jkl-link:hover:not(:focus){--link-color:var(--jkl-color-text-subdued)}.jkl-link:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:0}@media screen and (forced-colors:active){.jkl-link:hover:not(:focus){--link-color:HighLight}}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-padding-block:0.5rem;--jkl-button-padding-text:calc(var(--jkl-unit-10)*3);--jkl-button-padding-icon:calc(var(--jkl-unit-10)*2);--jkl-button-padding-icon-button:0.5rem;--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1.125rem;--jkl-button-line-height:1.75rem}@media (min-width:680px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-font-size:1.25rem;--jkl-button-line-height:2rem}}[data-density=compact],[data-layout-density=compact]{--jkl-button-padding-block:calc(var(--jkl-unit-10)*0.5);--jkl-button-padding-text:calc(var(--jkl-unit-10)*1.5);--jkl-button-padding-icon:0.5rem;--jkl-button-padding-icon-button:calc(var(--jkl-unit-10)*0.5);--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.25);--jkl-button-padding-ghost-inline:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem}@media (min-width:680px){[data-density=compact],[data-layout-density=compact]{--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem;--jkl-button-icon-weight:400}}.jkl-button{--jkl-icon-weight:var(--jkl-button-icon-weight,initial);--text-color:var(--jkl-color-text-default);--background-color:#0000;--border-radius:0;--border-width:0.0625rem;background:var(--background-color);border:unset;color:var(--text-color);cursor:pointer;display:inline-block;font-size:var(--jkl-button-font-size);font-weight:700;line-height:var(--jkl-button-line-height);text-decoration:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;animation:a .3s linear;border-radius:var(--border-radius);max-width:100%;overflow:hidden;padding-block:var(--jkl-button-padding-block);padding-inline:var(--jkl-button-padding-text);position:relative;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}.jkl-button:has(.jkl-button__text){min-width:9.5ch}.jkl-button:has(.jkl-icon:first-child){-webkit-padding-start:var(--jkl-button-padding-icon);padding-inline-start:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:last-child){-webkit-padding-end:var(--jkl-button-padding-icon);padding-inline-end:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:first-child):has(.jkl-icon:last-child){padding-inline:var(--jkl-button-padding-icon-button)}.jkl-button__label{align-items:center;display:flex;flex-direction:row;gap:calc(var(--jkl-unit-10)*.25);pointer-events:none;transition-duration:.25s;transition-property:translate;transition-timing-function:ease;width:100%}.jkl-button__loader{left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition-duration:.25s;transition-property:opacity,translate;transition-timing-function:ease;translate:-50% 350%}.jkl-button__text{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.jkl-button[data-loading=true] .jkl-button__label{translate:0 -120%}.jkl-button[data-loading=true] .jkl-button__loader{opacity:1;translate:-50% -50%}.jkl-button:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-button:hover{background-color:color-mix(in srgb,var(--background-color),var(--text-color) 15%)}@media (forced-colors:active){.jkl-button:hover{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}}.jkl-button--ghost,.jkl-button--primary,.jkl-button--secondary{--border-radius:999px}.jkl-button--primary{--background-color:var(--jkl-color-background-action);--text-color:var(--jkl-color-text-on-action)}@media (forced-colors:active){.jkl-button--primary{border:calc(var(--border-width)*2) solid Highlight}}.jkl-button--secondary{border:var(--border-width) solid var(--text-color)}.jkl-button--tertiary{border-bottom:var(--border-width) solid var(--text-color);padding-inline:var(--jkl-button-teritary-padding-icon)}.jkl-button--tertiary:has(.jkl-icon:first-child){padding-inline:var(--jkl-button-teritary-padding-icon) calc(var(--jkl-button-teritary-padding-icon)*2)}.jkl-button--tertiary:has(.jkl-icon:last-child){padding-inline:calc(var(--jkl-button-teritary-padding-icon)*2) var(--jkl-button-teritary-padding-icon)}@layer jokul.components{.jkl-loader{display:flex}.jkl-loader--inline{display:inline-flex}.jkl-loader__dot{animation:2.5s linear infinite;background-color:currentColor;display:block;height:.9em;transform-origin:center;width:.9em}.jkl-loader__dot--left{animation-name:jkl-loader-left-spin-uqwh942;margin-right:1.71em}.jkl-loader__dot--middle{animation-name:jkl-loader-middle-spin-uqwh94x;margin-right:1.9em}.jkl-loader__dot--right{animation-name:jkl-loader-right-spin-uqwh95n}@media screen and (forced-colors:active){.jkl-loader__dot{background-color:CanvasText}}.jkl-button .jkl-loader>.jkl-loader__dot,.jkl-loader--medium>.jkl-loader__dot{height:.35em;width:.35em}.jkl-button .jkl-loader>.jkl-loader__dot--left,.jkl-loader--medium>.jkl-loader__dot--left{margin-right:.585em}.jkl-button .jkl-loader>.jkl-loader__dot--middle,.jkl-loader--medium>.jkl-loader__dot--middle{margin-right:.65em}.jkl-loader--small>.jkl-loader__dot{height:.25em;width:.25em}.jkl-loader--small>.jkl-loader__dot--left{margin-right:.27em}.jkl-loader--small>.jkl-loader__dot--middle{margin-right:.3em}@keyframes jkl-loader-left-spin-uqwh942{0%{transform:rotate(0) scale(0)}30%{transform:rotate(90deg) scale(1)}70%{transform:rotate(180deg) scale(0)}to{transform:rotate(180deg) scale(0)}}@keyframes jkl-loader-middle-spin-uqwh94x{0%{transform:rotate(20deg) scale(0)}10%{transform:rotate(20deg) scale(0)}40%{transform:rotate(110deg) scale(1.4)}85%{transform:rotate(200deg) scale(0)}to{transform:rotate(200deg) scale(0)}}@keyframes jkl-loader-right-spin-uqwh95n{0%{transform:rotate(40deg) scale(0)}20%{transform:rotate(40deg) scale(0)}50%{transform:rotate(130deg) scale(1)}to{transform:rotate(220deg) scale(0)}}}@layer jokul.components{@media screen and (prefers-color-scheme:light){:root{--jkl-skeleton-element-color:#e0dbd4;--jkl-skeleton-sweeper-color:#f9f9f9}}[data-theme=light]{--jkl-skeleton-element-color:#e0dbd4;--jkl-skeleton-sweeper-color:#f9f9f9}@media screen and (prefers-color-scheme:dark){:root{--jkl-skeleton-element-color:#636060;--jkl-skeleton-sweeper-color:#1b1917}}[data-theme=dark]{--jkl-skeleton-element-color:#636060;--jkl-skeleton-sweeper-color:#1b1917}.jkl-skeleton-animation{--jkl-skeleton-sweep-duration:3s;overflow:hidden;position:relative}.jkl-skeleton-animation:after{animation:var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uqwh960;background:linear-gradient(89.17deg,#f9f9f900 .8%,var(--jkl-skeleton-sweeper-color) 50.09%,#f9f9f900 96.31%);bottom:0;content:" ";position:absolute;top:0;width:12.5rem}@media (width >= 0) and (max-width:679px){.jkl-skeleton-animation{width:9.375rem}}@media screen and (prefers-reduced-motion:reduce){.jkl-skeleton-animation:after{background:none}}@media screen and (forced-colors:active){.jkl-skeleton-animation:after{animation:none}}.jkl-skeleton-animation--compact:after{width:9.375rem}.jkl-skeleton-element{background-color:var(--jkl-skeleton-element-color);border-radius:.125rem}.jkl-skeleton-element--circle{border-radius:50%}@media screen and (forced-colors:active){.jkl-skeleton-element{animation:jkl-blink-uqwh96s 2s ease infinite;border:1px solid CanvasText}}.jkl-skeleton-input{display:flex;flex-direction:column;gap:.75rem}.jkl-skeleton-input__checkbox{display:flex;flex-direction:row;flex-wrap:nowrap;gap:.5rem}@media (width >= 0) and (max-width:679px){.jkl-skeleton-input{gap:.5rem}}.jkl-skeleton-input--compact:after{gap:.5rem}.jkl-skeleton-table{display:flex;flex-direction:column}.jkl-skeleton-table__header,.jkl-skeleton-table__row{border-bottom:1px solid var(--jkl-skeleton-element-color);display:flex;flex-direction:row;justify-content:space-between}.jkl-skeleton-table__header{padding:.75rem .5rem}.jkl-skeleton-table__row{padding:1rem .5rem}@media (width >= 0) and (max-width:679px){.jkl-skeleton-table__header{padding:.5rem .25rem}.jkl-skeleton-table__row{padding:.75rem .25rem}}.jkl-skeleton-table--compact::after__header{padding:.5rem .25rem}.jkl-skeleton-table--compact::after__row{padding:.75rem .25rem}@media screen and (forced-colors:active){.jkl-skeleton-table{animation:jkl-blink-uqwh96s 2s ease-in-out infinite}}@keyframes jkl-sweep-uqwh960{0%{transform:translateX(-200px)}80%,to{transform:translateX(calc(100vw + 400px))}}@keyframes jkl-blink-uqwh96s{0%{opacity:1}40%,50%{opacity:.3}70%,to{opacity:1}}}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-file-input-drag-font-size:var(--jkl-heading-2-font-size);--jkl-file-input-drag-line-height:var(--jkl-heading-2-line-height);--jkl-file-input-drag-font-weight:var(--jkl-heading-2-font-weight);--jkl-file-size-hint-font-size:var(--jkl-small-font-size);--jkl-file-size-hint-line-height:var(--jkl-small-line-height);--jkl-file-size-hint-font-weight:var(--jkl-small-font-weight);--jkl-file-input-dropzone-padding:calc(var(--jkl-unit-10)*3);--jkl-file-input-dropzone-gap:calc(var(--jkl-unit-10)*3);--jkl-file-cta-gap:calc(var(--jkl-unit-10)*3);--jkl-file-cta-with-files-gap:calc(var(--jkl-unit-10)*1.5);--jkl-file-list-gap:0.5rem}[data-density=compact],[data-layout-density=compact]{--jkl-file-input-drag-font-size:var(--jkl-body-font-size);--jkl-file-input-drag-line-height:var(--jkl-body-line-height);--jkl-file-input-drag-font-weight:var(--jkl-body-font-weight);--jkl-file-input-dropzone-padding:calc(var(--jkl-unit-10)*2);--jkl-file-input-dropzone-gap:calc(var(--jkl-unit-10)*2);--jkl-file-cta-gap:calc(var(--jkl-unit-10)*1.5);--jkl-file-cta-with-files-gap:calc(var(--jkl-unit-10)*0.5);--jkl-file-list-gap:0.5rem}.jkl-file-input__dropzone{--border-color:var(--jkl-color-border-input);--background-color:#0000;align-items:center;background-color:var(--background-color);border:1px dashed var(--border-color);border-radius:.25rem;display:flex;flex-direction:column;flex-wrap:nowrap;gap:var(--jkl-file-input-dropzone-gap);justify-content:center;padding:var(--jkl-file-input-dropzone-padding);transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}.jkl-file-input__dropzone--enter{--border-color:var(--jkl-color-border-input-focus);--background-color:var(--jkl-color-background-container-high);border-style:solid}.jkl-file-input__dropzone__drag-text{font-size:var(--jkl-file-input-drag-font-size);font-weight:var(--jkl-file-input-drag-font-weight);line-height:var(--jkl-file-input-drag-line-height)}@media (width >= 0) and (max-width:679px){.jkl-file-input__dropzone__drag-text{display:none}}.jkl-file-input__call-to-action{align-items:center;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center}.jkl-file-input__call-to-action:has(:focus-visible) .jkl-button{outline:3px solid var(--jkl-color-border-action);outline-offset:3px;transform:scale(1.05)}.jkl-file-input__call-to-action:has(:focus-visible) .jkl-button:active{transform:scale(1)}.jkl-file-input__dropzone-hint{margin-top:calc(var(--jkl-unit-10)*3)}.jkl-file-input--has-files .jkl-file-input__dropzone-hint{display:none}.jkl-file-input__max-size-text{color:var(--jkl-color-text-subdued);font-size:var(--jkl-file-size-hint-font-size);font-weight:var(--jkl-file-size-hint-font-weight);line-height:var(--jkl-file-size-hint-line-height);margin-top:calc(var(--jkl-unit-10)*3)}.jkl-file-input__files{display:flex;flex-direction:column;gap:var(--jkl-file-list-gap);list-style:none;margin:0;padding:0}.jkl-file-input--small .jkl-file-input__dropzone-hint{display:block;margin:0}.jkl-file-input--small .jkl-file-input__dropzone{flex-direction:row;gap:calc(var(--jkl-unit-10)*2);justify-content:flex-start;margin-bottom:calc(var(--jkl-unit-10)*2);max-width:-webkit-fit-content;max-width:fit-content;padding:calc(var(--jkl-unit-10)*2)}.jkl-file-input--small .jkl-file-input__call-to-action{flex-direction:row;font-size:var(--jkl-file-size-hint-font-size);font-weight:var(--jkl-file-size-hint-font-weight);gap:calc(var(--jkl-unit-10)*1.5);justify-content:flex-start;line-height:var(--jkl-file-size-hint-line-height)}.jkl-file-input--small .jkl-file-input__max-size-text{margin-bottom:calc(var(--jkl-unit-10)*2);margin-top:calc(var(--jkl-unit-10)*1.5*-1)}
+@charset "UTF-8";:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-file-padding:0.5rem;--jkl-file-thumbnail-width:calc(var(--jkl-unit-10)*7);--jkl-file-thumbnail-max-height:120px;--jkl-file-thumbnail-aspect-ratio:1;--jkl-file-gap:0.5rem calc(var(--jkl-unit-10)*2);--jkl-file-button-width:calc(var(--jkl-unit-10)*5)}[data-density=compact],[data-layout-density=compact]{--jkl-file-padding:0.5rem;--jkl-file-thumbnail-width:calc(var(--jkl-unit-10)*5);--jkl-file-thumbnail-max-height:80px;--jkl-file-thumbnail-aspect-ratio:1;--jkl-file-gap:calc(var(--jkl-unit-10)*0.5) 0.5rem;--jkl-file-button-width:calc(var(--jkl-unit-10)*4)}.jkl-file{--text-color:var(--jkl-color-text-default);--border:1px solid var(--jkl-color-border-separator);--border-radius:2px;--bg:#0000}.jkl-file__content{align-items:center;background:var(--bg);border:var(--border);border-radius:var(--border-radius);color:var(--jkl-color-text-default);display:grid;gap:var(--jkl-file-gap);grid-template-areas:"image text button";grid-template-columns:var(--jkl-file-thumbnail-width) 1fr var(--jkl-file-button-width);height:-webkit-fit-content;height:fit-content;padding:var(--jkl-file-padding);transition-duration:.1s;transition-property:background-color,border-color,color;transition-timing-function:ease}.jkl-file__content__name{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;grid-area:text;word-break:break-word}.jkl-file__content__name__size{word-break:keep-all}.jkl-file__content__delete{aspect-ratio:1;grid-area:button}.jkl-file__content__thumbnail{align-items:center;aspect-ratio:var(--jkl-file-thumbnail-aspect-ratio);background:var(--jkl-color-background-container-low);border-radius:2px;container-type:inline-size;display:flex;grid-area:image;justify-content:center;max-height:var(--jkl-file-thumbnail-max-height);object-fit:cover;overflow:hidden;position:relative;width:100%}.jkl-file__content__thumbnail img{z-index:0}.jkl-file__content__thumbnail img[src]{height:100%;object-fit:cover;width:100%}.jkl-file__content__thumbnail:after,.jkl-file__content__thumbnail:before{position:absolute;z-index:1}.jkl-file[class*=card]{--jkl-file-thumbnail-width:100%;--jkl-file-thumbnail-aspect-ratio:16/9}.jkl-file[class*=card] .jkl-file__content{grid-template-areas:"image image" "text button";grid-template-columns:1fr var(--jkl-file-button-width);grid-template-rows:var(--jkl-file-thumbnail-max-height) auto}.jkl-file:not([data-state*=loading]) .jkl-file__content__thumbnail:not(:has(img[src])):before{font-size:1rem;font-weight:400;line-height:1.5rem;--jkl-icon-weight:300;--jkl-icon-size:1.25rem;--jkl-icon-opsz:20;content:attr(data-filetype)}.jkl-file[data-state=loading]:not(:has(.jkl-file__support-label)) .jkl-file__content__thumbnail img{opacity:.25}.jkl-file[data-state=loading]:not(:has(.jkl-file__support-label)) .jkl-file__content__thumbnail:after{--scale:scale(0.3,0.3);--scale-end:scale(0.1,0.1);--rotation:45deg;animation:pulse 2.5s linear infinite forwards;aspect-ratio:1;background:var(--text-color);content:""/"Laster opp";height:100%;max-height:2lh;min-height:24px;transform:var(--scale) rotate(var(--rotation))}@keyframes pulse{0%{transform:var(--scale) rotate(var(--rotation))}50%{transform:var(--scale-end) rotate(calc(var(--rotation) + .5turn))}to{transform:var(--scale) rotate(calc(var(--rotation) + 1turn))}}.jkl-file[data-state=error]{--bg:var(--jkl-color-functional-error)}.jkl-file[data-state=error],.jkl-file[data-state=error] a,.jkl-file[data-state=error] a:hover,.jkl-file[data-state=error] button,.jkl-file[data-state=error] span{--text-color:var(--jkl-color-text-on-alert);--link-color:var(--text-color);--jkl-color-border-action:currentColor}.jkl-link{--link-color:var(--jkl-color-text-default);color:inherit;outline:none;text-decoration:none;transition-duration:75ms;transition-property:color;transition-timing-function:ease}.jkl-link__content{text-decoration:underline;-webkit-text-decoration-color:rgb(from currentColor r g b/70%);text-decoration-color:rgb(from currentColor r g b/70%);text-decoration-thickness:.05em;text-underline-offset:.08lh}.jkl-link__icon{-webkit-margin-start:.2em;margin-inline-start:.2em;-webkit-margin-before:-.1em;margin-block-start:-.1em;vertical-align:middle}.jkl-link--external:after,.jkl-link[download]:after,.jkl-link[target=_blank]:after{--jkl-icon-fill:0;--jkl-icon-size:1em;--jkl-icon-opsz:20;content:"\e89e"/"(Åpnes i ny fane)";-webkit-margin-before:-.1em;margin-block-start:-.1em;-webkit-padding-start:.2em;display:inline-block;font-family:Fremtind Material Symbols,Fremtind Material Symbols Fallback,sans-serif;font-feature-settings:"liga";-webkit-font-feature-settings:"liga";font-size:var(--jkl-icon-size,1.5rem);font-variation-settings:"FILL" var(--jkl-icon-fill,0),"GRAD" var(--jkl-icon-grade,0),"opsz" var(--jkl-icon-opsz,24);font-weight:var(--jkl-icon-weight,300);line-height:1;padding-inline-start:.2em;vertical-align:middle;-webkit-font-smoothing:antialiased;display:inline;transition-duration:.15s;transition-property:font-variation-settings,transform;transition-timing-function:ease}.jkl-link[download]:after{content:"\f090"/"(Last ned fil)"}.jkl-link:hover:not(:focus){--link-color:var(--jkl-color-text-subdued)}.jkl-link:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:0}@media screen and (forced-colors:active){.jkl-link:hover:not(:focus){--link-color:HighLight}}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-padding-block:0.5rem;--jkl-button-padding-text:calc(var(--jkl-unit-10)*3);--jkl-button-padding-icon:calc(var(--jkl-unit-10)*2);--jkl-button-padding-icon-button:0.5rem;--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1.125rem;--jkl-button-line-height:1.75rem}@media (min-width:680px){:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-button-font-size:1.25rem;--jkl-button-line-height:2rem}}[data-density=compact],[data-layout-density=compact]{--jkl-button-padding-block:calc(var(--jkl-unit-10)*0.5);--jkl-button-padding-text:calc(var(--jkl-unit-10)*1.5);--jkl-button-padding-icon:0.5rem;--jkl-button-padding-icon-button:calc(var(--jkl-unit-10)*0.5);--jkl-button-teritary-padding-icon:calc(var(--jkl-unit-10)*0.25);--jkl-button-padding-ghost-inline:calc(var(--jkl-unit-10)*0.5);--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem}@media (min-width:680px){[data-density=compact],[data-layout-density=compact]{--jkl-button-font-size:1rem;--jkl-button-line-height:1.5rem;--jkl-button-icon-weight:400}}.jkl-button{--jkl-icon-weight:var(--jkl-button-icon-weight,initial);--text-color:var(--jkl-color-text-default);--background-color:#0000;--border-radius:0;--border-width:0.0625rem;background:var(--background-color);border:unset;color:var(--text-color);cursor:pointer;display:inline-block;font-size:var(--jkl-button-font-size);font-weight:700;line-height:var(--jkl-button-line-height);text-decoration:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;animation:a .3s linear;border-radius:var(--border-radius);max-width:100%;overflow:hidden;padding-block:var(--jkl-button-padding-block);padding-inline:var(--jkl-button-padding-text);position:relative;transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}.jkl-button:has(.jkl-button__text){min-width:9.5ch}.jkl-button:has(.jkl-icon:first-child){-webkit-padding-start:var(--jkl-button-padding-icon);padding-inline-start:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:last-child){-webkit-padding-end:var(--jkl-button-padding-icon);padding-inline-end:var(--jkl-button-padding-icon)}.jkl-button:has(.jkl-icon:first-child):has(.jkl-icon:last-child){padding-inline:var(--jkl-button-padding-icon-button)}.jkl-button__label{align-items:center;display:flex;flex-direction:row;gap:calc(var(--jkl-unit-10)*.25);pointer-events:none;transition-duration:.25s;transition-property:translate;transition-timing-function:ease;width:100%}.jkl-button__loader{left:50%;opacity:0;pointer-events:none;position:absolute;top:50%;transition-duration:.25s;transition-property:opacity,translate;transition-timing-function:ease;translate:-50% 350%}.jkl-button__text{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.jkl-button[data-loading=true] .jkl-button__label{translate:0 -120%}.jkl-button[data-loading=true] .jkl-button__loader{opacity:1;translate:-50% -50%}.jkl-button:focus-visible{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}.jkl-button:hover{background-color:color-mix(in srgb,var(--background-color),var(--text-color) 15%)}@media (forced-colors:active){.jkl-button:hover{outline:3px solid var(--jkl-color-border-action);outline-offset:3px}}.jkl-button--ghost,.jkl-button--primary,.jkl-button--secondary{--border-radius:999px}.jkl-button--primary{--background-color:var(--jkl-color-background-action);--text-color:var(--jkl-color-text-on-action)}@media (forced-colors:active){.jkl-button--primary{border:calc(var(--border-width)*2) solid Highlight}}.jkl-button--secondary{border:var(--border-width) solid var(--text-color)}.jkl-button--tertiary{border-bottom:var(--border-width) solid var(--text-color);padding-inline:var(--jkl-button-teritary-padding-icon)}.jkl-button--tertiary:has(.jkl-icon:first-child){padding-inline:var(--jkl-button-teritary-padding-icon) calc(var(--jkl-button-teritary-padding-icon)*2)}.jkl-button--tertiary:has(.jkl-icon:last-child){padding-inline:calc(var(--jkl-button-teritary-padding-icon)*2) var(--jkl-button-teritary-padding-icon)}@layer jokul.components{.jkl-loader{display:flex}.jkl-loader--inline{display:inline-flex}.jkl-loader__dot{animation:2.5s linear infinite;background-color:currentColor;display:block;height:.9em;transform-origin:center;width:.9em}.jkl-loader__dot--left{animation-name:jkl-loader-left-spin-uqqmzx0;margin-right:1.71em}.jkl-loader__dot--middle{animation-name:jkl-loader-middle-spin-uqqmzxq;margin-right:1.9em}.jkl-loader__dot--right{animation-name:jkl-loader-right-spin-uqqmzy6}@media screen and (forced-colors:active){.jkl-loader__dot{background-color:CanvasText}}.jkl-button .jkl-loader>.jkl-loader__dot,.jkl-loader--medium>.jkl-loader__dot{height:.35em;width:.35em}.jkl-button .jkl-loader>.jkl-loader__dot--left,.jkl-loader--medium>.jkl-loader__dot--left{margin-right:.585em}.jkl-button .jkl-loader>.jkl-loader__dot--middle,.jkl-loader--medium>.jkl-loader__dot--middle{margin-right:.65em}.jkl-loader--small>.jkl-loader__dot{height:.25em;width:.25em}.jkl-loader--small>.jkl-loader__dot--left{margin-right:.27em}.jkl-loader--small>.jkl-loader__dot--middle{margin-right:.3em}@keyframes jkl-loader-left-spin-uqqmzx0{0%{transform:rotate(0) scale(0)}30%{transform:rotate(90deg) scale(1)}70%{transform:rotate(180deg) scale(0)}to{transform:rotate(180deg) scale(0)}}@keyframes jkl-loader-middle-spin-uqqmzxq{0%{transform:rotate(20deg) scale(0)}10%{transform:rotate(20deg) scale(0)}40%{transform:rotate(110deg) scale(1.4)}85%{transform:rotate(200deg) scale(0)}to{transform:rotate(200deg) scale(0)}}@keyframes jkl-loader-right-spin-uqqmzy6{0%{transform:rotate(40deg) scale(0)}20%{transform:rotate(40deg) scale(0)}50%{transform:rotate(130deg) scale(1)}to{transform:rotate(220deg) scale(0)}}}@layer jokul.components{@media screen and (prefers-color-scheme:light){:root{--jkl-skeleton-element-color:#e0dbd4;--jkl-skeleton-sweeper-color:#f9f9f9}}[data-theme=light]{--jkl-skeleton-element-color:#e0dbd4;--jkl-skeleton-sweeper-color:#f9f9f9}@media screen and (prefers-color-scheme:dark){:root{--jkl-skeleton-element-color:#636060;--jkl-skeleton-sweeper-color:#1b1917}}[data-theme=dark]{--jkl-skeleton-element-color:#636060;--jkl-skeleton-sweeper-color:#1b1917}.jkl-skeleton-animation{--jkl-skeleton-sweep-duration:3s;overflow:hidden;position:relative}.jkl-skeleton-animation:after{animation:var(--jkl-skeleton-sweep-duration) ease infinite jkl-sweep-uqqmzyv;background:linear-gradient(89.17deg,#f9f9f900 .8%,var(--jkl-skeleton-sweeper-color) 50.09%,#f9f9f900 96.31%);bottom:0;content:" ";position:absolute;top:0;width:12.5rem}@media (width >= 0) and (max-width:679px){.jkl-skeleton-animation{width:9.375rem}}@media screen and (prefers-reduced-motion:reduce){.jkl-skeleton-animation:after{background:none}}@media screen and (forced-colors:active){.jkl-skeleton-animation:after{animation:none}}.jkl-skeleton-animation--compact:after{width:9.375rem}.jkl-skeleton-element{background-color:var(--jkl-skeleton-element-color);border-radius:.125rem}.jkl-skeleton-element--circle{border-radius:50%}@media screen and (forced-colors:active){.jkl-skeleton-element{animation:jkl-blink-uqqmzz0 2s ease infinite;border:1px solid CanvasText}}.jkl-skeleton-input{display:flex;flex-direction:column;gap:.75rem}.jkl-skeleton-input__checkbox{display:flex;flex-direction:row;flex-wrap:nowrap;gap:.5rem}@media (width >= 0) and (max-width:679px){.jkl-skeleton-input{gap:.5rem}}.jkl-skeleton-input--compact:after{gap:.5rem}.jkl-skeleton-table{display:flex;flex-direction:column}.jkl-skeleton-table__header,.jkl-skeleton-table__row{border-bottom:1px solid var(--jkl-skeleton-element-color);display:flex;flex-direction:row;justify-content:space-between}.jkl-skeleton-table__header{padding:.75rem .5rem}.jkl-skeleton-table__row{padding:1rem .5rem}@media (width >= 0) and (max-width:679px){.jkl-skeleton-table__header{padding:.5rem .25rem}.jkl-skeleton-table__row{padding:.75rem .25rem}}.jkl-skeleton-table--compact::after__header{padding:.5rem .25rem}.jkl-skeleton-table--compact::after__row{padding:.75rem .25rem}@media screen and (forced-colors:active){.jkl-skeleton-table{animation:jkl-blink-uqqmzz0 2s ease-in-out infinite}}@keyframes jkl-sweep-uqqmzyv{0%{transform:translateX(-200px)}80%,to{transform:translateX(calc(100vw + 400px))}}@keyframes jkl-blink-uqqmzz0{0%{opacity:1}40%,50%{opacity:.3}70%,to{opacity:1}}}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-file-input-drag-font-size:var(--jkl-heading-2-font-size);--jkl-file-input-drag-line-height:var(--jkl-heading-2-line-height);--jkl-file-input-drag-font-weight:var(--jkl-heading-2-font-weight);--jkl-file-size-hint-font-size:var(--jkl-small-font-size);--jkl-file-size-hint-line-height:var(--jkl-small-line-height);--jkl-file-size-hint-font-weight:var(--jkl-small-font-weight);--jkl-file-input-dropzone-padding:calc(var(--jkl-unit-10)*3);--jkl-file-input-dropzone-gap:calc(var(--jkl-unit-10)*3);--jkl-file-cta-gap:calc(var(--jkl-unit-10)*3);--jkl-file-cta-with-files-gap:calc(var(--jkl-unit-10)*1.5);--jkl-file-list-gap:0.5rem}[data-density=compact],[data-layout-density=compact]{--jkl-file-input-drag-font-size:var(--jkl-body-font-size);--jkl-file-input-drag-line-height:var(--jkl-body-line-height);--jkl-file-input-drag-font-weight:var(--jkl-body-font-weight);--jkl-file-input-dropzone-padding:calc(var(--jkl-unit-10)*2);--jkl-file-input-dropzone-gap:calc(var(--jkl-unit-10)*2);--jkl-file-cta-gap:calc(var(--jkl-unit-10)*1.5);--jkl-file-cta-with-files-gap:calc(var(--jkl-unit-10)*0.5);--jkl-file-list-gap:0.5rem}.jkl-file-input__dropzone{--border-color:var(--jkl-color-border-input);--background-color:#0000;align-items:center;background-color:var(--background-color);border:1px dashed var(--border-color);border-radius:.25rem;display:flex;flex-direction:column;flex-wrap:nowrap;gap:var(--jkl-file-input-dropzone-gap);justify-content:center;padding:var(--jkl-file-input-dropzone-padding);transition-duration:.15s;transition-property:background-color;transition-timing-function:ease}.jkl-file-input__dropzone--enter{--border-color:var(--jkl-color-border-input-focus);--background-color:var(--jkl-color-background-container-high);border-style:solid}.jkl-file-input__dropzone__drag-text{font-size:var(--jkl-file-input-drag-font-size);font-weight:var(--jkl-file-input-drag-font-weight);line-height:var(--jkl-file-input-drag-line-height)}@media (width >= 0) and (max-width:679px){.jkl-file-input__dropzone__drag-text{display:none}}.jkl-file-input__call-to-action{align-items:center;display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:center}.jkl-file-input__call-to-action:has(:focus-visible) .jkl-button{outline:3px solid var(--jkl-color-border-action);outline-offset:3px;transform:scale(1.05)}.jkl-file-input__call-to-action:has(:focus-visible) .jkl-button:active{transform:scale(1)}.jkl-file-input__dropzone-hint{margin-top:calc(var(--jkl-unit-10)*3)}.jkl-file-input--has-files .jkl-file-input__dropzone-hint{display:none}.jkl-file-input__max-size-text{color:var(--jkl-color-text-subdued);font-size:var(--jkl-file-size-hint-font-size);font-weight:var(--jkl-file-size-hint-font-weight);line-height:var(--jkl-file-size-hint-line-height);margin-top:calc(var(--jkl-unit-10)*3)}.jkl-file-input__files{display:flex;flex-direction:column;gap:var(--jkl-file-list-gap);list-style:none;margin:0;padding:0}.jkl-file-input--small .jkl-file-input__dropzone-hint{display:block;margin:0}.jkl-file-input--small .jkl-file-input__dropzone{flex-direction:row;gap:calc(var(--jkl-unit-10)*2);justify-content:flex-start;margin-bottom:calc(var(--jkl-unit-10)*2);max-width:-webkit-fit-content;max-width:fit-content;padding:calc(var(--jkl-unit-10)*2)}.jkl-file-input--small .jkl-file-input__call-to-action{flex-direction:row;font-size:var(--jkl-file-size-hint-font-size);font-weight:var(--jkl-file-size-hint-font-weight);gap:calc(var(--jkl-unit-10)*1.5);justify-content:flex-start;line-height:var(--jkl-file-size-hint-line-height)}.jkl-file-input--small .jkl-file-input__max-size-text{margin-bottom:calc(var(--jkl-unit-10)*2);margin-top:calc(var(--jkl-unit-10)*1.5*-1)}

package/styles/components/help/help.css

@@ -16,8 +16,8 @@
   margin: var(--jkl-unit-05);
   inset: auto;
   border: none;
-  background-color: var(--jkl-color-background-container-high);
-  color: var(--jkl-color-text-default);
+  background-color: var(--jkl-color-background-container-inverted);
+  color: var(--jkl-color-text-inverted);
 }
 .jkl-help-popover header button {
   display: none;

package/styles/components/help/help.min.css

@@ -1 +1 @@
-.jkl-help-trigger{height:-webkit-fit-content;height:fit-content;vertical-align:middle;width:-webkit-fit-content;width:fit-content}.jkl-help-popover{background-color:var(--jkl-color-background-container-high);border:none;color:var(--jkl-color-text-default);inset:auto;margin:var(--jkl-unit-05);max-width:40ch;padding:var(--jkl-unit-30)}.jkl-help-popover header button{display:none}.jkl-help-popover .title{font-size:1.125rem;font-weight:400;line-height:1.75rem;--jkl-icon-weight:300;font-weight:700}@media (min-width:680px){.jkl-help-popover .title{font-size:1.25rem;font-weight:400;line-height:2rem;--jkl-icon-weight:300;font-weight:700}}.jkl-help-popover[data-position=top]{position-area:top center;position-try:top,bottom,right,left}.jkl-help-popover[data-position=bottom]{position-area:bottom center;position-try:bottom,top,right,left}.jkl-help-popover[data-position=left]{position-area:left center;position-try:left,right,top,bottom}.jkl-help-popover[data-position=right]{position-area:right center;position-try:right,left,top,bottom}
+.jkl-help-trigger{height:-webkit-fit-content;height:fit-content;vertical-align:middle;width:-webkit-fit-content;width:fit-content}.jkl-help-popover{background-color:var(--jkl-color-background-container-inverted);border:none;color:var(--jkl-color-text-inverted);inset:auto;margin:var(--jkl-unit-05);max-width:40ch;padding:var(--jkl-unit-30)}.jkl-help-popover header button{display:none}.jkl-help-popover .title{font-size:1.125rem;font-weight:400;line-height:1.75rem;--jkl-icon-weight:300;font-weight:700}@media (min-width:680px){.jkl-help-popover .title{font-size:1.25rem;font-weight:400;line-height:2rem;--jkl-icon-weight:300;font-weight:700}}.jkl-help-popover[data-position=top]{position-area:top center;position-try:top,bottom,right,left}.jkl-help-popover[data-position=bottom]{position-area:bottom center;position-try:bottom,top,right,left}.jkl-help-popover[data-position=left]{position-area:left center;position-try:left,right,top,bottom}.jkl-help-popover[data-position=right]{position-area:right center;position-try:right,left,top,bottom}

package/styles/components/help/help.scss

@@ -12,8 +12,8 @@
     margin: var(--jkl-unit-05);
     inset: auto;
     border: none;
-    background-color: var(--jkl-color-background-container-high);
-    color: var(--jkl-color-text-default);
+    background-color: var(--jkl-color-background-container-inverted);
+    color: var(--jkl-color-text-inverted);
 
     header button {
         display: none;
@@ -44,4 +44,4 @@
         position-area: right center;
         position-try: right, left, top, bottom;
     }
-}
+}

package/styles/components/input-group/input-group.css

@@ -80,7 +80,7 @@
   --color: var(--jkl-color-text-default);
 }
 .jkl-form-support-label--error .jkl-form-support-label__icon, .jkl-form-support-label--warning .jkl-form-support-label__icon, .jkl-form-support-label--success .jkl-form-support-label__icon {
-  animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-uh81j2w forwards;
+  animation: 400ms cubic-bezier(0, 0, 0.3, 1) 250ms jkl-support-icon-entrance-uu4gtjy forwards;
 }
 .jkl-form-support-label--sr-only {
   border: 0 !important;
@@ -155,7 +155,7 @@
   white-space: nowrap !important; /* 3 */
 }
 
-@keyframes jkl-support-icon-entrance-uh81j2w {
+@keyframes jkl-support-icon-entrance-uu4gtjy {
   0% {
     margin-right: 0;
     opacity: 0;

package/styles/components/input-group/input-group.min.css

@@ -1 +1 @@
-.jkl-field-group{border-style:none}.jkl-field-group,.jkl-field-group:active,.jkl-field-group:focus,.jkl-field-group:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-field-group{border-style:revert}.jkl-field-group,.jkl-field-group:active,.jkl-field-group:focus,.jkl-field-group:hover{outline:revert;outline-style:revert}}.jkl-dormant-form-support-label{display:none;opacity:0;pointer-events:none}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-form-support-label-font-size:var(--jkl-small-font-size);--jkl-form-support-label-line-height:var(--jkl-small-line-height);--jkl-form-support-label-font-weight:var(--jkl-small-font-weight);--jkl-form-support-label-margin:0.5rem 0 0;--jkl-form-support-label-icon-size:1.25rem;--jkl-form-support-label-icon-margin:0 -1.25rem -0.375rem 0}[data-density=compact],[data-layout-density=compact]{--jkl-form-support-label-icon-size:1.375rem;--jkl-form-support-label-icon-margin:0 -1.375rem -0.3125rem 0}.jkl-form-support-label{--color:var(--jkl-color-text-subdued);color:var(--color);display:flex;font-size:var(--jkl-form-support-label-font-size);font-weight:var(--jkl-form-support-label-font-weight);line-height:var(--jkl-form-support-label-line-height);margin:var(--jkl-form-support-label-margin);transition-delay:.15s;transition-duration:.4s;transition-property:color;transition-timing-function:ease}.jkl-form-support-label__icon,.jkl-form-support-label__icon.jkl-icon{height:var(--jkl-form-support-label-icon-size);margin:var(--jkl-form-support-label-icon-margin);opacity:0}@media screen and (forced-colors:active){.jkl-form-support-label__icon,.jkl-form-support-label__icon path,.jkl-form-support-label__icon svg,.jkl-form-support-label__icon.jkl-icon,.jkl-form-support-label__icon.jkl-icon path,.jkl-form-support-label__icon.jkl-icon svg{stroke:CanvasText;fill:Canvas}}.jkl-form-support-label--error,.jkl-form-support-label--success,.jkl-form-support-label--warning{--color:var(--jkl-color-text-default)}.jkl-form-support-label--error .jkl-form-support-label__icon,.jkl-form-support-label--success .jkl-form-support-label__icon,.jkl-form-support-label--warning .jkl-form-support-label__icon{animation:jkl-support-icon-entrance-uh81j2w .4s cubic-bezier(0,0,.3,1) .25s forwards}.jkl-form-support-label--sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-label-small-margin:0 0 0.25rem 0;--jkl-label-medium-margin:0 0 0.5rem 0;--jkl-label-large-margin:0 0 1rem -0.0625rem;--jkl-label-small-font-size:var(--jkl-small-font-size);--jkl-label-small-line-height:var(--jkl-small-line-height);--jkl-label-small-font-weight:var(--jkl-small-font-weight);--jkl-label-medium-font-size:var(--jkl-body-font-size);--jkl-label-medium-line-height:var(--jkl-body-line-height);--jkl-label-medium-font-weight:var(--jkl-body-font-weight);--jkl-label-large-font-size:var(--jkl-heading-2-font-size);--jkl-label-large-line-height:var(--jkl-heading-2-line-height);--jkl-label-large-font-weight:var(--jkl-heading-2-font-weight)}[data-density=compact],[data-layout-density=compact]{--jkl-label-small-margin:0 0 0.25rem 0;--jkl-label-medium-margin:0 0 0.5rem 0;--jkl-label-large-margin:0 0 0.75rem -0.0625rem}.jkl-label{color:var(--jkl-color-text-default);display:block;margin-left:0}.jkl-label--small{font-size:var(--jkl-label-small-font-size);font-weight:var(--jkl-label-small-font-weight);line-height:var(--jkl-label-small-line-height);margin:var(--jkl-label-small-margin)}.jkl-label--medium{font-size:var(--jkl-label-medium-font-size);font-weight:var(--jkl-label-medium-font-weight);line-height:var(--jkl-label-medium-line-height);margin:var(--jkl-label-medium-margin)}.jkl-label--large{font-size:var(--jkl-label-large-font-size);font-weight:var(--jkl-label-large-font-weight);line-height:var(--jkl-label-large-line-height);margin:var(--jkl-label-large-margin)}.jkl-label--sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}@keyframes jkl-support-icon-entrance-uh81j2w{0%{margin-right:0;opacity:0;transform:scale(1)}30%{margin-right:.5rem}50%{opacity:1}70%{transform:scale(1.1)}85%{transform:scale(.9)}to{margin-right:.5rem;opacity:1;transform:scale(1)}}@media screen and (forced-colors:active){.jkl-text-input-action-button,.jkl-text-input-action-button path,.jkl-text-input-action-button svg{stroke:ButtonText;fill:ButtonFace}}
+.jkl-field-group{border-style:none}.jkl-field-group,.jkl-field-group:active,.jkl-field-group:focus,.jkl-field-group:hover{outline:0;outline-style:none}@media screen and (forced-colors:active){.jkl-field-group{border-style:revert}.jkl-field-group,.jkl-field-group:active,.jkl-field-group:focus,.jkl-field-group:hover{outline:revert;outline-style:revert}}.jkl-dormant-form-support-label{display:none;opacity:0;pointer-events:none}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-form-support-label-font-size:var(--jkl-small-font-size);--jkl-form-support-label-line-height:var(--jkl-small-line-height);--jkl-form-support-label-font-weight:var(--jkl-small-font-weight);--jkl-form-support-label-margin:0.5rem 0 0;--jkl-form-support-label-icon-size:1.25rem;--jkl-form-support-label-icon-margin:0 -1.25rem -0.375rem 0}[data-density=compact],[data-layout-density=compact]{--jkl-form-support-label-icon-size:1.375rem;--jkl-form-support-label-icon-margin:0 -1.375rem -0.3125rem 0}.jkl-form-support-label{--color:var(--jkl-color-text-subdued);color:var(--color);display:flex;font-size:var(--jkl-form-support-label-font-size);font-weight:var(--jkl-form-support-label-font-weight);line-height:var(--jkl-form-support-label-line-height);margin:var(--jkl-form-support-label-margin);transition-delay:.15s;transition-duration:.4s;transition-property:color;transition-timing-function:ease}.jkl-form-support-label__icon,.jkl-form-support-label__icon.jkl-icon{height:var(--jkl-form-support-label-icon-size);margin:var(--jkl-form-support-label-icon-margin);opacity:0}@media screen and (forced-colors:active){.jkl-form-support-label__icon,.jkl-form-support-label__icon path,.jkl-form-support-label__icon svg,.jkl-form-support-label__icon.jkl-icon,.jkl-form-support-label__icon.jkl-icon path,.jkl-form-support-label__icon.jkl-icon svg{stroke:CanvasText;fill:Canvas}}.jkl-form-support-label--error,.jkl-form-support-label--success,.jkl-form-support-label--warning{--color:var(--jkl-color-text-default)}.jkl-form-support-label--error .jkl-form-support-label__icon,.jkl-form-support-label--success .jkl-form-support-label__icon,.jkl-form-support-label--warning .jkl-form-support-label__icon{animation:jkl-support-icon-entrance-uu4gtjy .4s cubic-bezier(0,0,.3,1) .25s forwards}.jkl-form-support-label--sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}:root,[data-density=comfortable],[data-layout-density=comfortable]{--jkl-label-small-margin:0 0 0.25rem 0;--jkl-label-medium-margin:0 0 0.5rem 0;--jkl-label-large-margin:0 0 1rem -0.0625rem;--jkl-label-small-font-size:var(--jkl-small-font-size);--jkl-label-small-line-height:var(--jkl-small-line-height);--jkl-label-small-font-weight:var(--jkl-small-font-weight);--jkl-label-medium-font-size:var(--jkl-body-font-size);--jkl-label-medium-line-height:var(--jkl-body-line-height);--jkl-label-medium-font-weight:var(--jkl-body-font-weight);--jkl-label-large-font-size:var(--jkl-heading-2-font-size);--jkl-label-large-line-height:var(--jkl-heading-2-line-height);--jkl-label-large-font-weight:var(--jkl-heading-2-font-weight)}[data-density=compact],[data-layout-density=compact]{--jkl-label-small-margin:0 0 0.25rem 0;--jkl-label-medium-margin:0 0 0.5rem 0;--jkl-label-large-margin:0 0 0.75rem -0.0625rem}.jkl-label{color:var(--jkl-color-text-default);display:block;margin-left:0}.jkl-label--small{font-size:var(--jkl-label-small-font-size);font-weight:var(--jkl-label-small-font-weight);line-height:var(--jkl-label-small-line-height);margin:var(--jkl-label-small-margin)}.jkl-label--medium{font-size:var(--jkl-label-medium-font-size);font-weight:var(--jkl-label-medium-font-weight);line-height:var(--jkl-label-medium-line-height);margin:var(--jkl-label-medium-margin)}.jkl-label--large{font-size:var(--jkl-label-large-font-size);font-weight:var(--jkl-label-large-font-weight);line-height:var(--jkl-label-large-line-height);margin:var(--jkl-label-large-margin)}.jkl-label--sr-only{border:0!important;clip:rect(1px,1px,1px,1px)!important;-webkit-clip-path:inset(50%)!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}@keyframes jkl-support-icon-entrance-uu4gtjy{0%{margin-right:0;opacity:0;transform:scale(1)}30%{margin-right:.5rem}50%{opacity:1}70%{transform:scale(1.1)}85%{transform:scale(.9)}to{margin-right:.5rem;opacity:1;transform:scale(1)}}@media screen and (forced-colors:active){.jkl-text-input-action-button,.jkl-text-input-action-button path,.jkl-text-input-action-button svg{stroke:ButtonText;fill:ButtonFace}}

package/styles/components/link/link.css

@@ -7,7 +7,7 @@
  */
 .jkl-link {
   --link-color: var(--jkl-color-text-default);
-  color: var(--link-color);
+  color: inherit;
   outline: none;
   text-decoration: none;
   transition-timing-function: ease;
@@ -18,7 +18,7 @@
   text-decoration: underline;
   text-underline-offset: 0.08lh;
   text-decoration-thickness: 0.05em;
-  text-decoration-color: rgba(from currentcolor r g b/0.7);
+  text-decoration-color: rgb(from currentColor r g b/70%);
 }
 .jkl-link__icon {
   margin-inline-start: 0.2em;