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

@fremtind/jokul 0.64.1 → 0.66.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (740) hide show

package/build/es/components/autosuggest/ControllerButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as o}from"react/jsx-runtime";import{CloseIcon as t}from"../icon/icons/CloseIcon.js";import{SearchIcon as n}from"../icon/icons/SearchIcon.js";import{IconButton as c}from"../icon-button/IconButton.js";const e=({hasSelectedItem:e,clearSelection:a,onClick:i,...s})=>o(c,{...s,className:"jkl-text-input-action-button","aria-label":e?"Fjern valg":"Vis valg",title:e?"Fjern valg":"Vis valg",onClick:e?a:i,children:o(e?t:n,{})});export{e as default};
+import{jsx as o}from"react/jsx-runtime";import{IconButton as t}from"../icon-button/IconButton.js";import{CloseIcon as n}from"../icon/icons/CloseIcon.js";import{SearchIcon as c}from"../icon/icons/SearchIcon.js";const e=({hasSelectedItem:e,clearSelection:a,onClick:i,...s})=>o(t,{...s,className:"jkl-text-input-action-button","aria-label":e?"Fjern valg":"Vis valg",title:e?"Fjern valg":"Vis valg",onClick:e?a:i,children:o(e?n:c,{})});export{e as default};
 //# sourceMappingURL=ControllerButton.js.map

package/build/es/components/autosuggest/ControllerButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ControllerButton.js","sources":["../../../../src/components/autosuggest/ControllerButton.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { ~~CloseIcon~~ } from \"../icon/~~icons/CloseIcon~~.js\";\nimport { ~~SearchIcon~~ } from \"../icon/icons/~~SearchIcon~~.js\";\nimport { ~~IconButton~~ } from \"../icon~~-button~~/~~IconButton~~.js\";\n\ninterface Props {\n clearSelection: () => void;\n hasSelectedItem: boolean;\n onClick: () => void;\n}\n\nconst ControllerButton: FC<Props> = ({\n hasSelectedItem,\n clearSelection,\n onClick,\n ...downshiftProps\n}) => (\n <IconButton\n {...downshiftProps}\n className=\"jkl-text-input-action-button\"\n aria-label={hasSelectedItem ? \"Fjern valg\" : \"Vis valg\"}\n title={hasSelectedItem ? \"Fjern valg\" : \"Vis valg\"}\n onClick={hasSelectedItem ? clearSelection : onClick}\n >\n {hasSelectedItem ? <CloseIcon /> : <SearchIcon />}\n </IconButton>\n);\n\nexport default ControllerButton;\n"],"names":["ControllerButton","hasSelectedItem","clearSelection","onClick","downshiftProps","jsx","IconButton","className","title","children","CloseIcon","SearchIcon"],"mappings":"kNAWA,MAAMA,EAA8B,EAChCC,gBAAAA,EACAC,eAAAA,EACAC,QAAAA,KACGC,KAEHC,EAACC,EAAA,IACOF,EACJG,UAAU,+BACV,aAAYN,EAAkB,aAAe,WAC7CO,MAAOP,EAAkB,aAAe,WACxCE,QAASF,EAAkBC,EAAiBC,EAE3CM,SAAkBJ,EAAAJ,EAACS,EAAgBC,EAAN,CAAA"}
1	+ {"version":3,"file":"ControllerButton.js","sources":["../../../../src/components/autosuggest/ControllerButton.tsx"],"sourcesContent":["import React, { type FC } from \"react\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { CloseIcon } from \"../icon/icons/CloseIcon.js\";\nimport { SearchIcon } from \"../icon/icons/SearchIcon.js\";\n\ninterface Props {\n clearSelection: () => void;\n hasSelectedItem: boolean;\n onClick: () => void;\n}\n\nconst ControllerButton: FC<Props> = ({\n hasSelectedItem,\n clearSelection,\n onClick,\n ...downshiftProps\n}) => (\n <IconButton\n {...downshiftProps}\n className=\"jkl-text-input-action-button\"\n aria-label={hasSelectedItem ? \"Fjern valg\" : \"Vis valg\"}\n title={hasSelectedItem ? \"Fjern valg\" : \"Vis valg\"}\n onClick={hasSelectedItem ? clearSelection : onClick}\n >\n {hasSelectedItem ? <CloseIcon /> : <SearchIcon />}\n </IconButton>\n);\n\nexport default ControllerButton;\n"],"names":["ControllerButton","hasSelectedItem","clearSelection","onClick","downshiftProps","jsx","IconButton","className","title","children","CloseIcon","SearchIcon"],"mappings":"kNAWA,MAAMA,EAA8B,EAChCC,gBAAAA,EACAC,eAAAA,EACAC,QAAAA,KACGC,KAEHC,EAACC,EAAA,IACOF,EACJG,UAAU,+BACV,aAAYN,EAAkB,aAAe,WAC7CO,MAAOP,EAAkB,aAAe,WACxCE,QAASF,EAAkBC,EAAiBC,EAE3CM,SAAkBJ,EAAAJ,EAACS,EAAgBC,EAAN,CAAA"}

package/build/es/components/autosuggest/Menu.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as t,jsx as e}from"react/jsx-runtime";import{createElement as s}from"react";import{c as i}from"../../../clsx-BeLtu-UY.js";function a({downshiftProps:{getMenuProps:a,getItemProps:l},highlightedIndex:m,items:n,itemToString:o,noHitsMessage:g,maxNumberOfHits:u=1/0,noHits:r}){const c=n.length>u?n.slice(0,u):n;if(0===c.length&&!g&&!r)return null;const d=0===c.length&&r?r.items:c;return t("div",{"data-testid":"autosuggest__menu",className:"jkl-autosuggest__menu",children:[(g||r)&&0===c.length&&e("div",{className:"jkl-autosuggest__no-hits-message","aria-live":"polite",children:g||(null==r?void 0:r.text)}),d.length>0&&e("ul",{...a({className:"jkl-autosuggest__item-list"}),children:d.map(((t,e)=>s("li",{...l({item:t,className:i("jkl-autosuggest__item",{"jkl-autosuggest__item--active":e===m})}),"data-testid":"autosuggest__item",key:o(t)},o(t))))})]})}export{a as default};
+import{jsxs as t,jsx as e}from"react/jsx-runtime";import{createElement as s}from"react";import{c as i}from"../../../clsx-BeLtu-UY.js";function a({downshiftProps:{getMenuProps:a,getItemProps:l},highlightedIndex:m,items:n,itemToString:o,noHitsMessage:u,maxNumberOfHits:g=Number.POSITIVE_INFINITY,noHits:r}){const c=n.length>g?n.slice(0,g):n;if(0===c.length&&!u&&!r)return null;const _=0===c.length&&r?r.items:c;return t("div",{"data-testid":"autosuggest__menu",className:"jkl-autosuggest__menu",children:[(u||r)&&0===c.length&&e("div",{className:"jkl-autosuggest__no-hits-message","aria-live":"polite",children:u||(null==r?void 0:r.text)}),_.length>0&&e("ul",{...a({className:"jkl-autosuggest__item-list"}),children:_.map(((t,e)=>s("li",{...l({item:t,className:i("jkl-autosuggest__item",{"jkl-autosuggest__item--active":e===m})}),"data-testid":"autosuggest__item",key:o(t)},o(t))))})]})}export{a as default};
 //# sourceMappingURL=Menu.js.map

package/build/es/components/autosuggest/Menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.js","sources":["../../../../src/components/autosuggest/Menu.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { PropGetters } from \"downshift\";\nimport React, { ReactNode } from \"react\";\n\ninterface MenuProps<T> {\n downshiftProps: Pick<PropGetters<T>, \"getMenuProps\" \| \"getItemProps\">;\n highlightedIndex: number \| undefined \| null;\n items: T[];\n itemToString: (item: T \| null) => string;\n noHitsMessage?: ReactNode;\n maxNumberOfHits?: number;\n noHits?: { items: T[]; text: ReactNode };\n}\n\nfunction Menu<T>({\n downshiftProps: { getMenuProps, getItemProps },\n highlightedIndex,\n items,\n itemToString,\n noHitsMessage,\n maxNumberOfHits = ~~Infinity~~,\n noHits,\n}: MenuProps<T>): JSX.Element \| null {\n const visibleItems =\n items.length > maxNumberOfHits\n ? items.slice(0, maxNumberOfHits)\n : items;\n\n if (visibleItems.length === 0 && !noHitsMessage && !noHits) {\n return null;\n }\n\n const itemList =\n visibleItems.length === 0 && noHits ? noHits.items : visibleItems;\n\n return (\n <div data-testid=\"autosuggest__menu\" className=\"jkl-autosuggest__menu\">\n {(noHitsMessage \|\| noHits) && visibleItems.length === 0 && (\n <div\n className=\"jkl-autosuggest__no-hits-message\"\n aria-live=\"polite\"\n >\n {noHitsMessage \|\| noHits?.text}\n </div>\n )}\n\n {itemList.length > 0 && (\n <ul\n {...getMenuProps({\n className: \"jkl-autosuggest__item-list\",\n })}\n >\n {itemList.map((item, index) => (\n <li\n {...getItemProps({\n item,\n className: clsx(\"jkl-autosuggest__item\", {\n \"jkl-autosuggest__item--active\":\n index === highlightedIndex,\n }),\n })}\n data-testid=\"autosuggest__item\"\n key={itemToString(item)}\n >\n {itemToString(item)}\n </li>\n ))}\n </ul>\n )}\n </div>\n );\n}\n\nexport default Menu;\n"],"names":["Menu","downshiftProps","getMenuProps","getItemProps","highlightedIndex","items","itemToString","noHitsMessage","maxNumberOfHits","noHits","visibleItems","length","slice","itemList","jsxs","className","children","jsx","text","map","item","index","createElement","clsx","key"],"mappings":"sIAcA,SAASA,GACLC,gBAAkBC,aAAAA,EAAcC,aAAAA,GAChCC,iBAAAA,EACAC,MAAAA,EACAC,aAAAA,EACAC,cAAAA,EACAC,gBAAAA,~~EAAkB~~,~~IAClBC~~,OAAAA,IAEMC,MAAAA,~~EACFL~~,~~EAAMM~~,~~OAASH~~,EACTH,~~EAAMO~~,MAAM,~~EAAGJ~~,GACfH,EAEV,GAA4B,~~IAAxBK~~,EAAaC,~~SAAiBJ~~,~~IAAkBE~~,EACzC,OAAA,KAGX,MAAMI,EACsB,IAAxBH,EAAaC,QAAgBF,EAASA,~~EAAOJ~~,~~MAAQK~~,EAGpD,OAAAI,EAAA,MAAA,CAAI,cAAY,oBAAoBC,UAAU,wBACzCC,SAAA,~~EAAiBT~~,~~GAAAE~~,IAAmC,IAAxBC,EAAaC,QACvCM,EAAC,MAAA,CACGF,UAAU,mCACV,YAAU,SAETC,aAAiB,MAAAP,OAAA,EAAAA,EAAQS,QAIjCL,EAASF,OAAS,GACfM,EAAC,KAAA,~~IACOf~~,EAAa,~~CACba~~,UAAW,+BAGdC,SAASH,EAAAM,KAAI,CAACC,EAAMC,IACjBC,EAAC,KAAA,~~IACOnB~~,EAAa,~~CACbiB~~,KAAAA,EACAL,UAAWQ,EAAK,wBAAyB,CACrC,gCACIF,~~IAAUjB~~,MAGtB,cAAY,~~oBACZoB~~,~~IAAKlB~~,~~EAAac~~,~~IAEjBd~~,~~EAAac~~,UAO1C"}
1	+ {"version":3,"file":"Menu.js","sources":["../../../../src/components/autosuggest/Menu.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport type { PropGetters } from \"downshift\";\nimport React, { type ReactNode } from \"react\";\n\ninterface MenuProps<T> {\n downshiftProps: Pick<PropGetters<T>, \"getMenuProps\" \| \"getItemProps\">;\n highlightedIndex: number \| undefined \| null;\n items: T[];\n itemToString: (item: T \| null) => string;\n noHitsMessage?: ReactNode;\n maxNumberOfHits?: number;\n noHits?: { items: T[]; text: ReactNode };\n}\n\nfunction Menu<T>({\n downshiftProps: { getMenuProps, getItemProps },\n highlightedIndex,\n items,\n itemToString,\n noHitsMessage,\n maxNumberOfHits = Number.POSITIVE_INFINITY,\n noHits,\n}: MenuProps<T>): JSX.Element \| null {\n const visibleItems =\n items.length > maxNumberOfHits\n ? items.slice(0, maxNumberOfHits)\n : items;\n\n if (visibleItems.length === 0 && !noHitsMessage && !noHits) {\n return null;\n }\n\n const itemList =\n visibleItems.length === 0 && noHits ? noHits.items : visibleItems;\n\n return (\n <div data-testid=\"autosuggest__menu\" className=\"jkl-autosuggest__menu\">\n {(noHitsMessage \|\| noHits) && visibleItems.length === 0 && (\n <div\n className=\"jkl-autosuggest__no-hits-message\"\n aria-live=\"polite\"\n >\n {noHitsMessage \|\| noHits?.text}\n </div>\n )}\n\n {itemList.length > 0 && (\n <ul\n {...getMenuProps({\n className: \"jkl-autosuggest__item-list\",\n })}\n >\n {itemList.map((item, index) => (\n <li\n {...getItemProps({\n item,\n className: clsx(\"jkl-autosuggest__item\", {\n \"jkl-autosuggest__item--active\":\n index === highlightedIndex,\n }),\n })}\n data-testid=\"autosuggest__item\"\n key={itemToString(item)}\n >\n {itemToString(item)}\n </li>\n ))}\n </ul>\n )}\n </div>\n );\n}\n\nexport default Menu;\n"],"names":["Menu","downshiftProps","getMenuProps","getItemProps","highlightedIndex","items","itemToString","noHitsMessage","maxNumberOfHits","Number","POSITIVE_INFINITY","noHits","visibleItems","length","slice","itemList","jsxs","className","children","jsx","text","map","item","index","createElement","clsx","key"],"mappings":"sIAcA,SAASA,GACLC,gBAAkBC,aAAAA,EAAcC,aAAAA,GAChCC,iBAAAA,EACAC,MAAAA,EACAC,aAAAA,EACAC,cAAAA,EACAC,gBAAAA,EAAkBC,OAAOC,kBACzBC,OAAAA,IAEMC,MAAAA,EACFP,EAAMQ,OAASL,EACTH,EAAMS,MAAM,EAAGN,GACfH,EAEV,GAA4B,IAAxBO,EAAaC,SAAiBN,IAAkBI,EACzC,OAAA,KAGX,MAAMI,EACsB,IAAxBH,EAAaC,QAAgBF,EAASA,EAAON,MAAQO,EAGpD,OAAAI,EAAA,MAAA,CAAI,cAAY,oBAAoBC,UAAU,wBACzCC,SAAA,EAAiBX,GAAAI,IAAmC,IAAxBC,EAAaC,QACvCM,EAAC,MAAA,CACGF,UAAU,mCACV,YAAU,SAETC,aAAiB,MAAAP,OAAA,EAAAA,EAAQS,QAIjCL,EAASF,OAAS,GACfM,EAAC,KAAA,IACOjB,EAAa,CACbe,UAAW,+BAGdC,SAASH,EAAAM,KAAI,CAACC,EAAMC,IACjBC,EAAC,KAAA,IACOrB,EAAa,CACbmB,KAAAA,EACAL,UAAWQ,EAAK,wBAAyB,CACrC,gCACIF,IAAUnB,MAGtB,cAAY,oBACZsB,IAAKpB,EAAagB,IAEjBhB,EAAagB,UAO1C"}

package/build/es/components/breadcrumb/Breadcrumb.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Breadcrumb.js","sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { BreadcrumbItemProps, BreadcrumbProps } from \"./types.js\";\n\nexport const Breadcrumb = ({\n className,\n children,\n density,\n ...rest\n}: BreadcrumbProps): JSX.Element => {\n const numberOfChildren = React.Children.count(children);\n return (\n <nav\n aria-label=\"Sti\"\n className={clsx(\"jkl-breadcrumb\", className)}\n data-layout-density={density}\n {...rest}\n >\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>(\n child,\n {\n isLastElement,\n },\n )\n : child}\n {!isLastElement && (\n <span\n className=\"jkl-breadcrumb__item-separator\"\n aria-hidden=\"true\"\n >\n ›\n </span>\n )}\n </>\n );\n })}\n </ol>\n </nav>\n );\n};\n"],"names":["Breadcrumb","className","children","density","rest","numberOfChildren","React","Children","count","jsx","clsx","map","child","index","isLastElement","jsxs","Fragment","isValidElement","cloneElement"],"mappings":"mIAIO,MAAMA,EAAa,EACtBC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,KACGC,MAEH,MAAMC,EAAmBC,EAAMC,SAASC,MAAMN,GAE1C,OAAAO,EAAC,MAAA,CACG,aAAW,MACXR,UAAWS,EAAK,iBAAkBT,GAClC,sBAAqBE,KACjBC,EAEJF,SAAAO,EAAC,KAAG,CAAAR,UAAU,uBACTC,SAAAI,EAAMC,SAASI,IAAIT,GAAU,CAACU,EAAOC,KAC5BC,MAAAA,EAAgBD,EAAQ,IAAMR,EACpC,OAESU,EAAAC,EAAA,CAAAd,SAAA,CAAMI,EAAAW,eAAoCL,GACrCN,EAAMY,aACFN,EACA,CACIE,cAAAA,IAGRF,GACJE,GACEL,EAAC,OAAA,CACGR,UAAU,iCACV,cAAY,OACfC,SAAA,QAIT,OAGZ"}
1	+ {"version":3,"file":"Breadcrumb.js","sources":["../../../../src/components/breadcrumb/Breadcrumb.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { BreadcrumbItemProps, BreadcrumbProps } from \"./types.js\";\n\nexport const Breadcrumb = ({\n className,\n children,\n density,\n ...rest\n}: BreadcrumbProps): JSX.Element => {\n const numberOfChildren = React.Children.count(children);\n return (\n <nav\n aria-label=\"Sti\"\n className={clsx(\"jkl-breadcrumb\", className)}\n data-layout-density={density}\n {...rest}\n >\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>(\n child,\n {\n isLastElement,\n },\n )\n : child}\n {!isLastElement && (\n <span\n className=\"jkl-breadcrumb__item-separator\"\n aria-hidden=\"true\"\n >\n ›\n </span>\n )}\n </>\n );\n })}\n </ol>\n </nav>\n );\n};\n"],"names":["Breadcrumb","className","children","density","rest","numberOfChildren","React","Children","count","jsx","clsx","map","child","index","isLastElement","jsxs","Fragment","isValidElement","cloneElement"],"mappings":"mIAIO,MAAMA,EAAa,EACtBC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,KACGC,MAEH,MAAMC,EAAmBC,EAAMC,SAASC,MAAMN,GAE1C,OAAAO,EAAC,MAAA,CACG,aAAW,MACXR,UAAWS,EAAK,iBAAkBT,GAClC,sBAAqBE,KACjBC,EAEJF,SAAAO,EAAC,KAAG,CAAAR,UAAU,uBACTC,SAAAI,EAAMC,SAASI,IAAIT,GAAU,CAACU,EAAOC,KAC5BC,MAAAA,EAAgBD,EAAQ,IAAMR,EACpC,OAESU,EAAAC,EAAA,CAAAd,SAAA,CAAMI,EAAAW,eAAoCL,GACrCN,EAAMY,aACFN,EACA,CACIE,cAAAA,IAGRF,GACJE,GACEL,EAAC,OAAA,CACGR,UAAU,iCACV,cAAY,OACfC,SAAA,QAIT,OAGZ"}

package/build/es/components/breadcrumb/BreadcrumbItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BreadcrumbItem.js","sources":["../../../../src/components/breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AnchorHTMLAttributes } from \"react\";\nimport { BreadcrumbItemProps } from \"./types.js\";\n\nexport const BreadcrumbItem = ({\n className,\n children,\n isLastElement,\n ...rest\n}: BreadcrumbItemProps): JSX.Element => {\n return (\n <li className={clsx(\"jkl-breadcrumb__item\", className)} {...rest}>\n {React.Children.map(children, (child) => {\n if (\n React.isValidElement<\n AnchorHTMLAttributes<HTMLAnchorElement>\n >(child)\n ) {\n return React.cloneElement<\n AnchorHTMLAttributes<HTMLAnchorElement>\n >(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":["BreadcrumbItem","className","children","isLastElement","rest","jsx","clsx","React","Children","map","child","isValidElement","cloneElement"],"mappings":"2GAIO,MAAMA,EAAiB,EAC1BC,UAAAA,EACAC,SAAAA,EACAC,cAAAA,KACGC,KAGEC,EAAA,KAAA,CAAGJ,UAAWK,EAAK,uBAAwBL,MAAgBG,EACvDF,SAAMK,EAAAC,SAASC,IAAIP,GAAWQ,GAEvBH,EAAMI,eAEJD,GAEKH,EAAMK,aAEXF,EAAO,CACL,eAAgBP,EAAgB,YAAS,EACzCF,UAAW,~~aAGRS~~"}
1	+ {"version":3,"file":"BreadcrumbItem.js","sources":["../../../../src/components/breadcrumb/BreadcrumbItem.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type AnchorHTMLAttributes } from \"react\";\nimport type { BreadcrumbItemProps } from \"./types.js\";\n\nexport const BreadcrumbItem = ({\n className,\n children,\n isLastElement,\n ...rest\n}: BreadcrumbItemProps): JSX.Element => {\n return (\n <li className={clsx(\"jkl-breadcrumb__item\", className)} {...rest}>\n {React.Children.map(children, (child) => {\n if (\n React.isValidElement<\n AnchorHTMLAttributes<HTMLAnchorElement>\n >(child)\n ) {\n return React.cloneElement<\n AnchorHTMLAttributes<HTMLAnchorElement>\n >(child, {\n \"aria-current\": isLastElement ? \"page\" : undefined,\n className: \"jkl-link\",\n });\n }\n\n return child;\n })}\n </li>\n );\n};\n"],"names":["BreadcrumbItem","className","children","isLastElement","rest","jsx","clsx","React","Children","map","child","isValidElement","cloneElement"],"mappings":"2GAIO,MAAMA,EAAiB,EAC1BC,UAAAA,EACAC,SAAAA,EACAC,cAAAA,KACGC,KAGEC,EAAA,KAAA,CAAGJ,UAAWK,EAAK,uBAAwBL,MAAgBG,EACvDF,SAAMK,EAAAC,SAASC,IAAIP,GAAWQ,GAEvBH,EAAMI,eAEJD,GAEKH,EAAMK,aAEXF,EAAO,CACL,eAAgBP,EAAgB,YAAS,EACzCF,UAAW,aAIZS"}

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

@@ -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: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};
+import{jsxs as t,jsx as n}from"react/jsx-runtime";import{c as e}from"../../../clsx-BeLtu-UY.js";import o from"react";import{useAriaLiveRegion as a}from"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js";import{Loader as r}from"../loader/Loader.js";const i=o.forwardRef((function(i,s){const{as:l="button",children:d,className:u,density:c,onTouchStart:m,onAnimationEnd:h,loader:v,icon:f,iconPosition:b="left",iconLeft:p,iconRight:y,variant:g="secondary",...j}=i,L=l;"production"!==process.env.NODE_ENV&&0===o.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 k=a(null==v?void 0:v.showLoader),x=!!d&&!(null==v||!v.showLoader);return t(L,{...k,"data-loading":x,"data-density":c,className:e("jkl-button",`jkl-button--${g}`,u),disabled:"button"===l?null==v?void 0:v.showLoader:void 0,...j,ref:s,children:[t("div",{className:"jkl-button__label",children:[p&&p,f&&"left"===b&&f,d&&n("span",{className:"jkl-button__text",children:d}),y&&y,f&&"right"===b&&f]}),d&&n(r,{className:"jkl-button__loader",variant:"medium",textDescription:(null==v?void 0:v.textDescription)||"Vennligst vent","aria-hidden":!(null!=v&&v.showLoader)})]})}));function s(t){const e={...t,variant:"primary"};return n(i,{...e})}function l(t){const e={...t,variant:"secondary"};return n(i,{...e})}function d(t){const e={...t,variant:"tertiary"};return n(i,{...e})}function u(t){const e={...t,variant:"ghost"};return n(i,{...e})}export{i as Button,u as GhostButton,s as PrimaryButton,l as SecondaryButton,d as TertiaryButton};
 //# sourceMappingURL=Button.js.map

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

	@@ -1 +1 @@
1	- {"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"}
1	+ {"version":3,"file":"Button.js","sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import cn from \"clsx\";\nimport React, { type ButtonHTMLAttributes } from \"react\";\nimport { useAriaLiveRegion } from \"../../hooks/useAriaLiveRegion/useAriaLiveRegion.js\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { Loader } from \"../loader/Loader.js\";\nimport type { 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 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 {...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","ariaLive","useAriaLiveRegion","showLoader","jsxs","cn","disabled","jsx","Loader","textDescription","PrimaryButton","buttonProps","SecondaryButton","TertiaryButton","GhostButton"],"mappings":"yPAOO,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,2HAIF,MAAAC,EAAWC,EAAkB,MAAAjB,OAAA,EAAAA,EAAQkB,YACrCA,IAAqBvB,KAAqB,MAAAK,IAAAA,EAAQkB,YAGpD,OAAAC,EAACZ,EAAA,IACOS,EACJ,eAAcE,EACd,eAAcrB,EACdD,UAAWwB,EAAG,aAAc,eAAef,IAAWT,GACtDyB,SAAiB,WAAP3B,EAAkB,MAAAM,OAAA,EAAAA,EAAQkB,gBAAa,KAC7CZ,EACJb,IAAAA,EAEAE,SAAA,CAACwB,EAAA,MAAA,CAAIvB,UAAU,oBACVD,SAAA,CAAYQ,GAAAA,EACZF,GAAyB,SAAjBC,GAA2BD,EACnCN,GACG2B,EAAC,OAAK,CAAA1B,UAAU,mBAAoBD,SAAAA,IAEvCS,GAAaA,EACbH,GAAyB,UAAjBC,GAA4BD,KAGxCN,GACG2B,EAACC,EAAA,CACG3B,UAAU,qBACVS,QAAQ,SACRmB,iBACI,MAAAxB,OAAAA,EAAAA,EAAQwB,kBAAmB,iBAE/B,gBAAc,MAAAxB,GAAAA,EAAQkB,gBAK1C,IAEO,SAASO,EACZjC,GAGA,MAAMkC,EAAc,IACblC,EACHa,QAAS,WAEN,OAAAiB,EAACjC,EAAQ,IAAGqC,GACvB,CAEO,SAASC,EAGZnC,GAGA,MAAMkC,EAAc,IACblC,EACHa,QAAS,aAEN,OAAAiB,EAACjC,EAAQ,IAAGqC,GACvB,CAEO,SAASE,EAGZpC,GAGA,MAAMkC,EAAc,IACblC,EACHa,QAAS,YAEN,OAAAiB,EAACjC,EAAQ,IAAGqC,GACvB,CAEO,SAASG,EACZrC,GAEA,MAAMkC,EAAc,IACblC,EACHa,QAAS,SAEN,OAAAiB,EAACjC,EAAQ,IAAGqC,GACvB"}

package/build/es/components/button/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sources":["../../../../src/components/button/types.ts"],"sourcesContent":["import { Density } from \"../../core/types.js\";\nimport { PolymorphicPropsWithRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport const buttonVariants = [\n \"primary\",\n \"secondary\",\n \"tertiary\",\n \"ghost\",\n] as const;\nexport type ButtonVariant = (typeof buttonVariants)[number];\nexport type IconPosition = \"left\" \| \"right\";\n\nexport type IconOptions =\n // Hvis ikke knappen har ikon, MÅ den ha children:\n \| {\n iconPosition?: never;\n icon?: never;\n children: React.ReactNode;\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\ntype Props = {\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;\n\nexport type ButtonProps<ElementType extends React.ElementType> =\n PolymorphicPropsWithRef<ElementType, Props> & Props;\n\nexport type ButtonComponent = <\n ElementType extends React.ElementType = \"button\",\n>(\n props: ButtonProps<ElementType>,\n) => React.ReactElement \| null;\n"],"names":["buttonVariants"],"mappings":"AAGO,MAAMA,EAAiB,CAC1B,UACA,YACA,WACA"}
1	+ {"version":3,"file":"types.js","sources":["../../../../src/components/button/types.ts"],"sourcesContent":["import type { Density } from \"../../core/types.js\";\nimport type { PolymorphicPropsWithRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport const buttonVariants = [\n \"primary\",\n \"secondary\",\n \"tertiary\",\n \"ghost\",\n] as const;\nexport type ButtonVariant = (typeof buttonVariants)[number];\nexport type IconPosition = \"left\" \| \"right\";\n\nexport type IconOptions =\n // Hvis ikke knappen har ikon, MÅ den ha children:\n \| {\n iconPosition?: never;\n icon?: never;\n children: React.ReactNode;\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\ntype Props = {\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;\n\nexport type ButtonProps<ElementType extends React.ElementType> =\n PolymorphicPropsWithRef<ElementType, Props> & Props;\n\nexport type ButtonComponent = <\n ElementType extends React.ElementType = \"button\",\n>(\n props: ButtonProps<ElementType>,\n) => React.ReactElement \| null;\n"],"names":["buttonVariants"],"mappings":"AAGO,MAAMA,EAAiB,CAC1B,UACA,YACA,WACA"}

package/build/es/components/card/Card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.js","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { ~~AsChildProps~~ } from \"../../utilities/polymorphism/~~as-child~~.js\";\nimport { ~~PolymorphicRef~~ } from \"../../utilities/polymorphism/~~polymorphism~~.js\";\nimport { ~~SlotComponent~~ } from \"../../utilities/polymorphism/~~SlotComponent~~.js\";\nimport { CardProps } from \"./types.js\";\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<\n ElementType extends React.ElementType = \"div\",\n>(props: CardProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\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","jsx","SlotComponent","clsx"],"mappings":"yLAiBO,MAAMA,EAAOC,EAAMC,YAAW,SAEnCC,EAA+BC,GACvB,MACFC,UAAAA,EACAC,UAAAA,GAAY,EACZC,QAAAA,EAAU,IACVC,QAAAA,EAAU,OACVC,QAAAA,EACAC,GAAAA,EAAK,SACFC,GACHR,EAKA,OAAAS,EAHcH,EAAUI,EAAgBH,EAGvC,CACG,cAAY,WACZ,iBAAgBJ,EAChB,eAAcC,EACdF,UAAWS,EAAK,WAAY,aAAaN,IAAWH,MAChDM,EACJP,IAAAA,GAGZ"}
1	+ {"version":3,"file":"Card.js","sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { SlotComponent } from \"../../utilities/polymorphism/SlotComponent.js\";\nimport type { AsChildProps } from \"../../utilities/polymorphism/as-child.js\";\nimport type { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport type { CardProps } from \"./types.js\";\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<\n ElementType extends React.ElementType = \"div\",\n>(props: CardProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\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","jsx","SlotComponent","clsx"],"mappings":"yLAiBO,MAAMA,EAAOC,EAAMC,YAAW,SAEnCC,EAA+BC,GACvB,MACFC,UAAAA,EACAC,UAAAA,GAAY,EACZC,QAAAA,EAAU,IACVC,QAAAA,EAAU,OACVC,QAAAA,EACAC,GAAAA,EAAK,SACFC,GACHR,EAKA,OAAAS,EAHcH,EAAUI,EAAgBH,EAGvC,CACG,cAAY,WACZ,iBAAgBJ,EAChB,eAAcC,EACdF,UAAWS,EAAK,WAAY,aAAaN,IAAWH,MAChDM,EACJP,IAAAA,GAGZ"}

package/build/es/components/card/CardImage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CardImage.js","sources":["../../../../src/components/card/CardImage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { ~~AsChildProps~~ } from \"../../utilities/polymorphism/~~as-child~~.js\";\nimport {~~\n PolymorphicPropsWithRef,\n PolymorphicRef,\n~~} from \"../../utilities/polymorphism/~~polymorphism~~.js\";\nimport { ~~SlotComponent~~ } from \"../../utilities/polymorphism/~~SlotComponent~~.js\";\n\nexport type CardImageProps<ElementType extends React.ElementType> =\n 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<\n ElementType extends React.ElementType = \"img\",\n>(\n {\n as,\n asChild,\n className,\n placement = \"top\",\n ...imageProps\n }: 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(\n \"jkl-card-image\",\n `jkl-card-image--${placement}`,\n className,\n )}\n {...imageProps}\n />\n );\n}) as CardImageComponent;\n"],"names":["CardImage","React","forwardRef","as","asChild","className","placement","imageProps","ref","jsx","SlotComponent","clsx"],"mappings":"yLAgCO,MAAMA,EAAYC,EAAMC,YAAW,UAIlCC,GAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,UAAAA,EAAY,SACTC,GAEPC,GAKI,OAAAC,EAHcL,EAAUM,EAAgBP,GAAM,MAG7C,CACGK,IAAAA,EACAH,UAAWM,EACP,iBACA,mBAAmBL,IACnBD,MAEAE,GAGhB"}
1	+ {"version":3,"file":"CardImage.js","sources":["../../../../src/components/card/CardImage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { SlotComponent } from \"../../utilities/polymorphism/SlotComponent.js\";\nimport type { AsChildProps } from \"../../utilities/polymorphism/as-child.js\";\nimport type {\n PolymorphicPropsWithRef,\n PolymorphicRef,\n} from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport type CardImageProps<ElementType extends React.ElementType> =\n 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<\n ElementType extends React.ElementType = \"img\",\n>(\n {\n as,\n asChild,\n className,\n placement = \"top\",\n ...imageProps\n }: 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(\n \"jkl-card-image\",\n `jkl-card-image--${placement}`,\n className,\n )}\n {...imageProps}\n />\n );\n}) as CardImageComponent;\n"],"names":["CardImage","React","forwardRef","as","asChild","className","placement","imageProps","ref","jsx","SlotComponent","clsx"],"mappings":"yLAgCO,MAAMA,EAAYC,EAAMC,YAAW,UAIlCC,GAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,UAAAA,EAAY,SACTC,GAEPC,GAKI,OAAAC,EAHcL,EAAUM,EAAgBP,GAAM,MAG7C,CACGK,IAAAA,EACAH,UAAWM,EACP,iBACA,mBAAmBL,IACnBD,MAEAE,GAGhB"}

package/build/es/components/card/InfoCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InfoCard.js","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> = ({\n title,\n children,\n density,\n className,\n padding = \"l\",\n ...rest\n}) => (\n <div\n {...rest}\n className={clsx(\"jkl-info-card\", className)}\n data-density={density}\n >\n <div\n className={clsx(\"jkl-info-card__content-wrapper\")}\n style={getPaddingStyles(padding)}\n >\n {title && <p className=\"jkl-info-card__title\">{title}</p>}\n {children}\n </div>\n </div>\n);\n"],"names":["InfoCard","title","children","density","className","padding","rest","jsx","clsx","jsxs","style","getPaddingStyles"],"mappings":"8IAgBO,MAAMA,EAA8B,EACvCC,MAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,OACPC,KAEHC,EAAC,MAAA,IACOD,EACJF,UAAWI,EAAK,gBAAiBJ,GACjC,eAAcD,EAEdD,SAAAO,EAAC,MAAA,CACGL,UAAWI,EAAK,kCAChBE,MAAOC,EAAiBN,GAEvBH,SAAA,CAAAD,GAAUM,EAAA,IAAA,CAAEH,UAAU,uBAAwBF,SAAMD,IACpDC"}
1	+ {"version":3,"file":"InfoCard.js","sources":["../../../../src/components/card/InfoCard.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { Density, WithChildren } from \"../../core/types.js\";\nimport type { 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> = ({\n title,\n children,\n density,\n className,\n padding = \"l\",\n ...rest\n}) => (\n <div\n {...rest}\n className={clsx(\"jkl-info-card\", className)}\n data-density={density}\n >\n <div\n className={clsx(\"jkl-info-card__content-wrapper\")}\n style={getPaddingStyles(padding)}\n >\n {title && <p className=\"jkl-info-card__title\">{title}</p>}\n {children}\n </div>\n </div>\n);\n"],"names":["InfoCard","title","children","density","className","padding","rest","jsx","clsx","jsxs","style","getPaddingStyles"],"mappings":"8IAgBO,MAAMA,EAA8B,EACvCC,MAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,OACPC,KAEHC,EAAC,MAAA,IACOD,EACJF,UAAWI,EAAK,gBAAiBJ,GACjC,eAAcD,EAEdD,SAAAO,EAAC,MAAA,CACGL,UAAWI,EAAK,kCAChBE,MAAOC,EAAiBN,GAEvBH,SAAA,CAAAD,GAAUM,EAAA,IAAA,CAAEH,UAAU,uBAAwBF,SAAMD,IACpDC"}

package/build/es/components/card/NavCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavCard.js","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 } from \"../image/Image.js\";\nimport { ImageProps } from \"../image/types.js\";\nimport { ErrorTag, InfoTag, SuccessTag, Tag, WarningTag } from \"../tag/Tag.js\";\nimport { TagProps } from \"../tag/types.js\";\nimport { CardTag, PaddingOptions, TagType } from \"./types.js\";\nimport { getPaddingStyles } from \"./utils.js\";\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 }) => (\n <div className=\"jkl-nav-card__info\">{children}</div>\n);\n\nexport interface NavCardProps\n extends PaddingOptions,\n 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 = ({\n text,\n type,\n density,\n}: 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<\n HTMLAnchorElement,\n NavCardProps\n>((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\n className=\"jkl-nav-card__content\"\n style={getPaddingStyles(padding)}\n >\n {tagArr && (\n <div className=\"jkl-nav-card__tag-wrapper\">\n {tagArr.map((t, index) => (\n <NavCardTag\n type={t.type}\n text={t.text}\n key={index}\n />\n ))}\n </div>\n )}\n <div>\n <p\n className={clsx(\n \"jkl-nav-card__link\",\n external ? \"jkl-nav-card__link--external\" : \"\",\n )}\n >\n {title}\n </p>\n {description && (\n <p className=\"jkl-nav-card__description jkl-spacing-xs--top\">\n {description}\n </p>\n )}\n </div>\n {children}\n </div>\n </Component>\n );\n});\n\nNavCard.displayName = \"NavCard\";\n"],"names":["InfoBlock","children","jsx","className","NavCardTag","text","type","density","CardTag","InfoTag","SuccessTag","WarningTag","ErrorTag","Tag","getTag","NavCard","React","forwardRef","props","ref","component","padding","image","tag","title","external","description","rest","Component","tagArr","Array","isArray","jsxs","clsx","Image","style","getPaddingStyles","map","t","index","displayName"],"mappings":"~~4SAca~~,MAAAA,EAA8B,EAAGC,SAAAA,KACzCC,EAAA,MAAA,CAAIC,UAAU,qBAAsBF,SAAAA,IAoCnCG,EAAa,EACfC,KAAAA,EACAC,KAAAA,EACAC,QAAAA,MAEMC,MAAAA,EAnBK,CAACF,IACZ,OAAQA,GACJ,IAAK,OACMG,OAAAA,EACX,IAAK,UACMC,OAAAA,EACX,IAAK,UACMC,OAAAA,EACX,IAAK,QACMC,OAAAA,EACX,QACWC,OAAAA,EACf,EAOgBC,CAAOR,~~GACfE~~,~~OAAAA~~,~~EAAAA~~,~~EAAA~~,~~CAAQD~~,QAAAA,EAAmBN,SAAKI,GAAA,EAG/BU,EAA4BC,EAAMC,YAG7C,CAACC,EAAOC,KACA,MACFC,UAAAA,EAAY,IACZC,QAAAA,EAAU,IACVC,MAAAA,EACAC,IAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,YAAAA,EACAzB,SAAAA,EACAE,UAAAA,EACAI,QAAAA,KACGoB,GACHT,EAEEU,EAAYR,EAEZS,EAAUN,EAAkBO,MAAMC,QAAQR,GAAOA,EAAM,CAACA,QAAxC,EAGlB,OAAAS,EAACJ,EAAA,CACGT,IAAAA,EACA,aAAYK,EACZrB,UAAW8B,EAAK,eAAgB9B,GAChC,eAAcI,KACVoB,EAEH1B,SAAA,CAAAqB,GAAUpB,EAAAgC,EAAA,CAAM/B,UAAU,yBAA0BmB,IACrDU,EAAC,MAAA,CACG7B,UAAU,wBACVgC,MAAOC,EAAiBf,GAEvBpB,SAAA,CACG4B,GAAA3B,EAAC,OAAIC,UAAU,4BACVF,WAAOoC,KAAI,CAACC,EAAGC,IACZrC,EAACE,EAAA,CACGE,KAAMgC,EAAEhC,KACRD,KAAMiC,EAAEjC,MACHkC,SAKpB,MACG,CAAAtC,SAAA,CAAAC,EAAC,IAAA,CACGC,UAAW8B,EACP,qBACAR,EAAW,+BAAiC,IAG/CxB,SAAAuB,IAEJE,GACGxB,EAAC,IAAE,CAAAC,UAAU,gDACRF,SACLyB,OAGPzB,OACL,IAKZc,EAAQyB,YAAc"}
1	+ {"version":3,"file":"NavCard.js","sources":["../../../../src/components/card/NavCard.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n type AnchorHTMLAttributes,\n type ElementType,\n type FC,\n} from \"react\";\nimport type { Density, WithChildren } from \"../../core/types.js\";\nimport { Image } from \"../image/Image.js\";\nimport type { ImageProps } from \"../image/types.js\";\nimport { ErrorTag, InfoTag, SuccessTag, Tag, WarningTag } from \"../tag/Tag.js\";\nimport type { TagProps } from \"../tag/types.js\";\nimport type { CardTag, PaddingOptions, TagType } from \"./types.js\";\nimport { getPaddingStyles } from \"./utils.js\";\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 }) => (\n <div className=\"jkl-nav-card__info\">{children}</div>\n);\n\nexport interface NavCardProps\n extends PaddingOptions,\n 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 = ({\n text,\n type,\n density,\n}: 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<\n HTMLAnchorElement,\n NavCardProps\n>((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\n className=\"jkl-nav-card__content\"\n style={getPaddingStyles(padding)}\n >\n {tagArr && (\n <div className=\"jkl-nav-card__tag-wrapper\">\n {tagArr.map((t, index) => (\n <NavCardTag\n type={t.type}\n text={t.text}\n key={index}\n />\n ))}\n </div>\n )}\n <div>\n <p\n className={clsx(\n \"jkl-nav-card__link\",\n external ? \"jkl-nav-card__link--external\" : \"\",\n )}\n >\n {title}\n </p>\n {description && (\n <p className=\"jkl-nav-card__description jkl-spacing-xs--top\">\n {description}\n </p>\n )}\n </div>\n {children}\n </div>\n </Component>\n );\n});\n\nNavCard.displayName = \"NavCard\";\n"],"names":["InfoBlock","children","jsx","className","NavCardTag","text","type","density","CardTag","InfoTag","SuccessTag","WarningTag","ErrorTag","Tag","getTag","NavCard","React","forwardRef","props","ref","component","padding","image","tag","title","external","description","rest","Component","tagArr","Array","isArray","jsxs","clsx","Image","style","getPaddingStyles","map","t","index","displayName"],"mappings":"4SAkBa,MAAAA,EAA8B,EAAGC,SAAAA,KACzCC,EAAA,MAAA,CAAIC,UAAU,qBAAsBF,SAAAA,IAoCnCG,EAAa,EACfC,KAAAA,EACAC,KAAAA,EACAC,QAAAA,MAEMC,MAAAA,EAnBK,CAACF,IACZ,OAAQA,GACJ,IAAK,OACMG,OAAAA,EACX,IAAK,UACMC,OAAAA,EACX,IAAK,UACMC,OAAAA,EACX,IAAK,QACMC,OAAAA,EACX,QACWC,OAAAA,EACf,EAOgBC,CAAOR,GAChB,OAAAJ,EAACM,EAAQ,CAAAD,QAAAA,EAAmBN,SAAKI,GAAA,EAG/BU,EAA4BC,EAAMC,YAG7C,CAACC,EAAOC,KACA,MACFC,UAAAA,EAAY,IACZC,QAAAA,EAAU,IACVC,MAAAA,EACAC,IAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,YAAAA,EACAzB,SAAAA,EACAE,UAAAA,EACAI,QAAAA,KACGoB,GACHT,EAEEU,EAAYR,EAEZS,EAAUN,EAAkBO,MAAMC,QAAQR,GAAOA,EAAM,CAACA,QAAxC,EAGlB,OAAAS,EAACJ,EAAA,CACGT,IAAAA,EACA,aAAYK,EACZrB,UAAW8B,EAAK,eAAgB9B,GAChC,eAAcI,KACVoB,EAEH1B,SAAA,CAAAqB,GAAUpB,EAAAgC,EAAA,CAAM/B,UAAU,yBAA0BmB,IACrDU,EAAC,MAAA,CACG7B,UAAU,wBACVgC,MAAOC,EAAiBf,GAEvBpB,SAAA,CACG4B,GAAA3B,EAAC,OAAIC,UAAU,4BACVF,WAAOoC,KAAI,CAACC,EAAGC,IACZrC,EAACE,EAAA,CACGE,KAAMgC,EAAEhC,KACRD,KAAMiC,EAAEjC,MACHkC,SAKpB,MACG,CAAAtC,SAAA,CAAAC,EAAC,IAAA,CACGC,UAAW8B,EACP,qBACAR,EAAW,+BAAiC,IAG/CxB,SAAAuB,IAEJE,GACGxB,EAAC,IAAE,CAAAC,UAAU,gDACRF,SACLyB,OAGPzB,OACL,IAKZc,EAAQyB,YAAc"}

package/build/es/components/card/TaskCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TaskCard.js","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\n className=\"jkl-task-card__content-wrapper\"\n style={getPaddingStyles(padding)}\n >\n {children}\n </div>\n </div>\n);\n"],"names":["TaskCard","bgColor","background","withShadow","padding","className","children","density","rest","jsx","clsx","style","getPaddingStyles"],"mappings":"oIA0BO,MAAMA,EAA8B,EACvCC,QAAAA,EACAC,WAAAA,EAAa,cACbC,WAAAA,GAAa,EACbC,QAAAA,EAAU,IACVC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,KACGC,KAEHC,EAAC,MAAA,CACGJ,UAAWK,EAAK,gBAAiBL,EAAW,CAExC,CAAC,kBAAkBH,MAAgBD,EACnC,CAAC,kBAAkBA,OAAcA,EACjC,6BAA8BE,IAElC,eAAcI,KACVC,EAEJF,SAAAG,EAAC,MAAA,CACGJ,UAAU,iCACVM,MAAOC,EAAiBR,GAEvBE,SAAAA"}
1	+ {"version":3,"file":"TaskCard.js","sources":["../../../../src/components/card/TaskCard.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport type { Density, WithChildren } from \"../../core/types.js\";\nimport type { 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\n className=\"jkl-task-card__content-wrapper\"\n style={getPaddingStyles(padding)}\n >\n {children}\n </div>\n </div>\n);\n"],"names":["TaskCard","bgColor","background","withShadow","padding","className","children","density","rest","jsx","clsx","style","getPaddingStyles"],"mappings":"oIA0BO,MAAMA,EAA8B,EACvCC,QAAAA,EACAC,WAAAA,EAAa,cACbC,WAAAA,GAAa,EACbC,QAAAA,EAAU,IACVC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,KACGC,KAEHC,EAAC,MAAA,CACGJ,UAAWK,EAAK,gBAAiBL,EAAW,CAExC,CAAC,kBAAkBH,MAAgBD,EACnC,CAAC,kBAAkBA,OAAcA,EACjC,6BAA8BE,IAElC,eAAcI,KACVC,EAEJF,SAAAG,EAAC,MAAA,CACGJ,UAAU,iCACVM,MAAOC,EAAiBR,GAEvBE,SAAAA"}

package/build/es/components/card/development/examples/FakturainfoExample.d.ts CHANGED Viewed

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

package/build/es/components/card/development/examples/InfoCardExample.d.ts CHANGED Viewed

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

package/build/es/components/card/development/examples/NavCardExample.d.ts CHANGED Viewed

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

package/build/es/components/card/development/examples/StatuskortExample.d.ts CHANGED Viewed

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

package/build/es/components/card/development/examples/TaskCardExample.d.ts CHANGED Viewed

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

package/build/es/components/card/development/examples/TopExample.d.ts CHANGED Viewed

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

package/build/es/components/card/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sources":["../../../../src/components/card/types.ts"],"sourcesContent":["import { PolymorphicPropsWithRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport const SPACING_STEPS = [\n \"0\",\n \"m\",\n \"l\",\n \"xl\",\n \"2xl\",\n \"3xl\",\n \"4xl\",\n] as const;\ntype SpacingSteps = typeof SPACING_STEPS;\nexport const NEW_SPACING_STEPS = [\n \"0\",\n \"16\",\n \"24\",\n \"40\",\n \"64\",\n \"104\",\n \"168\",\n] as const;\ntype NewSpacingSteps = typeof NEW_SPACING_STEPS;\nexport type BasePadding =\n \| SpacingSteps[0 \| 1 \| 2 \| 3]\n \| 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 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\ntype Props = {\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\nexport type CardProps<ElementType extends React.ElementType> =\n PolymorphicPropsWithRef<ElementType, Props> & Props;\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\nexport type TagType = \"success\" \| \"warning\" \| \"info\" \| \"error\";\n\nexport type CardTag = {\n /\n @default <none> Rendres som nøytral tag\n */\n type?: TagType;\n text: string;\n};\n"],"names":["SPACING_STEPS","NEW_SPACING_STEPS","isOldSpacingStep","value","includes","CARD_PADDINGS","CARD_VARIANTS"],"mappings":"AAEO,MAAMA,EAAgB,CACzB,IACA,IACA,IACA,KACA,MACA,MACA,OAGSC,EAAoB,CAC7B,IACA,KACA,KACA,KACA,KACA,MACA,OAUG,SAASC,EAAiBC,GACtBH,OAAAA,EAAcI,SAASD,EAClC,CAEO,MAAME,EAAgB,CAAC,IAAK,IAAK,IAAK,MAEhCC,EAAgB,CAAC,WAAY,OAAQ"}
1	+ {"version":3,"file":"types.js","sources":["../../../../src/components/card/types.ts"],"sourcesContent":["import type { PolymorphicPropsWithRef } from \"../../utilities/polymorphism/polymorphism.js\";\n\nexport const SPACING_STEPS = [\n \"0\",\n \"m\",\n \"l\",\n \"xl\",\n \"2xl\",\n \"3xl\",\n \"4xl\",\n] as const;\ntype SpacingSteps = typeof SPACING_STEPS;\nexport const NEW_SPACING_STEPS = [\n \"0\",\n \"16\",\n \"24\",\n \"40\",\n \"64\",\n \"104\",\n \"168\",\n] as const;\ntype NewSpacingSteps = typeof NEW_SPACING_STEPS;\nexport type BasePadding =\n \| SpacingSteps[0 \| 1 \| 2 \| 3]\n \| 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 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\ntype Props = {\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\nexport type CardProps<ElementType extends React.ElementType> =\n PolymorphicPropsWithRef<ElementType, Props> & Props;\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\nexport type TagType = \"success\" \| \"warning\" \| \"info\" \| \"error\";\n\nexport type CardTag = {\n /\n @default <none> Rendres som nøytral tag\n */\n type?: TagType;\n text: string;\n};\n"],"names":["SPACING_STEPS","NEW_SPACING_STEPS","isOldSpacingStep","value","includes","CARD_PADDINGS","CARD_VARIANTS"],"mappings":"AAEO,MAAMA,EAAgB,CACzB,IACA,IACA,IACA,KACA,MACA,MACA,OAGSC,EAAoB,CAC7B,IACA,KACA,KACA,KACA,KACA,MACA,OAUG,SAASC,EAAiBC,GACtBH,OAAAA,EAAcI,SAASD,EAClC,CAEO,MAAME,EAAgB,CAAC,IAAK,IAAK,IAAK,MAEhCC,EAAgB,CAAC,WAAY,OAAQ"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","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(\n spacingStep?: SpacingStep,\n fallback: SpacingStep = \"24\",\n): 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(\n padding: BasePadding \| PaddingShorthand,\n): CSSProperties {\n if (typeof padding === \"string\") {\n return {\n padding: `var(--jkl-spacing-${\n NEW_SPACING_STEPS[getSpacingIndex(padding)]\n })`,\n };\n }\n\n // Sett sidepadding til den største av de to innsendte verdiene (eller \"24\")\n const sideSpacingIndex = Math.max(\n getSpacingIndex(padding.left),\n getSpacingIndex(padding.right),\n );\n const sidePadding = NEW_SPACING_STEPS[sideSpacingIndex];\n\n // Sett topp-/bunnpadding til det største av innsendt verdi og sidepadding\n const topPadding =\n NEW_SPACING_STEPS[\n Math.max(\n sideSpacingIndex,\n getSpacingIndex(padding.top, sidePadding),\n )\n ];\n const bottomPadding =\n NEW_SPACING_STEPS[\n Math.max(\n sideSpacingIndex,\n getSpacingIndex(padding.bottom, sidePadding),\n )\n ];\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","getPaddingStyles","padding","sideSpacingIndex","Math","max","left","right","sidePadding","top","bottom"],"mappings":"wFAIA,SAASA,EACLC,EACAC,EAAwB,MAExB,MAAMC,EAAQF,GAAeC,EACzBE,OAAAA,EAAiBD,GACVE,EAAcC,QAAQH,~~GAEtBI~~,EAAkBD,QAAQH,~~EAEzC~~,CAEO,SAASK,EACZC,GAEI,GAAmB,iBAAZA,EACA,MAAA,CACHA,QAAS,qBACLF,EAAkBP,EAAgBS,QAM9C,MAAMC,EAAmBC,KAAKC,IAC1BZ,EAAgBS,EAAQI,MACxBb,EAAgBS,EAAQK,QAEtBC,EAAcR,EAAkBG,GAuB/B,MAAA,CAAED,QAAS,GALN,qBAdRF,EACII,KAAKC,IACDF,EACAV,EAAgBS,EAAQO,IAAKD,WAY3B,qBAAqBA,QACpB,qBATXR,EACII,KAAKC,IACDF,EACAV,EAAgBS,EAAQQ,OAAQF,WAO/B,qBAAqBA,OAGtC"}
1	+ {"version":3,"file":"utils.js","sources":["../../../../src/components/card/utils.ts"],"sourcesContent":["import type { CSSProperties } from \"react\";\nimport { NEW_SPACING_STEPS, SPACING_STEPS, isOldSpacingStep } from \"./types.js\";\nimport type { BasePadding, PaddingShorthand, SpacingStep } from \"./types.js\";\n\nfunction getSpacingIndex(\n spacingStep?: SpacingStep,\n fallback: SpacingStep = \"24\",\n): number {\n const value = spacingStep \|\| fallback;\n if (isOldSpacingStep(value)) {\n return SPACING_STEPS.indexOf(value);\n }\n\n return NEW_SPACING_STEPS.indexOf(value);\n}\n\nexport function getPaddingStyles(\n padding: BasePadding \| PaddingShorthand,\n): CSSProperties {\n if (typeof padding === \"string\") {\n return {\n padding: `var(--jkl-spacing-${\n NEW_SPACING_STEPS[getSpacingIndex(padding)]\n })`,\n };\n }\n\n // Sett sidepadding til den største av de to innsendte verdiene (eller \"24\")\n const sideSpacingIndex = Math.max(\n getSpacingIndex(padding.left),\n getSpacingIndex(padding.right),\n );\n const sidePadding = NEW_SPACING_STEPS[sideSpacingIndex];\n\n // Sett topp-/bunnpadding til det største av innsendt verdi og sidepadding\n const topPadding =\n NEW_SPACING_STEPS[\n Math.max(\n sideSpacingIndex,\n getSpacingIndex(padding.top, sidePadding),\n )\n ];\n const bottomPadding =\n NEW_SPACING_STEPS[\n Math.max(\n sideSpacingIndex,\n getSpacingIndex(padding.bottom, sidePadding),\n )\n ];\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","getPaddingStyles","padding","sideSpacingIndex","Math","max","left","right","sidePadding","top","bottom"],"mappings":"wFAIA,SAASA,EACLC,EACAC,EAAwB,MAExB,MAAMC,EAAQF,GAAeC,EACzBE,OAAAA,EAAiBD,GACVE,EAAcC,QAAQH,GAG1BI,EAAkBD,QAAQH,EACrC,CAEO,SAASK,EACZC,GAEI,GAAmB,iBAAZA,EACA,MAAA,CACHA,QAAS,qBACLF,EAAkBP,EAAgBS,QAM9C,MAAMC,EAAmBC,KAAKC,IAC1BZ,EAAgBS,EAAQI,MACxBb,EAAgBS,EAAQK,QAEtBC,EAAcR,EAAkBG,GAuB/B,MAAA,CAAED,QAAS,GALN,qBAdRF,EACII,KAAKC,IACDF,EACAV,EAAgBS,EAAQO,IAAKD,WAY3B,qBAAqBA,QACpB,qBATXR,EACII,KAAKC,IACDF,EACAV,EAAgBS,EAAQQ,OAAQF,WAO/B,qBAAqBA,OAGtC"}

package/build/es/components/checkbox/Checkbox.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Checkbox.js","sources":["../../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useEffect,\n useImperativeHandle,\n useRef,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { CheckboxProps } from \"./types.js\";\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n (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 (\n checked === true &&\n indeterminate === true &&\n process.env.NODE_ENV !== \"production\"\n ) {\n console.warn(\n \"A Checkbox can not be both checked and indeterminate, and will be treated as checked\",\n );\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);\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":"qOAUO,MAAMA,EAAWC,GACpB,CAACC,EAAOC,KACE,MACFC,GAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACA,kBAAmBC,EACnBC,QAAAA,EACAC,cAAAA,KACGC,GACHX,EAEEY,EAAWC,EAAyB,MAC1CC,~~EAAoBb~~,~~GAAK~~,IAAMW,EAASG,~~SAAU~~,~~IAE5CC~~,MAAAA,EAAUC,EAAMf,GAAM,eAAgB,CAAEgB,gBAAiBhB,IAE/D,OAAAiB,GAAU,MAEU,IAAZV,IACkB,IAAlBC,GACyB,eAAzBU,QAAQC,IAAIC,UAEJC,QAAAC,KACJ,wFAGJZ,EAASG,UACTH,EAASG,QAAQL,eAAiBD,KAAaC,EAAAA,GAEpD,CAACD,EAASC,IAGTe,EAAC,MAAA,CACGpB,UAAWqB,EAAK,eAAgBrB,EAAW,CACvC,uBAAwBC,EACxB,sBAAuBF,IAE3B,eAAcG,EAEdJ,SAAA,CAAAwB,EAAC,QAAA,CACGzB,GAAIc,EACJf,IAAKW,EACLP,UAAU,sBACV,cAAY,qBACZ,eAAcD,EACdwB,KAAK,WACL,kBAAiBpB,EACjBC,QAAAA,KACIE,IAEPc,EAAA,QAAA,CAAMI,QAASb,EAASX,UAAU,sBAC/BF,SAAA,CAACsB,EAAA,OAAA,CAAKpB,UAAU,qBACZF,SAAA,CAACwB,EAAA,OAAA,CAAKtB,UAAU,qCAChBsB,EAAC,OAAK,CAAAtB,UAAU,gCAEnBsB,EAAA,OAAA,CAAKtB,UAAU,qBAAsBF,SAAAA,SAC1C,IAMhBL,EAASgC,YAAc"}
1	+ {"version":3,"file":"Checkbox.js","sources":["../../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useEffect,\n useImperativeHandle,\n useRef,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport type { CheckboxProps } from \"./types.js\";\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n (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(\n ref,\n () => inputRef.current as HTMLInputElement,\n [],\n );\n\n const inputId = useId(id \|\| \"jkl-checkbox\", { generateSuffix: !id });\n\n useEffect(() => {\n if (\n checked === true &&\n indeterminate === true &&\n process.env.NODE_ENV !== \"production\"\n ) {\n console.warn(\n \"A Checkbox can not be both checked and indeterminate, and will be treated as checked\",\n );\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);\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":"qOAUO,MAAMA,EAAWC,GACpB,CAACC,EAAOC,KACE,MACFC,GAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,OAAAA,GAAS,EACTC,QAAAA,EACA,kBAAmBC,EACnBC,QAAAA,EACAC,cAAAA,KACGC,GACHX,EAEEY,EAAWC,EAAyB,MAC1CC,EACIb,GACA,IAAMW,EAASG,SACf,IAGEC,MAAAA,EAAUC,EAAMf,GAAM,eAAgB,CAAEgB,gBAAiBhB,IAE/D,OAAAiB,GAAU,MAEU,IAAZV,IACkB,IAAlBC,GACyB,eAAzBU,QAAQC,IAAIC,UAEJC,QAAAC,KACJ,wFAGJZ,EAASG,UACTH,EAASG,QAAQL,eAAiBD,KAAaC,EAAAA,GAEpD,CAACD,EAASC,IAGTe,EAAC,MAAA,CACGpB,UAAWqB,EAAK,eAAgBrB,EAAW,CACvC,uBAAwBC,EACxB,sBAAuBF,IAE3B,eAAcG,EAEdJ,SAAA,CAAAwB,EAAC,QAAA,CACGzB,GAAIc,EACJf,IAAKW,EACLP,UAAU,sBACV,cAAY,qBACZ,eAAcD,EACdwB,KAAK,WACL,kBAAiBpB,EACjBC,QAAAA,KACIE,IAEPc,EAAA,QAAA,CAAMI,QAASb,EAASX,UAAU,sBAC/BF,SAAA,CAACsB,EAAA,OAAA,CAAKpB,UAAU,qBACZF,SAAA,CAACwB,EAAA,OAAA,CAAKtB,UAAU,qCAChBsB,EAAC,OAAK,CAAAtB,UAAU,gCAEnBsB,EAAA,OAAA,CAAKtB,UAAU,qBAAsBF,SAAAA,SAC1C,IAMhBL,EAASgC,YAAc"}

package/build/es/components/checkbox-panel/CheckboxPanel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e}from"react/jsx-runtime";import{forwardRef as a,useState as t,useCallback as r}from"react";import{BasePanel as s}from"../../shared/input-panel/BasePanel.js";const c=a((function({label:a,extraLabel:c,alwaysOpen:l=!1,checked:n,defaultChecked:o,onChange:d,...h},f){const[p,u]=t(o||!1),k=r((e=>{null==d||d(e),u(e.target.checked)}),[d,u]),i=typeof n<"u";return e(s,{ref:f,type:"checkbox",isChecked:i?n:p,defaultChecked:o,checked:i?n:void 0,onChange:k,alwaysOpen:l,label:a,extraLabel:c,...h})}));export{c as CheckboxPanel};
+import{jsx as e}from"react/jsx-runtime";import{forwardRef as a,useState as t,useCallback as r}from"react";import{BasePanel as s}from"../../shared/input-panel/BasePanel.js";const c=a((function({label:a,extraLabel:c,alwaysOpen:l=!1,checked:n,defaultChecked:o,onChange:d,...h},f){const[p,u]=t(o||!1),k=r((e=>{null==d||d(e),u(e.target.checked)}),[d]),i=typeof n<"u";return e(s,{ref:f,type:"checkbox",isChecked:i?n:p,defaultChecked:o,checked:i?n:void 0,onChange:k,alwaysOpen:l,label:a,extraLabel:c,...h})}));export{c as CheckboxPanel};
 //# sourceMappingURL=CheckboxPanel.js.map

package/build/es/components/checkbox-panel/CheckboxPanel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckboxPanel.js","sources":["../../../../src/components/checkbox-panel/CheckboxPanel.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n ForwardedRef,\n forwardRef,\n useCallback,\n useState,\n} from \"react\";\nimport { BasePanel } from \"../../shared/input-panel/BasePanel.js\";\nimport { CheckboxPanelProps } from \"./types.js\";\n\nexport const CheckboxPanel = forwardRef(function CheckboxPanel(\n {\n label,\n extraLabel,\n alwaysOpen = false,\n checked,\n defaultChecked,\n onChange,\n ...rest\n }: CheckboxPanelProps,\n ref: ForwardedRef<HTMLInputElement>,\n) {\n const [_isChecked, setIsChecked] = useState(defaultChecked \|\| false);\n\n const handleChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n onChange?.(e);\n setIsChecked(e.target.checked);\n },\n [onChange~~, setIsChecked~~],\n );\n\n const isControlled = typeof checked !== \"undefined\";\n const isChecked = isControlled ? checked : _isChecked;\n\n return (\n <BasePanel\n ref={ref}\n type=\"checkbox\"\n isChecked={isChecked}\n defaultChecked={defaultChecked}\n checked={isControlled ? checked : undefined}\n onChange={handleChange}\n alwaysOpen={alwaysOpen}\n label={label}\n extraLabel={extraLabel}\n {...rest}\n />\n );\n});\n"],"names":["CheckboxPanel","forwardRef","label","extraLabel","alwaysOpen","checked","defaultChecked","onChange","rest","ref","_isChecked","setIsChecked","useState","handleChange","useCallback","e","target","isControlled","jsx","BasePanel","type","isChecked"],"mappings":"4KAUa,MAAAA,EAAgBC,GAAW,UAEhCC,MAAAA,EACAC,WAAAA,EACAC,WAAAA,GAAa,EACbC,QAAAA,EACAC,eAAAA,EACAC,SAAAA,KACGC,GAEPC,GAEM,MAACC,EAAYC,GAAgBC,EAASN,IAAkB,GAExDO,EAAeC,GAChBC,IACG,MAAAR,GAAAA,EAAWQ,GACEJ,EAAAI,EAAEC,OAAOX,QAAO,GAEjC,CAACE,~~EAAUI~~,~~IAGTM,~~SAAsBZ,EAAY,IAIpC,OAAAa,EAACC,EAAA,CACGV,IAAAA,EACAW,KAAK,WACLC,UANUJ,EAAeZ,EAAUK,EAOnCJ,eAAAA,EACAD,QAASY,EAAeZ,OAAU,EAClCE,SAAUM,EACVT,WAAAA,EACAF,MAAAA,EACAC,WAAAA,KACIK,GAGhB"}
1	+ {"version":3,"file":"CheckboxPanel.js","sources":["../../../../src/components/checkbox-panel/CheckboxPanel.tsx"],"sourcesContent":["import React, {\n type ChangeEvent,\n type ForwardedRef,\n forwardRef,\n useCallback,\n useState,\n} from \"react\";\nimport { BasePanel } from \"../../shared/input-panel/BasePanel.js\";\nimport type { CheckboxPanelProps } from \"./types.js\";\n\nexport const CheckboxPanel = forwardRef(function CheckboxPanel(\n {\n label,\n extraLabel,\n alwaysOpen = false,\n checked,\n defaultChecked,\n onChange,\n ...rest\n }: CheckboxPanelProps,\n ref: ForwardedRef<HTMLInputElement>,\n) {\n const [_isChecked, setIsChecked] = useState(defaultChecked \|\| false);\n\n const handleChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n onChange?.(e);\n setIsChecked(e.target.checked);\n },\n [onChange],\n );\n\n const isControlled = typeof checked !== \"undefined\";\n const isChecked = isControlled ? checked : _isChecked;\n\n return (\n <BasePanel\n ref={ref}\n type=\"checkbox\"\n isChecked={isChecked}\n defaultChecked={defaultChecked}\n checked={isControlled ? checked : undefined}\n onChange={handleChange}\n alwaysOpen={alwaysOpen}\n label={label}\n extraLabel={extraLabel}\n {...rest}\n />\n );\n});\n"],"names":["CheckboxPanel","forwardRef","label","extraLabel","alwaysOpen","checked","defaultChecked","onChange","rest","ref","_isChecked","setIsChecked","useState","handleChange","useCallback","e","target","isControlled","jsx","BasePanel","type","isChecked"],"mappings":"4KAUa,MAAAA,EAAgBC,GAAW,UAEhCC,MAAAA,EACAC,WAAAA,EACAC,WAAAA,GAAa,EACbC,QAAAA,EACAC,eAAAA,EACAC,SAAAA,KACGC,GAEPC,GAEM,MAACC,EAAYC,GAAgBC,EAASN,IAAkB,GAExDO,EAAeC,GAChBC,IACG,MAAAR,GAAAA,EAAWQ,GACEJ,EAAAI,EAAEC,OAAOX,QAAO,GAEjC,CAACE,IAGCU,SAAsBZ,EAAY,IAIpC,OAAAa,EAACC,EAAA,CACGV,IAAAA,EACAW,KAAK,WACLC,UANUJ,EAAeZ,EAAUK,EAOnCJ,eAAAA,EACAD,QAASY,EAAeZ,OAAU,EAClCE,SAAUM,EACVT,WAAAA,EACAF,MAAAA,EACAC,WAAAA,KACIK,GAGhB"}

package/build/es/components/chip/Chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Chip.js","sources":["../../../../src/components/chip/Chip.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { CheckIcon } from \"../icon/icons/CheckIcon.js\";\nimport { CloseIcon } from \"../icon/icons/CloseIcon.js\";\nimport { ChipProps } from \"./types.js\";\n\nexport const Chip = forwardRef<HTMLButtonElement, ChipProps>(function Chip(\n {\n className,\n variant,\n onClick,\n children,\n selected,\n size = \"small\",\n ...rest\n },\n ref,\n) {\n return (\n <button\n type=\"button\"\n ref={ref}\n className={clsx(\n \"jkl-chip\",\n `jkl-chip--${size}`,\n `jkl-chip--${variant}`,\n className,\n )}\n onClick={onClick}\n aria-pressed={selected}\n {...rest}\n >\n {children}\n {variant === \"filter\" && selected && (\n <CheckIcon\n className=\"jkl-chip__icon\"\n variant=\"small\"\n data-testid=\"jkl-check-icon\"\n />\n )}\n {variant === \"input\" && (\n <CloseIcon\n className=\"jkl-chip__icon\"\n variant=\"small\"\n data-testid=\"jkl-close-icon\"\n />\n )}\n </button>\n );\n});\n"],"names":["Chip","forwardRef","className","variant","onClick","children","selected","size","rest","ref","jsxs","type","clsx","jsx","CheckIcon","CloseIcon"],"mappings":"iPAMa,MAAAA,EAAOC,GAAyC,UAErDC,UAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EAAO,WACJC,GAEPC,GAGI,OAAAC,EAAC,SAAA,CACGC,KAAK,SACLF,IAAAA,EACAP,UAAWU,EACP,WACA,aAAaL,IACb,aAAaJ,IACbD,GAEJE,QAAAA,EACA,eAAcE,KACVE,EAEHH,SAAA,CAAAA,EACY,WAAZF,GAAwBG,GACrBO,EAACC,EAAA,CACGZ,UAAU,iBACVC,QAAQ,QACR,cAAY,mBAGP,UAAZA,GACGU,EAACE,EAAA,CACGb,UAAU,iBACVC,QAAQ,QACR,cAAY,qBAKhC"}
1	+ {"version":3,"file":"Chip.js","sources":["../../../../src/components/chip/Chip.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { CheckIcon } from \"../icon/icons/CheckIcon.js\";\nimport { CloseIcon } from \"../icon/icons/CloseIcon.js\";\nimport type { ChipProps } from \"./types.js\";\n\nexport const Chip = forwardRef<HTMLButtonElement, ChipProps>(function Chip(\n {\n className,\n variant,\n onClick,\n children,\n selected,\n size = \"small\",\n ...rest\n },\n ref,\n) {\n return (\n <button\n type=\"button\"\n ref={ref}\n className={clsx(\n \"jkl-chip\",\n `jkl-chip--${size}`,\n `jkl-chip--${variant}`,\n className,\n )}\n onClick={onClick}\n aria-pressed={selected}\n {...rest}\n >\n {children}\n {variant === \"filter\" && selected && (\n <CheckIcon\n className=\"jkl-chip__icon\"\n variant=\"small\"\n data-testid=\"jkl-check-icon\"\n />\n )}\n {variant === \"input\" && (\n <CloseIcon\n className=\"jkl-chip__icon\"\n variant=\"small\"\n data-testid=\"jkl-close-icon\"\n />\n )}\n </button>\n );\n});\n"],"names":["Chip","forwardRef","className","variant","onClick","children","selected","size","rest","ref","jsxs","type","clsx","jsx","CheckIcon","CloseIcon"],"mappings":"iPAMa,MAAAA,EAAOC,GAAyC,UAErDC,UAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,SAAAA,EACAC,SAAAA,EACAC,KAAAA,EAAO,WACJC,GAEPC,GAGI,OAAAC,EAAC,SAAA,CACGC,KAAK,SACLF,IAAAA,EACAP,UAAWU,EACP,WACA,aAAaL,IACb,aAAaJ,IACbD,GAEJE,QAAAA,EACA,eAAcE,KACVE,EAEHH,SAAA,CAAAA,EACY,WAAZF,GAAwBG,GACrBO,EAACC,EAAA,CACGZ,UAAU,iBACVC,QAAQ,QACR,cAAY,mBAGP,UAAZA,GACGU,EAACE,EAAA,CACGb,UAAU,iBACVC,QAAQ,QACR,cAAY,qBAKhC"}

package/build/es/components/combobox/Combobox.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as o}from"react/jsx-runtime";import{c as t}from"../../../clsx-BeLtu-UY.js";import{useState as a,useRef as n,useEffect as l,useCallback as r,useMemo as i}from"react";import{useAnimatedHeight as s}from"../../hooks/useAnimatedHeight/useAnimatedHeight.js";import{useId as c}from"../../hooks/useId/useId.js";import{useListNavigation as u}from"../../hooks/useListNavigation/useListNavigation.js";import{Chip as p}from"../chip/Chip.js";import{ArrowVerticalAnimated as d}from"../icon/icons/animated/ArrowVerticalAnimated.js";import{CheckIcon as m}from"../icon/icons/CheckIcon.js";import{IconButton as b}from"../icon-button/IconButton.js";import{InputGroup as v}from"../input-group/InputGroup.js";import{Tooltip as f}from"../tooltip/Tooltip.js";import{TooltipContent as h}from"../tooltip/TooltipContent.js";import{TooltipTrigger as k}from"../tooltip/TooltipTrigger.js";function g(e){return"string"==typeof e?{value:e,label:e}:e}const _=({id:_,placeholder:j,items:x,onChange:y,onFocus:w,onBlur:C,value:$,label:N,noMatchingOption:L,labelProps:T,helpLabel:I,errorLabel:B,width:D,density:P,name:A,className:E,invalid:F,hasTagHover:M})=>{var O,K;const S=c(_||"jkl-combobox",{generateSuffix:!_}),V=`${S}_label`,H=`${S}_button`,q=`${S}_search-input`,[G,R]=a($||[]),[U,z]=a(!1),[J,Q]=a(""),[W,X]=a(!1),[Y,Z]=a(!1),ee=n(null),oe=n(null),te=n(!1);l((()=>{Q(""),U&&ee.current&&ee.current.focus()}),[U]),l((()=>{R((e=>$||e))}),[$]);const ae=e=>!!G&&G.some((o=>o.value===e.value)),ne=r((e=>G.filter((o=>o.value!==e))),[G]),le=r(((e,o)=>{let t=ne(o);R(t),y({type:"change",target:{name:A,value:o,selectedOptions:t}}),e.stopPropagation(),0===t.length&&Z(!1)}),[ne,R,y,A,Z]),re=r((e=>{var o;let t;if(G.some((o=>o.value===e)))t=ne(e);else{const o=x.find((o=>o.value===e));t=[...G,o]}null==(o=ee.current)||o.focus(),R(t),y({type:"change",target:{name:A,value:e,selectedOptions:t}})}),[G,R,y,A,ne,x]),ie=e=>{var o;null==(o=ee.current)||o.focus(),z(!0),Q(e.target.value)},se=i((()=>{if(!J)return x;const e=x.filter((e=>e.label.toLowerCase().indexOf(J.toLowerCase())>=0));return X(0===e.length),e}),[J,x]),[ce,ue]=a(null!=(O=se[0])&&O.value?`${S}-${null==(K=se[0])?void 0:K.value}`:void 0),pe=!U;l((()=>{const e=e=>{"Escape"===e.key&&U&&z(!1)};return typeof window<"u"&&window.addEventListener("keydown",e),()=>{typeof window<"u"&&U&&window.removeEventListener("keydown",e)}}),[z,U]);const de=r((e=>{e?ee.current&&ee.current.focus():te.current&&oe.current&&oe.current.focus()}),[]),me=r((()=>{te.current||(w&&w({type:"change",target:{name:A,value:(null==G?void 0:G[0].value)||"",selectedOptions:G}}),te.current=!0,z(!0))}),[w,G,A]),[be]=s(U,{onFirstVisible:de,onTransitionEnd:de});u({ref:be});const ve=n(null),fe=r((e=>{var o,t;const a=ve.current;a&&a.contains(e.relatedTarget)||(Q(""),C&&(C({type:"blur",target:{name:A,value:(null==(o=null==G?void 0:G[0])?void 0:o.value)||"",selectedOptions:G}}),null==(t=oe.current)||t.dispatchEvent(new Event("focusout",{bubbles:!0}))),te.current=!1,z(!1))}),[C,A,G]),he=r((e=>{e.target.focus({preventScroll:!0})}),[]),ke=r((e=>{var o;if("ArrowDown"===e.key){e.preventDefault(),e.stopPropagation();const t=be.current;t&&(null==(o=t.querySelector('[role="option"]'))||o.focus())}else"Escape"===e.key&&(e.preventDefault(),e.stopPropagation(),z(!1));if(e.metaKey&&"a"===e.key||e.ctrlKey&&"a"===e.key){e.preventDefault(),e.stopPropagation();const o=G.map((e=>({...e,isMarked:!0})));Z(!0),R(o)}else if("Backspace"===e.key)if(e.stopPropagation(),Z(!1),G.some((e=>e.isMarked))){const e=G.filter((e=>!e.isMarked));R(e),Q("")}else G.length>0&&""===J&&le(e,G[G.length-1].value)}),[G,J,be,le]),ge=r((e=>{if("Tab"===e.key)ee.current&&(e.preventDefault(),e.stopPropagation(),e.shiftKey||z(!1),ee.current.focus());else if("ArrowUp"===e.key&&be.current&&ee.current){const o=be.current.querySelector('[role="option"]:not([hidden])');e.currentTarget.id===(null==o?void 0:o.id)&&ee.current&&ee.current.focus()}}),[z,be]),_e=G.length>=1,je=r((o=>e(p,{"data-testid":"jkl-chip","aria-label":`Fjern ${o.tagLabel}`,className:`jkl-combobox__selected-option ${Y&&"jkl-combobox__selected-option--marked"}`,variant:"input",onClick:e=>{ee.current&&ee.current.focus(),le(e,o.value)},onBlur:fe,children:o.tagLabel?o.tagLabel:o.label},o.value)),[fe,le,Y]);return e(v,{label:N,id:q,ref:ve,"data-testid":"jkl-combobox",className:t("jkl-combobox",E,{"jkl-combobox--invalid":!!B||F,"jkl-combobox--menu-open":U,"jkl-combobox--menu-closed":!U&&_e}),labelProps:{id:V,...T},helpLabel:I,errorLabel:B,density:P,render:a=>o("div",{className:t("jkl-combobox__wrapper",{"jkl-combobox__wrapper--active-value":_e}),style:{width:D},tabIndex:-1,onFocus:me,onBlur:fe,children:[o("div",{className:"jkl-combobox__chips","data-testid":"jkl-combobox__chips",children:[G.map(g).map((t=>M?o(f,{children:[e(k,{children:je(t)}),e(h,{children:t.label})]},t.value):je(t))),e("input",{...a,className:"jkl-combobox__search-input",onChange:ie,"data-testid":"jkl-combobox__search-input",onFocus:me,onBlur:fe,onKeyDown:ke,value:J,ref:ee,"aria-controls":S,role:"combobox","aria-autocomplete":"list","aria-expanded":U,placeholder:G.length>0?"":j,autoComplete:"off"})]}),o("div",{className:"jkl-combobox__menu",role:"listbox",ref:be,id:S,"aria-labelledby":V,"aria-multiselectable":"true","aria-activedescendant":ce,onFocus:me,onBlur:fe,tabIndex:-1,children:[se.map(((t,a)=>o("button",{type:"button",id:`${S}__${t.value}`,"aria-selected":ae(t),role:"option",value:t.value,onBlur:fe,className:`jkl-combobox__option ${ae(t)&&"jkl-combobox__option--selected"}`,"data-testid":"jkl-combobox__option","data-testautoid":`jkl-combobox__option-${a}`,onFocus:me,onKeyDown:ge,onClick:e=>{ue(`${S}__${t.value}`),e.stopPropagation(),re(t.value),Q("")},onMouseOver:he,children:[t.description?o("span",{children:[t.label,e("span",{className:"jkl-combobox__option-description",children:t.description})]}):t.label,ae(t)?o("span",{children:[e(m,{})," "]}):null]},`${S}-${t.value}`))),W&&e("div",{className:"jkl-combobox__no-option",children:L})]}),e("div",{className:"jkl-combobox__actions",children:e(b,{id:H,onFocus:me,onBlur:fe,className:"jkl-combobox__button","data-testid":"jkl-combobox__button","aria-label":`${G.map((e=>e.label))||"Velg"},${N}`,"aria-expanded":U,"aria-controls":S,role:"button",onClick:()=>z((e=>!e)),onMouseDown:e=>{var o;e.preventDefault(),null==(o=oe.current)||o.focus()},children:e(d,{pointingDown:pe})})})]})})};_.displayName="Combobox";export{_ as Combobox,g as getComboboxValuePair};
+import{jsx as e,jsxs as o}from"react/jsx-runtime";import{c as t}from"../../../clsx-BeLtu-UY.js";import{useState as a,useRef as n,useEffect as l,useCallback as r,useMemo as i}from"react";import{useAnimatedHeight as s}from"../../hooks/useAnimatedHeight/useAnimatedHeight.js";import{useId as c}from"../../hooks/useId/useId.js";import{useListNavigation as u}from"../../hooks/useListNavigation/useListNavigation.js";import{Chip as p}from"../chip/Chip.js";import{IconButton as d}from"../icon-button/IconButton.js";import{CheckIcon as m}from"../icon/icons/CheckIcon.js";import{ArrowVerticalAnimated as b}from"../icon/icons/animated/ArrowVerticalAnimated.js";import{InputGroup as v}from"../input-group/InputGroup.js";import{Tooltip as f}from"../tooltip/Tooltip.js";import{TooltipContent as h}from"../tooltip/TooltipContent.js";import{TooltipTrigger as k}from"../tooltip/TooltipTrigger.js";function g(e){return"string"==typeof e?{value:e,label:e}:e}const _=({id:_,placeholder:j,items:x,onChange:y,onFocus:w,onBlur:C,value:$,label:N,noMatchingOption:L,labelProps:T,helpLabel:I,errorLabel:B,width:D,density:P,name:A,className:E,invalid:F,hasTagHover:M})=>{var O,K;const S=c(_||"jkl-combobox",{generateSuffix:!_}),V=`${S}_label`,H=`${S}_button`,q=`${S}_search-input`,[G,R]=a($||[]),[U,z]=a(!1),[J,Q]=a(""),[W,X]=a(!1),[Y,Z]=a(!1),ee=n(null),oe=n(null),te=n(!1);l((()=>{Q(""),U&&ee.current&&ee.current.focus()}),[U]),l((()=>{R((e=>$||e))}),[$]);const ae=e=>!!G&&G.some((o=>o.value===e.value)),ne=r((e=>G.filter((o=>o.value!==e))),[G]),le=r(((e,o)=>{const t=ne(o);R(t),y({type:"change",target:{name:A,value:o,selectedOptions:t}}),e.stopPropagation(),0===t.length&&Z(!1)}),[ne,y,A]),re=r((e=>{var o;let t;if(G.some((o=>o.value===e)))t=ne(e);else{const o=x.find((o=>o.value===e));t=[...G,o]}null==(o=ee.current)||o.focus(),R(t),y({type:"change",target:{name:A,value:e,selectedOptions:t}})}),[G,y,A,ne,x]),ie=e=>{var o;null==(o=ee.current)||o.focus(),z(!0),Q(e.target.value)},se=i((()=>{if(!J)return x;const e=x.filter((e=>e.label.toLowerCase().indexOf(J.toLowerCase())>=0));return X(0===e.length),e}),[J,x]),[ce,ue]=a(null!=(O=se[0])&&O.value?`${S}-${null==(K=se[0])?void 0:K.value}`:void 0),pe=!U;l((()=>{const e=e=>{"Escape"===e.key&&U&&z(!1)};return typeof window<"u"&&window.addEventListener("keydown",e),()=>{typeof window<"u"&&U&&window.removeEventListener("keydown",e)}}),[U]);const de=r((e=>{e?ee.current&&ee.current.focus():te.current&&oe.current&&oe.current.focus()}),[]),me=r((()=>{te.current||(w&&w({type:"change",target:{name:A,value:(null==G?void 0:G[0].value)||"",selectedOptions:G}}),te.current=!0,z(!0))}),[w,G,A]),[be]=s(U,{onFirstVisible:de,onTransitionEnd:de});u({ref:be});const ve=n(null),fe=r((e=>{var o,t;const a=ve.current;(null==a?void 0:a.contains(e.relatedTarget))||(Q(""),C&&(C({type:"blur",target:{name:A,value:(null==(o=null==G?void 0:G[0])?void 0:o.value)||"",selectedOptions:G}}),null==(t=oe.current)||t.dispatchEvent(new Event("focusout",{bubbles:!0}))),te.current=!1,z(!1))}),[C,A,G]),he=r((e=>{e.target.focus({preventScroll:!0})}),[]),ke=r((e=>{var o;if("ArrowDown"===e.key){e.preventDefault(),e.stopPropagation();const t=be.current;t&&(null==(o=t.querySelector('[role="option"]'))||o.focus())}else"Escape"===e.key&&(e.preventDefault(),e.stopPropagation(),z(!1));if(e.metaKey&&"a"===e.key||e.ctrlKey&&"a"===e.key){e.preventDefault(),e.stopPropagation();const o=G.map((e=>({...e,isMarked:!0})));Z(!0),R(o)}else if("Backspace"===e.key)if(e.stopPropagation(),Z(!1),G.some((e=>e.isMarked))){const e=G.filter((e=>!e.isMarked));R(e),Q("")}else G.length>0&&""===J&&le(e,G[G.length-1].value)}),[G,J,be,le]),ge=r((e=>{if("Tab"===e.key)ee.current&&(e.preventDefault(),e.stopPropagation(),e.shiftKey||z(!1),ee.current.focus());else if("ArrowUp"===e.key&&be.current&&ee.current){const o=be.current.querySelector('[role="option"]:not([hidden])');e.currentTarget.id===(null==o?void 0:o.id)&&ee.current&&ee.current.focus()}}),[be]),_e=G.length>=1,je=r((o=>e(p,{"data-testid":"jkl-chip","aria-label":`Fjern ${o.tagLabel}`,className:`jkl-combobox__selected-option ${Y&&"jkl-combobox__selected-option--marked"}`,variant:"input",onClick:e=>{ee.current&&ee.current.focus(),le(e,o.value)},onBlur:fe,children:o.tagLabel?o.tagLabel:o.label},o.value)),[fe,le,Y]);return e(v,{label:N,id:q,ref:ve,"data-testid":"jkl-combobox",className:t("jkl-combobox",E,{"jkl-combobox--invalid":!!B||F,"jkl-combobox--menu-open":U,"jkl-combobox--menu-closed":!U&&_e}),labelProps:{id:V,...T},helpLabel:I,errorLabel:B,density:P,render:a=>o("div",{className:t("jkl-combobox__wrapper",{"jkl-combobox__wrapper--active-value":_e}),style:{width:D},tabIndex:-1,onFocus:me,onBlur:fe,children:[o("div",{className:"jkl-combobox__chips","data-testid":"jkl-combobox__chips",children:[G.map(g).map((t=>M?o(f,{children:[e(k,{children:je(t)}),e(h,{children:t.label})]},t.value):je(t))),e("input",{...a,className:"jkl-combobox__search-input",onChange:ie,"data-testid":"jkl-combobox__search-input",onFocus:me,onBlur:fe,onKeyDown:ke,value:J,ref:ee,"aria-controls":S,role:"combobox","aria-autocomplete":"list","aria-expanded":U,placeholder:G.length>0?"":j,autoComplete:"off"})]}),o("div",{className:"jkl-combobox__menu",role:"listbox",ref:be,id:S,"aria-labelledby":V,"aria-multiselectable":"true","aria-activedescendant":ce,onFocus:me,onBlur:fe,tabIndex:-1,children:[se.map(((t,a)=>o("button",{type:"button",id:`${S}__${t.value}`,"aria-selected":ae(t),role:"option",value:t.value,onBlur:fe,className:`jkl-combobox__option ${ae(t)&&"jkl-combobox__option--selected"}`,"data-testid":"jkl-combobox__option","data-testautoid":`jkl-combobox__option-${a}`,onFocus:me,onKeyDown:ge,onClick:e=>{ue(`${S}__${t.value}`),e.stopPropagation(),re(t.value),Q("")},onMouseOver:he,children:[t.description?o("span",{children:[t.label,e("span",{className:"jkl-combobox__option-description",children:t.description})]}):t.label,ae(t)?o("span",{children:[e(m,{})," "]}):null]},`${S}-${t.value}`))),W&&e("div",{className:"jkl-combobox__no-option",children:L})]}),e("div",{className:"jkl-combobox__actions",children:e(d,{id:H,onFocus:me,onBlur:fe,className:"jkl-combobox__button","data-testid":"jkl-combobox__button","aria-label":`${G.map((e=>e.label))||"Velg"},${N}`,"aria-expanded":U,"aria-controls":S,onClick:()=>z((e=>!e)),onMouseDown:e=>{var o;e.preventDefault(),null==(o=oe.current)||o.focus()},children:e(b,{pointingDown:pe})})})]})})};_.displayName="Combobox";export{_ as Combobox,g as getComboboxValuePair};
 //# sourceMappingURL=Combobox.js.map