@fremtind/jokul 0.24.1 → 0.25.0

package/build/cjs/components/ScreenReaderOnly.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime");exports.ScreenReaderOnly=({children:r,showOnFocus:s,...l})=>e.jsx("span",{...l,className:"jkl-sr-only"+(s?" jkl-sr-only--focusable":""),children:r});
+//# sourceMappingURL=ScreenReaderOnly.cjs.map

package/build/cjs/components/ScreenReaderOnly.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ScreenReaderOnly.cjs","sources":["../../../src/components/ScreenReaderOnly.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { WithChildren } from \"../core/types.js\";\n\nexport interface ScreenReaderOnlyProps extends WithChildren {\n    showOnFocus?: boolean;\n}\n\nexport const ScreenReaderOnly: FC<ScreenReaderOnlyProps> = ({ children, showOnFocus, ...rest }) => (\n    <span {...rest} className={`jkl-sr-only${showOnFocus ? \" jkl-sr-only--focusable\" : \"\"}`}>\n        {children}\n    </span>\n);\n"],"names":["children","showOnFocus","rest","jsx","className"],"mappings":"8IAO2D,EAAGA,SAAAA,EAAUC,YAAAA,KAAgBC,KACpFC,EAAAA,IAAC,OAAM,IAAGD,EAAME,UAAW,eAAcH,EAAc,0BAA4B,IAC9ED,SAAAA"}

package/build/cjs/components/ScreenReaderOnly.d.cts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+import { WithChildren } from '../core/types.cjs;'
+export interface ScreenReaderOnlyProps extends WithChildren {
+    showOnFocus?: boolean;
+}
+export declare const ScreenReaderOnly: FC<ScreenReaderOnlyProps>;

package/build/cjs/components/accordion/Accordion.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../clsx-E3yX_9sL.cjs");exports.Accordion=({className:t,density:r,id:c,...o})=>e.jsx("section",{role:"group","data-testid":"jkl-accordion",className:s.clsx("jkl-accordion",t),"data-density":r,id:c,...o});
+//# sourceMappingURL=Accordion.cjs.map

package/build/cjs/components/accordion/Accordion.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.cjs","sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\n\nexport interface AccordionProps extends WithChildren {\n    className?: string;\n    density?: Density;\n    id?: string;\n}\n\nexport const Accordion: FC<AccordionProps> = ({ className, density, id, ...rest }) => {\n    return (\n        <section\n            role=\"group\"\n            data-testid=\"jkl-accordion\"\n            className={clsx(\"jkl-accordion\", className)}\n            data-density={density}\n            id={id}\n            {...rest}\n        />\n    );\n};\n"],"names":["className","density","id","rest","jsx","role","clsx"],"mappings":"+KAU6C,EAAGA,UAAAA,EAAWC,QAAAA,EAASC,GAAAA,KAAOC,KAEnEC,EAAAA,IAAC,UAAA,CACGC,KAAK,QACL,cAAY,gBACZL,UAAWM,EAAAA,KAAK,gBAAiBN,GACjC,eAAcC,EACdC,GAAAA,KACIC"}

package/build/cjs/components/accordion/Accordion.d.cts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { Density, WithChildren } from '../../core/types.cjs;'
+export interface AccordionProps extends WithChildren {
+    className?: string;
+    density?: Density;
+    id?: string;
+}
+export declare const Accordion: FC<AccordionProps>;

package/build/cjs/components/accordion/AccordionItem.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../../../clsx-E3yX_9sL.cjs"),i=require("react"),a=require("../../hooks/useAnimatedDetails/useAnimatedDetails.cjs"),r=require("../icon/icons/animated/ArrowVerticalAnimated.cjs");exports.AccordionItem=({children:c,title:s,className:n,startExpanded:o=!1,onClick:d,id:l,...m})=>{const[j,u]=i.useState(o),[k]=i.useState((()=>o)),{detailsRef:x,summaryRef:_,contentRef:p,onSummaryClick:h}=a.useAnimatedDetails({onOpenChange:(e,t)=>{u(e),d&&d(t,e)},isExpanded:k});return e.jsxs("details",{"data-testid":"jkl-accordion-item",...m,className:t.clsx("jkl-accordion-item",n),ref:x,id:l,children:[e.jsxs("summary",{"data-testid":"jkl-accordion-item__title",className:"jkl-accordion-item__title",onClick:h,ref:_,children:[s,e.jsx(r.ArrowVerticalAnimated,{variant:"inherit",className:"jkl-accordion-item__arrow",pointingDown:!j,bold:j})]}),e.jsx("div",{"data-testid":"jkl-accordion-item__content-wrapper",className:"jkl-accordion-item__content-wrapper",ref:p,children:e.jsx("div",{className:"jkl-accordion-item__content",children:c})})]})};
+//# sourceMappingURL=AccordionItem.cjs.map

package/build/cjs/components/accordion/AccordionItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionItem.cjs","sources":["../../../../src/components/accordion/AccordionItem.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC, useState } from \"react\";\nimport { WithChildren } from \"../../core/types.js\";\nimport { useAnimatedDetails } from \"../../hooks/useAnimatedDetails/useAnimatedDetails.js\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\n\nexport interface AccordionItemProps extends WithChildren {\n    title: string;\n    startExpanded?: boolean;\n    className?: string;\n    onClick?: (e: React.MouseEvent, isOpen: boolean) => void;\n    id?: string;\n}\n\nexport const AccordionItem: FC<AccordionItemProps> = ({\n    children,\n    title,\n    className,\n    startExpanded = false,\n    onClick,\n    id,\n    ...rest\n}) => {\n    const [isOpen, setIsOpen] = useState(startExpanded);\n    const [expandOnMount] = useState(() => startExpanded);\n\n    const { detailsRef, summaryRef, contentRef, onSummaryClick } = useAnimatedDetails({\n        onOpenChange: (open, e) => {\n            setIsOpen(open);\n            if (onClick) {\n                onClick(e, open);\n            }\n        },\n        isExpanded: expandOnMount,\n    });\n\n    return (\n        <details\n            data-testid=\"jkl-accordion-item\"\n            {...rest}\n            className={clsx(\"jkl-accordion-item\", className)}\n            ref={detailsRef}\n            id={id}\n        >\n            <summary\n                data-testid=\"jkl-accordion-item__title\"\n                className=\"jkl-accordion-item__title\"\n                onClick={onSummaryClick}\n                ref={summaryRef}\n            >\n                {title}\n                <ArrowVerticalAnimated\n                    variant=\"inherit\"\n                    className=\"jkl-accordion-item__arrow\"\n                    pointingDown={!isOpen}\n                    bold={isOpen}\n                />\n            </summary>\n            <div\n                data-testid=\"jkl-accordion-item__content-wrapper\"\n                className=\"jkl-accordion-item__content-wrapper\"\n                ref={contentRef}\n            >\n                <div className=\"jkl-accordion-item__content\">{children}</div>\n            </div>\n        </details>\n    );\n};\n"],"names":["children","title","className","startExpanded","onClick","id","rest","isOpen","setIsOpen","useState","expandOnMount","detailsRef","summaryRef","contentRef","onSummaryClick","useAnimatedDetails","onOpenChange","open","e","isExpanded","jsxs","clsx","ref","jsx","ArrowVerticalAnimated","variant","pointingDown","bold"],"mappings":"uUAcqD,EACjDA,SAAAA,EACAC,MAAAA,EACAC,UAAAA,EACAC,cAAAA,GAAgB,EAChBC,QAAAA,EACAC,GAAAA,KACGC,MAEH,MAAOC,EAAQC,GAAaC,WAASN,IAC9BO,GAAiBD,YAAS,IAAMN,KAE/BQ,WAAAA,EAAYC,WAAAA,EAAYC,WAAAA,EAAYC,eAAAA,GAAmBC,EAAAA,mBAAmB,CAC9EC,aAAc,CAACC,EAAMC,KACjBV,EAAUS,GACNb,GACAA,EAAQc,EAAGD,EAAI,EAGvBE,WAAYT,IAIZ,OAAAU,EAAAA,KAAC,UAAA,CACG,cAAY,wBACRd,EACJJ,UAAWmB,EAAAA,KAAK,qBAAsBnB,GACtCoB,IAAKX,EACLN,GAAAA,EAEAL,SAAA,CAAAoB,EAAAA,KAAC,UAAA,CACG,cAAY,4BACZlB,UAAU,4BACVE,QAASU,EACTQ,IAAKV,EAEJZ,SAAA,CAAAC,EACDsB,EAAAA,IAACC,EAAAA,sBAAA,CACGC,QAAQ,UACRvB,UAAU,4BACVwB,cAAenB,EACfoB,KAAMpB,OAGdgB,EAAAA,IAAC,MAAA,CACG,cAAY,sCACZrB,UAAU,sCACVoB,IAAKT,EAELb,SAACuB,EAAAA,IAAA,MAAA,CAAIrB,UAAU,8BAA+BF,SAAAA,QAClD"}

package/build/cjs/components/accordion/AccordionItem.d.cts

@@ -0,0 +1,10 @@
+import { default as React, FC } from 'react';
+import { WithChildren } from '../../core/types.cjs;'
+export interface AccordionItemProps extends WithChildren {
+    title: string;
+    startExpanded?: boolean;
+    className?: string;
+    onClick?: (e: React.MouseEvent, isOpen: boolean) => void;
+    id?: string;
+}
+export declare const AccordionItem: FC<AccordionItemProps>;

package/build/cjs/components/accordion/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./Accordion.cjs"),c=require("./AccordionItem.cjs");exports.Accordion=o.Accordion,exports.AccordionItem=c.AccordionItem;
+//# sourceMappingURL=index.cjs.map

package/build/cjs/components/accordion/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/cjs/components/accordion/index.d.cts

@@ -0,0 +1,2 @@
+export { Accordion, type AccordionProps } from './Accordion.cjs;'
+export { AccordionItem, type AccordionItemProps } from './AccordionItem.cjs;'

package/build/cjs/components/breadcrumb/Breadcrumb.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),a=require("react");exports.Breadcrumb=({className:s,children:t,density:l,...n})=>{const c=a.Children.count(t);return e.jsx("nav",{"aria-label":"Sti",className:r.clsx("jkl-breadcrumb",s),"data-layout-density":l,...n,children:e.jsx("ol",{className:"jkl-breadcrumb__list",children:a.Children.map(t,((r,s)=>{const t=s+1===c;return e.jsxs(e.Fragment,{children:[a.isValidElement(r)?a.cloneElement(r,{isLastElement:t}):r,!t&&e.jsx("span",{className:"jkl-breadcrumb__item-separator","aria-hidden":"true",children:"›"})]})}))})})};
+//# sourceMappingURL=Breadcrumb.cjs.map

package/build/cjs/components/breadcrumb/Breadcrumb.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Breadcrumb.cjs","sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { BreadcrumbItemProps } from \"./BreadcrumbItem.js\";\n\nexport interface BreadcrumbProps extends WithChildren {\n    className?: string;\n    density?: Density;\n}\n\nexport const Breadcrumb = ({ className, children, density, ...rest }: BreadcrumbProps): JSX.Element => {\n    const numberOfChildren = React.Children.count(children);\n    return (\n        <nav aria-label=\"Sti\" className={clsx(\"jkl-breadcrumb\", className)} data-layout-density={density} {...rest}>\n            <ol className=\"jkl-breadcrumb__list\">\n                {React.Children.map(children, (child, index) => {\n                    const isLastElement = index + 1 === numberOfChildren;\n                    return (\n                        <>\n                            {React.isValidElement<BreadcrumbItemProps>(child)\n                                ? React.cloneElement<BreadcrumbItemProps>(child, {\n                                      isLastElement,\n                                  })\n                                : child}\n                            {!isLastElement && (\n                                <span className=\"jkl-breadcrumb__item-separator\" aria-hidden=\"true\">\n                                    ›\n                                </span>\n                            )}\n                        </>\n                    );\n                })}\n            </ol>\n        </nav>\n    );\n};\n"],"names":["className","children","density","rest","numberOfChildren","React","Children","count","jsx","clsx","map","child","index","isLastElement","jsxs","Fragment","isValidElement","cloneElement"],"mappings":"mMAU0B,EAAGA,UAAAA,EAAWC,SAAAA,EAAUC,QAAAA,KAAYC,MAC1D,MAAMC,EAAmBC,EAAMC,SAASC,MAAMN,GAE1C,OAAAO,MAAC,OAAI,aAAW,MAAMR,UAAWS,EAAKA,KAAA,iBAAkBT,GAAY,sBAAqBE,KAAaC,EAClGF,SAAAO,EAAAA,IAAC,KAAG,CAAAR,UAAU,uBACTC,SAAAI,EAAMC,SAASI,IAAIT,GAAU,CAACU,EAAOC,KAC5B,MAAAC,EAAgBD,EAAQ,IAAMR,EACpC,OAESU,EAAAA,KAAAC,WAAA,CAAAd,SAAA,CAAAI,EAAMW,eAAoCL,GACrCN,EAAMY,aAAkCN,EAAO,CAC3CE,cAAAA,IAEJF,GACJE,GACGL,EAAAA,IAAA,OAAA,CAAKR,UAAU,iCAAiC,cAAY,OAAOC,SAEpE,QAER,OAIhB"}

package/build/cjs/components/breadcrumb/Breadcrumb.d.cts

@@ -0,0 +1,6 @@
+import { Density, WithChildren } from '../../core/types.cjs;'
+export interface BreadcrumbProps extends WithChildren {
+    className?: string;
+    density?: Density;
+}
+export declare const Breadcrumb: ({ className, children, density, ...rest }: BreadcrumbProps) => JSX.Element;

package/build/cjs/components/breadcrumb/BreadcrumbItem.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),l=require("react");exports.BreadcrumbItem=({className:s,children:t,isLastElement:a,...i})=>e.jsx("li",{className:r.clsx("jkl-breadcrumb__item",s),...i,children:l.Children.map(t,(e=>l.isValidElement(e)?l.cloneElement(e,{"aria-current":a?"page":void 0,className:"jkl-link"}):e))});
+//# sourceMappingURL=BreadcrumbItem.cjs.map

package/build/cjs/components/breadcrumb/BreadcrumbItem.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"BreadcrumbItem.cjs","sources":["../../../../src/components/breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AnchorHTMLAttributes } from \"react\";\nimport { WithChildren } from \"../../core/types.js\";\n\nexport interface BreadcrumbItemProps extends WithChildren {\n    className?: string;\n    /**\n     * Settes automatisk av Breadcrumb\n     * @default false\n     */\n    isLastElement?: boolean;\n}\n\nexport const BreadcrumbItem = ({ className, children, isLastElement, ...rest }: BreadcrumbItemProps): JSX.Element => {\n    return (\n        <li className={clsx(\"jkl-breadcrumb__item\", className)} {...rest}>\n            {React.Children.map(children, (child) => {\n                if (React.isValidElement<AnchorHTMLAttributes<HTMLAnchorElement>>(child)) {\n                    return React.cloneElement<AnchorHTMLAttributes<HTMLAnchorElement>>(child, {\n                        \"aria-current\": isLastElement ? \"page\" : undefined,\n                        className: \"jkl-link\",\n                    });\n                } else {\n                    return child;\n                }\n            })}\n        </li>\n    );\n};\n"],"names":["className","children","isLastElement","rest","jsx","clsx","React","Children","map","child","isValidElement","cloneElement"],"mappings":"uMAa8B,EAAGA,UAAAA,EAAWC,SAAAA,EAAUC,cAAAA,KAAkBC,KAE/DC,EAAAA,IAAA,KAAA,CAAGJ,UAAWK,EAAAA,KAAK,uBAAwBL,MAAgBG,EACvDF,SAAMK,EAAAC,SAASC,IAAIP,GAAWQ,GACvBH,EAAMI,eAAwDD,GACvDH,EAAMK,aAAsDF,EAAO,CACtE,eAAgBP,EAAgB,YAAS,EACzCF,UAAW,aAGRS"}

package/build/cjs/components/breadcrumb/BreadcrumbItem.d.cts

@@ -0,0 +1,10 @@
+import { WithChildren } from '../../core/types.cjs;'
+export interface BreadcrumbItemProps extends WithChildren {
+    className?: string;
+    /**
+     * Settes automatisk av Breadcrumb
+     * @default false
+     */
+    isLastElement?: boolean;
+}
+export declare const BreadcrumbItem: ({ className, children, isLastElement, ...rest }: BreadcrumbItemProps) => JSX.Element;

package/build/cjs/components/breadcrumb/index.cjs

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

package/build/cjs/components/breadcrumb/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/cjs/components/breadcrumb/index.d.cts

@@ -0,0 +1,4 @@
+export type { BreadcrumbProps } from './Breadcrumb.cjs;'
+export { Breadcrumb } from './Breadcrumb.cjs;'
+export type { BreadcrumbItemProps } from './BreadcrumbItem.cjs;'
+export { BreadcrumbItem } from './BreadcrumbItem.cjs;'

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

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=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:c,className:l,density:u,onTouchStart:d,loader:x,icon:h,iconPosition:j="left",iconLeft:y,iconRight:g,variant:p="secondary",...v}=s,b=a,m=o.useCallback((t=>{d&&d(t);const e=t.target;if(e&&!e.disabled&&t.targetTouches.length){const o=t.targetTouches[0].clientX-e.getBoundingClientRect().x,r=t.targetTouches[0].clientY-e.getBoundingClientRect().y;e.style.setProperty("--jkl-touch-xcoord",o.toPrecision(4)+"px"),e.style.setProperty("--jkl-touch-ycoord",r.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)}}),[d]),f=r.useAriaLiveRegion(null==x?void 0:x.showLoader),k=!!c&&!(null==x||!x.showLoader);return t.jsxs(b,{...f,"data-loading":k,"data-density":u,className:e.clsx("jkl-button","jkl-button--"+p,l),disabled:"button"===a?null==x?void 0:x.showLoader:void 0,onTouchStart:m,...v,ref:i,children:[t.jsxs("div",{className:"jkl-button__label",children:[y&&y,h&&"left"===j&&h,c&&t.jsx("span",{className:"jkl-button__text",children:c}),g&&g,h&&"right"===j&&h]}),c&&t.jsx(n.Loader,{className:"jkl-button__loader",variant:"medium",textDescription:(null==x?void 0:x.textDescription)||"Vennligst vent","aria-hidden":!(null!=x&&x.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

@@ -0,0 +1 @@
+{"version":3,"file":"Button.cjs","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import cn from \"clsx\";\nimport React, { ButtonHTMLAttributes, type TouchEvent, useCallback } 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<ElementType extends React.ElementType = \"button\">(\n    props: ButtonProps<ElementType>,\n    ref?: PolymorphicRef<ElementType>,\n) {\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    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 = event.targetTouches[0].clientX - target.getBoundingClientRect().x;\n                const Ycoord = event.targetTouches[0].clientY - target.getBoundingClientRect().y;\n                target.style.setProperty(\"--jkl-touch-xcoord\", Xcoord.toPrecision(4) + \"px\");\n                target.style.setProperty(\"--jkl-touch-ycoord\", Ycoord.toPrecision(4) + \"px\");\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 && <span className=\"jkl-button__text\">{children}</span>}\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={loader?.textDescription || \"Vennligst vent\"}\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 = { ...props, variant: \"primary\" } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function SecondaryButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = { ...props, variant: \"secondary\" } as ButtonProps<ElementType>;\n    return <Button {...buttonProps} />;\n}\n\nexport function TertiaryButton<ElementType extends React.ElementType = \"button\">(\n    props: Omit<ButtonProps<ElementType>, \"variant\" | \"onClick\" | \"as\"> &\n        Pick<ButtonHTMLAttributes<HTMLButtonElement>, \"onClick\">,\n) {\n    const buttonProps = { ...props, variant: \"tertiary\" } 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 = { ...props, variant: \"ghost\" } 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","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":"mRAOaA,EAASC,EAAMC,YAAW,SACnCC,EACAC,GAEM,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,EAEZa,EAAcC,EAAAA,aACfC,IACGX,GAAgBA,EAAaW,GAE7B,MAAMC,EAASD,EAAMC,OACrB,GAAIA,IAAWA,EAAOC,UAAYF,EAAMG,cAAcC,OAAQ,CACpD,MAAAC,EAASL,EAAMG,cAAc,GAAGG,QAAUL,EAAOM,wBAAwBC,EACzEC,EAAST,EAAMG,cAAc,GAAGO,QAAUT,EAAOM,wBAAwBI,EAC/EV,EAAOW,MAAMC,YAAY,qBAAsBR,EAAOS,YAAY,GAAK,MACvEb,EAAOW,MAAMC,YAAY,qBAAsBJ,EAAOK,YAAY,GAAK,MAChEb,EAAAc,UAAUC,IAAI,uBAErBC,YAAW,KACAhB,EAAAc,UAAUG,OAAO,uBACjBjB,EAAAW,MAAMO,eAAe,sBACrBlB,EAAAW,MAAMO,eAAe,qBAAoB,GACjD,IACP,IAEJ,CAAC9B,IAGC+B,EAAWC,EAAAA,kBAAkB,MAAA/B,SAAAA,EAAQgC,YACrCA,IAAqBpC,KAAqB,MAAAI,IAAAA,EAAQgC,YAGpD,OAAAC,EAAAA,KAAC1B,EAAA,IACOuB,EACJ,eAAcE,EACd,eAAclC,EACdD,UAAWqC,EAAAA,KAAG,aAAc,eAAiB7B,EAASR,GACtDe,SAAiB,WAAPjB,EAAkB,MAAAK,OAAA,EAAAA,EAAQgC,gBAAa,EACjDjC,aAAcS,KACVF,EACJZ,IAAAA,EAEAE,SAAA,CAACqC,EAAAA,KAAA,MAAA,CAAIpC,UAAU,oBACVD,SAAA,CAAYO,GAAAA,EACZF,GAAyB,SAAjBC,GAA2BD,EACnCL,GAAYuC,EAAAA,IAAC,OAAK,CAAAtC,UAAU,mBAAoBD,SAAAA,IAChDQ,GAAaA,EACbH,GAAyB,UAAjBC,GAA4BD,KAGxCL,GACGuC,EAAAA,IAACC,EAAAA,OAAA,CACGvC,UAAU,qBACVQ,QAAQ,SACRgC,iBAAiB,MAAArC,SAAAA,EAAQqC,kBAAmB,iBAC5C,gBAAc,MAAArC,GAAAA,EAAQgC,gBAK1C,yCA0BO,SACHvC,GAEA,MAAM6C,EAAc,IAAK7C,EAAOY,QAAS,SAClC,OAAA8B,EAAAA,IAAC7C,EAAQ,IAAGgD,GACvB,wBA7BO,SACH7C,GAGA,MAAM6C,EAAc,IAAK7C,EAAOY,QAAS,WAClC,OAAA8B,EAAAA,IAAC7C,EAAQ,IAAGgD,GACvB,0BAEO,SACH7C,GAGA,MAAM6C,EAAc,IAAK7C,EAAOY,QAAS,aAClC,OAAA8B,EAAAA,IAAC7C,EAAQ,IAAGgD,GACvB,yBAEO,SACH7C,GAGA,MAAM6C,EAAc,IAAK7C,EAAOY,QAAS,YAClC,OAAA8B,EAAAA,IAAC7C,EAAQ,IAAGgD,GACvB"}

package/build/cjs/components/button/Button.d.cts

@@ -0,0 +1,7 @@
+import { default as React, ButtonHTMLAttributes } from 'react';
+import { ButtonComponent, ButtonProps } from './types.cjs;'
+export declare const Button: ButtonComponent;
+export declare function PrimaryButton<ElementType extends React.ElementType = "button">(props: Omit<ButtonProps<ElementType>, "variant" | "onClick" | "as"> & Pick<ButtonHTMLAttributes<HTMLButtonElement>, "onClick">): React.JSX.Element;
+export declare function SecondaryButton<ElementType extends React.ElementType = "button">(props: Omit<ButtonProps<ElementType>, "variant" | "onClick" | "as"> & Pick<ButtonHTMLAttributes<HTMLButtonElement>, "onClick">): React.JSX.Element;
+export declare function TertiaryButton<ElementType extends React.ElementType = "button">(props: Omit<ButtonProps<ElementType>, "variant" | "onClick" | "as"> & Pick<ButtonHTMLAttributes<HTMLButtonElement>, "onClick">): React.JSX.Element;
+export declare function GhostButton<ElementType extends React.ElementType = "button">(props: Omit<ButtonProps<ElementType>, "variant" | "loader">): React.JSX.Element;

package/build/cjs/components/button/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./Button.cjs");exports.Button=t.Button,exports.PrimaryButton=t.PrimaryButton,exports.SecondaryButton=t.SecondaryButton,exports.TertiaryButton=t.TertiaryButton;
+//# sourceMappingURL=index.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/cjs/components/button/index.d.cts

@@ -0,0 +1,2 @@
+export { Button, PrimaryButton, SecondaryButton, TertiaryButton } from './Button.cjs;'
+export type { ButtonProps, ButtonVariant } from './types.cjs;'

package/build/cjs/components/button/types.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.buttonVariants=["primary","secondary","tertiary","ghost"];
+//# sourceMappingURL=types.cjs.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.cjs","sources":["../../../../src/components/button/types.ts"],"sourcesContent":["import { Density } from \"../../core/types.js\";\nimport { PolymorphicPropsWithRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport const buttonVariants = [\"primary\", \"secondary\", \"tertiary\", \"ghost\"] as const;\nexport type ButtonVariant = (typeof buttonVariants)[number];\nexport type IconPosition = \"left\" | \"right\";\n\ntype IconOptions<T extends React.ElementType> =\n    // Hvis ikke knappen har ikon, MÅ den ha children:\n    | {\n          iconPosition?: never;\n          icon?: never;\n          children: React.ComponentPropsWithoutRef<T>[\"children\"];\n      }\n    | {\n          /**\n           * Plasseringen av ikonet\n           * @default \"left\"\n           */\n          iconPosition?: IconPosition;\n          /**\n           * Hvilket ikon som skal vises i knappen\n           */\n          icon: React.ReactElement;\n      };\n\nexport type ButtonProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<\n    ElementType,\n    {\n        density?: Density;\n        /**\n         * Hvilken variant av knappen skal vises\n         * @default \"secondary\"\n         */\n        variant?: ButtonVariant;\n        className?: string;\n        loader?: {\n            showLoader: boolean;\n            textDescription: string;\n        };\n        /**\n         * @deprecated Bruk `icon` i kombinasjon med `iconPosition=\"left\"`\n         */\n        iconLeft?: React.ReactNode;\n        /**\n         * @deprecated Bruk `icon` i kombinasjon med `iconPosition=\"right\"`\n         */\n        iconRight?: React.ReactNode;\n    } & IconOptions<ElementType>\n>;\n\nexport type ButtonComponent = <ElementType extends React.ElementType = \"button\">(\n    props: ButtonProps<ElementType>,\n) => React.ReactElement | null;\n"],"names":[],"mappings":"uGAG8B,CAAC,UAAW,YAAa,WAAY"}

package/build/cjs/components/button/types.d.cts

@@ -0,0 +1,43 @@
+import { Density } from '../../core/types.cjs;'
+import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.cjs;'
+export declare const buttonVariants: readonly ["primary", "secondary", "tertiary", "ghost"];
+export type ButtonVariant = (typeof buttonVariants)[number];
+export type IconPosition = "left" | "right";
+type IconOptions<T extends React.ElementType> = {
+    iconPosition?: never;
+    icon?: never;
+    children: React.ComponentPropsWithoutRef<T>["children"];
+} | {
+    /**
+     * Plasseringen av ikonet
+     * @default "left"
+     */
+    iconPosition?: IconPosition;
+    /**
+     * Hvilket ikon som skal vises i knappen
+     */
+    icon: React.ReactElement;
+};
+export type ButtonProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
+    density?: Density;
+    /**
+     * Hvilken variant av knappen skal vises
+     * @default "secondary"
+     */
+    variant?: ButtonVariant;
+    className?: string;
+    loader?: {
+        showLoader: boolean;
+        textDescription: string;
+    };
+    /**
+     * @deprecated Bruk `icon` i kombinasjon med `iconPosition="left"`
+     */
+    iconLeft?: React.ReactNode;
+    /**
+     * @deprecated Bruk `icon` i kombinasjon med `iconPosition="right"`
+     */
+    iconRight?: React.ReactNode;
+} & IconOptions<ElementType>>;
+export type ButtonComponent = <ElementType extends React.ElementType = "button">(props: ButtonProps<ElementType>) => React.ReactElement | null;
+export {};

package/build/cjs/components/card/Card.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),t=require("react"),a=require("../../utilities/polymorphism/SlotComponent.cjs"),s=t.forwardRef((function(t,s){const{className:i,clickable:l=!1,padding:o="s",variant:c="high",asChild:d,as:n="div",...u}=t,p=d?a.SlotComponent:n;return e.jsx(p,{"data-testid":"jkl-card","data-clickable":l,"data-padding":o,className:r.clsx("jkl-card",`jkl-card--${c}`,i),...u,ref:s})}));exports.CARD_PADDINGS=["s","m","l","xl"],exports.CARD_VARIANTS=["outlined","high","low"],exports.Card=s;
+//# sourceMappingURL=Card.cjs.map

package/build/cjs/components/card/Card.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card.cjs","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { AsChildProps } from \"../../utilities/polymorphism/as-child.js\";\nimport { SlotComponent } from \"../../utilities/polymorphism/index.js\";\nimport { PolymorphicPropsWithRef, PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport const CARD_PADDINGS = [\"s\", \"m\", \"l\", \"xl\"] as const;\nexport type CardPadding = (typeof CARD_PADDINGS)[number];\nexport const CARD_VARIANTS = [\"outlined\", \"high\", \"low\"] as const;\nexport type CardVariant = (typeof CARD_VARIANTS)[number];\n\nexport type CardProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<\n    ElementType,\n    {\n        className?: string;\n        /**\n         * Setter padding på kortet. Tilsvarer samme property i Figma.\n         * @default \"s\"\n         */\n        padding?: CardPadding;\n        /**\n         * Angir hvilken kortvariant du vil bruke. Velg en variant som gir god kontrast\n         * til bakgrunnen på siden, slik at det er enkelt å skille innholdet fra hverandre.\n         * @default \"high\"\n         */\n        variant?: CardVariant;\n        /**\n         * Angir om kortet visuelt skal fremstå som klikkbart. Du må selv rendre\n         * kortet som et klikkbart element (f.eks. `<a>` eller en `<Link>` fra\n         * et ruting-bibliotek) og gi det en `href` eller `onClick`-handler.\n         * HUSK: Sett aria-label for at støtteverktøy, som skjermlesere, ikke\n         * skal lese alt innholdet i kortet.\n         */\n        clickable?: boolean;\n    }\n>;\n\ntype CardComponent = <ElementType extends React.ElementType = \"div\">(\n    props: CardProps<ElementType> & AsChildProps,\n) => React.ReactElement | null;\n\n/**\n * En allsidig kortkomponent som brukes for å gruppere innhold på en side.\n * Komponenten rendres til vanlig som en `<div>`, men du kan velge å rendre\n * den som andre elementer eller komponenter der du trenger annen semantikk\n * eller funksjonalitet.\n */\nexport const Card = React.forwardRef(function Card<ElementType extends React.ElementType = \"div\">(\n    props: CardProps<ElementType>,\n    ref?: PolymorphicRef<ElementType>,\n) {\n    const {\n        className,\n        clickable = false,\n        padding = \"s\",\n        variant = \"high\",\n        asChild,\n        as = \"div\",\n        ...componentProps\n    } = props;\n\n    const Component = asChild ? SlotComponent : as;\n\n    return (\n        <Component\n            data-testid=\"jkl-card\"\n            data-clickable={clickable}\n            data-padding={padding}\n            className={clsx(\"jkl-card\", `jkl-card--${variant}`, className)}\n            {...componentProps}\n            ref={ref}\n        />\n    );\n}) as CardComponent;\n"],"names":["Card","React","forwardRef","props","ref","className","clickable","padding","variant","asChild","as","componentProps","Component","SlotComponent","jsx","clsx"],"mappings":"4OA+CaA,EAAOC,EAAMC,YAAW,SACjCC,EACAC,GAEM,MACFC,UAAAA,EACAC,UAAAA,GAAY,EACZC,QAAAA,EAAU,IACVC,QAAAA,EAAU,OACVC,QAAAA,EACAC,GAAAA,EAAK,SACFC,GACHR,EAEES,EAAYH,EAAUI,EAAgBA,cAAAH,EAGxC,OAAAI,EAAAA,IAACF,EAAA,CACG,cAAY,WACZ,iBAAgBN,EAChB,eAAcC,EACdF,UAAWU,EAAKA,KAAA,WAAY,aAAaP,IAAWH,MAChDM,EACJP,IAAAA,GAGZ,0BAnE6B,CAAC,IAAK,IAAK,IAAK,4BAEhB,CAAC,WAAY,OAAQ"}

package/build/cjs/components/card/Card.d.cts

@@ -0,0 +1,38 @@
+import { default as React } from 'react';
+import { AsChildProps } from '../../utilities/polymorphism/as-child.cjs;'
+import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.cjs;'
+export declare const CARD_PADDINGS: readonly ["s", "m", "l", "xl"];
+export type CardPadding = (typeof CARD_PADDINGS)[number];
+export declare const CARD_VARIANTS: readonly ["outlined", "high", "low"];
+export type CardVariant = (typeof CARD_VARIANTS)[number];
+export type CardProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
+    className?: string;
+    /**
+     * Setter padding på kortet. Tilsvarer samme property i Figma.
+     * @default "s"
+     */
+    padding?: CardPadding;
+    /**
+     * Angir hvilken kortvariant du vil bruke. Velg en variant som gir god kontrast
+     * til bakgrunnen på siden, slik at det er enkelt å skille innholdet fra hverandre.
+     * @default "high"
+     */
+    variant?: CardVariant;
+    /**
+     * Angir om kortet visuelt skal fremstå som klikkbart. Du må selv rendre
+     * kortet som et klikkbart element (f.eks. `<a>` eller en `<Link>` fra
+     * et ruting-bibliotek) og gi det en `href` eller `onClick`-handler.
+     * HUSK: Sett aria-label for at støtteverktøy, som skjermlesere, ikke
+     * skal lese alt innholdet i kortet.
+     */
+    clickable?: boolean;
+}>;
+type CardComponent = <ElementType extends React.ElementType = "div">(props: CardProps<ElementType> & AsChildProps) => React.ReactElement | null;
+/**
+ * En allsidig kortkomponent som brukes for å gruppere innhold på en side.
+ * Komponenten rendres til vanlig som en `<div>`, men du kan velge å rendre
+ * den som andre elementer eller komponenter der du trenger annen semantikk
+ * eller funksjonalitet.
+ */
+export declare const Card: CardComponent;
+export {};

package/build/cjs/components/card/CardImage.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../../../clsx-E3yX_9sL.cjs"),t=require("react"),s=require("../../utilities/polymorphism/SlotComponent.cjs"),o=t.forwardRef((function({as:t,asChild:o,className:a,placement:i="top",...c},l){const m=o?s.SlotComponent:t||"img";return e.jsx(m,{ref:l,className:r.clsx("jkl-card-image",`jkl-card-image--${i}`,a),...c})}));exports.CardImage=o;
+//# sourceMappingURL=CardImage.cjs.map

package/build/cjs/components/card/CardImage.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardImage.cjs","sources":["../../../../src/components/card/CardImage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { AsChildProps } from \"../../utilities/polymorphism/as-child.js\";\nimport { SlotComponent } from \"../../utilities/polymorphism/index.js\";\nimport { PolymorphicPropsWithRef, PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport type CardImageProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<\n    ElementType,\n    {\n        /**\n         * Legger til riktig negativ margin avhengig av hvor i kortet bildet\n         * skal plasseres. Margin justeres automatisk etter padding i kortet.\n         * @default \"top\"\n         */\n        placement?: \"top\" | \"middle\" | \"bottom\";\n    }\n>;\n\ntype CardImageComponent = <ElementType extends React.ElementType = \"img\">(\n    props: CardImageProps<ElementType>,\n) => React.ReactElement | null;\n\n/**\n * Bildekomponent som kan brukes i `Card` for å sørge for at bildet\n * blør helt ut i kantene av kortet. Rendres normalt som et `<img>`-\n * element, men du kan overstyre dette med `as` dersom du f.eks. har\n * en egen komponent for å håndtere responsive bilder.\n */\nexport const CardImage = React.forwardRef(function CardImage<ElementType extends React.ElementType = \"img\">(\n    { as, asChild, className, placement = \"top\", ...imageProps }: CardImageProps<ElementType> & AsChildProps,\n    ref?: PolymorphicRef<ElementType>,\n) {\n    const Component = asChild ? SlotComponent : as || \"img\";\n\n    return (\n        <Component\n            ref={ref}\n            className={clsx(\"jkl-card-image\", `jkl-card-image--${placement}`, className)}\n            {...imageProps}\n        />\n    );\n}) as CardImageComponent;\n"],"names":["CardImage","React","forwardRef","as","asChild","className","placement","imageProps","ref","Component","SlotComponent","jsx","clsx"],"mappings":"4OA4BaA,EAAYC,EAAMC,YAAW,UACpCC,GAAAA,EAAIC,QAAAA,EAASC,UAAAA,EAAWC,UAAAA,EAAY,SAAUC,GAChDC,GAEM,MAAAC,EAAYL,EAAUM,gBAAgBP,GAAM,MAG9C,OAAAQ,EAAAA,IAACF,EAAA,CACGD,IAAAA,EACAH,UAAWO,EAAKA,KAAA,iBAAkB,mBAAmBN,IAAaD,MAC9DE,GAGhB"}

package/build/cjs/components/card/CardImage.d.cts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.cjs;'
+export type CardImageProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
+    /**
+     * Legger til riktig negativ margin avhengig av hvor i kortet bildet
+     * skal plasseres. Margin justeres automatisk etter padding i kortet.
+     * @default "top"
+     */
+    placement?: "top" | "middle" | "bottom";
+}>;
+type CardImageComponent = <ElementType extends React.ElementType = "img">(props: CardImageProps<ElementType>) => React.ReactElement | null;
+/**
+ * Bildekomponent som kan brukes i `Card` for å sørge for at bildet
+ * blør helt ut i kantene av kortet. Rendres normalt som et `<img>`-
+ * element, men du kan overstyre dette med `as` dersom du f.eks. har
+ * en egen komponent for å håndtere responsive bilder.
+ */
+export declare const CardImage: CardImageComponent;
+export {};

package/build/cjs/components/card/InfoCard.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../clsx-E3yX_9sL.cjs"),r=require("./utils.cjs");exports.InfoCard=({title:t,children:i,density:l,className:c,padding:a="l",...d})=>e.jsx("div",{...d,className:s.clsx("jkl-info-card",c),"data-density":l,children:e.jsxs("div",{className:s.clsx("jkl-info-card__content-wrapper"),style:r.getPaddingStyles(a),children:[t&&e.jsx("p",{className:"jkl-info-card__title",children:t}),i]})});
+//# sourceMappingURL=InfoCard.cjs.map

package/build/cjs/components/card/InfoCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoCard.cjs","sources":["../../../../src/components/card/InfoCard.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { PaddingOptions, SpacingStep } from \"./types.js\";\nimport { getPaddingStyles } from \"./utils.js\";\n\nexport interface InfoCardProps extends PaddingOptions, WithChildren {\n    className?: string;\n    title?: string;\n    /**\n     * Legger til ekstra rom i bunnen av kortet, fra spacing-skalaen til Jøkul.\n     */\n    bottomPadding?: SpacingStep;\n    density?: Density;\n}\n\nexport const InfoCard: FC<InfoCardProps> = ({ title, children, density, className, padding = \"l\", ...rest }) => (\n    <div {...rest} className={clsx(\"jkl-info-card\", className)} data-density={density}>\n        <div className={clsx(\"jkl-info-card__content-wrapper\")} style={getPaddingStyles(padding)}>\n            {title && <p className=\"jkl-info-card__title\">{title}</p>}\n            {children}\n        </div>\n    </div>\n);\n"],"names":["title","children","density","className","padding","rest","jsx","clsx","jsxs","style","getPaddingStyles"],"mappings":"uMAgB2C,EAAGA,MAAAA,EAAOC,SAAAA,EAAUC,QAAAA,EAASC,UAAAA,EAAWC,QAAAA,EAAU,OAAQC,KACjGC,EAAAA,IAAC,UAAQD,EAAMF,UAAWI,EAAAA,KAAK,gBAAiBJ,GAAY,eAAcD,EACtED,SAACO,EAAAA,KAAA,MAAA,CAAIL,UAAWI,EAAAA,KAAK,kCAAmCE,MAAOC,EAAAA,iBAAiBN,GAC3EH,SAAA,CAAAD,GAAUM,EAAAA,IAAA,IAAA,CAAEH,UAAU,uBAAwBF,SAAMD,IACpDC"}

package/build/cjs/components/card/InfoCard.d.cts

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+import { Density, WithChildren } from '../../core/types.cjs;'
+import { PaddingOptions, SpacingStep } from './types.cjs;'
+export interface InfoCardProps extends PaddingOptions, WithChildren {
+    className?: string;
+    title?: string;
+    /**
+     * Legger til ekstra rom i bunnen av kortet, fra spacing-skalaen til Jøkul.
+     */
+    bottomPadding?: SpacingStep;
+    density?: Density;
+}
+export declare const InfoCard: FC<InfoCardProps>;

package/build/cjs/components/card/NavCard.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../../../clsx-E3yX_9sL.cjs"),r=require("react"),s=require("../image/Image.cjs"),n=require("../tag/Tag.cjs"),c=require("./utils.cjs"),t=({text:a,type:r,density:s})=>{const c=(e=>{switch(e){case"info":return n.InfoTag;case"success":return n.SuccessTag;case"warning":return n.WarningTag;case"error":return n.ErrorTag;default:return n.Tag}})(r);return e.jsx(c,{density:s,children:a})},i=r.forwardRef(((r,n)=>{const{component:i="a",padding:l="l",image:d,tag:j,title:o,external:x,description:g,children:u,className:p,density:m,...v}=r,y=i,_=j?Array.isArray(j)?j:[j]:void 0;return e.jsxs(y,{ref:n,"aria-label":o,className:a.clsx("jkl-nav-card",p),"data-density":m,...v,children:[d&&e.jsx(s.Image,{className:"jkl-nav-card__image",...d}),e.jsxs("div",{className:"jkl-nav-card__content",style:c.getPaddingStyles(l),children:[_&&e.jsx("div",{className:"jkl-nav-card__tag-wrapper",children:_.map(((a,r)=>e.jsx(t,{type:a.type,text:a.text},r)))}),e.jsxs("div",{children:[e.jsx("p",{className:a.clsx("jkl-nav-card__link",x?"jkl-nav-card__link--external":""),children:o}),g&&e.jsx("p",{className:"jkl-nav-card__description jkl-spacing-xs--top",children:g})]}),u]})]})}));i.displayName="NavCard",exports.InfoBlock=({children:a})=>e.jsx("div",{className:"jkl-nav-card__info",children:a}),exports.NavCard=i;
+//# sourceMappingURL=NavCard.cjs.map

package/build/cjs/components/card/NavCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavCard.cjs","sources":["../../../../src/components/card/NavCard.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AnchorHTMLAttributes, ElementType, FC } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { Image, ImageProps } from \"../image/Image.js\";\nimport { ErrorTag, InfoTag, SuccessTag, Tag, TagProps, WarningTag } from \"../tag/Tag.js\";\nimport { PaddingOptions } from \"./types.js\";\nimport { getPaddingStyles } from \"./utils.js\";\n\nexport type TagType = \"success\" | \"warning\" | \"info\" | \"error\";\n\n/**\n * Bruk denne komponenten for å legge til ekstra informasjon i NavCard.\n * Innholdet blir rendret med skillelinje, og tekststil \"small\"\n */\nexport const InfoBlock: FC<WithChildren> = ({ children }) => <div className=\"jkl-nav-card__info\">{children}</div>;\n\ninterface CardTag {\n    /**\n     * @default <none> Rendres som nøytral tag\n     */\n    type?: TagType;\n    text: string;\n}\n\nexport interface NavCardProps extends PaddingOptions, AnchorHTMLAttributes<HTMLAnchorElement> {\n    tag?: CardTag | Array<CardTag>;\n    title: string;\n    href?: string;\n    to?: string;\n    external?: boolean;\n    description?: string;\n    image?: Omit<ImageProps, \"className\">;\n    className?: string;\n    /**\n     * Overstyr hvilken komponent som skal brukes, for eksempel hvis du har en Link-komponent fra en router.\n     * @default \"a\"\n     */\n    component?: ElementType;\n    density?: Density;\n}\n\nconst getTag = (type?: TagType) => {\n    switch (type) {\n        case \"info\":\n            return InfoTag;\n        case \"success\":\n            return SuccessTag;\n        case \"warning\":\n            return WarningTag;\n        case \"error\":\n            return ErrorTag;\n        default:\n            return Tag;\n    }\n};\nconst NavCardTag = ({ text, type, density }: CardTag & Pick<TagProps, \"density\">) => {\n    const CardTag = getTag(type);\n    return <CardTag density={density}>{text}</CardTag>;\n};\n\nexport const NavCard: FC<NavCardProps> = React.forwardRef<HTMLAnchorElement, NavCardProps>((props, ref) => {\n    const {\n        component = \"a\",\n        padding = \"l\",\n        image,\n        tag,\n        title,\n        external,\n        description,\n        children,\n        className,\n        density,\n        ...rest\n    } = props;\n\n    const Component = component;\n\n    const tagArr = !tag ? undefined : Array.isArray(tag) ? tag : [tag];\n\n    return (\n        <Component\n            ref={ref}\n            aria-label={title}\n            className={clsx(\"jkl-nav-card\", className)}\n            data-density={density}\n            {...rest}\n        >\n            {image && <Image className=\"jkl-nav-card__image\" {...image} />}\n            <div className=\"jkl-nav-card__content\" style={getPaddingStyles(padding)}>\n                {tagArr && (\n                    <div className=\"jkl-nav-card__tag-wrapper\">\n                        {tagArr.map((t, index) => (\n                            <NavCardTag type={t.type} text={t.text} key={index} />\n                        ))}\n                    </div>\n                )}\n                <div>\n                    <p className={clsx(\"jkl-nav-card__link\", external ? \"jkl-nav-card__link--external\" : \"\")}>\n                        {title}\n                    </p>\n                    {description && <p className=\"jkl-nav-card__description jkl-spacing-xs--top\">{description}</p>}\n                </div>\n                {children}\n            </div>\n        </Component>\n    );\n});\n\nNavCard.displayName = \"NavCard\";\n"],"names":["NavCardTag","text","type","density","CardTag","InfoTag","SuccessTag","WarningTag","ErrorTag","Tag","getTag","jsx","children","NavCard","React","forwardRef","props","ref","component","padding","image","tag","title","external","description","className","rest","Component","tagArr","Array","isArray","jsxs","clsx","Image","style","getPaddingStyles","map","t","index","displayName"],"mappings":"qQAuDMA,EAAa,EAAGC,KAAAA,EAAMC,KAAAA,EAAMC,QAAAA,MACxB,MAAAC,EAfMF,KACZ,OAAQA,GACJ,IAAK,OACM,OAAAG,UACX,IAAK,UACM,OAAAC,aACX,IAAK,UACM,OAAAC,aACX,IAAK,QACM,OAAAC,WACX,QACW,OAAAC,MACf,EAGgBC,CAAOR,GAChB,OAAAS,EAAAA,IAACP,EAAQ,CAAAD,QAAAA,EAAmBS,SAAKX,GAAA,EAG/BY,EAA4BC,EAAMC,YAA4C,CAACC,EAAOC,KACzF,MACFC,UAAAA,EAAY,IACZC,QAAAA,EAAU,IACVC,MAAAA,EACAC,IAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,YAAAA,EACAZ,SAAAA,EACAa,UAAAA,EACAtB,QAAAA,KACGuB,GACHV,EAEEW,EAAYT,EAEZU,EAAUP,EAAkBQ,MAAMC,QAAQT,GAAOA,EAAM,CAACA,QAAxC,EAGlB,OAAAU,EAAAA,KAACJ,EAAA,CACGV,IAAAA,EACA,aAAYK,EACZG,UAAWO,EAAAA,KAAK,eAAgBP,GAChC,eAActB,KACVuB,EAEHd,SAAA,CAAAQ,GAAUT,EAAAA,IAAAsB,QAAA,CAAMR,UAAU,yBAA0BL,WACpD,MAAI,CAAAK,UAAU,wBAAwBS,MAAOC,EAAAA,iBAAiBhB,GAC1DP,SAAA,CAAAgB,SACI,MAAI,CAAAH,UAAU,4BACVb,SAAOgB,EAAAQ,KAAI,CAACC,EAAGC,UACXtC,EAAW,CAAAE,KAAMmC,EAAEnC,KAAMD,KAAMoC,EAAEpC,MAAWqC,cAIxD,MACG,CAAA1B,SAAA,CAACD,EAAAA,IAAA,IAAA,CAAEc,UAAWO,EAAKA,KAAA,qBAAsBT,EAAW,+BAAiC,IAChFX,SACLU,IACCE,GAAeb,EAAAA,IAAC,IAAE,CAAAc,UAAU,gDAAiDb,SAAYY,OAE7FZ,OACL,IAKZC,EAAQ0B,YAAc,4BA9FqB,EAAG3B,SAAAA,KAAgBD,EAAAA,IAAA,MAAA,CAAIc,UAAU,qBAAsBb,SAAAA"}

package/build/cjs/components/card/NavCard.d.cts

@@ -0,0 +1,35 @@
+import { AnchorHTMLAttributes, ElementType, FC } from 'react';
+import { Density, WithChildren } from '../../core/types.cjs;'
+import { ImageProps } from '../image/Image.cjs;'
+import { PaddingOptions } from './types.cjs;'
+export type TagType = "success" | "warning" | "info" | "error";
+/**
+ * Bruk denne komponenten for å legge til ekstra informasjon i NavCard.
+ * Innholdet blir rendret med skillelinje, og tekststil "small"
+ */
+export declare const InfoBlock: FC<WithChildren>;
+interface CardTag {
+    /**
+     * @default <none> Rendres som nøytral tag
+     */
+    type?: TagType;
+    text: string;
+}
+export interface NavCardProps extends PaddingOptions, AnchorHTMLAttributes<HTMLAnchorElement> {
+    tag?: CardTag | Array<CardTag>;
+    title: string;
+    href?: string;
+    to?: string;
+    external?: boolean;
+    description?: string;
+    image?: Omit<ImageProps, "className">;
+    className?: string;
+    /**
+     * Overstyr hvilken komponent som skal brukes, for eksempel hvis du har en Link-komponent fra en router.
+     * @default "a"
+     */
+    component?: ElementType;
+    density?: Density;
+}
+export declare const NavCard: FC<NavCardProps>;
+export {};

package/build/cjs/components/card/TaskCard.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../../../clsx-E3yX_9sL.cjs"),a=require("./utils.cjs");exports.TaskCard=({bgColor:t,background:r="highlighted",withShadow:d=!1,padding:l="l",className:c,children:i,density:n,...o})=>e.jsx("div",{className:s.clsx("jkl-task-card",c,{[`jkl-task-card--${r}`]:!t,[`jkl-task-card--${t}`]:!!t,"jkl-task-card--with-shadow":d}),"data-density":n,...o,children:e.jsx("div",{className:"jkl-task-card__content-wrapper",style:a.getPaddingStyles(l),children:i})});
+//# sourceMappingURL=TaskCard.cjs.map

package/build/cjs/components/card/TaskCard.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TaskCard.cjs","sources":["../../../../src/components/card/TaskCard.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\nimport { PaddingOptions } from \"./types.js\";\nimport { getPaddingStyles } from \"./utils.js\";\n\nexport interface TaskCardProps extends PaddingOptions, WithChildren {\n    /**\n     * Bakgrunnsfargen til kortet\n     * @deprecated Bruk `background` i stedet\n     */\n    bgColor?: \"hvit\" | \"snohvit\" | \"sand\" | \"dis\";\n    /**\n     * Bestemmer bakgrunnsfargen til kortet, på tvers av mørkt eller lyst tema\n     * @default \"highlighted\"\n     */\n    background?: \"highlighted\" | \"normal\" | \"subdued\";\n    /**\n     * Skal kortet ha skygge?\n     * @default false\n     */\n    withShadow?: boolean;\n    className?: string;\n    density?: Density;\n}\n\nexport const TaskCard: FC<TaskCardProps> = ({\n    bgColor,\n    background = \"highlighted\",\n    withShadow = false,\n    padding = \"l\",\n    className,\n    children,\n    density,\n    ...rest\n}) => (\n    <div\n        className={clsx(\"jkl-task-card\", className, {\n            // Vi bruker kun background hvis bgColor ikke er satt, for å ikke bryte eksisterende kode\n            [`jkl-task-card--${background}`]: !bgColor,\n            [`jkl-task-card--${bgColor}`]: !!bgColor,\n            \"jkl-task-card--with-shadow\": withShadow,\n        })}\n        data-density={density}\n        {...rest}\n    >\n        <div className=\"jkl-task-card__content-wrapper\" style={getPaddingStyles(padding)}>\n            {children}\n        </div>\n    </div>\n);\n"],"names":["bgColor","background","withShadow","padding","className","children","density","rest","jsx","clsx","style","getPaddingStyles"],"mappings":"uMA0B2C,EACvCA,QAAAA,EACAC,WAAAA,EAAa,cACbC,WAAAA,GAAa,EACbC,QAAAA,EAAU,IACVC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,KACGC,KAEHC,EAAAA,IAAC,MAAA,CACGJ,UAAWK,EAAAA,KAAK,gBAAiBL,EAAW,CAExC,CAAC,kBAAkBH,MAAgBD,EACnC,CAAC,kBAAkBA,OAAcA,EACjC,6BAA8BE,IAElC,eAAcI,KACVC,EAEJF,SAAAG,EAAAA,IAAC,OAAIJ,UAAU,iCAAiCM,MAAOC,mBAAiBR,GACnEE,SAAAA"}

package/build/cjs/components/card/TaskCard.d.cts

@@ -0,0 +1,23 @@
+import { FC } from 'react';
+import { Density, WithChildren } from '../../core/types.cjs;'
+import { PaddingOptions } from './types.cjs;'
+export interface TaskCardProps extends PaddingOptions, WithChildren {
+    /**
+     * Bakgrunnsfargen til kortet
+     * @deprecated Bruk `background` i stedet
+     */
+    bgColor?: "hvit" | "snohvit" | "sand" | "dis";
+    /**
+     * Bestemmer bakgrunnsfargen til kortet, på tvers av mørkt eller lyst tema
+     * @default "highlighted"
+     */
+    background?: "highlighted" | "normal" | "subdued";
+    /**
+     * Skal kortet ha skygge?
+     * @default false
+     */
+    withShadow?: boolean;
+    className?: string;
+    density?: Density;
+}
+export declare const TaskCard: FC<TaskCardProps>;

package/build/cjs/components/card/documentation/examples/FakturainfoExample.d.cts

@@ -0,0 +1,4 @@
+import { ExampleComponentProps, ExampleKnobsProps } from 'doc-utils/index.cjs;'
+import { default as React } from 'react';
+export declare const FakturainfoExample: ({ boolValues, choiceValues }: ExampleComponentProps) => React.JSX.Element;
+export declare const fakturainfoExampleProps: ExampleKnobsProps;

package/build/cjs/components/card/documentation/examples/InfoCardExample.d.cts

@@ -0,0 +1,3 @@
+import { ExampleComponentProps } from 'doc-utils/index.cjs;'
+import { default as React } from 'react';
+export declare const InfoCardExample: React.FC<ExampleComponentProps>;

package/build/cjs/components/card/documentation/examples/NavCardExample.d.cts

@@ -0,0 +1,3 @@
+import { ExampleComponentProps } from 'doc-utils/index.cjs;'
+import { default as React } from 'react';
+export declare const NavCardExample: React.FC<ExampleComponentProps>;

package/build/cjs/components/card/documentation/examples/StatuskortExample.d.cts

@@ -0,0 +1,4 @@
+import { ExampleComponentProps, ExampleKnobsProps } from 'doc-utils/index.cjs;'
+import { default as React } from 'react';
+export declare const StatuskortExample: ({ boolValues, choiceValues }: ExampleComponentProps) => React.JSX.Element;
+export declare const statuskortExampleProps: ExampleKnobsProps;

package/build/cjs/components/card/documentation/examples/TaskCardExample.d.cts

@@ -0,0 +1,3 @@
+import { ExampleComponentProps } from 'doc-utils/index.cjs;'
+import { default as React } from 'react';
+export declare const TaskCardExample: React.FC<ExampleComponentProps>;

package/build/cjs/components/card/documentation/examples/TopExample.d.cts

@@ -0,0 +1,3 @@
+import { ExampleComponentProps } from 'doc-utils/index.cjs;'
+import { FC } from 'react';
+export declare const TopExample: FC<ExampleComponentProps>;

package/build/cjs/components/card/documentation/examples/cardExampleProps.d.cts

@@ -0,0 +1,13 @@
+import { ExampleKnobsProps } from 'doc-utils/index.cjs;'
+import { PaddingShorthand } from '../../types.cjs;'
+export declare const baseCardExampleProps: {
+    choiceProps: {
+        name: string;
+        values: string[];
+        defaultValue: number;
+    }[];
+};
+export declare const navCardExampleProps: ExampleKnobsProps;
+export declare const taskCardExampleProps: ExampleKnobsProps;
+export declare const infoCardExampleProps: ExampleKnobsProps;
+export declare const mixedPadding: PaddingShorthand;

package/build/cjs/components/card/index.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./Card.cjs"),e=require("./CardImage.cjs"),a=require("./NavCard.cjs"),o=require("./TaskCard.cjs"),s=require("./InfoCard.cjs");exports.Card=r.Card,exports.CardImage=e.CardImage,exports.InfoBlock=a.InfoBlock,exports.NavCard=a.NavCard,exports.TaskCard=o.TaskCard,exports.InfoCard=s.InfoCard;
+//# sourceMappingURL=index.cjs.map

package/build/cjs/components/card/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/build/cjs/components/card/index.d.cts

@@ -0,0 +1,6 @@
+export { Card } from './Card.cjs;'
+export { CardImage } from './CardImage.cjs;'
+export { NavCard, InfoBlock, type NavCardProps } from './NavCard.cjs;'
+export { TaskCard, type TaskCardProps } from './TaskCard.cjs;'
+export { InfoCard, type InfoCardProps } from './InfoCard.cjs;'
+export type { SpacingStep, PaddingOptions } from './types.cjs;'

package/build/cjs/components/card/types.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=["0","m","l","xl","2xl","3xl","4xl"];exports.NEW_SPACING_STEPS=["0","16","24","40","64","104","168"],exports.SPACING_STEPS=e,exports.isOldSpacingStep=function(t){return e.includes(t)};
+//# sourceMappingURL=types.cjs.map

package/build/cjs/components/card/types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.cjs","sources":["../../../../src/components/card/types.ts"],"sourcesContent":["export const SPACING_STEPS = [\"0\", \"m\", \"l\", \"xl\", \"2xl\", \"3xl\", \"4xl\"] as const;\ntype SpacingSteps = typeof SPACING_STEPS;\nexport const NEW_SPACING_STEPS = [\"0\", \"16\", \"24\", \"40\", \"64\", \"104\", \"168\"] as const;\ntype NewSpacingSteps = typeof NEW_SPACING_STEPS;\nexport type BasePadding = SpacingSteps[0 | 1 | 2 | 3] | NewSpacingSteps[0 | 1 | 2 | 3];\nexport type OldSpacingStep = SpacingSteps[number];\nexport type NewSpacingStep = NewSpacingSteps[number];\nexport type SpacingStep = SpacingSteps[number] | NewSpacingSteps[number];\n\nexport function isOldSpacingStep(value: SpacingStep): value is OldSpacingStep {\n    return SPACING_STEPS.includes(value as OldSpacingStep);\n}\n\nexport interface PaddingShorthand {\n    /**\n     * Legger til ekstra rom i toppen av kortet, fra spacing-skalaen til Jøkul.\n     * Ikke bruk ekstra topPadding sammen med tag. Verdier lavere enn for venstre og høyre padding\n     * blir ignorert.\n     * @default \"24\"\n     */\n    top?: SpacingStep;\n    /**\n     * Bruk stegene fra spacing-skalaen til Jøkul.\n     * Hvis left og right har forskjellige verdier brukes den største for begge.\n     * @default \"24\"\n     */\n    right?: BasePadding;\n    /**\n     * Legger til ekstra rom i bunnen av kortet, fra spacing-skalaen til Jøkul.\n     * Verdier lavere enn for venstre og høyre padding blir ignorert.\n     * @default \"24\"\n     */\n    bottom?: SpacingStep;\n    /**\n     * Bruk stegene fra spacing-skalaen til Jøkul.\n     * Hvis left og right har forskjellige verdier brukes den største for begge.\n     * @default \"24\"\n     */\n    left?: BasePadding;\n}\n\nexport interface PaddingOptions {\n    /**\n     * Hvor mye rom skal det være rundt innholdet i kortet?\n     * @default \"24\"\n     */\n    padding?: BasePadding | PaddingShorthand;\n}\n"],"names":["SPACING_STEPS","value","includes"],"mappings":"gFAAa,MAAAA,EAAgB,CAAC,IAAK,IAAK,IAAK,KAAM,MAAO,MAAO,iCAEhC,CAAC,IAAK,KAAM,KAAM,KAAM,KAAM,MAAO,wDAO/D,SAA0BC,GACtB,OAAAD,EAAcE,SAASD,EAClC"}

package/build/cjs/components/card/utils.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./types.cjs");function n(n,S="24"){const a=n||S;return t.isOldSpacingStep(a)?t.SPACING_STEPS.indexOf(a):t.NEW_SPACING_STEPS.indexOf(a)}exports.getPaddingStyles=function(S){if("string"==typeof S)return{padding:`var(--jkl-spacing-${t.NEW_SPACING_STEPS[n(S)]})`};const a=Math.max(n(S.left),n(S.right)),e=t.NEW_SPACING_STEPS[a];return{padding:`${`var(--jkl-spacing-${t.NEW_SPACING_STEPS[Math.max(a,n(S.top,e))]})`} ${`var(--jkl-spacing-${e})`} ${`var(--jkl-spacing-${t.NEW_SPACING_STEPS[Math.max(a,n(S.bottom,e))]})`} ${`var(--jkl-spacing-${e})`}`}};
+//# sourceMappingURL=utils.cjs.map

package/build/cjs/components/card/utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.cjs","sources":["../../../../src/components/card/utils.ts"],"sourcesContent":["import { CSSProperties } from \"react\";\nimport { NEW_SPACING_STEPS, SPACING_STEPS, isOldSpacingStep } from \"./types.js\";\nimport type { BasePadding, PaddingShorthand, SpacingStep } from \"./types.js\";\n\nfunction getSpacingIndex(spacingStep?: SpacingStep, fallback: SpacingStep = \"24\"): number {\n    const value = spacingStep || fallback;\n    if (isOldSpacingStep(value)) {\n        return SPACING_STEPS.indexOf(value);\n    } else {\n        return NEW_SPACING_STEPS.indexOf(value);\n    }\n}\n\nexport function getPaddingStyles(padding: BasePadding | PaddingShorthand): CSSProperties {\n    if (typeof padding === \"string\") {\n        return { padding: `var(--jkl-spacing-${NEW_SPACING_STEPS[getSpacingIndex(padding)]})` };\n    }\n\n    // Sett sidepadding til den største av de to innsendte verdiene (eller \"24\")\n    const sideSpacingIndex = Math.max(getSpacingIndex(padding.left), getSpacingIndex(padding.right));\n    const sidePadding = NEW_SPACING_STEPS[sideSpacingIndex];\n\n    // Sett topp-/bunnpadding til det største av innsendt verdi og sidepadding\n    const topPadding = NEW_SPACING_STEPS[Math.max(sideSpacingIndex, getSpacingIndex(padding.top, sidePadding))];\n    const bottomPadding = NEW_SPACING_STEPS[Math.max(sideSpacingIndex, getSpacingIndex(padding.bottom, sidePadding))];\n\n    const top = `var(--jkl-spacing-${topPadding})`;\n    const right = `var(--jkl-spacing-${sidePadding})`;\n    const bottom = `var(--jkl-spacing-${bottomPadding})`;\n    const left = `var(--jkl-spacing-${sidePadding})`;\n\n    return { padding: `${top} ${right} ${bottom} ${left}` };\n}\n"],"names":["getSpacingIndex","spacingStep","fallback","value","isOldSpacingStep","SPACING_STEPS","indexOf","NEW_SPACING_STEPS","padding","sideSpacingIndex","Math","max","left","right","sidePadding","top","bottom"],"mappings":"+GAIA,SAASA,EAAgBC,EAA2BC,EAAwB,MACxE,MAAMC,EAAQF,GAAeC,EACzB,OAAAE,EAAAA,iBAAiBD,GACVE,EAAAA,cAAcC,QAAQH,GAEtBI,EAAAA,kBAAkBD,QAAQH,EAEzC,0BAEO,SAA0BK,GACzB,GAAmB,iBAAZA,EACA,MAAA,CAAEA,QAAS,qBAAqBD,EAAAA,kBAAkBP,EAAgBQ,QAIvE,MAAAC,EAAmBC,KAAKC,IAAIX,EAAgBQ,EAAQI,MAAOZ,EAAgBQ,EAAQK,QACnFC,EAAcP,oBAAkBE,GAW/B,MAAA,CAAED,QAAS,GALN,qBAHOD,EAAAA,kBAAkBG,KAAKC,IAAIF,EAAkBT,EAAgBQ,EAAQO,IAAKD,WAI/E,qBAAqBA,QACpB,qBAJOP,EAAAA,kBAAkBG,KAAKC,IAAIF,EAAkBT,EAAgBQ,EAAQQ,OAAQF,WAKtF,qBAAqBA,OAGtC"}

package/build/cjs/components/card/utils.d.cts

@@ -0,0 +1,3 @@
+import { CSSProperties } from 'react';
+import { BasePadding, PaddingShorthand } from './types.cjs;'
+export declare function getPaddingStyles(padding: BasePadding | PaddingShorthand): CSSProperties;

package/build/cjs/components/checkbox/Checkbox.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("../../../clsx-E3yX_9sL.cjs"),a=require("react"),s=require("../../hooks/useId/useId.cjs"),t=a.forwardRef(((t,r)=>{const{id:n,children:i,invalid:l,className:d,inline:o=!1,density:k,"data-testautoid":x,checked:h,indeterminate:u,...b}=t,j=a.useRef(null);a.useImperativeHandle(r,(()=>j.current),[]);const m=s.useId(n||"jkl-checkbox",{generateSuffix:!n});return a.useEffect((()=>{!0===h&&!0===u&&"production"!==process.env.NODE_ENV&&console.warn("A Checkbox can not be both checked and indeterminate, and will be treated as checked"),j.current&&(j.current.indeterminate=!h&&!!u)}),[h,u]),e.jsxs("div",{className:c.clsx("jkl-checkbox",d,{"jkl-checkbox--inline":o,"jkl-checkbox--error":l}),"data-density":k,children:[e.jsx("input",{id:m,ref:j,className:"jkl-checkbox__input","data-testid":"jkl-checkbox-input","aria-invalid":l,type:"checkbox","data-testautoid":x,checked:h,...b}),e.jsxs("label",{htmlFor:m,className:"jkl-checkbox__label",children:[e.jsxs("span",{className:"jkl-checkbox__mark",children:[e.jsx("span",{className:"jkl-checkbox__indeterminate-mark"}),e.jsx("span",{className:"jkl-checkbox__check-mark"})]}),e.jsx("span",{className:"jkl-checkbox__text",children:i})]})]})}));t.displayName="Checkbox",exports.Checkbox=t;
+//# sourceMappingURL=Checkbox.cjs.map

package/build/cjs/components/checkbox/Checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.cjs","sources":["../../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n    ReactNode,\n    forwardRef,\n    ChangeEventHandler,\n    FocusEventHandler,\n    InputHTMLAttributes,\n    useEffect,\n    useImperativeHandle,\n    useRef,\n} from \"react\";\nimport { DataTestAutoId, Density } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\n\nexport interface CheckboxProps extends DataTestAutoId, InputHTMLAttributes<HTMLInputElement> {\n    children: ReactNode;\n    name: string;\n    value: string;\n    checked?: boolean;\n    inline?: boolean;\n    className?: string;\n    density?: Density;\n    invalid?: boolean;\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    onFocus?: FocusEventHandler<HTMLInputElement>;\n    onBlur?: FocusEventHandler<HTMLInputElement>;\n    indeterminate?: boolean;\n}\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>((props, ref) => {\n    const {\n        id,\n        children,\n        invalid,\n        className,\n        inline = false,\n        density,\n        \"data-testautoid\": testAutoId,\n        checked,\n        indeterminate,\n        ...rest\n    } = props;\n\n    const inputRef = useRef<HTMLInputElement>(null);\n    useImperativeHandle(ref, () => inputRef.current!, []);\n\n    const inputId = useId(id || \"jkl-checkbox\", { generateSuffix: !id });\n\n    useEffect(() => {\n        if (checked === true && indeterminate === true && process.env.NODE_ENV !== \"production\") {\n            console.warn(\"A Checkbox can not be both checked and indeterminate, and will be treated as checked\");\n        }\n        if (inputRef.current) {\n            inputRef.current.indeterminate = !checked && !!indeterminate;\n        }\n    }, [checked, indeterminate]);\n\n    return (\n        <div\n            className={clsx(\"jkl-checkbox\", className, {\n                \"jkl-checkbox--inline\": inline,\n                \"jkl-checkbox--error\": invalid,\n            })}\n            data-density={density}\n        >\n            <input\n                id={inputId}\n                ref={inputRef}\n                className=\"jkl-checkbox__input\"\n                data-testid=\"jkl-checkbox-input\"\n                aria-invalid={invalid}\n                type=\"checkbox\"\n                data-testautoid={testAutoId}\n                checked={checked}\n                {...rest}\n            />\n            <label htmlFor={inputId} className=\"jkl-checkbox__label\">\n                <span className=\"jkl-checkbox__mark\">\n                    <span className=\"jkl-checkbox__indeterminate-mark\" />\n                    <span className=\"jkl-checkbox__check-mark\" />\n                </span>\n                <span className=\"jkl-checkbox__text\">{children}</span>\n            </label>\n        </div>\n    );\n});\n\nCheckbox.displayName = \"Checkbox\";\n"],"names":["Checkbox","forwardRef","props","ref","id","children","invalid","className","inline","density","testAutoId","checked","indeterminate","rest","inputRef","useRef","useImperativeHandle","current","inputId","useId","generateSuffix","useEffect","process","env","NODE_ENV","console","warn","jsxs","clsx","jsx","type","htmlFor","displayName"],"mappings":"yNA6BaA,EAAWC,EAAAA,YAA4C,CAACC,EAAOC,KAClE,MACFC,GAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACA,kBAAmBC,EACnBC,QAAAA,EACAC,cAAAA,KACGC,GACHX,EAEEY,EAAWC,SAAyB,MAC1CC,EAAAA,oBAAoBb,GAAK,IAAMW,EAASG,SAAU,IAE5C,MAAAC,EAAUC,QAAMf,GAAM,eAAgB,CAAEgB,gBAAiBhB,IAE/DiB,OAAAA,EAAAA,WAAU,MACU,IAAZV,IAAsC,IAAlBC,GAAmD,eAAzBU,QAAQC,IAAIC,UAC1DC,QAAQC,KAAK,wFAEbZ,EAASG,UACTH,EAASG,QAAQL,eAAiBD,KAAaC,KAEpD,CAACD,EAASC,IAGTe,EAAAA,KAAC,MAAA,CACGpB,UAAWqB,EAAAA,KAAK,eAAgBrB,EAAW,CACvC,uBAAwBC,EACxB,sBAAuBF,IAE3B,eAAcG,EAEdJ,SAAA,CAAAwB,EAAAA,IAAC,QAAA,CACGzB,GAAIc,EACJf,IAAKW,EACLP,UAAU,sBACV,cAAY,qBACZ,eAAcD,EACdwB,KAAK,WACL,kBAAiBpB,EACjBC,QAAAA,KACIE,IAEPc,EAAAA,KAAA,QAAA,CAAMI,QAASb,EAASX,UAAU,sBAC/BF,SAAA,CAACsB,EAAAA,KAAA,OAAA,CAAKpB,UAAU,qBACZF,SAAA,CAACwB,EAAAA,IAAA,OAAA,CAAKtB,UAAU,qCAChBsB,EAAAA,IAAC,OAAK,CAAAtB,UAAU,gCAEnBsB,EAAAA,IAAA,OAAA,CAAKtB,UAAU,qBAAsBF,SAAAA,SAC1C,IAKZL,EAASgC,YAAc"}