@fremtind/jokul 0.57.1 → 0.57.3

package/build/cjs/components/button/Button.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"),o=require("react"),r=require("../../hooks/useAriaLiveRegion/useAriaLiveRegion.cjs"),n=require("../loader/Loader.cjs"),s=o.forwardRef((function(s,i){const{as:a="button",children:l,className:c,density:u,onTouchStart:d,loader:h,icon:x,iconPosition:y="left",iconLeft:j,iconRight:g,variant:b="secondary",...p}=s,v=a;"production"!==process.env.NODE_ENV&&0===o.Children.count(l)&&!s["aria-label"]&&!s["aria-labelledby"]&&!s.title&&console.warn("Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title");const m=o.useCallback((e=>{d&&d(e);const t=e.target;if(t&&!t.disabled&&e.targetTouches.length){const o=e.targetTouches[0].clientX-t.getBoundingClientRect().x,r=e.targetTouches[0].clientY-t.getBoundingClientRect().y;t.style.setProperty("--jkl-touch-xcoord",o.toPrecision(4)+"px"),t.style.setProperty("--jkl-touch-ycoord",r.toPrecision(4)+"px"),t.classList.add("jkl-button--pressed"),setTimeout((()=>{t.classList.remove("jkl-button--pressed"),t.style.removeProperty("--jkl-touch-xcoord"),t.style.removeProperty("--jkl-touch-ycoord")}),400)}}),[d]),k=r.useAriaLiveRegion(null==h?void 0:h.showLoader),f=!!l&&!(null==h||!h.showLoader);return e.jsxs(v,{...k,"data-loading":f,"data-density":u,className:t.clsx("jkl-button","jkl-button--"+b,c),disabled:"button"===a?null==h?void 0:h.showLoader:void 0,onTouchStart:m,...p,ref:i,children:[e.jsxs("div",{className:"jkl-button__label",children:[j&&j,x&&"left"===y&&x,l&&e.jsx("span",{className:"jkl-button__text",children:l}),g&&g,x&&"right"===y&&x]}),l&&e.jsx(n.Loader,{className:"jkl-button__loader",variant:"medium",textDescription:(null==h?void 0:h.textDescription)||"Vennligst vent","aria-hidden":!(null!=h&&h.showLoader)})]})}));exports.Button=s,exports.GhostButton=function(t){const o={...t,variant:"ghost"};return e.jsx(s,{...o})},exports.PrimaryButton=function(t){const o={...t,variant:"primary"};return e.jsx(s,{...o})},exports.SecondaryButton=function(t){const o={...t,variant:"secondary"};return e.jsx(s,{...o})},exports.TertiaryButton=function(t){const o={...t,variant:"tertiary"};return e.jsx(s,{...o})};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("../../../clsx-E3yX_9sL.cjs"),o=require("react"),n=require("../../hooks/useAriaLiveRegion/useAriaLiveRegion.cjs"),r=require("../loader/Loader.cjs"),s=o.forwardRef((function(s,i){const{as:a="button",children:l,className:c,density:u,onTouchStart:d,onAnimationEnd:x,loader:h,icon:j,iconPosition:y="left",iconLeft:g,iconRight:b,variant:p="secondary",...v}=s,m=a;"production"!==process.env.NODE_ENV&&0===o.Children.count(l)&&!s["aria-label"]&&!s["aria-labelledby"]&&!s.title&&console.warn("Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title");const k=o.useCallback((t=>{const e=t.target;if(e&&!e.disabled&&t.targetTouches.length){const o=t.targetTouches[0].clientX-e.getBoundingClientRect().x,n=t.targetTouches[0].clientY-e.getBoundingClientRect().y;e.style.setProperty("--jkl-touch-xcoord",o.toFixed(1)+"px"),e.style.setProperty("--jkl-touch-ycoord",n.toFixed(1)+"px"),e.classList.add("jkl-button--pressed")}}),[]),f=n.useAriaLiveRegion(null==h?void 0:h.showLoader),L=!!l&&!(null==h||!h.showLoader);return t.jsxs(m,{...f,"data-loading":L,"data-density":u,className:e.clsx("jkl-button","jkl-button--"+p,c),disabled:"button"===a?null==h?void 0:h.showLoader:void 0,onTouchStart:t=>{null==d||d(t),k(t)},onAnimationEnd:t=>{null==x||x(t),(t=>{t.classList.contains("jkl-button--pressed")&&(t.classList.remove("jkl-button--pressed"),t.style.removeProperty("--jkl-touch-xcoord"),t.style.removeProperty("--jkl-touch-ycoord"))})(t.target)},...v,ref:i,children:[t.jsxs("div",{className:"jkl-button__label",children:[g&&g,j&&"left"===y&&j,l&&t.jsx("span",{className:"jkl-button__text",children:l}),b&&b,j&&"right"===y&&j]}),l&&t.jsx(r.Loader,{className:"jkl-button__loader",variant:"medium",textDescription:(null==h?void 0:h.textDescription)||"Vennligst vent","aria-hidden":!(null!=h&&h.showLoader)})]})}));exports.Button=s,exports.GhostButton=function(e){const o={...e,variant:"ghost"};return t.jsx(s,{...o})},exports.PrimaryButton=function(e){const o={...e,variant:"primary"};return t.jsx(s,{...o})},exports.SecondaryButton=function(e){const o={...e,variant:"secondary"};return t.jsx(s,{...o})},exports.TertiaryButton=function(e){const o={...e,variant:"tertiary"};return t.jsx(s,{...o})};
 //# sourceMappingURL=Button.cjs.map

package/build/cjs/components/button/Button.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Button.cjs","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import cn from \"clsx\";\nimport React, {\n    ButtonHTMLAttributes,\n    type TouchEvent,\n    useCallback,\n} from \"react\";\nimport { useAriaLiveRegion } from \"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js\";\nimport { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { Loader } from \"../loader/Loader.js\";\nimport { ButtonComponent, ButtonProps } from \"./types.js\";\n\nexport const Button = React.forwardRef(function Button<\n    ElementType extends React.ElementType = \"button\",\n>(props: ButtonProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        as = \"button\",\n        children,\n        className,\n        density,\n        onTouchStart,\n        loader,\n        icon,\n        iconPosition = \"left\",\n        iconLeft,\n        iconRight,\n        variant = \"secondary\",\n        ...rest\n    } = props;\n\n    const Component = as;\n\n    if (\n        process.env.NODE_ENV !== \"production\" &&\n        React.Children.count(children) === 0 &&\n        !props[\"aria-label\"] &&\n        !props[\"aria-labelledby\"] &&\n        !props.title\n    ) {\n        console.warn(\n            \"Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title\",\n        );\n    }\n\n    const handleTouch = useCallback(\n        (event: TouchEvent<HTMLButtonElement>) => {\n            onTouchStart && onTouchStart(event);\n\n            const target = event.target as HTMLButtonElement;\n            if (target && !target.disabled && event.targetTouches.length) {\n                const Xcoord =\n                    event.targetTouches[0].clientX -\n                    target.getBoundingClientRect().x;\n                const Ycoord =\n                    event.targetTouches[0].clientY -\n                    target.getBoundingClientRect().y;\n                target.style.setProperty(\n                    \"--jkl-touch-xcoord\",\n                    Xcoord.toPrecision(4) + \"px\",\n                );\n                target.style.setProperty(\n                    \"--jkl-touch-ycoord\",\n                    Ycoord.toPrecision(4) + \"px\",\n                );\n                target.classList.add(\"jkl-button--pressed\");\n\n                setTimeout(() => {\n                    target.classList.remove(\"jkl-button--pressed\");\n                    target.style.removeProperty(\"--jkl-touch-xcoord\");\n                    target.style.removeProperty(\"--jkl-touch-ycoord\");\n                }, 400);\n            }\n        },\n        [onTouchStart],\n    );\n\n    const ariaLive = useAriaLiveRegion(loader?.showLoader);\n    const showLoader = Boolean(children) && Boolean(loader?.showLoader);\n\n    return (\n        <Component\n            {...ariaLive}\n            data-loading={showLoader}\n            data-density={density}\n            className={cn(\"jkl-button\", \"jkl-button--\" + variant, className)}\n            disabled={as === \"button\" ? loader?.showLoader : undefined}\n            onTouchStart={handleTouch}\n            {...rest}\n            ref={ref}\n        >\n            <div className=\"jkl-button__label\">\n                {iconLeft && iconLeft}\n                {icon && iconPosition === \"left\" && icon}\n                {children && (\n                    <span className=\"jkl-button__text\">{children}</span>\n                )}\n                {iconRight && iconRight}\n                {icon && iconPosition === \"right\" && icon}\n            </div>\n\n            {children && (\n                <Loader\n                    className=\"jkl-button__loader\"\n                    variant=\"medium\"\n                    textDescription={\n                        loader?.textDescription || \"Vennligst vent\"\n                    }\n                    aria-hidden={!loader?.showLoader}\n                />\n            )}\n        </Component>\n    );\n}) as ButtonComponent;\n\nexport function PrimaryButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"primary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function SecondaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"secondary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function TertiaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"tertiary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function GhostButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"loader\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"ghost\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n"],"names":["Button","React","forwardRef","props","ref","as","children","className","density","onTouchStart","loader","icon","iconPosition","iconLeft","iconRight","variant","rest","Component","process","env","NODE_ENV","Children","count","title","console","warn","handleTouch","useCallback","event","target","disabled","targetTouches","length","Xcoord","clientX","getBoundingClientRect","x","Ycoord","clientY","y","style","setProperty","toPrecision","classList","add","setTimeout","remove","removeProperty","ariaLive","useAriaLiveRegion","showLoader","jsxs","cn","jsx","Loader","textDescription","buttonProps"],"mappings":"mRAWaA,EAASC,EAAMC,YAAW,SAErCC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,SACLC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,aAAAA,EACAC,OAAAA,EACAC,KAAAA,EACAC,aAAAA,EAAe,OACfC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,eACPC,GACHb,EAEEc,EAAYZ,EAGW,eAAzBa,QAAQC,IAAIC,UACuB,IAAnCnB,EAAMoB,SAASC,MAAMhB,KACpBH,EAAM,gBACNA,EAAM,qBACNA,EAAMoB,OAECC,QAAAC,KACJ,2HAIR,MAAMC,EAAcC,EAAAA,aACfC,IACGnB,GAAgBA,EAAamB,GAE7B,MAAMC,EAASD,EAAMC,OACrB,GAAIA,IAAWA,EAAOC,UAAYF,EAAMG,cAAcC,OAAQ,CACpD,MAAAC,EACFL,EAAMG,cAAc,GAAGG,QACvBL,EAAOM,wBAAwBC,EAC7BC,EACFT,EAAMG,cAAc,GAAGO,QACvBT,EAAOM,wBAAwBI,EACnCV,EAAOW,MAAMC,YACT,qBACAR,EAAOS,YAAY,GAAK,MAE5Bb,EAAOW,MAAMC,YACT,qBACAJ,EAAOK,YAAY,GAAK,MAErBb,EAAAc,UAAUC,IAAI,uBAErBC,YAAW,KACAhB,EAAAc,UAAUG,OAAO,uBACjBjB,EAAAW,MAAMO,eAAe,sBACrBlB,EAAAW,MAAMO,eAAe,qBAAoB,GACjD,IACP,IAEJ,CAACtC,IAGCuC,EAAWC,EAAAA,kBAAkB,MAAAvC,OAAA,EAAAA,EAAQwC,YACrCA,IAAqB5C,KAAqB,MAAAI,IAAAA,EAAQwC,YAGpD,OAAAC,EAAAA,KAAClC,EAAA,IACO+B,EACJ,eAAcE,EACd,eAAc1C,EACdD,UAAW6C,EAAAA,KAAG,aAAc,eAAiBrC,EAASR,GACtDuB,SAAiB,WAAPzB,EAAkB,MAAAK,OAAA,EAAAA,EAAQwC,gBAAa,EACjDzC,aAAciB,KACVV,EACJZ,IAAAA,EAEAE,SAAA,CAAC6C,EAAAA,KAAA,MAAA,CAAI5C,UAAU,oBACVD,SAAA,CAAYO,GAAAA,EACZF,GAAyB,SAAjBC,GAA2BD,EACnCL,GACG+C,EAAAA,IAAC,OAAK,CAAA9C,UAAU,mBAAoBD,SAAAA,IAEvCQ,GAAaA,EACbH,GAAyB,UAAjBC,GAA4BD,KAGxCL,GACG+C,EAAAA,IAACC,EAAAA,OAAA,CACG/C,UAAU,qBACVQ,QAAQ,SACRwC,iBACI,MAAA7C,OAAAA,EAAAA,EAAQ6C,kBAAmB,iBAE/B,gBAAc,MAAA7C,GAAAA,EAAQwC,gBAK1C,yCAuCO,SACH/C,GAEA,MAAMqD,EAAc,IACbrD,EACHY,QAAS,SAEN,OAAAsC,EAAAA,IAACrD,EAAQ,IAAGwD,GACvB,wBA7CO,SACHrD,GAGA,MAAMqD,EAAc,IACbrD,EACHY,QAAS,WAEN,OAAAsC,EAAAA,IAACrD,EAAQ,IAAGwD,GACvB,0BAEO,SAGHrD,GAGA,MAAMqD,EAAc,IACbrD,EACHY,QAAS,aAEN,OAAAsC,EAAAA,IAACrD,EAAQ,IAAGwD,GACvB,yBAEO,SAGHrD,GAGA,MAAMqD,EAAc,IACbrD,EACHY,QAAS,YAEN,OAAAsC,EAAAA,IAACrD,EAAQ,IAAGwD,GACvB"}
+{"version":3,"file":"Button.cjs","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import cn from \"clsx\";\nimport React, {\n    type ButtonHTMLAttributes,\n    type TouchEvent,\n    useCallback,\n} from \"react\";\nimport { useAriaLiveRegion } from \"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js\";\nimport { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { Loader } from \"../loader/Loader.js\";\nimport { ButtonComponent, ButtonProps } from \"./types.js\";\n\nexport const Button = React.forwardRef(function Button<\n    ElementType extends React.ElementType = \"button\",\n>(props: ButtonProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        as = \"button\",\n        children,\n        className,\n        density,\n        onTouchStart,\n        onAnimationEnd,\n        loader,\n        icon,\n        iconPosition = \"left\",\n        iconLeft,\n        iconRight,\n        variant = \"secondary\",\n        ...rest\n    } = props;\n\n    const Component = as;\n\n    if (\n        process.env.NODE_ENV !== \"production\" &&\n        React.Children.count(children) === 0 &&\n        !props[\"aria-label\"] &&\n        !props[\"aria-labelledby\"] &&\n        !props.title\n    ) {\n        console.warn(\n            \"Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title\",\n        );\n    }\n\n    const removeButtonAnimation = (element: HTMLElement) => {\n        if (element.classList.contains(\"jkl-button--pressed\")) {\n            element.classList.remove(\"jkl-button--pressed\");\n            element.style.removeProperty(\"--jkl-touch-xcoord\");\n            element.style.removeProperty(\"--jkl-touch-ycoord\");\n        }\n    };\n\n    const handleTouch = useCallback((event: TouchEvent<HTMLButtonElement>) => {\n        const target = event.target as HTMLButtonElement;\n\n        if (target && !target.disabled && event.targetTouches.length) {\n            const Xcoord =\n                event.targetTouches[0].clientX -\n                target.getBoundingClientRect().x;\n            const Ycoord =\n                event.targetTouches[0].clientY -\n                target.getBoundingClientRect().y;\n            target.style.setProperty(\n                \"--jkl-touch-xcoord\",\n                Xcoord.toFixed(1) + \"px\",\n            );\n            target.style.setProperty(\n                \"--jkl-touch-ycoord\",\n                Ycoord.toFixed(1) + \"px\",\n            );\n            target.classList.add(\"jkl-button--pressed\");\n        }\n    }, []);\n\n    const ariaLive = useAriaLiveRegion(loader?.showLoader);\n    const showLoader = Boolean(children) && Boolean(loader?.showLoader);\n\n    return (\n        <Component\n            {...ariaLive}\n            data-loading={showLoader}\n            data-density={density}\n            className={cn(\"jkl-button\", \"jkl-button--\" + variant, className)}\n            disabled={as === \"button\" ? loader?.showLoader : undefined}\n            onTouchStart={(event) => {\n                onTouchStart?.(event);\n                handleTouch(event);\n            }}\n            onAnimationEnd={(event) => {\n                onAnimationEnd?.(event);\n                removeButtonAnimation(event.target as HTMLElement);\n            }}\n            {...rest}\n            ref={ref}\n        >\n            <div className=\"jkl-button__label\">\n                {iconLeft && iconLeft}\n                {icon && iconPosition === \"left\" && icon}\n                {children && (\n                    <span className=\"jkl-button__text\">{children}</span>\n                )}\n                {iconRight && iconRight}\n                {icon && iconPosition === \"right\" && icon}\n            </div>\n\n            {children && (\n                <Loader\n                    className=\"jkl-button__loader\"\n                    variant=\"medium\"\n                    textDescription={\n                        loader?.textDescription || \"Vennligst vent\"\n                    }\n                    aria-hidden={!loader?.showLoader}\n                />\n            )}\n        </Component>\n    );\n}) as ButtonComponent;\n\nexport function PrimaryButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"primary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function SecondaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"secondary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function TertiaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"tertiary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function GhostButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"loader\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"ghost\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n"],"names":["Button","React","forwardRef","props","ref","as","children","className","density","onTouchStart","onAnimationEnd","loader","icon","iconPosition","iconLeft","iconRight","variant","rest","Component","process","env","NODE_ENV","Children","count","title","console","warn","handleTouch","useCallback","event","target","disabled","targetTouches","length","Xcoord","clientX","getBoundingClientRect","x","Ycoord","clientY","y","style","setProperty","toFixed","classList","add","ariaLive","useAriaLiveRegion","showLoader","jsxs","cn","element","contains","remove","removeProperty","removeButtonAnimation","jsx","Loader","textDescription","buttonProps"],"mappings":"mRAWaA,EAASC,EAAMC,YAAW,SAErCC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,SACLC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,aAAAA,EACAC,eAAAA,EACAC,OAAAA,EACAC,KAAAA,EACAC,aAAAA,EAAe,OACfC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,eACPC,GACHd,EAEEe,EAAYb,EAGW,eAAzBc,QAAQC,IAAIC,UACuB,IAAnCpB,EAAMqB,SAASC,MAAMjB,KACpBH,EAAM,gBACNA,EAAM,qBACNA,EAAMqB,OAECC,QAAAC,KACJ,2HAIF,MAQAC,EAAcC,eAAaC,IAC7B,MAAMC,EAASD,EAAMC,OAErB,GAAIA,IAAWA,EAAOC,UAAYF,EAAMG,cAAcC,OAAQ,CACpD,MAAAC,EACFL,EAAMG,cAAc,GAAGG,QACvBL,EAAOM,wBAAwBC,EAC7BC,EACFT,EAAMG,cAAc,GAAGO,QACvBT,EAAOM,wBAAwBI,EACnCV,EAAOW,MAAMC,YACT,qBACAR,EAAOS,QAAQ,GAAK,MAExBb,EAAOW,MAAMC,YACT,qBACAJ,EAAOK,QAAQ,GAAK,MAEjBb,EAAAc,UAAUC,IAAI,sBACzB,IACD,IAEGC,EAAWC,EAAAA,kBAAkB,MAAApC,OAAAA,EAAAA,EAAQqC,YACrCA,IAAqB1C,KAAqB,MAAAK,IAAAA,EAAQqC,YAGpD,OAAAC,EAAAA,KAAC/B,EAAA,IACO4B,EACJ,eAAcE,EACd,eAAcxC,EACdD,UAAW2C,EAAAA,KAAG,aAAc,eAAiBlC,EAAST,GACtDwB,SAAiB,WAAP1B,EAAkB,MAAAM,OAAA,EAAAA,EAAQqC,gBAAa,EACjDvC,aAAeoB,IACX,MAAApB,GAAAA,EAAeoB,GACfF,EAAYE,EAAK,EAErBnB,eAAiBmB,IACb,MAAAnB,GAAAA,EAAiBmB,GA7CEsB,KACvBA,EAAQP,UAAUQ,SAAS,yBACnBD,EAAAP,UAAUS,OAAO,uBACjBF,EAAAV,MAAMa,eAAe,sBACrBH,EAAAV,MAAMa,eAAe,sBAAoB,EA0C7CC,CAAsB1B,EAAMC,OAAqB,KAEjDb,EACJb,IAAAA,EAEAE,SAAA,CAAC2C,EAAAA,KAAA,MAAA,CAAI1C,UAAU,oBACVD,SAAA,CAAYQ,GAAAA,EACZF,GAAyB,SAAjBC,GAA2BD,EACnCN,GACGkD,EAAAA,IAAC,OAAK,CAAAjD,UAAU,mBAAoBD,SAAAA,IAEvCS,GAAaA,EACbH,GAAyB,UAAjBC,GAA4BD,KAGxCN,GACGkD,EAAAA,IAACC,EAAAA,OAAA,CACGlD,UAAU,qBACVS,QAAQ,SACR0C,iBACI,MAAA/C,OAAA,EAAAA,EAAQ+C,kBAAmB,iBAE/B,gBAAc,MAAA/C,GAAAA,EAAQqC,gBAK1C,yCAuCO,SACH7C,GAEA,MAAMwD,EAAc,IACbxD,EACHa,QAAS,SAEN,OAAAwC,EAAAA,IAACxD,EAAQ,IAAG2D,GACvB,wBA7CO,SACHxD,GAGA,MAAMwD,EAAc,IACbxD,EACHa,QAAS,WAEN,OAAAwC,EAAAA,IAACxD,EAAQ,IAAG2D,GACvB,0BAEO,SAGHxD,GAGA,MAAMwD,EAAc,IACbxD,EACHa,QAAS,aAEN,OAAAwC,EAAAA,IAACxD,EAAQ,IAAG2D,GACvB,yBAEO,SAGHxD,GAGA,MAAMwD,EAAc,IACbxD,EACHa,QAAS,YAEN,OAAAwC,EAAAA,IAACxD,EAAQ,IAAG2D,GACvB"}

package/build/cjs/components/file-input/File.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../clsx-E3yX_9sL.cjs"),i=require("react");require("../icon/Icon.cjs"),require("../icon/icons/animated/ArrowVerticalAnimated.cjs"),require("../icon/icons/animated/ArrowHorizontalAnimated.cjs"),require("../icon/icons/animated/PlusRemoveAnimated.cjs"),require("../icon/icons/ArrowDownIcon.cjs"),require("../icon/icons/ArrowLeftIcon.cjs"),require("../icon/icons/ArrowNorthEastIcon.cjs"),require("../icon/icons/ArrowRightIcon.cjs"),require("../icon/icons/ArrowUpIcon.cjs"),require("../icon/icons/CalendarIcon.cjs"),require("../icon/icons/CheckIcon.cjs"),require("../icon/icons/ChevronDownIcon.cjs"),require("../icon/icons/ChevronLeftIcon.cjs"),require("../icon/icons/ChevronRightIcon.cjs"),require("../icon/icons/ChevronUpIcon.cjs"),require("../icon/icons/CloseIcon.cjs"),require("../icon/icons/CopyIcon.cjs"),require("../icon/icons/DotsIcon.cjs"),require("../icon/icons/DragIcon.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/GreenCheckIcon.cjs"),require("../icon/icons/HamburgerIcon.cjs"),require("../icon/icons/InfoIcon.cjs"),require("../icon/icons/LinkIcon.cjs"),require("../icon/icons/MinusIcon.cjs"),require("../icon/icons/OpenInNewIcon.cjs"),require("../icon/icons/PenIcon.cjs"),require("../icon/icons/PlusIcon.cjs"),require("../icon/icons/QuestionIcon.cjs"),require("../icon/icons/RedCrossIcon.cjs"),require("../icon/icons/SearchIcon.cjs");const n=require("../icon/icons/SuccessIcon.cjs");require("../icon/icons/ThumbDownIcon.cjs"),require("../icon/icons/ThumbUpIcon.cjs");const r=require("../icon/icons/TrashCanIcon.cjs");require("../icon/icons/WarningIcon.cjs");const o=require("../icon-button/IconButton.cjs"),s=require("../input-group/SupportLabel.cjs"),l=require("../../utilities/formatters/bytes/formatBytes.cjs"),t=require("./internal/fileInputContext.cjs"),u=require("./internal/Thumbnail.cjs");exports.File=a=>{const{children:j,fileName:q,fileType:p,fileSize:I,path:d,file:h,supportLabel:m,supportLabelType:f,state:b,onRemove:x}=a,_=`jkl-file-preview-${i.useId()}`,k=_+"-support",w=t.useFileInputContext(),C=d?"a":"div",v="error"===f||"warning"===f,g="success"===f,y=e.jsxs("div",{id:_,className:"jkl-file",children:[e.jsxs(C,{className:c.clsx("jkl-file__content",{"jkl-file__content--error":"error"===f,"jkl-file__content--warning":"warning"===f}),href:d,target:d?"_blank":void 0,children:[e.jsx(u.Thumbnail,{fileName:q,fileType:p,file:h,path:d,state:b,children:j}),e.jsxs("div",{children:[e.jsx("p",{className:"jkl-file__name",children:q}),e.jsxs("p",{className:"jkl-file__description",children:[e.jsx("span",{children:l.formatBytes(I)}),v||g?g?e.jsx(n.SuccessIcon,{variant:"small","aria-label":"Filen ble lastet opp uten feil"}):null:e.jsx(s.SupportLabel,{className:"jkl-file__support-label jkl-body",id:k,label:m,labelType:f})]}),m&&v&&e.jsx(s.SupportLabel,{className:"jkl-file__support-label",id:k,label:m,labelType:f})]})]}),x&&e.jsx(o.IconButton,{className:"jkl-file__delete",onClick:x,title:`Fjern ${q}`,children:e.jsx(r.TrashCanIcon,{})})]});return w?e.jsx("li",{children:y}):y};
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../clsx-E3yX_9sL.cjs"),i=require("react");require("../icon/Icon.cjs"),require("../icon/icons/animated/ArrowVerticalAnimated.cjs"),require("../icon/icons/animated/ArrowHorizontalAnimated.cjs"),require("../icon/icons/animated/PlusRemoveAnimated.cjs"),require("../icon/icons/ArrowDownIcon.cjs"),require("../icon/icons/ArrowLeftIcon.cjs"),require("../icon/icons/ArrowNorthEastIcon.cjs"),require("../icon/icons/ArrowRightIcon.cjs"),require("../icon/icons/ArrowUpIcon.cjs"),require("../icon/icons/CalendarIcon.cjs"),require("../icon/icons/CheckIcon.cjs"),require("../icon/icons/ChevronDownIcon.cjs"),require("../icon/icons/ChevronLeftIcon.cjs"),require("../icon/icons/ChevronRightIcon.cjs"),require("../icon/icons/ChevronUpIcon.cjs"),require("../icon/icons/CloseIcon.cjs"),require("../icon/icons/CopyIcon.cjs"),require("../icon/icons/DotsIcon.cjs"),require("../icon/icons/DragIcon.cjs"),require("../icon/icons/ErrorIcon.cjs"),require("../icon/icons/GreenCheckIcon.cjs"),require("../icon/icons/HamburgerIcon.cjs"),require("../icon/icons/InfoIcon.cjs"),require("../icon/icons/LinkIcon.cjs"),require("../icon/icons/MinusIcon.cjs"),require("../icon/icons/OpenInNewIcon.cjs"),require("../icon/icons/PenIcon.cjs"),require("../icon/icons/PlusIcon.cjs"),require("../icon/icons/QuestionIcon.cjs"),require("../icon/icons/RedCrossIcon.cjs"),require("../icon/icons/SearchIcon.cjs");const n=require("../icon/icons/SuccessIcon.cjs");require("../icon/icons/ThumbDownIcon.cjs"),require("../icon/icons/ThumbUpIcon.cjs");const r=require("../icon/icons/TrashCanIcon.cjs");require("../icon/icons/WarningIcon.cjs");const o=require("../icon-button/IconButton.cjs"),s=require("../input-group/SupportLabel.cjs"),l=require("../../utilities/formatters/bytes/formatBytes.cjs"),t=require("./internal/fileInputContext.cjs"),a=require("./internal/Thumbnail.cjs");exports.File=u=>{const{children:j,className:q,fileName:p,fileType:I,fileSize:d,path:m,file:h,supportLabel:f,supportLabelType:b,state:x,onRemove:_,...k}=u,w=`jkl-file-preview-${i.useId()}`,C=w+"-support",v=t.useFileInputContext(),g=m?"a":"div",y="error"===b||"warning"===b,N="success"===b,T=e.jsxs("div",{id:w,className:c.clsx(q,"jkl-file"),...k,children:[e.jsxs(g,{className:c.clsx("jkl-file__content",{"jkl-file__content--error":"error"===b,"jkl-file__content--warning":"warning"===b}),href:m,target:m?"_blank":void 0,children:[e.jsx(a.Thumbnail,{fileName:p,fileType:I,file:h,path:m,state:x,children:j}),e.jsxs("div",{children:[e.jsx("p",{className:"jkl-file__name",children:p}),e.jsxs("p",{className:"jkl-file__description",children:[e.jsx("span",{children:l.formatBytes(d)}),y||N?N?e.jsx(n.SuccessIcon,{variant:"small","aria-label":"Filen ble lastet opp uten feil"}):null:e.jsx(s.SupportLabel,{className:"jkl-file__support-label jkl-body",id:C,label:f,labelType:b})]}),f&&y&&e.jsx(s.SupportLabel,{className:"jkl-file__support-label",id:C,label:f,labelType:b})]})]}),_&&e.jsx(o.IconButton,{className:"jkl-file__delete",onClick:_,title:`Fjern ${p}`,children:e.jsx(r.TrashCanIcon,{})})]});return v?e.jsx("li",{children:T}):T};
 //# sourceMappingURL=File.cjs.map

package/build/cjs/components/file-input/File.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"File.cjs","sources":["../../../../src/components/file-input/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type ComponentProps,\n    type FC,\n    type MouseEvent,\n    useId,\n} from \"react\";\nimport { TrashCanIcon, SuccessIcon } from \"../../components/icon/index.js\";\nimport { IconButton } from \"../../components/icon-button/IconButton.js\";\nimport { SupportLabel } from \"../../components/input-group/SupportLabel.js\";\nimport { formatBytes } from \"../../utilities/formatters/bytes/formatBytes.js\";\nimport { useFileInputContext } from \"./internal/fileInputContext.js\";\nimport { Thumbnail } from \"./internal/Thumbnail.js\";\nimport type { FileInputFileState } from \"./types.js\";\n\nexport type FileProps = {\n    fileName: string;\n    fileType: string;\n    fileSize: number;\n    path?: string;\n    file?: File;\n    supportLabel?: string;\n    supportLabelType?: \"help\" | \"error\" | \"warning\" | \"success\";\n    state?: FileInputFileState;\n    onRemove?: (e: MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n    const {\n        children,\n        fileName,\n        fileType,\n        fileSize,\n        path,\n        file,\n        supportLabel,\n        supportLabelType,\n        state,\n        onRemove,\n    } = props;\n\n    const id = `jkl-file-preview-${useId()}`;\n    const supportId = id + \"-support\";\n\n    const context = useFileInputContext();\n\n    const Component = path ? \"a\" : \"div\";\n\n    const hasErrorOrWarning =\n        supportLabelType === \"error\" || supportLabelType === \"warning\";\n    const hasSuccess = supportLabelType === \"success\";\n\n    const renderFeedbackElement = () => {\n        if (!hasErrorOrWarning && !hasSuccess) {\n            return (\n                <SupportLabel\n                    className=\"jkl-file__support-label jkl-body\"\n                    id={supportId}\n                    label={supportLabel}\n                    labelType={supportLabelType}\n                />\n            );\n        }\n\n        if (hasSuccess)\n            return (\n                <SuccessIcon\n                    variant=\"small\"\n                    aria-label=\"Filen ble lastet opp uten feil\"\n                />\n            );\n\n        return null;\n    };\n\n    const fileComponent = (\n        <div id={id} className=\"jkl-file\">\n            <Component\n                className={clsx(\"jkl-file__content\", {\n                    \"jkl-file__content--error\": supportLabelType === \"error\",\n                    \"jkl-file__content--warning\":\n                        supportLabelType === \"warning\",\n                })}\n                href={path}\n                target={path ? \"_blank\" : undefined}\n            >\n                <Thumbnail\n                    fileName={fileName}\n                    fileType={fileType}\n                    file={file}\n                    path={path}\n                    state={state}\n                >\n                    {children}\n                </Thumbnail>\n                <div>\n                    <p className=\"jkl-file__name\">{fileName}</p>\n                    <p className=\"jkl-file__description\">\n                        <span>{formatBytes(fileSize)}</span>\n                        {renderFeedbackElement()}\n                    </p>\n                    {supportLabel && hasErrorOrWarning && (\n                        <SupportLabel\n                            className=\"jkl-file__support-label\"\n                            id={supportId}\n                            label={supportLabel}\n                            labelType={supportLabelType}\n                        />\n                    )}\n                </div>\n            </Component>\n            {onRemove && (\n                <IconButton\n                    className=\"jkl-file__delete\"\n                    onClick={onRemove}\n                    title={`Fjern ${fileName}`}\n                >\n                    <TrashCanIcon />\n                </IconButton>\n            )}\n        </div>\n    );\n\n    return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["props","children","fileName","fileType","fileSize","path","file","supportLabel","supportLabelType","state","onRemove","id","useId","supportId","context","useFileInputContext","Component","hasErrorOrWarning","hasSuccess","fileComponent","jsxs","className","clsx","href","target","jsx","Thumbnail","formatBytes","SuccessIcon","variant","SupportLabel","label","labelType","IconButton","onClick","title","TrashCanIcon"],"mappings":"s7DA2B4DA,IAClD,MACFC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,aAAAA,EACAC,iBAAAA,EACAC,MAAAA,EACAC,SAAAA,GACAV,EAEEW,EAAK,oBAAoBC,EAAAA,UACzBC,EAAYF,EAAK,WAEjBG,EAAUC,EAAAA,sBAEVC,EAAYX,EAAO,IAAM,MAEzBY,EACmB,UAArBT,GAAqD,YAArBA,EAC9BU,EAAkC,YAArBV,EAyBbW,EACFC,EAAAA,KAAC,MAAI,CAAAT,GAAAA,EAAQU,UAAU,WACnBpB,SAAA,CAAAmB,EAAAA,KAACJ,EAAA,CACGK,UAAWC,OAAK,oBAAqB,CACjC,2BAAiD,UAArBd,EAC5B,6BACyB,YAArBA,IAERe,KAAMlB,EACNmB,OAAQnB,EAAO,cAAW,EAE1BJ,SAAA,CAAAwB,EAAAA,IAACC,EAAAA,UAAA,CACGxB,SAAAA,EACAC,SAAAA,EACAG,KAAAA,EACAD,KAAAA,EACAI,MAAAA,EAECR,SAAAA,WAEJ,MACG,CAAAA,SAAA,CAACwB,EAAAA,IAAA,IAAA,CAAEJ,UAAU,iBAAkBpB,SAASC,IACxCkB,EAAAA,KAAC,IAAE,CAAAC,UAAU,wBACTpB,SAAA,CAACwB,EAAAA,IAAA,OAAA,CAAMxB,SAAY0B,EAAAA,YAAAvB,KA7C9Ba,GAAsBC,EAWvBA,EAEIO,EAAAA,IAACG,EAAAA,YAAA,CACGC,QAAQ,QACR,aAAW,mCAIhB,KAjBCJ,EAAAA,IAACK,EAAAA,aAAA,CACGT,UAAU,mCACVV,GAAIE,EACJkB,MAAOxB,EACPyB,UAAWxB,OA0CVD,GAAgBU,GACbQ,EAAAA,IAACK,EAAAA,aAAA,CACGT,UAAU,0BACVV,GAAIE,EACJkB,MAAOxB,EACPyB,UAAWxB,UAK1BE,GACGe,EAAAA,IAACQ,EAAAA,WAAA,CACGZ,UAAU,mBACVa,QAASxB,EACTyB,MAAO,SAASjC,IAEhBD,eAACmC,EAAaA,aAAA,SAM9B,OAAOtB,EAAUW,EAAAA,IAAC,KAAI,CAAAxB,SAAAkB,IAAsBA"}
+{"version":3,"file":"File.cjs","sources":["../../../../src/components/file-input/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type ComponentProps,\n    type FC,\n    type MouseEvent,\n    useId,\n} from \"react\";\nimport { TrashCanIcon, SuccessIcon } from \"../../components/icon/index.js\";\nimport { IconButton } from \"../../components/icon-button/IconButton.js\";\nimport { SupportLabel } from \"../../components/input-group/SupportLabel.js\";\nimport { formatBytes } from \"../../utilities/formatters/bytes/formatBytes.js\";\nimport { useFileInputContext } from \"./internal/fileInputContext.js\";\nimport { Thumbnail } from \"./internal/Thumbnail.js\";\nimport type { FileInputFileState } from \"./types.js\";\n\nexport type FileProps = {\n    fileName: string;\n    fileType: string;\n    fileSize: number;\n    path?: string;\n    file?: File;\n    supportLabel?: string;\n    supportLabelType?: \"help\" | \"error\" | \"warning\" | \"success\";\n    state?: FileInputFileState;\n    onRemove?: (e: MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n    const {\n        children,\n        className,\n        fileName,\n        fileType,\n        fileSize,\n        path,\n        file,\n        supportLabel,\n        supportLabelType,\n        state,\n        onRemove,\n        ...rest\n    } = props;\n\n    const id = `jkl-file-preview-${useId()}`;\n    const supportId = id + \"-support\";\n\n    const context = useFileInputContext();\n\n    const Component = path ? \"a\" : \"div\";\n\n    const hasErrorOrWarning =\n        supportLabelType === \"error\" || supportLabelType === \"warning\";\n    const hasSuccess = supportLabelType === \"success\";\n\n    const renderFeedbackElement = () => {\n        if (!hasErrorOrWarning && !hasSuccess) {\n            return (\n                <SupportLabel\n                    className=\"jkl-file__support-label jkl-body\"\n                    id={supportId}\n                    label={supportLabel}\n                    labelType={supportLabelType}\n                />\n            );\n        }\n\n        if (hasSuccess)\n            return (\n                <SuccessIcon\n                    variant=\"small\"\n                    aria-label=\"Filen ble lastet opp uten feil\"\n                />\n            );\n\n        return null;\n    };\n\n    const fileComponent = (\n        <div id={id} className={clsx(className, \"jkl-file\")} {...rest}>\n            <Component\n                className={clsx(\"jkl-file__content\", {\n                    \"jkl-file__content--error\": supportLabelType === \"error\",\n                    \"jkl-file__content--warning\":\n                        supportLabelType === \"warning\",\n                })}\n                href={path}\n                target={path ? \"_blank\" : undefined}\n            >\n                <Thumbnail\n                    fileName={fileName}\n                    fileType={fileType}\n                    file={file}\n                    path={path}\n                    state={state}\n                >\n                    {children}\n                </Thumbnail>\n                <div>\n                    <p className=\"jkl-file__name\">{fileName}</p>\n                    <p className=\"jkl-file__description\">\n                        <span>{formatBytes(fileSize)}</span>\n                        {renderFeedbackElement()}\n                    </p>\n                    {supportLabel && hasErrorOrWarning && (\n                        <SupportLabel\n                            className=\"jkl-file__support-label\"\n                            id={supportId}\n                            label={supportLabel}\n                            labelType={supportLabelType}\n                        />\n                    )}\n                </div>\n            </Component>\n            {onRemove && (\n                <IconButton\n                    className=\"jkl-file__delete\"\n                    onClick={onRemove}\n                    title={`Fjern ${fileName}`}\n                >\n                    <TrashCanIcon />\n                </IconButton>\n            )}\n        </div>\n    );\n\n    return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["props","children","className","fileName","fileType","fileSize","path","file","supportLabel","supportLabelType","state","onRemove","rest","id","useId","supportId","context","useFileInputContext","Component","hasErrorOrWarning","hasSuccess","fileComponent","jsxs","clsx","href","target","jsx","Thumbnail","formatBytes","SuccessIcon","variant","SupportLabel","label","labelType","IconButton","onClick","title","TrashCanIcon"],"mappings":"s7DA2B4DA,IAClD,MACFC,SAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,aAAAA,EACAC,iBAAAA,EACAC,MAAAA,EACAC,SAAAA,KACGC,GACHZ,EAEEa,EAAK,oBAAoBC,EAAAA,UACzBC,EAAYF,EAAK,WAEjBG,EAAUC,EAAAA,sBAEVC,EAAYZ,EAAO,IAAM,MAEzBa,EACmB,UAArBV,GAAqD,YAArBA,EAC9BW,EAAkC,YAArBX,EAyBbY,EACDC,EAAAA,KAAA,MAAA,CAAIT,GAAAA,EAAQX,UAAWqB,OAAKrB,EAAW,eAAiBU,EACrDX,SAAA,CAAAqB,EAAAA,KAACJ,EAAA,CACGhB,UAAWqB,OAAK,oBAAqB,CACjC,2BAAiD,UAArBd,EAC5B,6BACyB,YAArBA,IAERe,KAAMlB,EACNmB,OAAQnB,EAAO,cAAW,EAE1BL,SAAA,CAAAyB,EAAAA,IAACC,EAAAA,UAAA,CACGxB,SAAAA,EACAC,SAAAA,EACAG,KAAAA,EACAD,KAAAA,EACAI,MAAAA,EAECT,SAAAA,WAEJ,MACG,CAAAA,SAAA,CAACyB,EAAAA,IAAA,IAAA,CAAExB,UAAU,iBAAkBD,SAASE,IACxCmB,EAAAA,KAAC,IAAE,CAAApB,UAAU,wBACTD,SAAA,CAACyB,EAAAA,IAAA,OAAA,CAAMzB,SAAY2B,EAAAA,YAAAvB,KA7C9Bc,GAAsBC,EAWvBA,EAEIM,EAAAA,IAACG,EAAAA,YAAA,CACGC,QAAQ,QACR,aAAW,mCAIhB,KAjBCJ,EAAAA,IAACK,EAAAA,aAAA,CACG7B,UAAU,mCACVW,GAAIE,EACJiB,MAAOxB,EACPyB,UAAWxB,OA0CVD,GAAgBW,GACbO,EAAAA,IAACK,EAAAA,aAAA,CACG7B,UAAU,0BACVW,GAAIE,EACJiB,MAAOxB,EACPyB,UAAWxB,UAK1BE,GACGe,EAAAA,IAACQ,EAAAA,WAAA,CACGhC,UAAU,mBACViC,QAASxB,EACTyB,MAAO,SAASjC,IAEhBF,eAACoC,EAAaA,aAAA,SAM9B,OAAOrB,EAAUU,EAAAA,IAAC,KAAI,CAAAzB,SAAAoB,IAAsBA"}

package/build/es/components/button/Button.js

@@ -1,2 +1,2 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import n,{useCallback as r}from"react";import{useAriaLiveRegion as a}from"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js";import{Loader as s}from"../loader/Loader.js";const i=n.forwardRef((function(i,l){const{as:c="button",children:u,className:d,density:h,onTouchStart:m,loader:y,icon:g,iconPosition:p="left",iconLeft:v,iconRight:b,variant:f="secondary",...j}=i,k=c;"production"!==process.env.NODE_ENV&&0===n.Children.count(u)&&!i["aria-label"]&&!i["aria-labelledby"]&&!i.title&&console.warn("Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title");const x=r((t=>{m&&m(t);const e=t.target;if(e&&!e.disabled&&t.targetTouches.length){const o=t.targetTouches[0].clientX-e.getBoundingClientRect().x,n=t.targetTouches[0].clientY-e.getBoundingClientRect().y;e.style.setProperty("--jkl-touch-xcoord",o.toPrecision(4)+"px"),e.style.setProperty("--jkl-touch-ycoord",n.toPrecision(4)+"px"),e.classList.add("jkl-button--pressed"),setTimeout((()=>{e.classList.remove("jkl-button--pressed"),e.style.removeProperty("--jkl-touch-xcoord"),e.style.removeProperty("--jkl-touch-ycoord")}),400)}}),[m]),L=a(null==y?void 0:y.showLoader),B=!!u&&!(null==y||!y.showLoader);return t(k,{...L,"data-loading":B,"data-density":h,className:o("jkl-button","jkl-button--"+f,d),disabled:"button"===c?null==y?void 0:y.showLoader:void 0,onTouchStart:x,...j,ref:l,children:[t("div",{className:"jkl-button__label",children:[v&&v,g&&"left"===p&&g,u&&e("span",{className:"jkl-button__text",children:u}),b&&b,g&&"right"===p&&g]}),u&&e(s,{className:"jkl-button__loader",variant:"medium",textDescription:(null==y?void 0:y.textDescription)||"Vennligst vent","aria-hidden":!(null!=y&&y.showLoader)})]})}));function l(t){const o={...t,variant:"primary"};return e(i,{...o})}function c(t){const o={...t,variant:"secondary"};return e(i,{...o})}function u(t){const o={...t,variant:"tertiary"};return e(i,{...o})}function d(t){const o={...t,variant:"ghost"};return e(i,{...o})}export{i as Button,d as GhostButton,l as PrimaryButton,c as SecondaryButton,u as TertiaryButton};
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import{c as o}from"../../../clsx-BeLtu-UY.js";import n,{useCallback as r}from"react";import{useAriaLiveRegion as a}from"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js";import{Loader as s}from"../loader/Loader.js";const i=n.forwardRef((function(i,l){const{as:c="button",children:d,className:u,density:m,onTouchStart:h,onAnimationEnd:y,loader:g,icon:p,iconPosition:b="left",iconLeft:v,iconRight:j,variant:f="secondary",...k}=i,x=c;"production"!==process.env.NODE_ENV&&0===n.Children.count(d)&&!i["aria-label"]&&!i["aria-labelledby"]&&!i.title&&console.warn("Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title");const L=r((t=>{const e=t.target;if(e&&!e.disabled&&t.targetTouches.length){const o=t.targetTouches[0].clientX-e.getBoundingClientRect().x,n=t.targetTouches[0].clientY-e.getBoundingClientRect().y;e.style.setProperty("--jkl-touch-xcoord",o.toFixed(1)+"px"),e.style.setProperty("--jkl-touch-ycoord",n.toFixed(1)+"px"),e.classList.add("jkl-button--pressed")}}),[]),B=a(null==g?void 0:g.showLoader),N=!!d&&!(null==g||!g.showLoader);return t(x,{...B,"data-loading":N,"data-density":m,className:o("jkl-button","jkl-button--"+f,u),disabled:"button"===c?null==g?void 0:g.showLoader:void 0,onTouchStart:t=>{null==h||h(t),L(t)},onAnimationEnd:t=>{null==y||y(t),(t=>{t.classList.contains("jkl-button--pressed")&&(t.classList.remove("jkl-button--pressed"),t.style.removeProperty("--jkl-touch-xcoord"),t.style.removeProperty("--jkl-touch-ycoord"))})(t.target)},...k,ref:l,children:[t("div",{className:"jkl-button__label",children:[v&&v,p&&"left"===b&&p,d&&e("span",{className:"jkl-button__text",children:d}),j&&j,p&&"right"===b&&p]}),d&&e(s,{className:"jkl-button__loader",variant:"medium",textDescription:(null==g?void 0:g.textDescription)||"Vennligst vent","aria-hidden":!(null!=g&&g.showLoader)})]})}));function l(t){const o={...t,variant:"primary"};return e(i,{...o})}function c(t){const o={...t,variant:"secondary"};return e(i,{...o})}function d(t){const o={...t,variant:"tertiary"};return e(i,{...o})}function u(t){const o={...t,variant:"ghost"};return e(i,{...o})}export{i as Button,u as GhostButton,l as PrimaryButton,c as SecondaryButton,d as TertiaryButton};
 //# sourceMappingURL=Button.js.map

package/build/es/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import cn from \"clsx\";\nimport React, {\n    ButtonHTMLAttributes,\n    type TouchEvent,\n    useCallback,\n} from \"react\";\nimport { useAriaLiveRegion } from \"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js\";\nimport { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { Loader } from \"../loader/Loader.js\";\nimport { ButtonComponent, ButtonProps } from \"./types.js\";\n\nexport const Button = React.forwardRef(function Button<\n    ElementType extends React.ElementType = \"button\",\n>(props: ButtonProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        as = \"button\",\n        children,\n        className,\n        density,\n        onTouchStart,\n        loader,\n        icon,\n        iconPosition = \"left\",\n        iconLeft,\n        iconRight,\n        variant = \"secondary\",\n        ...rest\n    } = props;\n\n    const Component = as;\n\n    if (\n        process.env.NODE_ENV !== \"production\" &&\n        React.Children.count(children) === 0 &&\n        !props[\"aria-label\"] &&\n        !props[\"aria-labelledby\"] &&\n        !props.title\n    ) {\n        console.warn(\n            \"Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title\",\n        );\n    }\n\n    const handleTouch = useCallback(\n        (event: TouchEvent<HTMLButtonElement>) => {\n            onTouchStart && onTouchStart(event);\n\n            const target = event.target as HTMLButtonElement;\n            if (target && !target.disabled && event.targetTouches.length) {\n                const Xcoord =\n                    event.targetTouches[0].clientX -\n                    target.getBoundingClientRect().x;\n                const Ycoord =\n                    event.targetTouches[0].clientY -\n                    target.getBoundingClientRect().y;\n                target.style.setProperty(\n                    \"--jkl-touch-xcoord\",\n                    Xcoord.toPrecision(4) + \"px\",\n                );\n                target.style.setProperty(\n                    \"--jkl-touch-ycoord\",\n                    Ycoord.toPrecision(4) + \"px\",\n                );\n                target.classList.add(\"jkl-button--pressed\");\n\n                setTimeout(() => {\n                    target.classList.remove(\"jkl-button--pressed\");\n                    target.style.removeProperty(\"--jkl-touch-xcoord\");\n                    target.style.removeProperty(\"--jkl-touch-ycoord\");\n                }, 400);\n            }\n        },\n        [onTouchStart],\n    );\n\n    const ariaLive = useAriaLiveRegion(loader?.showLoader);\n    const showLoader = Boolean(children) && Boolean(loader?.showLoader);\n\n    return (\n        <Component\n            {...ariaLive}\n            data-loading={showLoader}\n            data-density={density}\n            className={cn(\"jkl-button\", \"jkl-button--\" + variant, className)}\n            disabled={as === \"button\" ? loader?.showLoader : undefined}\n            onTouchStart={handleTouch}\n            {...rest}\n            ref={ref}\n        >\n            <div className=\"jkl-button__label\">\n                {iconLeft && iconLeft}\n                {icon && iconPosition === \"left\" && icon}\n                {children && (\n                    <span className=\"jkl-button__text\">{children}</span>\n                )}\n                {iconRight && iconRight}\n                {icon && iconPosition === \"right\" && icon}\n            </div>\n\n            {children && (\n                <Loader\n                    className=\"jkl-button__loader\"\n                    variant=\"medium\"\n                    textDescription={\n                        loader?.textDescription || \"Vennligst vent\"\n                    }\n                    aria-hidden={!loader?.showLoader}\n                />\n            )}\n        </Component>\n    );\n}) as ButtonComponent;\n\nexport function PrimaryButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"primary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function SecondaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"secondary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function TertiaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"tertiary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function GhostButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"loader\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"ghost\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n"],"names":["Button","React","forwardRef","props","ref","as","children","className","density","onTouchStart","loader","icon","iconPosition","iconLeft","iconRight","variant","rest","Component","process","env","NODE_ENV","Children","count","title","console","warn","handleTouch","useCallback","event","target","disabled","targetTouches","length","Xcoord","clientX","getBoundingClientRect","x","Ycoord","clientY","y","style","setProperty","toPrecision","classList","add","setTimeout","remove","removeProperty","ariaLive","useAriaLiveRegion","showLoader","jsxs","cn","jsx","Loader","textDescription","PrimaryButton","buttonProps","SecondaryButton","TertiaryButton","GhostButton"],"mappings":"2QAWO,MAAMA,EAASC,EAAMC,YAAW,SAErCC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,SACLC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,aAAAA,EACAC,OAAAA,EACAC,KAAAA,EACAC,aAAAA,EAAe,OACfC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,eACPC,GACHb,EAEEc,EAAYZ,EAGW,eAAzBa,QAAQC,IAAIC,UACuB,IAAnCnB,EAAMoB,SAASC,MAAMhB,KACpBH,EAAM,gBACNA,EAAM,qBACNA,EAAMoB,OAECC,QAAAC,KACJ,2HAIR,MAAMC,EAAcC,GACfC,IACGnB,GAAgBA,EAAamB,GAE7B,MAAMC,EAASD,EAAMC,OACrB,GAAIA,IAAWA,EAAOC,UAAYF,EAAMG,cAAcC,OAAQ,CACpD,MAAAC,EACFL,EAAMG,cAAc,GAAGG,QACvBL,EAAOM,wBAAwBC,EAC7BC,EACFT,EAAMG,cAAc,GAAGO,QACvBT,EAAOM,wBAAwBI,EACnCV,EAAOW,MAAMC,YACT,qBACAR,EAAOS,YAAY,GAAK,MAE5Bb,EAAOW,MAAMC,YACT,qBACAJ,EAAOK,YAAY,GAAK,MAErBb,EAAAc,UAAUC,IAAI,uBAErBC,YAAW,KACAhB,EAAAc,UAAUG,OAAO,uBACjBjB,EAAAW,MAAMO,eAAe,sBACrBlB,EAAAW,MAAMO,eAAe,qBAAoB,GACjD,IACP,IAEJ,CAACtC,IAGCuC,EAAWC,EAAkB,MAAAvC,SAAAA,EAAQwC,YACrCA,IAAqB5C,KAAqB,MAAAI,IAAAA,EAAQwC,YAGpD,OAAAC,EAAClC,EAAA,IACO+B,EACJ,eAAcE,EACd,eAAc1C,EACdD,UAAW6C,EAAG,aAAc,eAAiBrC,EAASR,GACtDuB,SAAiB,WAAPzB,EAAkB,MAAAK,OAAA,EAAAA,EAAQwC,gBAAa,EACjDzC,aAAciB,KACVV,EACJZ,IAAAA,EAEAE,SAAA,CAAC6C,EAAA,MAAA,CAAI5C,UAAU,oBACVD,SAAA,CAAYO,GAAAA,EACZF,GAAyB,SAAjBC,GAA2BD,EACnCL,GACG+C,EAAC,OAAK,CAAA9C,UAAU,mBAAoBD,SAAAA,IAEvCQ,GAAaA,EACbH,GAAyB,UAAjBC,GAA4BD,KAGxCL,GACG+C,EAACC,EAAA,CACG/C,UAAU,qBACVQ,QAAQ,SACRwC,iBACI,MAAA7C,OAAAA,EAAAA,EAAQ6C,kBAAmB,iBAE/B,gBAAc,MAAA7C,GAAAA,EAAQwC,gBAK1C,IAEO,SAASM,EACZrD,GAGA,MAAMsD,EAAc,IACbtD,EACHY,QAAS,WAEN,OAAAsC,EAACrD,EAAQ,IAAGyD,GACvB,CAEO,SAASC,EAGZvD,GAGA,MAAMsD,EAAc,IACbtD,EACHY,QAAS,aAEN,OAAAsC,EAACrD,EAAQ,IAAGyD,GACvB,CAEO,SAASE,EAGZxD,GAGA,MAAMsD,EAAc,IACbtD,EACHY,QAAS,YAEN,OAAAsC,EAACrD,EAAQ,IAAGyD,GACvB,CAEO,SAASG,EACZzD,GAEA,MAAMsD,EAAc,IACbtD,EACHY,QAAS,SAEN,OAAAsC,EAACrD,EAAQ,IAAGyD,GACvB"}
+{"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import cn from \"clsx\";\nimport React, {\n    type ButtonHTMLAttributes,\n    type TouchEvent,\n    useCallback,\n} from \"react\";\nimport { useAriaLiveRegion } from \"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js\";\nimport { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { Loader } from \"../loader/Loader.js\";\nimport { ButtonComponent, ButtonProps } from \"./types.js\";\n\nexport const Button = React.forwardRef(function Button<\n    ElementType extends React.ElementType = \"button\",\n>(props: ButtonProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        as = \"button\",\n        children,\n        className,\n        density,\n        onTouchStart,\n        onAnimationEnd,\n        loader,\n        icon,\n        iconPosition = \"left\",\n        iconLeft,\n        iconRight,\n        variant = \"secondary\",\n        ...rest\n    } = props;\n\n    const Component = as;\n\n    if (\n        process.env.NODE_ENV !== \"production\" &&\n        React.Children.count(children) === 0 &&\n        !props[\"aria-label\"] &&\n        !props[\"aria-labelledby\"] &&\n        !props.title\n    ) {\n        console.warn(\n            \"Når du lager en Button uten synlig tekst må du huske å gi den et navn med enten aria-label, aria-labelledby eller title\",\n        );\n    }\n\n    const removeButtonAnimation = (element: HTMLElement) => {\n        if (element.classList.contains(\"jkl-button--pressed\")) {\n            element.classList.remove(\"jkl-button--pressed\");\n            element.style.removeProperty(\"--jkl-touch-xcoord\");\n            element.style.removeProperty(\"--jkl-touch-ycoord\");\n        }\n    };\n\n    const handleTouch = useCallback((event: TouchEvent<HTMLButtonElement>) => {\n        const target = event.target as HTMLButtonElement;\n\n        if (target && !target.disabled && event.targetTouches.length) {\n            const Xcoord =\n                event.targetTouches[0].clientX -\n                target.getBoundingClientRect().x;\n            const Ycoord =\n                event.targetTouches[0].clientY -\n                target.getBoundingClientRect().y;\n            target.style.setProperty(\n                \"--jkl-touch-xcoord\",\n                Xcoord.toFixed(1) + \"px\",\n            );\n            target.style.setProperty(\n                \"--jkl-touch-ycoord\",\n                Ycoord.toFixed(1) + \"px\",\n            );\n            target.classList.add(\"jkl-button--pressed\");\n        }\n    }, []);\n\n    const ariaLive = useAriaLiveRegion(loader?.showLoader);\n    const showLoader = Boolean(children) && Boolean(loader?.showLoader);\n\n    return (\n        <Component\n            {...ariaLive}\n            data-loading={showLoader}\n            data-density={density}\n            className={cn(\"jkl-button\", \"jkl-button--\" + variant, className)}\n            disabled={as === \"button\" ? loader?.showLoader : undefined}\n            onTouchStart={(event) => {\n                onTouchStart?.(event);\n                handleTouch(event);\n            }}\n            onAnimationEnd={(event) => {\n                onAnimationEnd?.(event);\n                removeButtonAnimation(event.target as HTMLElement);\n            }}\n            {...rest}\n            ref={ref}\n        >\n            <div className=\"jkl-button__label\">\n                {iconLeft && iconLeft}\n                {icon && iconPosition === \"left\" && icon}\n                {children && (\n                    <span className=\"jkl-button__text\">{children}</span>\n                )}\n                {iconRight && iconRight}\n                {icon && iconPosition === \"right\" && icon}\n            </div>\n\n            {children && (\n                <Loader\n                    className=\"jkl-button__loader\"\n                    variant=\"medium\"\n                    textDescription={\n                        loader?.textDescription || \"Vennligst vent\"\n                    }\n                    aria-hidden={!loader?.showLoader}\n                />\n            )}\n        </Component>\n    );\n}) as ButtonComponent;\n\nexport function PrimaryButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"primary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function SecondaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"secondary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function TertiaryButton<\n    ElementType extends React.ElementType = \"button\",\n>(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"tertiary\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function GhostButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"loader\">,\n) {\n    const buttonProps = {\n        ...props,\n        variant: \"ghost\",\n    } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n"],"names":["Button","React","forwardRef","props","ref","as","children","className","density","onTouchStart","onAnimationEnd","loader","icon","iconPosition","iconLeft","iconRight","variant","rest","Component","process","env","NODE_ENV","Children","count","title","console","warn","removeButtonAnimation","handleTouch","useCallback","event","target","disabled","targetTouches","length","Xcoord","clientX","getBoundingClientRect","x","Ycoord","clientY","y","style","setProperty","toFixed","classList","add","ariaLive","useAriaLiveRegion","showLoader","jsxs","cn","element","contains","remove","removeProperty","jsx","Loader","textDescription","PrimaryButton","buttonProps","SecondaryButton","TertiaryButton","GhostButton"],"mappings":"2QAWO,MAAMA,EAASC,EAAMC,YAAW,SAErCC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,SACLC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,aAAAA,EACAC,eAAAA,EACAC,OAAAA,EACAC,KAAAA,EACAC,aAAAA,EAAe,OACfC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,eACPC,GACHd,EAEEe,EAAYb,EAGW,eAAzBc,QAAQC,IAAIC,UACuB,IAAnCpB,EAAMqB,SAASC,MAAMjB,KACpBH,EAAM,gBACNA,EAAM,qBACNA,EAAMqB,OAECC,QAAAC,KACJ,2HAIFC,MAQAC,EAAcC,GAAaC,IAC7B,MAAMC,EAASD,EAAMC,OAErB,GAAIA,IAAWA,EAAOC,UAAYF,EAAMG,cAAcC,OAAQ,CACpD,MAAAC,EACFL,EAAMG,cAAc,GAAGG,QACvBL,EAAOM,wBAAwBC,EAC7BC,EACFT,EAAMG,cAAc,GAAGO,QACvBT,EAAOM,wBAAwBI,EACnCV,EAAOW,MAAMC,YACT,qBACAR,EAAOS,QAAQ,GAAK,MAExBb,EAAOW,MAAMC,YACT,qBACAJ,EAAOK,QAAQ,GAAK,MAEjBb,EAAAc,UAAUC,IAAI,sBACzB,IACD,IAEGC,EAAWC,EAAkB,MAAArC,OAAA,EAAAA,EAAQsC,YACrCA,IAAqB3C,KAAqB,MAAAK,IAAAA,EAAQsC,YAGpD,OAAAC,EAAChC,EAAA,IACO6B,EACJ,eAAcE,EACd,eAAczC,EACdD,UAAW4C,EAAG,aAAc,eAAiBnC,EAAST,GACtDyB,SAAiB,WAAP3B,EAAkB,MAAAM,OAAA,EAAAA,EAAQsC,gBAAa,EACjDxC,aAAeqB,IACX,MAAArB,GAAAA,EAAeqB,GACfF,EAAYE,EAAK,EAErBpB,eAAiBoB,IACb,MAAApB,GAAAA,EAAiBoB,GA7CC,CAACsB,IACvBA,EAAQP,UAAUQ,SAAS,yBACnBD,EAAAP,UAAUS,OAAO,uBACjBF,EAAAV,MAAMa,eAAe,sBACrBH,EAAAV,MAAMa,eAAe,sBAAoB,EA0C7C5B,CAAsBG,EAAMC,OAAqB,KAEjDd,EACJb,IAAAA,EAEAE,SAAA,CAAC4C,EAAA,MAAA,CAAI3C,UAAU,oBACVD,SAAA,CAAYQ,GAAAA,EACZF,GAAyB,SAAjBC,GAA2BD,EACnCN,GACGkD,EAAC,OAAK,CAAAjD,UAAU,mBAAoBD,SAAAA,IAEvCS,GAAaA,EACbH,GAAyB,UAAjBC,GAA4BD,KAGxCN,GACGkD,EAACC,EAAA,CACGlD,UAAU,qBACVS,QAAQ,SACR0C,iBACI,MAAA/C,OAAAA,EAAAA,EAAQ+C,kBAAmB,iBAE/B,gBAAc,MAAA/C,GAAAA,EAAQsC,gBAK1C,IAEO,SAASU,EACZxD,GAGA,MAAMyD,EAAc,IACbzD,EACHa,QAAS,WAEN,OAAAwC,EAACxD,EAAQ,IAAG4D,GACvB,CAEO,SAASC,EAGZ1D,GAGA,MAAMyD,EAAc,IACbzD,EACHa,QAAS,aAEN,OAAAwC,EAACxD,EAAQ,IAAG4D,GACvB,CAEO,SAASE,EAGZ3D,GAGA,MAAMyD,EAAc,IACbzD,EACHa,QAAS,YAEN,OAAAwC,EAACxD,EAAQ,IAAG4D,GACvB,CAEO,SAASG,EACZ5D,GAEA,MAAMyD,EAAc,IACbzD,EACHa,QAAS,SAEN,OAAAwC,EAACxD,EAAQ,IAAG4D,GACvB"}

package/build/es/components/file-input/File.js

@@ -1,2 +1,2 @@
-import{jsxs as o,jsx as i}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{useId as c}from"react";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import{SuccessIcon as s}from"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import{TrashCanIcon as r}from"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{IconButton as e}from"../icon-button/IconButton.js";import{SupportLabel as t}from"../input-group/SupportLabel.js";import{formatBytes as l}from"../../utilities/formatters/bytes/formatBytes.js";import{useFileInputContext as a}from"./internal/fileInputContext.js";import{Thumbnail as m}from"./internal/Thumbnail.js";const p=p=>{const{children:j,fileName:I,fileType:f,fileSize:u,path:d,file:h,supportLabel:b,supportLabelType:_,state:k,onRemove:w}=p,C=`jkl-file-preview-${c()}`,v=C+"-support",N=a(),T="error"===_||"warning"===_,g="success"===_,y=o("div",{id:C,className:"jkl-file",children:[o(d?"a":"div",{className:n("jkl-file__content",{"jkl-file__content--error":"error"===_,"jkl-file__content--warning":"warning"===_}),href:d,target:d?"_blank":void 0,children:[i(m,{fileName:I,fileType:f,file:h,path:d,state:k,children:j}),o("div",{children:[i("p",{className:"jkl-file__name",children:I}),o("p",{className:"jkl-file__description",children:[i("span",{children:l(u)}),T||g?g?i(s,{variant:"small","aria-label":"Filen ble lastet opp uten feil"}):null:i(t,{className:"jkl-file__support-label jkl-body",id:v,label:b,labelType:_})]}),b&&T&&i(t,{className:"jkl-file__support-label",id:v,label:b,labelType:_})]})]}),w&&i(e,{className:"jkl-file__delete",onClick:w,title:`Fjern ${I}`,children:i(r,{})})]});return N?i("li",{children:y}):y};export{p as File};
+import{jsxs as o,jsx as i}from"react/jsx-runtime";import{c as n}from"../../../clsx-BeLtu-UY.js";import{useId as c}from"react";import"../icon/Icon.js";import"../icon/icons/animated/ArrowVerticalAnimated.js";import"../icon/icons/animated/ArrowHorizontalAnimated.js";import"../icon/icons/animated/PlusRemoveAnimated.js";import"../icon/icons/ArrowDownIcon.js";import"../icon/icons/ArrowLeftIcon.js";import"../icon/icons/ArrowNorthEastIcon.js";import"../icon/icons/ArrowRightIcon.js";import"../icon/icons/ArrowUpIcon.js";import"../icon/icons/CalendarIcon.js";import"../icon/icons/CheckIcon.js";import"../icon/icons/ChevronDownIcon.js";import"../icon/icons/ChevronLeftIcon.js";import"../icon/icons/ChevronRightIcon.js";import"../icon/icons/ChevronUpIcon.js";import"../icon/icons/CloseIcon.js";import"../icon/icons/CopyIcon.js";import"../icon/icons/DotsIcon.js";import"../icon/icons/DragIcon.js";import"../icon/icons/ErrorIcon.js";import"../icon/icons/GreenCheckIcon.js";import"../icon/icons/HamburgerIcon.js";import"../icon/icons/InfoIcon.js";import"../icon/icons/LinkIcon.js";import"../icon/icons/MinusIcon.js";import"../icon/icons/OpenInNewIcon.js";import"../icon/icons/PenIcon.js";import"../icon/icons/PlusIcon.js";import"../icon/icons/QuestionIcon.js";import"../icon/icons/RedCrossIcon.js";import"../icon/icons/SearchIcon.js";import{SuccessIcon as s}from"../icon/icons/SuccessIcon.js";import"../icon/icons/ThumbDownIcon.js";import"../icon/icons/ThumbUpIcon.js";import{TrashCanIcon as r}from"../icon/icons/TrashCanIcon.js";import"../icon/icons/WarningIcon.js";import{IconButton as e}from"../icon-button/IconButton.js";import{SupportLabel as t}from"../input-group/SupportLabel.js";import{formatBytes as l}from"../../utilities/formatters/bytes/formatBytes.js";import{useFileInputContext as a}from"./internal/fileInputContext.js";import{Thumbnail as m}from"./internal/Thumbnail.js";const p=p=>{const{children:j,className:I,fileName:f,fileType:u,fileSize:d,path:h,file:b,supportLabel:_,supportLabelType:k,state:w,onRemove:C,...v}=p,N=`jkl-file-preview-${c()}`,T=N+"-support",g=a(),y=h?"a":"div",A="error"===k||"warning"===k,x="success"===k,L=o("div",{id:N,className:n(I,"jkl-file"),...v,children:[o(y,{className:n("jkl-file__content",{"jkl-file__content--error":"error"===k,"jkl-file__content--warning":"warning"===k}),href:h,target:h?"_blank":void 0,children:[i(m,{fileName:f,fileType:u,file:b,path:h,state:w,children:j}),o("div",{children:[i("p",{className:"jkl-file__name",children:f}),o("p",{className:"jkl-file__description",children:[i("span",{children:l(d)}),A||x?x?i(s,{variant:"small","aria-label":"Filen ble lastet opp uten feil"}):null:i(t,{className:"jkl-file__support-label jkl-body",id:T,label:_,labelType:k})]}),_&&A&&i(t,{className:"jkl-file__support-label",id:T,label:_,labelType:k})]})]}),C&&i(e,{className:"jkl-file__delete",onClick:C,title:`Fjern ${f}`,children:i(r,{})})]});return g?i("li",{children:L}):L};export{p as File};
 //# sourceMappingURL=File.js.map

package/build/es/components/file-input/File.js.map

@@ -1 +1 @@
-{"version":3,"file":"File.js","sources":["../../../../src/components/file-input/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type ComponentProps,\n    type FC,\n    type MouseEvent,\n    useId,\n} from \"react\";\nimport { TrashCanIcon, SuccessIcon } from \"../../components/icon/index.js\";\nimport { IconButton } from \"../../components/icon-button/IconButton.js\";\nimport { SupportLabel } from \"../../components/input-group/SupportLabel.js\";\nimport { formatBytes } from \"../../utilities/formatters/bytes/formatBytes.js\";\nimport { useFileInputContext } from \"./internal/fileInputContext.js\";\nimport { Thumbnail } from \"./internal/Thumbnail.js\";\nimport type { FileInputFileState } from \"./types.js\";\n\nexport type FileProps = {\n    fileName: string;\n    fileType: string;\n    fileSize: number;\n    path?: string;\n    file?: File;\n    supportLabel?: string;\n    supportLabelType?: \"help\" | \"error\" | \"warning\" | \"success\";\n    state?: FileInputFileState;\n    onRemove?: (e: MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n    const {\n        children,\n        fileName,\n        fileType,\n        fileSize,\n        path,\n        file,\n        supportLabel,\n        supportLabelType,\n        state,\n        onRemove,\n    } = props;\n\n    const id = `jkl-file-preview-${useId()}`;\n    const supportId = id + \"-support\";\n\n    const context = useFileInputContext();\n\n    const Component = path ? \"a\" : \"div\";\n\n    const hasErrorOrWarning =\n        supportLabelType === \"error\" || supportLabelType === \"warning\";\n    const hasSuccess = supportLabelType === \"success\";\n\n    const renderFeedbackElement = () => {\n        if (!hasErrorOrWarning && !hasSuccess) {\n            return (\n                <SupportLabel\n                    className=\"jkl-file__support-label jkl-body\"\n                    id={supportId}\n                    label={supportLabel}\n                    labelType={supportLabelType}\n                />\n            );\n        }\n\n        if (hasSuccess)\n            return (\n                <SuccessIcon\n                    variant=\"small\"\n                    aria-label=\"Filen ble lastet opp uten feil\"\n                />\n            );\n\n        return null;\n    };\n\n    const fileComponent = (\n        <div id={id} className=\"jkl-file\">\n            <Component\n                className={clsx(\"jkl-file__content\", {\n                    \"jkl-file__content--error\": supportLabelType === \"error\",\n                    \"jkl-file__content--warning\":\n                        supportLabelType === \"warning\",\n                })}\n                href={path}\n                target={path ? \"_blank\" : undefined}\n            >\n                <Thumbnail\n                    fileName={fileName}\n                    fileType={fileType}\n                    file={file}\n                    path={path}\n                    state={state}\n                >\n                    {children}\n                </Thumbnail>\n                <div>\n                    <p className=\"jkl-file__name\">{fileName}</p>\n                    <p className=\"jkl-file__description\">\n                        <span>{formatBytes(fileSize)}</span>\n                        {renderFeedbackElement()}\n                    </p>\n                    {supportLabel && hasErrorOrWarning && (\n                        <SupportLabel\n                            className=\"jkl-file__support-label\"\n                            id={supportId}\n                            label={supportLabel}\n                            labelType={supportLabelType}\n                        />\n                    )}\n                </div>\n            </Component>\n            {onRemove && (\n                <IconButton\n                    className=\"jkl-file__delete\"\n                    onClick={onRemove}\n                    title={`Fjern ${fileName}`}\n                >\n                    <TrashCanIcon />\n                </IconButton>\n            )}\n        </div>\n    );\n\n    return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["File","props","children","fileName","fileType","fileSize","path","file","supportLabel","supportLabelType","state","onRemove","id","useId","supportId","context","useFileInputContext","hasErrorOrWarning","hasSuccess","fileComponent","jsxs","className","clsx","href","target","jsx","Thumbnail","formatBytes","SuccessIcon","variant","SupportLabel","label","labelType","IconButton","onClick","title","TrashCanIcon"],"mappings":"o1DA2Ba,MAAAA,EAA+CC,IAClD,MACFC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,aAAAA,EACAC,iBAAAA,EACAC,MAAAA,EACAC,SAAAA,GACAV,EAEEW,EAAK,oBAAoBC,MACzBC,EAAYF,EAAK,WAEjBG,EAAUC,IAIVC,EACmB,UAArBR,GAAqD,YAArBA,EAC9BS,EAAkC,YAArBT,EAyBbU,EACFC,EAAC,MAAI,CAAAR,GAAAA,EAAQS,UAAU,WACnBnB,SAAA,CAAAkB,EA/BUd,EAAO,IAAM,MA+BtB,CACGe,UAAWC,EAAK,oBAAqB,CACjC,2BAAiD,UAArBb,EAC5B,6BACyB,YAArBA,IAERc,KAAMjB,EACNkB,OAAQlB,EAAO,cAAW,EAE1BJ,SAAA,CAAAuB,EAACC,EAAA,CACGvB,SAAAA,EACAC,SAAAA,EACAG,KAAAA,EACAD,KAAAA,EACAI,MAAAA,EAECR,SAAAA,MAEJ,MACG,CAAAA,SAAA,CAACuB,EAAA,IAAA,CAAEJ,UAAU,iBAAkBnB,SAASC,IACxCiB,EAAC,IAAE,CAAAC,UAAU,wBACTnB,SAAA,CAACuB,EAAA,OAAA,CAAMvB,SAAYyB,EAAAtB,KA7C9BY,GAAsBC,EAWvBA,EAEIO,EAACG,EAAA,CACGC,QAAQ,QACR,aAAW,mCAIhB,KAjBCJ,EAACK,EAAA,CACGT,UAAU,mCACVT,GAAIE,EACJiB,MAAOvB,EACPwB,UAAWvB,OA0CVD,GAAgBS,GACbQ,EAACK,EAAA,CACGT,UAAU,0BACVT,GAAIE,EACJiB,MAAOvB,EACPwB,UAAWvB,UAK1BE,GACGc,EAACQ,EAAA,CACGZ,UAAU,mBACVa,QAASvB,EACTwB,MAAO,SAAShC,IAEhBD,WAACkC,EAAa,SAMvBrB,OAAAA,EAAUU,EAAC,KAAI,CAAAvB,SAAAiB,IAAsBA,CAAAA"}
+{"version":3,"file":"File.js","sources":["../../../../src/components/file-input/File.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    type ComponentProps,\n    type FC,\n    type MouseEvent,\n    useId,\n} from \"react\";\nimport { TrashCanIcon, SuccessIcon } from \"../../components/icon/index.js\";\nimport { IconButton } from \"../../components/icon-button/IconButton.js\";\nimport { SupportLabel } from \"../../components/input-group/SupportLabel.js\";\nimport { formatBytes } from \"../../utilities/formatters/bytes/formatBytes.js\";\nimport { useFileInputContext } from \"./internal/fileInputContext.js\";\nimport { Thumbnail } from \"./internal/Thumbnail.js\";\nimport type { FileInputFileState } from \"./types.js\";\n\nexport type FileProps = {\n    fileName: string;\n    fileType: string;\n    fileSize: number;\n    path?: string;\n    file?: File;\n    supportLabel?: string;\n    supportLabelType?: \"help\" | \"error\" | \"warning\" | \"success\";\n    state?: FileInputFileState;\n    onRemove?: (e: MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const File: FC<FileProps & ComponentProps<\"div\">> = (props) => {\n    const {\n        children,\n        className,\n        fileName,\n        fileType,\n        fileSize,\n        path,\n        file,\n        supportLabel,\n        supportLabelType,\n        state,\n        onRemove,\n        ...rest\n    } = props;\n\n    const id = `jkl-file-preview-${useId()}`;\n    const supportId = id + \"-support\";\n\n    const context = useFileInputContext();\n\n    const Component = path ? \"a\" : \"div\";\n\n    const hasErrorOrWarning =\n        supportLabelType === \"error\" || supportLabelType === \"warning\";\n    const hasSuccess = supportLabelType === \"success\";\n\n    const renderFeedbackElement = () => {\n        if (!hasErrorOrWarning && !hasSuccess) {\n            return (\n                <SupportLabel\n                    className=\"jkl-file__support-label jkl-body\"\n                    id={supportId}\n                    label={supportLabel}\n                    labelType={supportLabelType}\n                />\n            );\n        }\n\n        if (hasSuccess)\n            return (\n                <SuccessIcon\n                    variant=\"small\"\n                    aria-label=\"Filen ble lastet opp uten feil\"\n                />\n            );\n\n        return null;\n    };\n\n    const fileComponent = (\n        <div id={id} className={clsx(className, \"jkl-file\")} {...rest}>\n            <Component\n                className={clsx(\"jkl-file__content\", {\n                    \"jkl-file__content--error\": supportLabelType === \"error\",\n                    \"jkl-file__content--warning\":\n                        supportLabelType === \"warning\",\n                })}\n                href={path}\n                target={path ? \"_blank\" : undefined}\n            >\n                <Thumbnail\n                    fileName={fileName}\n                    fileType={fileType}\n                    file={file}\n                    path={path}\n                    state={state}\n                >\n                    {children}\n                </Thumbnail>\n                <div>\n                    <p className=\"jkl-file__name\">{fileName}</p>\n                    <p className=\"jkl-file__description\">\n                        <span>{formatBytes(fileSize)}</span>\n                        {renderFeedbackElement()}\n                    </p>\n                    {supportLabel && hasErrorOrWarning && (\n                        <SupportLabel\n                            className=\"jkl-file__support-label\"\n                            id={supportId}\n                            label={supportLabel}\n                            labelType={supportLabelType}\n                        />\n                    )}\n                </div>\n            </Component>\n            {onRemove && (\n                <IconButton\n                    className=\"jkl-file__delete\"\n                    onClick={onRemove}\n                    title={`Fjern ${fileName}`}\n                >\n                    <TrashCanIcon />\n                </IconButton>\n            )}\n        </div>\n    );\n\n    return context ? <li>{fileComponent}</li> : fileComponent;\n};\n"],"names":["File","props","children","className","fileName","fileType","fileSize","path","file","supportLabel","supportLabelType","state","onRemove","rest","id","useId","supportId","context","useFileInputContext","Component","hasErrorOrWarning","hasSuccess","fileComponent","jsxs","clsx","href","target","jsx","Thumbnail","formatBytes","SuccessIcon","variant","SupportLabel","label","labelType","IconButton","onClick","title","TrashCanIcon"],"mappings":"o1DA2Ba,MAAAA,EAA+CC,IAClD,MACFC,SAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EACAC,KAAAA,EACAC,aAAAA,EACAC,iBAAAA,EACAC,MAAAA,EACAC,SAAAA,KACGC,GACHZ,EAEEa,EAAK,oBAAoBC,MACzBC,EAAYF,EAAK,WAEjBG,EAAUC,IAEVC,EAAYZ,EAAO,IAAM,MAEzBa,EACmB,UAArBV,GAAqD,YAArBA,EAC9BW,EAAkC,YAArBX,EAyBbY,EACDC,EAAA,MAAA,CAAIT,GAAAA,EAAQX,UAAWqB,EAAKrB,EAAW,eAAiBU,EACrDX,SAAA,CAAAqB,EAACJ,EAAA,CACGhB,UAAWqB,EAAK,oBAAqB,CACjC,2BAAiD,UAArBd,EAC5B,6BACyB,YAArBA,IAERe,KAAMlB,EACNmB,OAAQnB,EAAO,cAAW,EAE1BL,SAAA,CAAAyB,EAACC,EAAA,CACGxB,SAAAA,EACAC,SAAAA,EACAG,KAAAA,EACAD,KAAAA,EACAI,MAAAA,EAECT,SAAAA,MAEJ,MACG,CAAAA,SAAA,CAACyB,EAAA,IAAA,CAAExB,UAAU,iBAAkBD,SAASE,IACxCmB,EAAC,IAAE,CAAApB,UAAU,wBACTD,SAAA,CAACyB,EAAA,OAAA,CAAMzB,SAAY2B,EAAAvB,KA7C9Bc,GAAsBC,EAWvBA,EAEIM,EAACG,EAAA,CACGC,QAAQ,QACR,aAAW,mCAIhB,KAjBCJ,EAACK,EAAA,CACG7B,UAAU,mCACVW,GAAIE,EACJiB,MAAOxB,EACPyB,UAAWxB,OA0CVD,GAAgBW,GACbO,EAACK,EAAA,CACG7B,UAAU,0BACVW,GAAIE,EACJiB,MAAOxB,EACPyB,UAAWxB,UAK1BE,GACGe,EAACQ,EAAA,CACGhC,UAAU,mBACViC,QAASxB,EACTyB,MAAO,SAASjC,IAEhBF,WAACoC,EAAa,SAMvBrB,OAAAA,EAAUU,EAAC,KAAI,CAAAzB,SAAAoB,IAAsBA,CAAAA"}