npm - @fremtind/jokul - Versions diffs - 0.68.4 → 0.68.6 - Mend

@fremtind/jokul 0.68.4 → 0.68.6

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 (406) hide show

package/build/es/components/table/TableHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableHeader.js","sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, type MouseEventHandler } from \"react\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableHeaderProps } from \"./types.js\";\n\nexport type TableSortDirection = \"asc\" \| \"desc\";\n\nconst TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(\n (props, ref) => {\n const {\n bold = true,\n density,\n sortable,\n className,\n scope = \"col\",\n srOnly,\n align = \"left\",\n children,\n onClick,\n ...rest\n } = props;\n const { density: contextDensity } = useTableContext();\n\n const handleClick: MouseEventHandler<HTMLTableCellElement> = (e) => {\n onClick?.(e);\n sortable?.onClick();\n };\n\n return (\n <th\n className={clsx(\"jkl-table-header\", className, {\n [\"jkl-table-header--bold\"]: bold,\n [\"jkl-table-header--align-right\"]: align === \"right\",\n [\"jkl-table-header--align-center\"]: align === \"center\",\n [\"jkl-table-header--sr-only\"]: srOnly,\n [\"jkl-table-header--sortable\"]:\n typeof sortable !== \"undefined\",\n })}\n scope={scope}\n onClick={handleClick}\n {...rest}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n {children}\n {sortable && (\n <div\n className={clsx(\"jkl-table-header__arrows\", {\n \"jkl-table-header__arrows--active\": Boolean(\n sortable.direction,\n ),\n })}\n >\n {sortable.direction && (\n <ArrowVerticalAnimated\n pointingDown={sortable.direction === \"desc\"}\n bold\n />\n )}\n </div>\n )}\n </th>\n );\n },\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nexport { TableHeader };\n"],"names":["TableHeader","forwardRef","props","ref","bold","density","sortable","className","scope","srOnly","align","children","onClick","rest","contextDensity","useTableContext","jsxs","clsx","e","jsx","direction","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"+QAQA,MAAMA,EAAcC,GAChB,CAACC,EAAOC,KACE,MACFC,KAAAA,GAAO,EACPC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,MAAAA,EAAQ,MACRC,OAAAA,EACAC,MAAAA,EAAQ,OACRC,SAAAA,EACAC,QAAAA,KACGC,GACHX,GACIG,QAASS,GAAmBC,IAQhC,OAAAC,EAAC,KAAA,CACGT,UAAWU,EAAK,mBAAoBV,EAAW,CAC1C,yBAA2BH,EAC3B,gCAA4C,UAAVM,EAClC,iCAA6C,WAAVA,EACnC,4BAA8BD,EAC9B,oCACUH,EAAa,MAE5BE,MAAAA,EACAI,QAhBsDM,IAC1D,MAAAN,GAAAA,EAAUM,GACV,MAAAZ,GAAAA,EAAUM,SAAA,KAeFC,EACJ,eAAcR,GAAWS,EACzBX,IAAAA,EAECQ,SAAA,CAAAA,EACAL,GACGa,EAAC,MAAA,CACGZ,UAAWU,EAAK,2BAA4B,CACxC,qCACIX,EAASc,YAIhBT,WAASS,WACND,EAACE,EAAA,CACGC,aAAqC,SAAvBhB,EAASc,UACvBhB,MAAI,~~QAGhB~~,~~IAOpBJ~~,EAAYuB,YAAc"}
1	+ {"version":3,"file":"TableHeader.js","sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, type MouseEventHandler } from \"react\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TableHeaderProps } from \"./types.js\";\n\nexport type TableSortDirection = \"asc\" \| \"desc\";\n\nconst TableHeader = forwardRef<HTMLTableCellElement, TableHeaderProps>(\n (props, ref) => {\n const {\n bold = true,\n density,\n sortable,\n className,\n scope = \"col\",\n srOnly,\n align = \"left\",\n children,\n onClick,\n ...rest\n } = props;\n const { density: contextDensity } = useTableContext();\n\n const handleClick: MouseEventHandler<HTMLTableCellElement> = (e) => {\n onClick?.(e);\n sortable?.onClick();\n };\n\n return (\n <th\n className={clsx(\"jkl-table-header\", className, {\n [\"jkl-table-header--bold\"]: bold,\n [\"jkl-table-header--align-right\"]: align === \"right\",\n [\"jkl-table-header--align-center\"]: align === \"center\",\n [\"jkl-table-header--sr-only\"]: srOnly,\n [\"jkl-table-header--sortable\"]:\n typeof sortable !== \"undefined\",\n })}\n scope={scope}\n onClick={handleClick}\n {...rest}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n {children}\n {sortable && (\n <div\n className={clsx(\"jkl-table-header__arrows\", {\n \"jkl-table-header__arrows--active\": Boolean(\n sortable.direction,\n ),\n })}\n >\n {sortable.direction && (\n <ArrowVerticalAnimated\n pointingDown={sortable.direction === \"desc\"}\n bold\n />\n )}\n </div>\n )}\n </th>\n );\n },\n);\n\nTableHeader.displayName = \"TableHeader\";\n\nexport { TableHeader };\n"],"names":["TableHeader","forwardRef","props","ref","bold","density","sortable","className","scope","srOnly","align","children","onClick","rest","contextDensity","useTableContext","jsxs","clsx","e","jsx","direction","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"+QAQA,MAAMA,EAAcC,GAChB,CAACC,EAAOC,KACE,MACFC,KAAAA,GAAO,EACPC,QAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,MAAAA,EAAQ,MACRC,OAAAA,EACAC,MAAAA,EAAQ,OACRC,SAAAA,EACAC,QAAAA,KACGC,GACHX,GACIG,QAASS,GAAmBC,IAQhC,OAAAC,EAAC,KAAA,CACGT,UAAWU,EAAK,mBAAoBV,EAAW,CAC1C,yBAA2BH,EAC3B,gCAA4C,UAAVM,EAClC,iCAA6C,WAAVA,EACnC,4BAA8BD,EAC9B,oCACUH,EAAa,MAE5BE,MAAAA,EACAI,QAhBsDM,IAC1D,MAAAN,GAAAA,EAAUM,GACV,MAAAZ,GAAAA,EAAUM,SAAA,KAeFC,EACJ,eAAcR,GAAWS,EACzBX,IAAAA,EAECQ,SAAA,CAAAA,EACAL,GACGa,EAAC,MAAA,CACGZ,UAAWU,EAAK,2BAA4B,CACxC,qCACIX,EAASc,YAIhBT,WAASS,WACND,EAACE,EAAA,CACGC,aAAqC,SAAvBhB,EAASc,UACvBhB,MAAI,QAKxB,IAKZJ,EAAYuB,YAAc"}

package/build/es/components/table/TablePagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TablePagination.js","sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useCallback,\n useState,\n type ChangeEventHandler,\n type FC,\n type MouseEventHandler,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { ChevronLeftIcon } from \"../icon/icons/ChevronLeftIcon.js\";\nimport { ChevronRightIcon } from \"../icon/icons/ChevronRightIcon.js\";\nimport { NativeSelect } from \"../select/NativeSelect.js\";\nimport { TextInput } from \"../text-input/TextInput.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TablePaginationProps } from \"./types.js\";\n\nfunction clamp(min: number, num: number, max: number): number {\n if (num < min) {\n return min;\n }\n\n if (num > max) {\n return max;\n }\n\n return num;\n}\n\nexport const TablePagination = forwardRef<HTMLDivElement, TablePaginationProps>(\n (props, ref) => {\n const {\n activePage = 0,\n totalNumberOfRows,\n rowsPerPage,\n rowsPerPageItems,\n className,\n density,\n id: idProp,\n withGoToPage = false,\n onChange,\n onChangeRowsPerPage,\n labels = {\n rowsPerPage: \"Rader per side\",\n previous: \"Forrige\",\n next: \"Neste\",\n },\n ...rest\n } = props;\n\n const id = useId(idProp \|\| \"jkl-table-pagination\", {\n generateSuffix: !idProp,\n });\n const { density: contextDensity } = useTableContext();\n\n const showAll = rowsPerPage <= 0;\n const numberOfPages = showAll\n ? 1\n : Math.ceil(totalNumberOfRows / rowsPerPage);\n\n const [currentPage, setCurrentPage] = useState(\n clamp(0, activePage, numberOfPages - 1),\n );\n\n const onPageClick: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n const toPage = Number.parseInt(\n e.currentTarget.dataset.number as string,\n );\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const [pagePickerValue, setPagePickerValue] = useState(\n String(currentPage + 1),\n );\n const onPageChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n setPagePickerValue(e.target.value);\n try {\n const toPage = Number.parseInt(e.target.value) - 1;\n if (Number.isNaN(toPage)) {\n return;\n }\n\n if (toPage >= 0 && toPage < numberOfPages) {\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n }\n } catch {\n return;\n }\n },\n [onChange, currentPage, numberOfPages],\n );\n\n const onPrevious: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === 0) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage - 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const onNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === numberOfPages - 1) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage + 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, numberOfPages, currentPage],\n );\n\n return (\n <div\n className={clsx(\"jkl-table-pagination\", className)}\n {...rest}\n id={id}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n <div className=\"jkl-table-pagination__left\">\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--rows\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {labels.rowsPerPage}:\n </span>\n <NativeSelect\n className=\"jkl-table-pagination__picker-input\"\n label={labels.rowsPerPage}\n labelProps={{ srOnly: true }}\n name={`${id}-rows-per-page`}\n items={rowsPerPageItems.map((i) =>\n typeof i === \"number\"\n ? String(i)\n : {\n label: i.label,\n value: String(i.value),\n },\n )}\n value={String(rowsPerPage)}\n onChange={onChangeRowsPerPage}\n width=\"min(8rem, 100%)\"\n inline\n />\n </div>\n </div>\n <div className=\"jkl-table-pagination__right\">\n {numberOfPages !== 1 && (\n <nav className=\"jkl-table-pagination__nav\">\n {withGoToPage && (\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--page\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"}\n :\n </span>\n {/* onChange først ved enter/submit */}\n <TextInput\n className=\"jkl-table-pagination__picker-input\"\n label={\n typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"\n }\n labelProps={{ srOnly: true }}\n name={`${id}-go-to-page`}\n value={pagePickerValue}\n width=\"min(4rem, 100%)\"\n onChange={onPageChange}\n aria-invalid={\n pagePickerValue &&\n pagePickerValue !==\n String(currentPage + 1)\n ? \"true\"\n : undefined\n }\n />\n </div>\n )}\n <ul>\n <li>\n <IconButton\n className=\"jkl-table-pagination__previous\"\n title={labels.previous}\n onClick={onPrevious}\n >\n <ChevronLeftIcon />\n </IconButton>\n </li>\n <PaginationPages\n id={id}\n activePage={activePage}\n numberOfPages={numberOfPages}\n onPageClick={onPageClick}\n />\n <li>\n <IconButton\n className=\"jkl-table-pagination__next\"\n title={labels.next}\n onClick={onNext}\n >\n <ChevronRightIcon />\n </IconButton>\n </li>\n </ul>\n </nav>\n )}\n </div>\n </div>\n );\n },\n);\n\nconst PaginationPages: FC<{\n id: string;\n activePage: number;\n numberOfPages: number;\n onPageClick: MouseEventHandler;\n}> = ({ id, activePage, numberOfPages, onPageClick }) => {\n if (numberOfPages <= 7) {\n return (\n <>\n {Array.from({ length: numberOfPages }).map((_, i) => (\n <li key={`${id}-page-${i}`}>\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\":\n activePage === i,\n })}\n type=\"button\"\n data-number={i}\n onClick={onPageClick}\n >\n {i + 1}\n </button>\n </li>\n ))}\n </>\n );\n }\n\n const showStartEllipsis = activePage > 3 && numberOfPages > 7;\n const showEndEllipsis = activePage < numberOfPages - 4 && numberOfPages > 7;\n\n const startEllipsis = Math.min(\n Math.max(activePage - 2, 1),\n numberOfPages - 6,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 5,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 4,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 3,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 2);\n\n return (\n <>\n <li>\n <PaginationPageButton\n isActive={activePage === 0}\n number={0}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showStartEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === startEllipsis}\n number={startEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberStart}\n number={centerPageNumberStart}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumber}\n number={centerPageNumber}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showEndEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === endEllipsis}\n number={endEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === numberOfPages - 1}\n number={numberOfPages - 1}\n onClick={onPageClick}\n />\n </li>\n </>\n );\n};\n\nconst PaginationPageButton: FC<{\n isActive: boolean;\n number: number;\n onClick: MouseEventHandler;\n}> = ({ isActive, number, onClick, ...rest }) => (\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\": isActive,\n })}\n type=\"button\"\n data-number={number}\n onClick={onClick}\n {...rest}\n >\n {number + 1}\n </button>\n);\n\nTablePagination.displayName = \"TablePagination\";\n"],"names":["TablePagination","forwardRef","props","ref","activePage","totalNumberOfRows","rowsPerPage","rowsPerPageItems","className","density","id","idProp","withGoToPage","onChange","onChangeRowsPerPage","labels","previous","next","rest","useId","generateSuffix","contextDensity","useTableContext","numberOfPages","Math","ceil","currentPage","setCurrentPage","useState","min","num","max","clamp","onPageClick","useCallback","e","toPage","Number","parseInt","currentTarget","dataset","number","setPagePickerValue","String","pagePickerValue","onPageChange","target","value","isNaN","onPrevious","onNext","jsxs","clsx","children","jsx","NativeSelect","label","labelProps","srOnly","name","items","map","i","width","inline","gotoLabel","TextInput","IconButton","title","onClick","ChevronLeftIcon","PaginationPages","ChevronRightIcon","Fragment","Array","from","length","_","type","showStartEllipsis","showEndEllipsis","startEllipsis","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","PaginationPageButton","isActive","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"TablePagination.js","sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n forwardRef,\n useCallback,\n useState,\n type ChangeEventHandler,\n type FC,\n type MouseEventHandler,\n} from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { ChevronLeftIcon } from \"../icon/icons/ChevronLeftIcon.js\";\nimport { ChevronRightIcon } from \"../icon/icons/ChevronRightIcon.js\";\nimport { NativeSelect } from \"../select/NativeSelect.js\";\nimport { TextInput } from \"../text-input/TextInput.js\";\nimport { useTableContext } from \"./tableContext.js\";\nimport type { TablePaginationProps } from \"./types.js\";\n\nfunction clamp(min: number, num: number, max: number): number {\n if (num < min) {\n return min;\n }\n\n if (num > max) {\n return max;\n }\n\n return num;\n}\n\nexport const TablePagination = forwardRef<HTMLDivElement, TablePaginationProps>(\n (props, ref) => {\n const {\n activePage = 0,\n totalNumberOfRows,\n rowsPerPage,\n rowsPerPageItems,\n className,\n density,\n id: idProp,\n withGoToPage = false,\n onChange,\n onChangeRowsPerPage,\n labels = {\n rowsPerPage: \"Rader per side\",\n previous: \"Forrige\",\n next: \"Neste\",\n },\n ...rest\n } = props;\n\n const id = useId(idProp \|\| \"jkl-table-pagination\", {\n generateSuffix: !idProp,\n });\n const { density: contextDensity } = useTableContext();\n\n const showAll = rowsPerPage <= 0;\n const numberOfPages = showAll\n ? 1\n : Math.ceil(totalNumberOfRows / rowsPerPage);\n\n const [currentPage, setCurrentPage] = useState(\n clamp(0, activePage, numberOfPages - 1),\n );\n\n const onPageClick: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n const toPage = Number.parseInt(\n e.currentTarget.dataset.number as string,\n );\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const [pagePickerValue, setPagePickerValue] = useState(\n String(currentPage + 1),\n );\n const onPageChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n setPagePickerValue(e.target.value);\n try {\n const toPage = Number.parseInt(e.target.value) - 1;\n if (Number.isNaN(toPage)) {\n return;\n }\n\n if (toPage >= 0 && toPage < numberOfPages) {\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n }\n } catch {\n return;\n }\n },\n [onChange, currentPage, numberOfPages],\n );\n\n const onPrevious: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === 0) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage - 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, currentPage],\n );\n\n const onNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n (e) => {\n if (currentPage === numberOfPages - 1) {\n // TODO: skal dette være en no-op i stedet?\n onChange(e, currentPage, currentPage);\n return;\n }\n const toPage = currentPage + 1;\n onChange(e, toPage, currentPage);\n setCurrentPage(toPage);\n setPagePickerValue(String(toPage + 1));\n },\n [onChange, numberOfPages, currentPage],\n );\n\n return (\n <div\n className={clsx(\"jkl-table-pagination\", className)}\n {...rest}\n id={id}\n data-density={density \|\| contextDensity}\n ref={ref}\n >\n <div className=\"jkl-table-pagination__left\">\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--rows\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {labels.rowsPerPage}:\n </span>\n <NativeSelect\n className=\"jkl-table-pagination__picker-input\"\n label={labels.rowsPerPage}\n labelProps={{ srOnly: true }}\n name={`${id}-rows-per-page`}\n items={rowsPerPageItems.map((i) =>\n typeof i === \"number\"\n ? String(i)\n : {\n label: i.label,\n value: String(i.value),\n },\n )}\n value={String(rowsPerPage)}\n onChange={onChangeRowsPerPage}\n width=\"min(8rem, 100%)\"\n inline\n />\n </div>\n </div>\n <div className=\"jkl-table-pagination__right\">\n {numberOfPages !== 1 && (\n <nav className=\"jkl-table-pagination__nav\">\n {withGoToPage && (\n <div className=\"jkl-table-pagination__picker jkl-table-pagination__picker--page\">\n <span\n className=\"jkl-table-pagination__picker-label\"\n aria-hidden=\"true\"\n >\n {typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"}\n :\n </span>\n {/* onChange først ved enter/submit */}\n <TextInput\n className=\"jkl-table-pagination__picker-input\"\n label={\n typeof withGoToPage === \"object\"\n ? withGoToPage.gotoLabel\n : \"Gå til side\"\n }\n labelProps={{ srOnly: true }}\n name={`${id}-go-to-page`}\n value={pagePickerValue}\n width=\"min(4rem, 100%)\"\n onChange={onPageChange}\n aria-invalid={\n pagePickerValue &&\n pagePickerValue !==\n String(currentPage + 1)\n ? \"true\"\n : undefined\n }\n />\n </div>\n )}\n <ul>\n <li>\n <IconButton\n className=\"jkl-table-pagination__previous\"\n title={labels.previous}\n onClick={onPrevious}\n >\n <ChevronLeftIcon />\n </IconButton>\n </li>\n <PaginationPages\n id={id}\n activePage={activePage}\n numberOfPages={numberOfPages}\n onPageClick={onPageClick}\n />\n <li>\n <IconButton\n className=\"jkl-table-pagination__next\"\n title={labels.next}\n onClick={onNext}\n >\n <ChevronRightIcon />\n </IconButton>\n </li>\n </ul>\n </nav>\n )}\n </div>\n </div>\n );\n },\n);\n\nconst PaginationPages: FC<{\n id: string;\n activePage: number;\n numberOfPages: number;\n onPageClick: MouseEventHandler;\n}> = ({ id, activePage, numberOfPages, onPageClick }) => {\n if (numberOfPages <= 7) {\n return (\n <>\n {Array.from({ length: numberOfPages }).map((_, i) => (\n <li key={`${id}-page-${i}`}>\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\":\n activePage === i,\n })}\n type=\"button\"\n data-number={i}\n onClick={onPageClick}\n >\n {i + 1}\n </button>\n </li>\n ))}\n </>\n );\n }\n\n const showStartEllipsis = activePage > 3 && numberOfPages > 7;\n const showEndEllipsis = activePage < numberOfPages - 4 && numberOfPages > 7;\n\n const startEllipsis = Math.min(\n Math.max(activePage - 2, 1),\n numberOfPages - 6,\n );\n const centerPageNumberStart = Math.min(\n startEllipsis + 1,\n numberOfPages - 5,\n );\n const centerPageNumber = Math.min(\n centerPageNumberStart + 1,\n numberOfPages - 4,\n );\n const centerPageNumberEnd = Math.min(\n centerPageNumberStart + 2,\n numberOfPages - 3,\n );\n const endEllipsis = Math.min(centerPageNumberStart + 3, numberOfPages - 2);\n\n return (\n <>\n <li>\n <PaginationPageButton\n isActive={activePage === 0}\n number={0}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showStartEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === startEllipsis}\n number={startEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberStart}\n number={centerPageNumberStart}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumber}\n number={centerPageNumber}\n onClick={onPageClick}\n />\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === centerPageNumberEnd}\n number={centerPageNumberEnd}\n onClick={onPageClick}\n />\n </li>\n <li>\n {showEndEllipsis ? (\n <span\n className=\"jkl-table-pagination__ellipsis\"\n aria-hidden\n >\n {\"...\"}\n </span>\n ) : (\n <PaginationPageButton\n isActive={activePage === endEllipsis}\n number={endEllipsis}\n onClick={onPageClick}\n />\n )}\n </li>\n <li>\n <PaginationPageButton\n isActive={activePage === numberOfPages - 1}\n number={numberOfPages - 1}\n onClick={onPageClick}\n />\n </li>\n </>\n );\n};\n\nconst PaginationPageButton: FC<{\n isActive: boolean;\n number: number;\n onClick: MouseEventHandler;\n}> = ({ isActive, number, onClick, ...rest }) => (\n <button\n className={clsx(\"jkl-table-pagination__page\", {\n \"jkl-table-pagination__page--active\": isActive,\n })}\n type=\"button\"\n data-number={number}\n onClick={onClick}\n {...rest}\n >\n {number + 1}\n </button>\n);\n\nTablePagination.displayName = \"TablePagination\";\n"],"names":["TablePagination","forwardRef","props","ref","activePage","totalNumberOfRows","rowsPerPage","rowsPerPageItems","className","density","id","idProp","withGoToPage","onChange","onChangeRowsPerPage","labels","previous","next","rest","useId","generateSuffix","contextDensity","useTableContext","numberOfPages","Math","ceil","currentPage","setCurrentPage","useState","min","num","max","clamp","onPageClick","useCallback","e","toPage","Number","parseInt","currentTarget","dataset","number","setPagePickerValue","String","pagePickerValue","onPageChange","target","value","isNaN","onPrevious","onNext","jsxs","clsx","children","jsx","NativeSelect","label","labelProps","srOnly","name","items","map","i","width","inline","gotoLabel","TextInput","IconButton","title","onClick","ChevronLeftIcon","PaginationPages","ChevronRightIcon","Fragment","Array","from","length","_","type","showStartEllipsis","showEndEllipsis","startEllipsis","centerPageNumberStart","centerPageNumber","centerPageNumberEnd","endEllipsis","PaginationPageButton","isActive","displayName"],"mappings":"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"}

package/build/es/components/table/TableRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableRow.js","sources":["../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { useTableSectionContext } from \"./tableSectionContext.js\";\nimport type { TableRowProps } from \"./types.js\";\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n ({ className, clickable, children, ...rest }, ref) => {\n const { density } = useTableContext();\n const { isTableBody } = useTableSectionContext();\n\n const [clicked, setClicked] = useState(clickable?.isClicked \|\| false);\n\n useEffect(() => {\n setClicked((prev) =>\n clickable?.isClicked !== undefined ? clickable.isClicked : prev,\n );\n }, [clickable?.isClicked]);\n\n if (isTableBody && clickable) {\n return (\n <tr\n onClick={function handleOnClick(e) {\n setClicked(!clicked);\n clickable.onClick(e);\n }}\n onKeyPress={function handleKeyPress(e) {\n if (e.key === \" \" \|\| e.key === \"Enter\") {\n e.preventDefault();\n setClicked(!clicked);\n clickable.onClick(e);\n }\n }}\n data-testid=\"jkl-clickable-table-row\"\n className={clsx(\n \"jkl-table-row\",\n \"jkl-table-row--clickable\",\n className,\n {\n [\"jkl-table-row--clicked\"]:\n clickable?.markClickedRows && clicked,\n },\n )}\n aria-label=\"Klikkbar rad\"\n aria-pressed={\n clickable?.markClickedRows\n ? clicked\n ? \"true\"\n : \"false\"\n : undefined\n }\n tabIndex={0}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children}\n </tr>\n );\n }\n\n return (\n <tr\n className={clsx(\"jkl-table-row\", className)}\n {...rest}\n ref={ref}\n data-density={density}\n >\n {children}\n </tr>\n );\n },\n);\n\nTableRow.displayName = \"TableRow\";\n\nexport { TableRow };\n"],"names":["TableRow","forwardRef","className","clickable","children","rest","ref","density","useTableContext","isTableBody","useTableSectionContext","clicked","setClicked","useState","isClicked","useEffect","prev","jsx","onClick","e","onKeyPress","key","preventDefault","clsx","markClickedRows","tabIndex","displayName"],"mappings":"4QAMA,MAAMA,EAAWC,GACb,EAAGC,UAAAA,EAAWC,UAAAA,EAAWC,SAAAA,KAAaC,GAAQC,KACpC,MAAEC,QAAAA,GAAYC,KACZC,YAAAA,GAAgBC,KAEjBC,EAASC,GAAcC,GAAS,MAAAV,OAAA,EAAAA,EAAWW,aAAa,GAQ/D,OANAC,GAAU,KACNH,GAAYI,QACiB,KAAzB,MAAAb,OAAA,EAAAA,EAAWW,WAA0BX,EAAUW,UAAYE,~~GAAA~~,~~GAEhE~~,CAAC,MAAAb,OAAAA,EAAAA,EAAWW,YAIPG,EAAC,KAFLR,GAAeN,EAEV,CACGe,QAAS,SAAuBC,GAC5BP,GAAYD,GACZR,EAAUe,QAAQC,EACtB,EACAC,WAAY,SAAwBD,IAClB,MAAVA,EAAEE,KAAyB,UAAVF,EAAEE,OACnBF,EAAEG,iBACFV,GAAYD,GACZR,EAAUe,QAAQC,GAE1B,EACA,cAAY,0BACZjB,UAAWqB,EACP,gBACA,2BACArB,EACA,CACK,0BACG,MAAAC,OAAAA,EAAAA,EAAWqB,kBAAmBb,IAG1C,aAAW,eACX,eACI,MAAAR,GAAAA,EAAWqB,gBACLb,EACI,OACA,aACJ,EAEVc,SAAU,KACNpB,EACJ,eAAcE,EACdD,IAAAA,EAECF,SAAAA,GAMR,CACGF,UAAWqB,EAAK,gBAAiBrB,MAC7BG,EACJC,IAAAA,EACA,eAAcC,EAEbH,SAAAA,~~GAAA~~,~~IAMjBJ~~,EAAS0B,YAAc"}
1	+ {"version":3,"file":"TableRow.js","sources":["../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useEffect, useState } from \"react\";\nimport { useTableContext } from \"./tableContext.js\";\nimport { useTableSectionContext } from \"./tableSectionContext.js\";\nimport type { TableRowProps } from \"./types.js\";\n\nconst TableRow = forwardRef<HTMLTableRowElement, TableRowProps>(\n ({ className, clickable, children, ...rest }, ref) => {\n const { density } = useTableContext();\n const { isTableBody } = useTableSectionContext();\n\n const [clicked, setClicked] = useState(clickable?.isClicked \|\| false);\n\n useEffect(() => {\n setClicked((prev) =>\n clickable?.isClicked !== undefined ? clickable.isClicked : prev,\n );\n }, [clickable?.isClicked]);\n\n if (isTableBody && clickable) {\n return (\n <tr\n onClick={function handleOnClick(e) {\n setClicked(!clicked);\n clickable.onClick(e);\n }}\n onKeyPress={function handleKeyPress(e) {\n if (e.key === \" \" \|\| e.key === \"Enter\") {\n e.preventDefault();\n setClicked(!clicked);\n clickable.onClick(e);\n }\n }}\n data-testid=\"jkl-clickable-table-row\"\n className={clsx(\n \"jkl-table-row\",\n \"jkl-table-row--clickable\",\n className,\n {\n [\"jkl-table-row--clicked\"]:\n clickable?.markClickedRows && clicked,\n },\n )}\n aria-label=\"Klikkbar rad\"\n aria-pressed={\n clickable?.markClickedRows\n ? clicked\n ? \"true\"\n : \"false\"\n : undefined\n }\n tabIndex={0}\n {...rest}\n data-density={density}\n ref={ref}\n >\n {children}\n </tr>\n );\n }\n\n return (\n <tr\n className={clsx(\"jkl-table-row\", className)}\n {...rest}\n ref={ref}\n data-density={density}\n >\n {children}\n </tr>\n );\n },\n);\n\nTableRow.displayName = \"TableRow\";\n\nexport { TableRow };\n"],"names":["TableRow","forwardRef","className","clickable","children","rest","ref","density","useTableContext","isTableBody","useTableSectionContext","clicked","setClicked","useState","isClicked","useEffect","prev","jsx","onClick","e","onKeyPress","key","preventDefault","clsx","markClickedRows","tabIndex","displayName"],"mappings":"4QAMA,MAAMA,EAAWC,GACb,EAAGC,UAAAA,EAAWC,UAAAA,EAAWC,SAAAA,KAAaC,GAAQC,KACpC,MAAEC,QAAAA,GAAYC,KACZC,YAAAA,GAAgBC,KAEjBC,EAASC,GAAcC,GAAS,MAAAV,OAAA,EAAAA,EAAWW,aAAa,GAQ/D,OANAC,GAAU,KACNH,GAAYI,QACiB,KAAzB,MAAAb,OAAA,EAAAA,EAAWW,WAA0BX,EAAUW,UAAYE,GAC/D,GACD,CAAC,MAAAb,OAAAA,EAAAA,EAAWW,YAIPG,EAAC,KAFLR,GAAeN,EAEV,CACGe,QAAS,SAAuBC,GAC5BP,GAAYD,GACZR,EAAUe,QAAQC,EACtB,EACAC,WAAY,SAAwBD,IAClB,MAAVA,EAAEE,KAAyB,UAAVF,EAAEE,OACnBF,EAAEG,iBACFV,GAAYD,GACZR,EAAUe,QAAQC,GAE1B,EACA,cAAY,0BACZjB,UAAWqB,EACP,gBACA,2BACArB,EACA,CACK,0BACG,MAAAC,OAAAA,EAAAA,EAAWqB,kBAAmBb,IAG1C,aAAW,eACX,eACI,MAAAR,GAAAA,EAAWqB,gBACLb,EACI,OACA,aACJ,EAEVc,SAAU,KACNpB,EACJ,eAAcE,EACdD,IAAAA,EAECF,SAAAA,GAMR,CACGF,UAAWqB,EAAK,gBAAiBrB,MAC7BG,EACJC,IAAAA,EACA,eAAcC,EAEbH,SAAAA,GACL,IAKZJ,EAAS0B,YAAc"}

package/build/es/components/table/stories/table.stories.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as r,Fragment as a}from"react/jsx-runtime";import"react";import{Table as l}from"../Table.js";import{TableBody as t}from"../TableBody.js";import{TableCaption as n}from"../TableCaption.js";import{TableCell as o}from"../TableCell.js";import{TableHead as i}from"../TableHead.js";import{TableHeader as s}from"../TableHeader.js";import{TableRow as d}from"../TableRow.js";const m={title:"Komponenter/Table",component:l,parameters:{layout:"centered"},tags:["autodocs"]},p=["Dato","Saksnummer","Kundenummer","Kundenavn","Milepæl","Følger saken"],c={args:{caption:e(n,{srOnly:!0,children:"Overskrift for skjermlesere"}),children:r(a,{children:[e(i,{children:e(d,{children:p.map(((r,a)=>e(s,{bold:!0,children:r},a)))})}),e(t,{children:[["24.02.2020","20-1234567","010203 99887","Ola Nordmann","Opprettet","Siri Saksbehandler"],["13.04.2019","20-8382811","010203 99887","Kari Nordkvinne","Opprettet","Siri Saksbehandler"],["31.07.2017","20-1111","010203 99887","Kari Nordkvinne","Opprettet","Per Persen"]].map(((r,a)=>e(d,{children:r.map(((r,a)=>e(o,{"data-th":p[a],align:[1,2].includes(a)?"right":"left",children:r},a)))},a)))})]})},render:r=>e(l,{caption:r.caption,fullWidth:!0,children:r.children})};export{c as TableComponent,m as default};
+import{jsxs as e,Fragment as r,jsx as a}from"react/jsx-runtime";import"react";import{Table as l}from"../Table.js";import{TableBody as t}from"../TableBody.js";import{TableCaption as n}from"../TableCaption.js";import{TableCell as o}from"../TableCell.js";import{TableHead as i}from"../TableHead.js";import{TableHeader as s}from"../TableHeader.js";import{TableRow as d}from"../TableRow.js";const m={title:"Komponenter/Table",component:l,parameters:{layout:"centered"},tags:["autodocs"]},p=["Dato","Saksnummer","Kundenummer","Kundenavn","Milepæl","Følger saken"],c={args:{caption:a(n,{srOnly:!0,children:"Overskrift for skjermlesere"}),children:e(r,{children:[a(i,{children:a(d,{children:p.map(((e,r)=>a(s,{bold:!0,children:e},r)))})}),a(t,{children:[["24.02.2020","20-1234567","010203 99887","Ola Nordmann","Opprettet","Siri Saksbehandler"],["13.04.2019","20-8382811","010203 99887","Kari Nordkvinne","Opprettet","Siri Saksbehandler"],["31.07.2017","20-1111","010203 99887","Kari Nordkvinne","Opprettet","Per Persen"]].map(((e,r)=>a(d,{children:e.map(((e,r)=>a(o,{"data-th":p[r],align:[1,2].includes(r)?"right":"left",children:e},r)))},r)))})]})},render:e=>a(l,{caption:e.caption,fullWidth:!0,children:e.children})};export{c as TableComponent,m as default};
 //# sourceMappingURL=table.stories.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import type { TableSortDirection } from \"./TableHeader.js\";\n\nexport type TableSortProps = ReturnType<\n ReturnType<typeof useSortableTableHeader>[\"getSortProps\"]\n>[\"sortable\"];\n\nexport const useSortableTableHeader = (\n activeSortKey: string,\n activeSortDirection: TableSortDirection,\n onChange: (\n newSortKey: string,\n newSortDirection: TableSortDirection,\n ) => void,\n) => {\n const calculateNewSortParameters = (\n sortKey: string,\n ): TableSortDirection => {\n if (sortKey === activeSortKey && activeSortDirection === \"desc\") {\n return \"asc\";\n }\n\n return \"desc\";\n };\n\n const handleClick = (sortKey: string) => {\n const newSortParameters = calculateNewSortParameters(sortKey);\n onChange(sortKey, newSortParameters);\n };\n\n const getSortProps = (sortKey: string) => {\n return {\n sortable: {\n onClick: () => handleClick(sortKey),\n direction:\n activeSortKey === sortKey ? activeSortDirection : undefined,\n },\n };\n };\n\n return {\n getSortProps,\n };\n};\n"],"names":["useSortableTableHeader","activeSortKey","activeSortDirection","onChange","calculateNewSortParameters","handleClick","sortKey","newSortParameters","getSortProps","sortable","onClick","direction"],"mappings":"AAMO,MAAMA,EAAyB,CAClCC,EACAC,EACAC,KAKMC,MAUAC,EAAeC,IACXC,MAAAA,EAXyB,CAC/BD,GAEIA,IAAYL,GAAyC,SAAxBC,EACtB,MAGJ,OAImBE,CAA2BE,GACrDH,EAASG,EAASC,EAAiB,EAahC,MAAA,CACHC,aAXkBF,IACX,CACHG,SAAU,CACNC,QAAS,IAAML,EAAYC,GAC3BK,UACIV,IAAkBK,EAAUJ,OAAsB,~~KAM9D~~"}
1	+ {"version":3,"file":"utils.js","sources":["../../../../src/components/table/utils.ts"],"sourcesContent":["import type { TableSortDirection } from \"./TableHeader.js\";\n\nexport type TableSortProps = ReturnType<\n ReturnType<typeof useSortableTableHeader>[\"getSortProps\"]\n>[\"sortable\"];\n\nexport const useSortableTableHeader = (\n activeSortKey: string,\n activeSortDirection: TableSortDirection,\n onChange: (\n newSortKey: string,\n newSortDirection: TableSortDirection,\n ) => void,\n) => {\n const calculateNewSortParameters = (\n sortKey: string,\n ): TableSortDirection => {\n if (sortKey === activeSortKey && activeSortDirection === \"desc\") {\n return \"asc\";\n }\n\n return \"desc\";\n };\n\n const handleClick = (sortKey: string) => {\n const newSortParameters = calculateNewSortParameters(sortKey);\n onChange(sortKey, newSortParameters);\n };\n\n const getSortProps = (sortKey: string) => {\n return {\n sortable: {\n onClick: () => handleClick(sortKey),\n direction:\n activeSortKey === sortKey ? activeSortDirection : undefined,\n },\n };\n };\n\n return {\n getSortProps,\n };\n};\n"],"names":["useSortableTableHeader","activeSortKey","activeSortDirection","onChange","calculateNewSortParameters","handleClick","sortKey","newSortParameters","getSortProps","sortable","onClick","direction"],"mappings":"AAMO,MAAMA,EAAyB,CAClCC,EACAC,EACAC,KAKMC,MAUAC,EAAeC,IACXC,MAAAA,EAXyB,CAC/BD,GAEIA,IAAYL,GAAyC,SAAxBC,EACtB,MAGJ,OAImBE,CAA2BE,GACrDH,EAASG,EAASC,EAAiB,EAahC,MAAA,CACHC,aAXkBF,IACX,CACHG,SAAU,CACNC,QAAS,IAAML,EAAYC,GAC3BK,UACIV,IAAkBK,EAAUJ,OAAsB,KAOlE"}

package/build/es/components/tabs/NavTab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavTab.js","sources":["../../../../src/components/tabs/NavTab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { NavTabProps } from \"./types.js\";\n\ntype NavTabComponent = <ElementType extends React.ElementType = \"a\">(\n props: NavTabProps<ElementType>,\n) => React.ReactElement \| null;\n\nexport const NavTab = forwardRef(function NavTab<\n ElementType extends React.ElementType = \"a\",\n>(props: NavTabProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n as = \"a\",\n \"aria-selected\": selected,\n className,\n onBeforeKeyboardNavigation: onBeforeNavigate,\n ...rest\n } = props;\n\n const Component = as;\n\n const navigate = useCallback(\n (from: HTMLAnchorElement, to: HTMLAnchorElement) => {\n if (onBeforeNavigate) {\n // Åpne for å stoppe selve navigeringen hvis det skulle være behov for å gjøre noe custom med fokus og navigasjon\n const doNavigate = onBeforeNavigate(from, to);\n if (doNavigate === false) {\n return;\n }\n }\n\n to.focus();\n // Click brukes for å være router-agnostisk\n to.click();\n },\n [onBeforeNavigate],\n );\n\n const handleOnKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n navigate(current, prev as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.lastChild\n ?.previousSibling as HTMLAnchorElement,\n );\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"A\") {\n navigate(current, next as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.firstChild as HTMLAnchorElement,\n );\n }\n }\n },\n [navigate],\n );\n\n return (\n <Component\n ref={ref}\n {...rest}\n role=\"tab\"\n aria-selected={selected}\n className={clsx(\"jkl-tab\", className)}\n onKeyDown={handleOnKeyDown}\n // En faneliste skal være én fokuserbar gruppe.\n // Piltaster brukes for å veksle mellom faner.\n // Bare den aktive fanen skal være fokuserbar med tastatur.\n tabIndex={selected ? 0 : -1}\n />\n );\n}) as NavTabComponent;\n"],"names":["NavTab","forwardRef","props","ref","as","selected","className","onBeforeKeyboardNavigation","onBeforeNavigate","rest","Component","navigate","useCallback","from","to","focus","click","handleOnKeyDown","event","key","current","currentTarget","prev","previousSibling","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","clsx","onKeyDown","tabIndex"],"mappings":"0IASO,MAAMA,EAASC,GAAW,SAE/BC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,IACL,gBAAiBC,EACjBC,UAAAA,EACAC,2BAA4BC,KACzBC,GACHP,EAEEQ,EAAYN,EAEZO,EAAWC,GACb,CAACC,EAAyBC,KAClBN,IAGmB,IADAA,EAAiBK,EAAMC,KAM9CA,EAAGC,QAEHD,EAAGE,QAAM,GAEb,CAACR,IAGCS,EAAkBL,GACnBM,cACOA,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAG7BZ,EAASS,EADTE,IAKI,OAAAE,EAAA,OAAAC,EAAAL,EAAQM,sBAARD,EAAuBE,kBAAvBH,EACMD,~~iBAGlB~~,~~CAEIL~~,GAAc,eAAdA,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBO,EAAOV,EAAMG,cAAcQ,YAG7BD,GAA0B,MAAlBA,EAAKE,SACbnB,EAASS,EAASQ,GAElBjB,EACIS,EACA,OAAAW,EAAAX,EAAQM,oBAAR,EAAAK,EAAuBC,~~WAGnC~~,~~IAEJ~~,CAACrB,IAID,OAAAsB,EAACvB,EAAA,CACGP,IAAAA,KACIM,EACJyB,KAAK,MACL,gBAAe7B,EACfC,UAAW6B,EAAK,UAAW7B,GAC3B8B,UAAWnB,EAIXoB,SAAUhC,EAAW,GAAI,GAGrC"}
1	+ {"version":3,"file":"NavTab.js","sources":["../../../../src/components/tabs/NavTab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, useCallback } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { NavTabProps } from \"./types.js\";\n\ntype NavTabComponent = <ElementType extends React.ElementType = \"a\">(\n props: NavTabProps<ElementType>,\n) => React.ReactElement \| null;\n\nexport const NavTab = forwardRef(function NavTab<\n ElementType extends React.ElementType = \"a\",\n>(props: NavTabProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n const {\n as = \"a\",\n \"aria-selected\": selected,\n className,\n onBeforeKeyboardNavigation: onBeforeNavigate,\n ...rest\n } = props;\n\n const Component = as;\n\n const navigate = useCallback(\n (from: HTMLAnchorElement, to: HTMLAnchorElement) => {\n if (onBeforeNavigate) {\n // Åpne for å stoppe selve navigeringen hvis det skulle være behov for å gjøre noe custom med fokus og navigasjon\n const doNavigate = onBeforeNavigate(from, to);\n if (doNavigate === false) {\n return;\n }\n }\n\n to.focus();\n // Click brukes for å være router-agnostisk\n to.click();\n },\n [onBeforeNavigate],\n );\n\n const handleOnKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLAnchorElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n navigate(current, prev as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.lastChild\n ?.previousSibling as HTMLAnchorElement,\n );\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"A\") {\n navigate(current, next as HTMLAnchorElement);\n } else {\n navigate(\n current,\n current.parentElement?.firstChild as HTMLAnchorElement,\n );\n }\n }\n },\n [navigate],\n );\n\n return (\n <Component\n ref={ref}\n {...rest}\n role=\"tab\"\n aria-selected={selected}\n className={clsx(\"jkl-tab\", className)}\n onKeyDown={handleOnKeyDown}\n // En faneliste skal være én fokuserbar gruppe.\n // Piltaster brukes for å veksle mellom faner.\n // Bare den aktive fanen skal være fokuserbar med tastatur.\n tabIndex={selected ? 0 : -1}\n />\n );\n}) as NavTabComponent;\n"],"names":["NavTab","forwardRef","props","ref","as","selected","className","onBeforeKeyboardNavigation","onBeforeNavigate","rest","Component","navigate","useCallback","from","to","focus","click","handleOnKeyDown","event","key","current","currentTarget","prev","previousSibling","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","clsx","onKeyDown","tabIndex"],"mappings":"0IASO,MAAMA,EAASC,GAAW,SAE/BC,EAAiCC,GACzB,MACFC,GAAAA,EAAK,IACL,gBAAiBC,EACjBC,UAAAA,EACAC,2BAA4BC,KACzBC,GACHP,EAEEQ,EAAYN,EAEZO,EAAWC,GACb,CAACC,EAAyBC,KAClBN,IAGmB,IADAA,EAAiBK,EAAMC,KAM9CA,EAAGC,QAEHD,EAAGE,QAAM,GAEb,CAACR,IAGCS,EAAkBL,GACnBM,cACOA,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAG7BZ,EAASS,EADTE,IAKI,OAAAE,EAAA,OAAAC,EAAAL,EAAQM,sBAARD,EAAuBE,kBAAvBH,EACMD,iBAEd,CAGAL,GAAc,eAAdA,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBO,EAAOV,EAAMG,cAAcQ,YAG7BD,GAA0B,MAAlBA,EAAKE,SACbnB,EAASS,EAASQ,GAElBjB,EACIS,EACA,OAAAW,EAAAX,EAAQM,oBAAR,EAAAK,EAAuBC,WAE/B,IAGR,CAACrB,IAID,OAAAsB,EAACvB,EAAA,CACGP,IAAAA,KACIM,EACJyB,KAAK,MACL,gBAAe7B,EACfC,UAAW6B,EAAK,UAAW7B,GAC3B8B,UAAWnB,EAIXoB,SAAUhC,EAAW,GAAI,GAGrC"}

package/build/es/components/tabs/NavTabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavTabs.js","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport type { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n \"aria-label\": ariaLabel,\n children,\n className,\n density = \"comfortable\",\n ...rest\n}: NavTabsProps) => {\n const [tabsRect, setTabsRect] = useState<DOMRect>();\n const [activeRect, setActiveRect] = useState<DOMRect>();\n\n const scrollRef = useRef<HTMLDivElement>(null);\n const tablistRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLElement>(null);\n\n const selectedIndex = React.Children.toArray(children).findIndex(\n (navTab) => {\n if (!React.isValidElement(navTab)) {\n return false;\n }\n return navTab.props[\"aria-selected\"] === true;\n },\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies:\n useEffect(() => {\n if (tablistRef.current) {\n setTabsRect(tablistRef.current.getBoundingClientRect());\n }\n if (activeRef.current) {\n setActiveRect(activeRef.current.getBoundingClientRect());\n }\n }, [selectedIndex, density]);\n\n return (\n <div\n {...rest}\n data-layout-density={density}\n className={clsx(\"jkl-tabs\", className)}\n ref={scrollRef}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel}\n ref={tablistRef}\n className=\"jkl-tablist\"\n >\n {React.Children.map(children, (child, index) => {\n return React.isValidElement(child)\n ? React.cloneElement<any>(child, {\n ref:\n selectedIndex === index\n ? activeRef\n : undefined,\n })\n : null;\n })}\n <span\n className=\"jkl-tablist__indicator\"\n style={{\n left:\n (activeRect?.left \|\| 0) -\n (tabsRect?.left \|\| 0) +\n (scrollRef.current?.scrollLeft \|\| 0),\n bottom: -1,\n width:\n (activeRect?.width \|\| 0) -\n (density === \"compact\" ? 32 : 38),\n }}\n />\n </div>\n </div>\n );\n};\n"],"names":["NavTabs","ariaLabel","children","className","density","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","_a","scrollLeft","bottom","width"],"mappings":"+JAIO,MAAMA,EAAU,EACnB,aAAcC,EACdC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,iBACPC,YAEH,MAAOC,EAAUC,GAAeC,KACzBC,EAAYC,GAAiBF,IAE9BG,EAAYC,EAAuB,MACnCC,EAAaD,EAAuB,MACpCE,EAAYF,EAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQhB,GAAUiB,WAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,mBAK5B,OAAAC,GAAU,KACFV,EAAWW,SACCjB,EAAAM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACId,EAAAI,EAAUU,QAAQC,wBAAuB,GAE5D,CAACV,EAAeX,IAGfsB,EAAC,MAAA,IACOrB,EACJ,sBAAqBD,EACrBD,UAAWwB,EAAK,WAAYxB,GAC5ByB,IAAKjB,EAELT,SAAA2B,EAAC,MAAA,CACGC,KAAK,UACL,aAAY7B,EACZ2B,IAAKf,EACLV,UAAU,cAETD,SAAA,CAAAc,EAAMC,SAASc,IAAI7B,GAAU,CAAC8B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,OAEVY,EAAC,OAAA,CACGvB,UAAU,yBACVgC,MAAO,CACHC,OACK,MAAA3B,OAAA,EAAAA,EAAY2B,OAAQ,KACpB,MAAA9B,OAAA,EAAAA,EAAU8B,OAAQ,KAClB,OAAAC,EAAA1B,EAAUa,cAAV,EAAAa,EAAmBC,aAAc,GACtCC,QAAQ,EACRC,QACK,MAAA/B,OAAAA,EAAAA,EAAY+B,QAAS,IACT,YAAZpC,EAAwB,GAAK,~~WAG9C~~"}
1	+ {"version":3,"file":"NavTabs.js","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport type { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n \"aria-label\": ariaLabel,\n children,\n className,\n density = \"comfortable\",\n ...rest\n}: NavTabsProps) => {\n const [tabsRect, setTabsRect] = useState<DOMRect>();\n const [activeRect, setActiveRect] = useState<DOMRect>();\n\n const scrollRef = useRef<HTMLDivElement>(null);\n const tablistRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLElement>(null);\n\n const selectedIndex = React.Children.toArray(children).findIndex(\n (navTab) => {\n if (!React.isValidElement(navTab)) {\n return false;\n }\n return navTab.props[\"aria-selected\"] === true;\n },\n );\n\n // biome-ignore lint/correctness/useExhaustiveDependencies:\n useEffect(() => {\n if (tablistRef.current) {\n setTabsRect(tablistRef.current.getBoundingClientRect());\n }\n if (activeRef.current) {\n setActiveRect(activeRef.current.getBoundingClientRect());\n }\n }, [selectedIndex, density]);\n\n return (\n <div\n {...rest}\n data-layout-density={density}\n className={clsx(\"jkl-tabs\", className)}\n ref={scrollRef}\n >\n <div\n role=\"tablist\"\n aria-label={ariaLabel}\n ref={tablistRef}\n className=\"jkl-tablist\"\n >\n {React.Children.map(children, (child, index) => {\n return React.isValidElement(child)\n ? React.cloneElement<any>(child, {\n ref:\n selectedIndex === index\n ? activeRef\n : undefined,\n })\n : null;\n })}\n <span\n className=\"jkl-tablist__indicator\"\n style={{\n left:\n (activeRect?.left \|\| 0) -\n (tabsRect?.left \|\| 0) +\n (scrollRef.current?.scrollLeft \|\| 0),\n bottom: -1,\n width:\n (activeRect?.width \|\| 0) -\n (density === \"compact\" ? 32 : 38),\n }}\n />\n </div>\n </div>\n );\n};\n"],"names":["NavTabs","ariaLabel","children","className","density","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","_a","scrollLeft","bottom","width"],"mappings":"+JAIO,MAAMA,EAAU,EACnB,aAAcC,EACdC,SAAAA,EACAC,UAAAA,EACAC,QAAAA,EAAU,iBACPC,YAEH,MAAOC,EAAUC,GAAeC,KACzBC,EAAYC,GAAiBF,IAE9BG,EAAYC,EAAuB,MACnCC,EAAaD,EAAuB,MACpCE,EAAYF,EAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQhB,GAAUiB,WAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,mBAK5B,OAAAC,GAAU,KACFV,EAAWW,SACCjB,EAAAM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACId,EAAAI,EAAUU,QAAQC,wBAAuB,GAE5D,CAACV,EAAeX,IAGfsB,EAAC,MAAA,IACOrB,EACJ,sBAAqBD,EACrBD,UAAWwB,EAAK,WAAYxB,GAC5ByB,IAAKjB,EAELT,SAAA2B,EAAC,MAAA,CACGC,KAAK,UACL,aAAY7B,EACZ2B,IAAKf,EACLV,UAAU,cAETD,SAAA,CAAAc,EAAMC,SAASc,IAAI7B,GAAU,CAAC8B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,OAEVY,EAAC,OAAA,CACGvB,UAAU,yBACVgC,MAAO,CACHC,OACK,MAAA3B,OAAA,EAAAA,EAAY2B,OAAQ,KACpB,MAAA9B,OAAA,EAAAA,EAAU8B,OAAQ,KAClB,OAAAC,EAAA1B,EAAUa,cAAV,EAAAa,EAAmBC,aAAc,GACtCC,QAAQ,EACRC,QACK,MAAA/B,OAAAA,EAAAA,EAAY+B,QAAS,IACT,YAAZpC,EAAwB,GAAK,WAIlD"}

package/build/es/components/tabs/Tab.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tab.js","sources":["../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabProps } from \"./types.js\";\n\n/*\n En Tab til bruk som element i TabList. Ikke funksjonell utenfor et TabList element.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tab = React.forwardRef<HTMLButtonElement, TabProps>(\n (props, ref) => {\n const classes = clsx(\"jkl-tab\", props.className);\n\n return (\n <button\n role=\"tab\"\n type=\"button\"\n ref={ref}\n {...props}\n className={classes}\n />\n );\n },\n);\n\nTab.displayName = \"Tab\";\n"],"names":["Tab","React","forwardRef","props","ref","classes","clsx","className","jsx","role","type","displayName"],"mappings":"2GASO,MAAMA,EAAMC,EAAMC,YACrB,CAACC,EAAOC,KACJ,MAAMC,EAAUC,EAAK,UAAWH,EAAMI,WAGlC,OAAAC,EAAC,SAAA,CACGC,KAAK,MACLC,KAAK,SACLN,IAAAA,KACID,EACJI,UAAWF,~~GAAA~~,~~IAM3BL~~,EAAIW,YAAc"}
1	+ {"version":3,"file":"Tab.js","sources":["../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport type { TabProps } from \"./types.js\";\n\n/*\n En Tab til bruk som element i TabList. Ikke funksjonell utenfor et TabList element.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tab = React.forwardRef<HTMLButtonElement, TabProps>(\n (props, ref) => {\n const classes = clsx(\"jkl-tab\", props.className);\n\n return (\n <button\n role=\"tab\"\n type=\"button\"\n ref={ref}\n {...props}\n className={classes}\n />\n );\n },\n);\n\nTab.displayName = \"Tab\";\n"],"names":["Tab","React","forwardRef","props","ref","classes","clsx","className","jsx","role","type","displayName"],"mappings":"2GASO,MAAMA,EAAMC,EAAMC,YACrB,CAACC,EAAOC,KACJ,MAAMC,EAAUC,EAAK,UAAWH,EAAMI,WAGlC,OAAAC,EAAC,SAAA,CACGC,KAAK,MACLC,KAAK,SACLN,IAAAA,KACID,EACJI,UAAWF,GACf,IAKZL,EAAIW,YAAc"}

package/build/es/components/tabs/TabList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TabList.js","sources":["../../../../src/components/tabs/TabList.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useCallback, useRef } from \"react\";\nimport type { TabListProps } from \"./types.js\";\n\nexport interface InjectedProps {\n activeIndex: number;\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n tabIDs: string[];\n tabPanelIDs: string[];\n}\n\n/*\n Konteiner for elementer av typen Tab. Ikke funksjonell utenfor et Tabs element.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const TabList = ({ children, className, ...injected }: TabListProps) => {\n // props injected by Tabs\n const { activeIndex, setActiveIndex, tabIDs, tabPanelIDs, ...rest } =\n injected as TabListProps & InjectedProps;\n\n const tabsRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLButtonElement>(null);\n\n const keyDownHandler = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n (prev as HTMLElement).focus();\n } else {\n (\n current.parentElement?.lastChild\n ?.previousSibling as HTMLElement\n ).focus();\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"BUTTON\") {\n (next as HTMLElement).focus();\n } else {\n (current.parentElement?.firstChild as HTMLElement).focus();\n }\n }\n },\n [],\n );\n\n return (\n <div\n role=\"tablist\"\n ref={tabsRef}\n {...rest}\n className={clsx(\"jkl-tablist\", className)}\n >\n {React.Children.map(children, (tab, tabIndex) => {\n const isActive = activeIndex === tabIndex;\n\n return React.isValidElement(tab)\n ? React.cloneElement<any>(tab, {\n onKeyDown: keyDownHandler,\n tabIndex: isActive ? undefined : -1,\n ref: isActive ? activeRef : undefined,\n onClick: () => setActiveIndex(tabIndex),\n \"aria-selected\": isActive,\n \"aria-controls\": tabPanelIDs[tabIndex],\n id: tabIDs[tabIndex],\n })\n : null;\n })}\n </div>\n );\n};\n"],"names":["TabList","children","className","injected","activeIndex","setActiveIndex","tabIDs","tabPanelIDs","rest","tabsRef","useRef","activeRef","keyDownHandler","useCallback","event","key","current","currentTarget","prev","previousSibling","focus","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","ref","clsx","Children","map","tab","tabIndex","isActive","React","isValidElement","cloneElement","onKeyDown","onClick","id"],"mappings":"yIAgBO,MAAMA,EAAU,EAAGC,SAAAA,EAAUC,UAAAA,KAAcC,MAExC,MAAEC,YAAAA,EAAaC,eAAAA,EAAgBC,OAAAA,EAAQC,YAAAA,KAAgBC,GACzDL,EAEEM,EAAUC,EAAuB,MACjCC,EAAYD,EAA0B,MAEtCE,EAAiBC,GAClBC,cACOA,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAE7BD,EACCA,EAAqBE,SAGlB,OAAAC,EAAA,OAAAC,EAAAN,EAAQO,oBAAR,EAAAD,EAAuBE,gBAAvBH,EAAAA,EACMF,iBACRC,~~OAEV~~,~~CAEIN~~,GAAc,eAAdA,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBQ,EAAOX,EAAMG,cAAcS,YAG7BD,GAA0B,WAAlBA,EAAKE,SACZF,EAAqBL,SAErB,OAAAQ,EAAAZ,EAAQO,oBAARK,EAAAA,EAAuBC,YAA2BT,~~OAE3D~~,~~IAEJ~~,IAIA,OAAAU,EAAC,MAAA,CACGC,KAAK,UACLC,IAAKvB,KACDD,EACJN,UAAW+B,EAAK,cAAe/B,GAE9BD,WAAMiC,SAASC,IAAIlC,GAAU,CAACmC,EAAKC,KAChC,MAAMC,EAAWlC,IAAgBiC,EAEjC,OAAOE,EAAMC,eAAeJ,GACtBG,EAAME,aAAkBL,EAAK,CACzBM,UAAW9B,EACXyB,SAAUC,OAAW,GAAY,EACjCN,IAAKM,EAAW3B,OAAY,EAC5BgC,QAAS,IAAMtC,EAAegC,GAC9B,gBAAiBC,EACjB,gBAAiB/B,EAAY8B,GAC7BO,GAAItC,EAAO+B,KAEf,IAAA,~~KACT~~"}
1	+ {"version":3,"file":"TabList.js","sources":["../../../../src/components/tabs/TabList.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useCallback, useRef } from \"react\";\nimport type { TabListProps } from \"./types.js\";\n\nexport interface InjectedProps {\n activeIndex: number;\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n tabIDs: string[];\n tabPanelIDs: string[];\n}\n\n/*\n Konteiner for elementer av typen Tab. Ikke funksjonell utenfor et Tabs element.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const TabList = ({ children, className, ...injected }: TabListProps) => {\n // props injected by Tabs\n const { activeIndex, setActiveIndex, tabIDs, tabPanelIDs, ...rest } =\n injected as TabListProps & InjectedProps;\n\n const tabsRef = useRef<HTMLDivElement>(null);\n const activeRef = useRef<HTMLButtonElement>(null);\n\n const keyDownHandler = useCallback(\n (event: React.KeyboardEvent<HTMLButtonElement>) => {\n if (event.key === \"ArrowLeft\") {\n const current = event.currentTarget;\n const prev = event.currentTarget.previousSibling;\n\n if (prev) {\n (prev as HTMLElement).focus();\n } else {\n (\n current.parentElement?.lastChild\n ?.previousSibling as HTMLElement\n ).focus();\n }\n }\n\n if (event.key === \"ArrowRight\") {\n const current = event.currentTarget;\n const next = event.currentTarget.nextSibling;\n\n // skip the focus indicator element\n if (next && next.nodeName === \"BUTTON\") {\n (next as HTMLElement).focus();\n } else {\n (current.parentElement?.firstChild as HTMLElement).focus();\n }\n }\n },\n [],\n );\n\n return (\n <div\n role=\"tablist\"\n ref={tabsRef}\n {...rest}\n className={clsx(\"jkl-tablist\", className)}\n >\n {React.Children.map(children, (tab, tabIndex) => {\n const isActive = activeIndex === tabIndex;\n\n return React.isValidElement(tab)\n ? React.cloneElement<any>(tab, {\n onKeyDown: keyDownHandler,\n tabIndex: isActive ? undefined : -1,\n ref: isActive ? activeRef : undefined,\n onClick: () => setActiveIndex(tabIndex),\n \"aria-selected\": isActive,\n \"aria-controls\": tabPanelIDs[tabIndex],\n id: tabIDs[tabIndex],\n })\n : null;\n })}\n </div>\n );\n};\n"],"names":["TabList","children","className","injected","activeIndex","setActiveIndex","tabIDs","tabPanelIDs","rest","tabsRef","useRef","activeRef","keyDownHandler","useCallback","event","key","current","currentTarget","prev","previousSibling","focus","_b","_a","parentElement","lastChild","next","nextSibling","nodeName","_c","firstChild","jsx","role","ref","clsx","Children","map","tab","tabIndex","isActive","React","isValidElement","cloneElement","onKeyDown","onClick","id"],"mappings":"yIAgBO,MAAMA,EAAU,EAAGC,SAAAA,EAAUC,UAAAA,KAAcC,MAExC,MAAEC,YAAAA,EAAaC,eAAAA,EAAgBC,OAAAA,EAAQC,YAAAA,KAAgBC,GACzDL,EAEEM,EAAUC,EAAuB,MACjCC,EAAYD,EAA0B,MAEtCE,EAAiBC,GAClBC,cACOA,GAAc,cAAdA,EAAMC,IAAqB,CAC3B,MAAMC,EAAUF,EAAMG,cAChBC,EAAOJ,EAAMG,cAAcE,gBAE7BD,EACCA,EAAqBE,SAGlB,OAAAC,EAAA,OAAAC,EAAAN,EAAQO,oBAAR,EAAAD,EAAuBE,gBAAvBH,EAAAA,EACMF,iBACRC,OACN,CAGAN,GAAc,eAAdA,EAAMC,IAAsB,CAC5B,MAAMC,EAAUF,EAAMG,cAChBQ,EAAOX,EAAMG,cAAcS,YAG7BD,GAA0B,WAAlBA,EAAKE,SACZF,EAAqBL,SAErB,OAAAQ,EAAAZ,EAAQO,oBAARK,EAAAA,EAAuBC,YAA2BT,OACvD,IAGR,IAIA,OAAAU,EAAC,MAAA,CACGC,KAAK,UACLC,IAAKvB,KACDD,EACJN,UAAW+B,EAAK,cAAe/B,GAE9BD,WAAMiC,SAASC,IAAIlC,GAAU,CAACmC,EAAKC,KAChC,MAAMC,EAAWlC,IAAgBiC,EAEjC,OAAOE,EAAMC,eAAeJ,GACtBG,EAAME,aAAkBL,EAAK,CACzBM,UAAW9B,EACXyB,SAAUC,OAAW,GAAY,EACjCN,IAAKM,EAAW3B,OAAY,EAC5BgC,QAAS,IAAMtC,EAAegC,GAC9B,gBAAiBC,EACjB,gBAAiB/B,EAAY8B,GAC7BO,GAAItC,EAAO+B,KAEf,IAAA,KAEd"}

package/build/es/components/tabs/Tabs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{c as s}from"../../../clsx-BeLtu-UY.js";import a,{useState as r,useEffect as n,useCallback as l}from"react";import{usePreviousValue as i}from"../../hooks/usePreviousValue/usePreviousValue.js";import{TabsContextProvider as o}from"./tabsContext.js";let d=(e=21)=>crypto.getRandomValues(new Uint8Array(e)).reduce(((e,t)=>e+=(t&=63)<36?t.toString(36):t<62?(t-26).toString(36).toUpperCase():t>62?"-":"_"),"");const c=({onChange:c,defaultTab:m,density:u,...h})=>{const[p,b]=r(m??0),f=i(p);n((()=>{void 0!==f&&f!==p&&c&&c(p)}),[c,f,p]);const[j,x]=r([]),[C,v]=r([]),y=l((()=>{const e=a.Children.toArray(h.children)[0];a.isValidElement(e)&&a.Children.forEach(e.props.children,(e=>{a.isValidElement(e)&&(x((e=>[...e,`jkl-tab-${d(8)}`])),v((e=>[...e,`jkl-tabpanel-${d(8)}`])))}))}),[h.children]);return n((()=>{y()}),[y]),e(o,{state:{density:u},children:t("div",{...h,className:s("jkl-tabs",h.className),"data-density":u,children:[(()=>{const e=a.Children.toArray(h.children)[0];if(a.isValidElement(e))return a.cloneElement(e,{activeIndex:p,setActiveIndex:b,tabIDs:j,tabPanelIDs:C})})(),a.Children.map(h.children,((e,t)=>{if(!a.isValidElement(e)||0===t)return;const s=t-1;return s===p?a.cloneElement(e,{"aria-labelledby":j[s],id:C[s]}):null}))]})})};export{c as Tabs};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{c as s}from"../../../clsx-BeLtu-UY.js";import a,{useState as r,useEffect as n,useCallback as l}from"react";import{usePreviousValue as i}from"../../hooks/usePreviousValue/usePreviousValue.js";import{TabsContextProvider as o}from"./tabsContext.js";let d=(e=21)=>{let t="",s=crypto.getRandomValues(new Uint8Array(e|=0));for(;e--;)t+="useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict"[63&s[e]];return t};const c=({onChange:c,defaultTab:m,density:u,...h})=>{const[b,f]=r(m??0),p=i(b);n((()=>{void 0!==p&&p!==b&&c&&c(b)}),[c,p,b]);const[j,x]=r([]),[v,y]=r([]),C=l((()=>{const e=a.Children.toArray(h.children)[0];a.isValidElement(e)&&a.Children.forEach(e.props.children,(e=>{a.isValidElement(e)&&(x((e=>[...e,`jkl-tab-${d(8)}`])),y((e=>[...e,`jkl-tabpanel-${d(8)}`])))}))}),[h.children]);return n((()=>{C()}),[C]),e(o,{state:{density:u},children:t("div",{...h,className:s("jkl-tabs",h.className),"data-density":u,children:[(()=>{const e=a.Children.toArray(h.children)[0];if(a.isValidElement(e))return a.cloneElement(e,{activeIndex:b,setActiveIndex:f,tabIDs:j,tabPanelIDs:v})})(),a.Children.map(h.children,((e,t)=>{if(!a.isValidElement(e)||0===t)return;const s=t-1;return s===b?a.cloneElement(e,{"aria-labelledby":j[s],id:v[s]}):null}))]})})};export{c as Tabs};
 //# sourceMappingURL=Tabs.js.map

package/build/es/components/tabs/Tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.js","sources":["../../../../../../node_modules/.pnpm/nanoid@3.3.8/node_modules/nanoid/index.browser.js","../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["// ~~This file replaces `~~index.~~js`~~ in ~~bundlers~~ ~~like~~ ~~webpack~~ or ~~Rollup,\n//~~ ~~according~~ ~~to `browser` config in `package~~.~~json`.\n~~\~~nimport~~ { urlAlphabet } from './url-alphabet/index.js'\~~n\nlet~~ random = bytes => crypto.getRandomValues(new Uint8Array(bytes))\~~n\nlet~~ customRandom = (alphabet, defaultSize, getRandom) => {\n // First, a bitmask is necessary to generate the ID. The bitmask makes bytes\n // values closer to the alphabet size. The bitmask calculates the closest\n // `2^31 - 1` number, which exceeds the alphabet size.\n // For example, the bitmask for the alphabet size 30 is 31 (00011111).\n // `Math.clz32` is not used, because it is not available in browsers.\n let mask = (2 << (Math.~~log~~(alphabet.length - 1) ~~/ Math.LN2~~)) - 1\n // Though, the bitmask solution is not perfect since the bytes exceeding\n // the alphabet size are refused. Therefore, to reliably generate the ID,\n // the random bytes redundancy has to be satisfied.\n\n // Note: every hardware random generator call is performance expensive,\n // because the system call for entropy collection takes a lot of time.\n // So, to avoid additional system calls, extra bytes are requested in advance.\n\n // Next, a step determines how many random bytes to generate.\n // The number of random bytes gets decided upon the ID size, mask,\n // alphabet size, and magic number 1.6 (using 1.6 peaks at performance\n // according to benchmarks).\n\n // `-~f => Math.ceil(f)` if f is a float\n // `-~i => i + 1` if i is an integer\n let step = -~((1.6 * mask * defaultSize) / alphabet.length)\n\n return (size = defaultSize) => {\n let id = ''\n while (true) {\n let bytes = getRandom(step)\n ~~// A compact alternative for `for (var i = 0; i < step; i++)`.\n~~ let j = step \| 0\n while (j--) {\n ~~// Adding `\|\| ''` refuses a random byte that exceeds the alphabet size.\n~~ id += alphabet[bytes[j] & mask] \|\| ''\n if (id.length ~~===~~ size) return id\n }\n }\n }\n}\~~n\nlet~~ customAlphabet = (alphabet, size = 21) =>\n customRandom(alphabet, size, random)\~~n\nlet~~ nanoid = (size = 21) ~~=>\n crypto.getRandomValues(new Uint8Array(size)).reduce((id, byte)~~ => {\n // It is ~~incorrect to use bytes exceeding the alphabet size.\n // The following mask reduces the random byte in the 0-255 value~~\n // ~~range to the 0-63 value range. Therefore, adding hacks, such\n // as empty string fallback or magic numbers, is unneccessary because\n // the bitmask trims~~ bytes ~~down~~ ~~to the alphabet size.\n byte &= 63\n if (byte < 36) {\n // `0-9a-z`\n id += byte~~.~~toString~~(~~36)\n }~~ ~~else if~~ (~~byte < 62) {\n // `A-Z`\n id +=~~ (~~byte~~ - 26)~~.toString(36~~)~~.toUpperCase(~~)\n } ~~else if~~ (~~byte > 62~~) {\n id += ~~'-'\n }~~ ~~else~~ {\n ~~id += '_'\n~~ }\n return id\n }~~, '')~~\n~~\nexport { nanoid~~, ~~customAlphabet,~~ ~~customRandom,~~ urlAlphabet, ~~random }~~\n","import clsx from \"clsx\";\nimport { nanoid } from \"nanoid\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport { usePreviousValue } from \"../../hooks/usePreviousValue/usePreviousValue.js\";\nimport type { InjectedProps } from \"./TabList.js\";\nimport { TabsContextProvider } from \"./tabsContext.js\";\nimport type { TabListProps, TabPanelProps, TabsProps } from \"./types.js\";\n\n/*\n Konteiner for et grensesnitt hvor man kan tabbe mellom innhold.\n * Må inneholde en TabList etterfulgt av en eller flere TabPanel.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tabs = ({\n onChange,\n defaultTab,\n density,\n ...props\n}: TabsProps) => {\n const [activeIndex, setActiveIndex] = useState(defaultTab ?? 0);\n\n const previousTabIndex = usePreviousValue(activeIndex);\n\n useEffect(() => {\n if (\n previousTabIndex !== undefined &&\n previousTabIndex !== activeIndex &&\n onChange\n ) {\n onChange(activeIndex);\n }\n }, [onChange, previousTabIndex, activeIndex]);\n\n const [tabIDs, setTabIDs] = useState<string[]>([]);\n const [tabPanelIDs, setTabPanelIds] = useState<string[]>([]);\n\n const resolveIDs = useCallback(() => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement(tabList)) return;\n\n React.Children.forEach(tabList.props.children, (tab) => {\n if (!React.isValidElement(tab)) return;\n\n setTabIDs((prev) => [...prev, `jkl-tab-${nanoid(8)}`]);\n setTabPanelIds((prev) => [...prev, `jkl-tabpanel-${nanoid(8)}`]);\n });\n }, [props.children]);\n\n const renderTabList = () => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement<TabListProps & InjectedProps>(tabList))\n return;\n\n return React.cloneElement<TabListProps & InjectedProps>(tabList, {\n activeIndex,\n setActiveIndex,\n tabIDs,\n tabPanelIDs,\n });\n };\n\n const renderTabPanels = () => {\n return React.Children.map(props.children, (child, childIndex) => {\n if (\n !React.isValidElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child) \|\|\n childIndex === 0\n )\n return;\n\n const tabPanelIndex = childIndex - 1;\n\n return tabPanelIndex === activeIndex\n ? React.cloneElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child, {\n \"aria-labelledby\": tabIDs[tabPanelIndex],\n id: tabPanelIDs[tabPanelIndex],\n })\n : null;\n });\n };\n\n useEffect(() => {\n resolveIDs();\n }, [resolveIDs]);\n\n return (\n <TabsContextProvider state={{ density }}>\n <div\n {...props}\n className={clsx(\"jkl-tabs\", props.className)}\n data-density={density}\n >\n {renderTabList()}\n {renderTabPanels()}\n </div>\n </TabsContextProvider>\n );\n};\n"],"names":["nanoid","size","~~crypto~~","~~getRandomValues~~","~~Uint8Array~~","~~reduce~~","id","~~byte","toString","toUpperCase","~~Tabs","onChange","defaultTab","density","props","activeIndex","setActiveIndex","useState","previousTabIndex","usePreviousValue","useEffect","tabIDs","setTabIDs","tabPanelIDs","setTabPanelIds","resolveIDs","useCallback","tabList","React","Children","toArray","children","isValidElement","forEach","tab","prev","jsx","TabsContextProvider","state","jsxs","className","clsx","cloneElement","renderTabList","map","child","childIndex","tabPanelIndex"],"mappings":"+~~SAiDA~~,IAAIA,EAAS,CAACC,EAAO,~~KACnBC~~,~~OAAOC~~,~~gBAAgB~~,~~IAAIC~~,~~WAAWH~~,~~IAAOI~~,~~QAAO~~,~~CAACC~~,~~EAAIC~~,~~IASrDD,IAHFC,~~GAAQ,~~IACG~~,~~GAEHA~~,~~EAAKC~~,~~SAAS~~,~~IACXD~~,~~EAAO~~,~~IAETA~~,~~EAAO~~,~~IAAIC~~,~~SAAS~~,~~IAAIC~~,~~cACtBF~~,EAAO,~~GACV,IAEA,KAGP,ICvDE,MAAMG,EAAO,~~EAChBC,SAAAA,EACAC,WAAAA,EACAC,QAAAA,KACGC,MAEG,MAACC,EAAaC,GAAkBC,EAASL,GAAc,GAEvDM,EAAmBC,EAAiBJ,GAE1CK,GAAU,UAEmB,IAArBF,GACAA,IAAqBH,GACrBJ,GAEAA,EAASI,EAAW,GAEzB,CAACJ,EAAUO,EAAkBH,IAEhC,MAAOM,EAAQC,GAAaL,EAAmB,KACxCM,EAAaC,GAAkBP,EAAmB,IAEnDQ,EAAaC,GAAY,KAC3B,MAAMC,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAElDH,EAAMI,eAAeL,IAE1BC,EAAMC,SAASI,QAAQN,EAAQb,MAAMiB,UAAWG,IACvCN,EAAMI,eAAeE,KAEhBZ,GAACa,GAAS,IAAIA,EAAM,~~WAAWnC~~,EAAO,~~QACjCwB~~,GAACW,GAAS,IAAIA,EAAM,~~gBAAgBnC~~,EAAO,QAAK,GAClE,GACF,~~CAACc~~,EAAMiB,WAuCV,OAAAX,GAAU,KACKK,~~MACZ~~,CAACA,IAGCW,EAAAC,EAAA,CAAoBC,MAAO,CAAEzB,QAAAA,GAC1BkB,SAAAQ,EAAC,MAAA,IACOzB,EACJ0B,UAAWC,EAAK,WAAY3B,EAAM0B,WAClC,eAAc3B,EAEbkB,SAAA,CAhDS,MAClB,MAAMJ,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAElDH,GAAAA,EAAMI,eAA6CL,GAGjDC,OAAAA,EAAMc,aAA2Cf,EAAS,CAC7DZ,YAAAA,EACAC,eAAAA,EACAK,OAAAA,EACAE,YAAAA,GACH,EAqCsBoB,GAjChBf,EAAMC,SAASe,IAAI9B,EAAMiB,UAAU,CAACc,EAAOC,KAC9C,IACKlB,EAAMI,eAELa,IACa,IAAfC,EAEA,OAEJ,MAAMC,EAAgBD,EAAa,EAEnC,OAAOC,IAAkBhC,EACnBa,EAAMc,aAEJG,EAAO,CACL,kBAAmBxB,EAAO0B,~~GAC1BzC~~,~~GAAIiB~~,EAAYwB,KAEpB,IAAA,QAkBV","x_google_ignoreList":[0]}
1	+ {"version":3,"file":"Tabs.js","sources":["../../../../../../node_modules/.pnpm/nanoid@5.1.5/node_modules/nanoid/index.browser.js","../../../../../../node_modules/.pnpm/nanoid@5.1.5/node_modules/nanoid/url-alphabet/index.js","../../../../src/components/tabs/Tabs.tsx"],"sourcesContent":["/* @ts-self-types=\"./index.d.ts\" /\nimport { urlAlphabet as scopedUrlAlphabet } from './url-alphabet/index.js'\nexport { urlAlphabet } from './url-alphabet/index.js'\nexport let random = bytes => crypto.getRandomValues(new Uint8Array(bytes))\nexport let customRandom = (alphabet, defaultSize, getRandom) => {\n let mask = (2 << Math.log2(alphabet.length - 1)) - 1\n let step = -~((1.6 mask * defaultSize) / alphabet.length)\n return (size = defaultSize) => {\n let id = ''\n while (true) {\n let bytes = getRandom(step)\n let j = step \| 0\n while (j--) {\n id += alphabet[bytes[j] & mask] \|\| ''\n if (id.length >= size) return id\n }\n }\n }\n}\nexport let customAlphabet = (alphabet, size = 21) =>\n customRandom(alphabet, size \| 0, random)\nexport let nanoid = (size = 21) => {\n let id = ''\n let bytes = crypto.getRandomValues(new Uint8Array((size \|= 0)))\n while (size--) {\n id += scopedUrlAlphabet[bytes[size] & 63]\n }\n return id\n}\n","export const urlAlphabet =\n 'useandom-26T198340PX75pxJACKVERYMINDBUSHWOLF_GQZbfghjklqvwyzrict'\n","import clsx from \"clsx\";\nimport { nanoid } from \"nanoid\";\nimport React, { useCallback, useEffect, useState } from \"react\";\nimport { usePreviousValue } from \"../../hooks/usePreviousValue/usePreviousValue.js\";\nimport type { InjectedProps } from \"./TabList.js\";\nimport { TabsContextProvider } from \"./tabsContext.js\";\nimport type { TabListProps, TabPanelProps, TabsProps } from \"./types.js\";\n\n/*\n Konteiner for et grensesnitt hvor man kan tabbe mellom innhold.\n * Må inneholde en TabList etterfulgt av en eller flere TabPanel.\n \n Docs: https://jokul.fremtind.no/komponenter/tabs\n */\nexport const Tabs = ({\n onChange,\n defaultTab,\n density,\n ...props\n}: TabsProps) => {\n const [activeIndex, setActiveIndex] = useState(defaultTab ?? 0);\n\n const previousTabIndex = usePreviousValue(activeIndex);\n\n useEffect(() => {\n if (\n previousTabIndex !== undefined &&\n previousTabIndex !== activeIndex &&\n onChange\n ) {\n onChange(activeIndex);\n }\n }, [onChange, previousTabIndex, activeIndex]);\n\n const [tabIDs, setTabIDs] = useState<string[]>([]);\n const [tabPanelIDs, setTabPanelIds] = useState<string[]>([]);\n\n const resolveIDs = useCallback(() => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement(tabList)) return;\n\n React.Children.forEach(tabList.props.children, (tab) => {\n if (!React.isValidElement(tab)) return;\n\n setTabIDs((prev) => [...prev, `jkl-tab-${nanoid(8)}`]);\n setTabPanelIds((prev) => [...prev, `jkl-tabpanel-${nanoid(8)}`]);\n });\n }, [props.children]);\n\n const renderTabList = () => {\n const tabList = React.Children.toArray(props.children)[0];\n\n if (!React.isValidElement<TabListProps & InjectedProps>(tabList))\n return;\n\n return React.cloneElement<TabListProps & InjectedProps>(tabList, {\n activeIndex,\n setActiveIndex,\n tabIDs,\n tabPanelIDs,\n });\n };\n\n const renderTabPanels = () => {\n return React.Children.map(props.children, (child, childIndex) => {\n if (\n !React.isValidElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child) \|\|\n childIndex === 0\n )\n return;\n\n const tabPanelIndex = childIndex - 1;\n\n return tabPanelIndex === activeIndex\n ? React.cloneElement<\n TabPanelProps & React.HTMLAttributes<HTMLDivElement>\n >(child, {\n \"aria-labelledby\": tabIDs[tabPanelIndex],\n id: tabPanelIDs[tabPanelIndex],\n })\n : null;\n });\n };\n\n useEffect(() => {\n resolveIDs();\n }, [resolveIDs]);\n\n return (\n <TabsContextProvider state={{ density }}>\n <div\n {...props}\n className={clsx(\"jkl-tabs\", props.className)}\n data-density={density}\n >\n {renderTabList()}\n {renderTabPanels()}\n </div>\n </TabsContextProvider>\n );\n};\n"],"names":["nanoid","size","id","bytes","crypto","getRandomValues","Uint8Array","Tabs","onChange","defaultTab","density","props","activeIndex","setActiveIndex","useState","previousTabIndex","usePreviousValue","useEffect","tabIDs","setTabIDs","tabPanelIDs","setTabPanelIds","resolveIDs","useCallback","tabList","React","Children","toArray","children","isValidElement","forEach","tab","prev","jsx","TabsContextProvider","state","jsxs","className","clsx","cloneElement","renderTabList","map","child","childIndex","tabPanelIndex"],"mappings":"+SAqBO,IAAIA,EAAS,CAACC,EAAO,MACtBC,IAAAA,EAAK,GACLC,EAAQC,OAAOC,gBAAgB,IAAIC,WAAYL,GAAQ,IACpDA,KAAAA,KACLC,GCxBF,mEDwBwC,GAAdC,EAAMF,IAEzBC,OAAAA,CAAAA,EEbF,MAAMK,EAAO,EAChBC,SAAAA,EACAC,WAAAA,EACAC,QAAAA,KACGC,MAEG,MAACC,EAAaC,GAAkBC,EAASL,GAAc,GAEvDM,EAAmBC,EAAiBJ,GAE1CK,GAAU,UAEmB,IAArBF,GACAA,IAAqBH,GACrBJ,GAEAA,EAASI,EAAW,GAEzB,CAACJ,EAAUO,EAAkBH,IAEhC,MAAOM,EAAQC,GAAaL,EAAmB,KACxCM,EAAaC,GAAkBP,EAAmB,IAEnDQ,EAAaC,GAAY,KAC3B,MAAMC,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAElDH,EAAMI,eAAeL,IAE1BC,EAAMC,SAASI,QAAQN,EAAQb,MAAMiB,UAAWG,IACvCN,EAAMI,eAAeE,KAEhBZ,GAACa,GAAS,IAAIA,EAAM,WAAWhC,EAAO,QACjCqB,GAACW,GAAS,IAAIA,EAAM,gBAAgBhC,EAAO,QAAK,GAClE,GACF,CAACW,EAAMiB,WAuCV,OAAAX,GAAU,KACKK,GAAA,GACZ,CAACA,IAGCW,EAAAC,EAAA,CAAoBC,MAAO,CAAEzB,QAAAA,GAC1BkB,SAAAQ,EAAC,MAAA,IACOzB,EACJ0B,UAAWC,EAAK,WAAY3B,EAAM0B,WAClC,eAAc3B,EAEbkB,SAAA,CAhDS,MAClB,MAAMJ,EAAUC,EAAMC,SAASC,QAAQhB,EAAMiB,UAAU,GAElDH,GAAAA,EAAMI,eAA6CL,GAGjDC,OAAAA,EAAMc,aAA2Cf,EAAS,CAC7DZ,YAAAA,EACAC,eAAAA,EACAK,OAAAA,EACAE,YAAAA,GACH,EAqCsBoB,GAjChBf,EAAMC,SAASe,IAAI9B,EAAMiB,UAAU,CAACc,EAAOC,KAC9C,IACKlB,EAAMI,eAELa,IACa,IAAfC,EAEA,OAEJ,MAAMC,EAAgBD,EAAa,EAEnC,OAAOC,IAAkBhC,EACnBa,EAAMc,aAEJG,EAAO,CACL,kBAAmBxB,EAAO0B,GAC1B1C,GAAIkB,EAAYwB,KAEpB,IAAA,QAkBV","x_google_ignoreList":[0,1]}

package/build/es/components/tabs/stories/NavTabs.stories.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as a,jsxs as e}from"react/jsx-runtime";import"react";/* empty css                         */import{NavTab as s}from"../NavTab.js";import{NavTabs as r}from"../NavTabs.js";const t={title:"Komponenter/Tabs/NavTabs",component:r,subcomponents:{NavTab:s},tags:["autodocs"]},o={name:"NavTabs",args:{children:a("p",{children:"e"})},render:t=>e(r,{...t,children:[a(s,{"aria-selected":!0,children:"Alle"}),a(s,{"aria-selected":!1,children:"NICE"}),a(s,{"aria-selected":!1,children:"Prolife"})]})};export{o as TabsStory,t as default};
+import{jsxs as a,jsx as e}from"react/jsx-runtime";import"react";/* empty css                         */import{NavTab as s}from"../NavTab.js";import{NavTabs as r}from"../NavTabs.js";const t={title:"Komponenter/Tabs/NavTabs",component:r,subcomponents:{NavTab:s},tags:["autodocs"]},o={name:"NavTabs",args:{children:e("p",{children:"e"})},render:t=>a(r,{...t,children:[e(s,{"aria-selected":!0,children:"Alle"}),e(s,{"aria-selected":!1,children:"NICE"}),e(s,{"aria-selected":!1,children:"Prolife"})]})};export{o as TabsStory,t as default};
 //# sourceMappingURL=NavTabs.stories.js.map

package/build/es/components/tabs/stories/Tabs.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.stories.js","sources":["../../../../../src/components/tabs/stories/Tabs.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport \"../styles/_index.scss\";\nimport { Tab } from \"../Tab.js\";\nimport { TabList } from \"../TabList.js\";\nimport { TabPanel } from \"../TabPanel.js\";\nimport { Tabs } from \"../Tabs.js\";\n\nconst meta = {\n title: \"Komponenter/Tabs/Tabs\",\n component: Tabs,\n subcomponents: {\n TabList,\n TabPanel,\n Tab,\n },\n argTypes: {\n defaultTab: {\n control: \"number\",\n table: {\n defaultValue: {\n summary: undefined,\n },\n },\n },\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Tabs>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const TabsStory: Story = {\n name: \"Tabs\",\n args: {\n children: <p />,\n },\n render: (args) => (\n <div style={{ maxWidth: \"300px\" }}>\n <Tabs {...args}>\n <TabList aria-label=\"Avtale-filter\">\n <Tab>Alle avtaler</Tab>\n <Tab>NICE</Tab>\n <Tab>Prolife</Tab>\n <Tab>Paris</Tab>\n </TabList>\n\n <TabPanel>Alle avtaler</TabPanel>\n\n <TabPanel>NICE-avtaler</TabPanel>\n\n <TabPanel>Prolife-avtaler</TabPanel>\n\n <TabPanel>Paris-avtaler</TabPanel>\n </Tabs>\n </div>\n ),\n};\n"],"names":["meta","title","component","Tabs","subcomponents","TabList","TabPanel","Tab","argTypes","defaultTab","control","table","defaultValue","summary","tags","TabsStory","name","args","children","render","jsx","style","maxWidth","jsxs"],"mappings":"2PAQA,MAAMA,EAAO,CACTC,MAAO,wBACPC,UAAWC,EACXC,cAAe,CACXC,QAAAA,EACAC,SAAAA,EACAC,IAAAA,GAEJC,SAAU,CACNC,WAAY,CACRC,QAAS,SACTC,MAAO,CACHC,aAAc,CACVC,aAAS,MAKzBC,KAAM,CAAC,aAMEC,EAAmB,CAC5BC,KAAM,OACNC,KAAM,CACFC,WAAW,IAAE,~~KAEjBC~~,OAASF,GACLG,EAAC,MAAI,CAAAC,MAAO,CAAEC,SAAU,SACpBJ,SAACK,EAAApB,EAAA,IAASc,EACNC,SAAA,CAACK,EAAAlB,EAAA,CAAQ,aAAW,gBAChBa,SAAA,CAAAE,EAACb,GAAIW,SAAY,iBACjBE,EAACb,GAAIW,SAAI,SACTE,EAACb,GAAIW,SAAO,YACZE,EAACb,GAAIW,SAAK,aAGdE,EAACd,GAASY,SAAY,iBAEtBE,EAACd,GAASY,SAAY,iBAEtBE,EAACd,GAASY,SAAe,oBAEzBE,EAACd,GAASY,SAAa"}
1	+ {"version":3,"file":"Tabs.stories.js","sources":["../../../../../src/components/tabs/stories/Tabs.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React from \"react\";\nimport \"../styles/_index.scss\";\nimport { Tab } from \"../Tab.js\";\nimport { TabList } from \"../TabList.js\";\nimport { TabPanel } from \"../TabPanel.js\";\nimport { Tabs } from \"../Tabs.js\";\n\nconst meta = {\n title: \"Komponenter/Tabs/Tabs\",\n component: Tabs,\n subcomponents: {\n TabList,\n TabPanel,\n Tab,\n },\n argTypes: {\n defaultTab: {\n control: \"number\",\n table: {\n defaultValue: {\n summary: undefined,\n },\n },\n },\n },\n tags: [\"autodocs\"],\n} satisfies Meta<typeof Tabs>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\nexport const TabsStory: Story = {\n name: \"Tabs\",\n args: {\n children: <p />,\n },\n render: (args) => (\n <div style={{ maxWidth: \"300px\" }}>\n <Tabs {...args}>\n <TabList aria-label=\"Avtale-filter\">\n <Tab>Alle avtaler</Tab>\n <Tab>NICE</Tab>\n <Tab>Prolife</Tab>\n <Tab>Paris</Tab>\n </TabList>\n\n <TabPanel>Alle avtaler</TabPanel>\n\n <TabPanel>NICE-avtaler</TabPanel>\n\n <TabPanel>Prolife-avtaler</TabPanel>\n\n <TabPanel>Paris-avtaler</TabPanel>\n </Tabs>\n </div>\n ),\n};\n"],"names":["meta","title","component","Tabs","subcomponents","TabList","TabPanel","Tab","argTypes","defaultTab","control","table","defaultValue","summary","tags","TabsStory","name","args","children","render","jsx","style","maxWidth","jsxs"],"mappings":"2PAQA,MAAMA,EAAO,CACTC,MAAO,wBACPC,UAAWC,EACXC,cAAe,CACXC,QAAAA,EACAC,SAAAA,EACAC,IAAAA,GAEJC,SAAU,CACNC,WAAY,CACRC,QAAS,SACTC,MAAO,CACHC,aAAc,CACVC,aAAS,MAKzBC,KAAM,CAAC,aAMEC,EAAmB,CAC5BC,KAAM,OACNC,KAAM,CACFC,WAAW,IAAE,CAAA,IAEjBC,OAASF,GACLG,EAAC,MAAI,CAAAC,MAAO,CAAEC,SAAU,SACpBJ,SAACK,EAAApB,EAAA,IAASc,EACNC,SAAA,CAACK,EAAAlB,EAAA,CAAQ,aAAW,gBAChBa,SAAA,CAAAE,EAACb,GAAIW,SAAY,iBACjBE,EAACb,GAAIW,SAAI,SACTE,EAACb,GAAIW,SAAO,YACZE,EAACb,GAAIW,SAAK,aAGdE,EAACd,GAASY,SAAY,iBAEtBE,EAACd,GAASY,SAAY,iBAEtBE,EAACd,GAASY,SAAe,oBAEzBE,EAACd,GAASY,SAAa"}

package/build/es/components/text-area/BaseTextArea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseTextArea.js","sources":["../../../../src/components/text-area/BaseTextArea.tsx"],"sourcesContent":["import React, {\n type ChangeEvent,\n type FocusEvent,\n forwardRef,\n type RefObject,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { BaseTextAreaProps } from \"./types.js\";\n\nexport const BaseTextArea = forwardRef<HTMLTextAreaElement, BaseTextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n counter,\n onBlur,\n onFocus,\n rows = 7,\n placeholder = \" \", // This space intentionally left blank. Denne + rows trengs for å få den ekspanderende effekten.\n startOpen,\n style,\n value,\n \"aria-invalid\": ariaInvalid,\n onChange,\n ...rest\n } = props;\n\n const [counterCurrent, setCounterCurrent] = useState(() => {\n if (typeof value === \"undefined\") {\n return 0;\n }\n\n if (typeof value === \"number\") {\n return String(value).length;\n }\n\n return value.length;\n });\n const [textAreaFocused, setTextAreaFocused] = useState(false);\n const internalRef = useRef<HTMLTextAreaElement>(null);\n const textAreaRef =\n (ref as RefObject<HTMLTextAreaElement>) \|\| internalRef;\n\n useEffect(() => {\n const textAreaElement = textAreaRef.current;\n if (textAreaElement) {\n if (!autoExpand) {\n textAreaElement.style.height = \"\";\n return;\n }\n\n if (textAreaFocused \|\| value) {\n textAreaElement.style.height = \"auto\"; // Sett til auto før scrollhøyden leses, sånn at redusering av høyde ved sletting av tekst fungerer\n textAreaElement.style.height = `${textAreaElement.scrollHeight}px`;\n } else {\n textAreaElement.style.height = \"\";\n }\n }\n }, [autoExpand, textAreaRef, value, textAreaFocused]);\n\n function handleOnFocus(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(true);\n if (onFocus) {\n onFocus(e);\n }\n }\n\n function handleOnBlur(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(false);\n if (onBlur) {\n onBlur(e);\n }\n }\n\n function handleOnChange(e: ChangeEvent<HTMLTextAreaElement>) {\n setCounterCurrent(e.target.value.length);\n if (onChange) {\n onChange(e);\n }\n }\n\n const counterTotal: number = counter?.maxLength \|\| 0;\n const progressCurrent: number = counterTotal - counterCurrent;\n function calculatePercentage(current: number, total: number): number {\n if (current <= 0) {\n return 0;\n }\n return total === 0 ? 0 : (current * 100) / total;\n }\n const counterLabel =\n counter && counterCurrent > counterTotal\n ? `Du har skrevet ${counterCurrent - counterTotal} tegn for mye`\n : undefined;\n\n const invalid = Boolean(ariaInvalid \|\| counterLabel);\n\n const overflowStyle = {\n overflowX: autoExpand ? \"hidden\" : undefined, // Must set overflowX hidden for Firefox https://stackoverflow.com/a/22700700\n } as React.CSSProperties;\n\n return (\n <div\n className=\"jkl-text-area-wrapper\"\n data-invalid={invalid}\n data-has-content={counterCurrent > 0}\n >\n <textarea\n aria-invalid={invalid}\n className={`jkl-text-area__text-area jkl-text-area__text-area--${rows}-rows`}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onChange={handleOnChange}\n ref={textAreaRef}\n style={{ ...style, ...overflowStyle }}\n placeholder={placeholder}\n value={value}\n {...rest}\n />\n {counter && (\n <div className=\"jkl-text-area__counter\" aria-hidden=\"true\">\n <div className=\"jkl-text-area__counter-count\">\n {counterCurrent} / {counterTotal}\n </div>\n {!counter.hideProgress && (\n <div\n className=\"jkl-text-area__counter-progress\"\n style={{\n [\"--progress-width\" as string]: `${calculatePercentage(\n progressCurrent,\n counterTotal,\n )}%`,\n }}\n />\n )}\n </div>\n )}\n </div>\n );\n },\n);\nBaseTextArea.displayName = \"BaseTextArea\";\n"],"names":["BaseTextArea","forwardRef","props","ref","autoExpand","counter","onBlur","onFocus","rows","placeholder","startOpen","style","value","ariaInvalid","onChange","rest","counterCurrent","setCounterCurrent","useState","String","length","textAreaFocused","setTextAreaFocused","internalRef","useRef","textAreaRef","useEffect","textAreaElement","current","height","scrollHeight","counterTotal","maxLength","progressCurrent","invalid","jsxs","className","children","jsx","e","target","overflowX","hideProgress","total","calculatePercentage","displayName"],"mappings":"8HAWO,MAAMA,EAAeC,GACxB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,EAAO,EACPC,YAAAA,EAAc,IACdC,UAAAA,EACAC,MAAAA,EACAC,MAAAA,EACA,eAAgBC,EAChBC,SAAAA,KACGC,GACHb,GAEGc,EAAgBC,GAAqBC,GAAS,WACtCN,EAAU,IACV,EAGU,iBAAVA,EACAO,OAAOP,GAAOQ,OAGlBR,EAAMQ,UAEVC,EAAiBC,GAAsBJ,GAAS,GACjDK,EAAcC,EAA4B,MAC1CC,EACDtB,GAA0CoB,EAE/CG,GAAU,KACN,MAAMC,EAAkBF,EAAYG,QACpC,GAAID,EAAiB,CACjB,IAAKvB,EAED,YADAuB,EAAgBhB,MAAMkB,OAAS,IAI/BR,GAAmBT,GACnBe,EAAgBhB,MAAMkB,OAAS,OAC/BF,EAAgBhB,MAAMkB,OAAS,GAAGF,EAAgBG,kBAElDH,EAAgBhB,MAAMkB,OAAS,~~EAEvC~~,~~IACD~~,CAACzB,EAAYqB,EAAab,EAAOS,IAuB9B,MAAAU,GAAuB,MAAA1B,OAAA,EAAAA,EAAS2B,YAAa,EAC7CC,EAA0BF,EAAef,EAO/C,MAKMkB,KAAkBrB,KAJpBR,GAAWW,EAAiBe,EACtB,kBAAkBf,EAAiBe,sBACnC,IASN,OAAAI,EAAC,MAAA,CACGC,UAAU,wBACV,eAAcF,EACd,mBAAkBlB,EAAiB,EAEnCqB,SAAA,CAAAC,EAAC,WAAA,CACG,eAAcJ,EACdE,UAAW,sDAAsD5B,SACjEF,OA1CZ,SAAsBiC,GAClBjB,GAAmB,GACfhB,GACAA,EAAOiC,~~EAEf~~,~~EAsCYhC~~,QAlDZ,SAAuBgC,GACnBjB,GAAmB,GACff,GACAA,EAAQgC,~~EAEhB~~,~~EA8CYzB~~,SArCZ,SAAwByB,GACFtB,EAAAsB,EAAEC,OAAO5B,MAAMQ,QAC7BN,GACAA,EAASyB,~~EAEjB~~,~~EAiCYpC~~,IAAKsB,EACLd,MAAO,IAAKA,KAjBF,CAClB8B,UAAWrC,EAAa,cAAW,IAiB3BK,YAAAA,EACAG,MAAAA,KACIG,IAEPV,GACI8B,EAAA,MAAA,CAAIC,UAAU,yBAAyB,cAAY,OAChDC,SAAA,CAACF,EAAA,MAAA,CAAIC,UAAU,+BACVC,SAAA,CAAArB,EAAe,MAAce,MAEhC1B,EAAQqC,cACNJ,EAAC,MAAA,CACGF,UAAU,kCACVzB,MAAO,CACF,oBA5CAiB,EA6CGK,EA7CcU,EA8CdZ,EA7CxBH,GAAW,GAGE,IAAVe,EAFI,EAEyB,IAAVf,EAAiBe,GAwCa,aA5CnDC,IAAoBhB,EAAiBe,~~CAmDlC~~,~~IAMpB3C~~,EAAa6C,YAAc"}
1	+ {"version":3,"file":"BaseTextArea.js","sources":["../../../../src/components/text-area/BaseTextArea.tsx"],"sourcesContent":["import React, {\n type ChangeEvent,\n type FocusEvent,\n forwardRef,\n type RefObject,\n useEffect,\n useRef,\n useState,\n} from \"react\";\nimport type { BaseTextAreaProps } from \"./types.js\";\n\nexport const BaseTextArea = forwardRef<HTMLTextAreaElement, BaseTextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n counter,\n onBlur,\n onFocus,\n rows = 7,\n placeholder = \" \", // This space intentionally left blank. Denne + rows trengs for å få den ekspanderende effekten.\n startOpen,\n style,\n value,\n \"aria-invalid\": ariaInvalid,\n onChange,\n ...rest\n } = props;\n\n const [counterCurrent, setCounterCurrent] = useState(() => {\n if (typeof value === \"undefined\") {\n return 0;\n }\n\n if (typeof value === \"number\") {\n return String(value).length;\n }\n\n return value.length;\n });\n const [textAreaFocused, setTextAreaFocused] = useState(false);\n const internalRef = useRef<HTMLTextAreaElement>(null);\n const textAreaRef =\n (ref as RefObject<HTMLTextAreaElement>) \|\| internalRef;\n\n useEffect(() => {\n const textAreaElement = textAreaRef.current;\n if (textAreaElement) {\n if (!autoExpand) {\n textAreaElement.style.height = \"\";\n return;\n }\n\n if (textAreaFocused \|\| value) {\n textAreaElement.style.height = \"auto\"; // Sett til auto før scrollhøyden leses, sånn at redusering av høyde ved sletting av tekst fungerer\n textAreaElement.style.height = `${textAreaElement.scrollHeight}px`;\n } else {\n textAreaElement.style.height = \"\";\n }\n }\n }, [autoExpand, textAreaRef, value, textAreaFocused]);\n\n function handleOnFocus(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(true);\n if (onFocus) {\n onFocus(e);\n }\n }\n\n function handleOnBlur(e: FocusEvent<HTMLTextAreaElement>) {\n setTextAreaFocused(false);\n if (onBlur) {\n onBlur(e);\n }\n }\n\n function handleOnChange(e: ChangeEvent<HTMLTextAreaElement>) {\n setCounterCurrent(e.target.value.length);\n if (onChange) {\n onChange(e);\n }\n }\n\n const counterTotal: number = counter?.maxLength \|\| 0;\n const progressCurrent: number = counterTotal - counterCurrent;\n function calculatePercentage(current: number, total: number): number {\n if (current <= 0) {\n return 0;\n }\n return total === 0 ? 0 : (current * 100) / total;\n }\n const counterLabel =\n counter && counterCurrent > counterTotal\n ? `Du har skrevet ${counterCurrent - counterTotal} tegn for mye`\n : undefined;\n\n const invalid = Boolean(ariaInvalid \|\| counterLabel);\n\n const overflowStyle = {\n overflowX: autoExpand ? \"hidden\" : undefined, // Must set overflowX hidden for Firefox https://stackoverflow.com/a/22700700\n } as React.CSSProperties;\n\n return (\n <div\n className=\"jkl-text-area-wrapper\"\n data-invalid={invalid}\n data-has-content={counterCurrent > 0}\n >\n <textarea\n aria-invalid={invalid}\n className={`jkl-text-area__text-area jkl-text-area__text-area--${rows}-rows`}\n onBlur={handleOnBlur}\n onFocus={handleOnFocus}\n onChange={handleOnChange}\n ref={textAreaRef}\n style={{ ...style, ...overflowStyle }}\n placeholder={placeholder}\n value={value}\n {...rest}\n />\n {counter && (\n <div className=\"jkl-text-area__counter\" aria-hidden=\"true\">\n <div className=\"jkl-text-area__counter-count\">\n {counterCurrent} / {counterTotal}\n </div>\n {!counter.hideProgress && (\n <div\n className=\"jkl-text-area__counter-progress\"\n style={{\n [\"--progress-width\" as string]: `${calculatePercentage(\n progressCurrent,\n counterTotal,\n )}%`,\n }}\n />\n )}\n </div>\n )}\n </div>\n );\n },\n);\nBaseTextArea.displayName = \"BaseTextArea\";\n"],"names":["BaseTextArea","forwardRef","props","ref","autoExpand","counter","onBlur","onFocus","rows","placeholder","startOpen","style","value","ariaInvalid","onChange","rest","counterCurrent","setCounterCurrent","useState","String","length","textAreaFocused","setTextAreaFocused","internalRef","useRef","textAreaRef","useEffect","textAreaElement","current","height","scrollHeight","counterTotal","maxLength","progressCurrent","invalid","jsxs","className","children","jsx","e","target","overflowX","hideProgress","total","calculatePercentage","displayName"],"mappings":"8HAWO,MAAMA,EAAeC,GACxB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,QAAAA,EACAC,KAAAA,EAAO,EACPC,YAAAA,EAAc,IACdC,UAAAA,EACAC,MAAAA,EACAC,MAAAA,EACA,eAAgBC,EAChBC,SAAAA,KACGC,GACHb,GAEGc,EAAgBC,GAAqBC,GAAS,WACtCN,EAAU,IACV,EAGU,iBAAVA,EACAO,OAAOP,GAAOQ,OAGlBR,EAAMQ,UAEVC,EAAiBC,GAAsBJ,GAAS,GACjDK,EAAcC,EAA4B,MAC1CC,EACDtB,GAA0CoB,EAE/CG,GAAU,KACN,MAAMC,EAAkBF,EAAYG,QACpC,GAAID,EAAiB,CACjB,IAAKvB,EAED,YADAuB,EAAgBhB,MAAMkB,OAAS,IAI/BR,GAAmBT,GACnBe,EAAgBhB,MAAMkB,OAAS,OAC/BF,EAAgBhB,MAAMkB,OAAS,GAAGF,EAAgBG,kBAElDH,EAAgBhB,MAAMkB,OAAS,EACnC,IAEL,CAACzB,EAAYqB,EAAab,EAAOS,IAuB9B,MAAAU,GAAuB,MAAA1B,OAAA,EAAAA,EAAS2B,YAAa,EAC7CC,EAA0BF,EAAef,EAO/C,MAKMkB,KAAkBrB,KAJpBR,GAAWW,EAAiBe,EACtB,kBAAkBf,EAAiBe,sBACnC,IASN,OAAAI,EAAC,MAAA,CACGC,UAAU,wBACV,eAAcF,EACd,mBAAkBlB,EAAiB,EAEnCqB,SAAA,CAAAC,EAAC,WAAA,CACG,eAAcJ,EACdE,UAAW,sDAAsD5B,SACjEF,OA1CZ,SAAsBiC,GAClBjB,GAAmB,GACfhB,GACAA,EAAOiC,EACX,EAuCQhC,QAlDZ,SAAuBgC,GACnBjB,GAAmB,GACff,GACAA,EAAQgC,EACZ,EA+CQzB,SArCZ,SAAwByB,GACFtB,EAAAsB,EAAEC,OAAO5B,MAAMQ,QAC7BN,GACAA,EAASyB,EACb,EAkCQpC,IAAKsB,EACLd,MAAO,IAAKA,KAjBF,CAClB8B,UAAWrC,EAAa,cAAW,IAiB3BK,YAAAA,EACAG,MAAAA,KACIG,IAEPV,GACI8B,EAAA,MAAA,CAAIC,UAAU,yBAAyB,cAAY,OAChDC,SAAA,CAACF,EAAA,MAAA,CAAIC,UAAU,+BACVC,SAAA,CAAArB,EAAe,MAAce,MAEhC1B,EAAQqC,cACNJ,EAAC,MAAA,CACGF,UAAU,kCACVzB,MAAO,CACF,oBA5CAiB,EA6CGK,EA7CcU,EA8CdZ,EA7CxBH,GAAW,GAGE,IAAVe,EAFI,EAEyB,IAAVf,EAAiBe,GAwCa,aA5CnDC,IAAoBhB,EAAiBe,CAqD1C,IAIZ3C,EAAa6C,YAAc"}

package/build/es/components/text-area/TextArea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextArea.js","sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { BaseTextArea } from \"./BaseTextArea.js\";\nimport type { TextAreaProps } from \"./types.js\";\n\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n className,\n counter,\n density,\n errorLabel,\n helpLabel,\n inline,\n label,\n labelProps,\n startOpen,\n supportLabelProps,\n tooltip,\n ...rest\n } = props;\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltip,\n };\n const textAreaProps = { autoExpand, counter, startOpen };\n return (\n <InputGroup\n className={clsx(\"jkl-text-area\", className, {\n \"jkl-text-area--start-open\": startOpen,\n \"jkl-text-area--auto-expand\": autoExpand,\n })}\n data-testid=\"jkl-text-area\"\n {...inputGroupProps}\n >\n <BaseTextArea ref={ref} {...rest} {...textAreaProps} />\n </InputGroup>\n );\n },\n);\nTextArea.displayName = \"TextArea\";\n"],"names":["TextArea","forwardRef","props","ref","autoExpand","className","counter","density","errorLabel","helpLabel","inline","label","labelProps","startOpen","supportLabelProps","tooltip","rest","inputGroupProps","textAreaProps","jsx","InputGroup","clsx","children","BaseTextArea","displayName"],"mappings":"oOAMO,MAAMA,EAAWC,GACpB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,QAAAA,KACGC,GACHd,EACEe,EAAkB,CACpBN,MAAAA,EACAJ,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAG,WAAAA,EACAF,OAAAA,EACAI,kBAAAA,EACAC,QAAAA,GAEEG,EAAgB,CAAEd,WAAAA,EAAYE,QAAAA,EAASO,UAAAA,GAEzC,OAAAM,EAACC,EAAA,CACGf,UAAWgB,EAAK,gBAAiBhB,EAAW,CACxC,4BAA6BQ,EAC7B,6BAA8BT,IAElC,cAAY,mBACRa,EAEJK,WAACC,EAAa,CAAApB,IAAAA,KAAca,KAAUE,~~KAAe~~,~~IAKrElB~~,EAASwB,YAAc"}
1	+ {"version":3,"file":"TextArea.js","sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { BaseTextArea } from \"./BaseTextArea.js\";\nimport type { TextAreaProps } from \"./types.js\";\n\nexport const TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n (props, ref) => {\n const {\n autoExpand,\n className,\n counter,\n density,\n errorLabel,\n helpLabel,\n inline,\n label,\n labelProps,\n startOpen,\n supportLabelProps,\n tooltip,\n ...rest\n } = props;\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltip,\n };\n const textAreaProps = { autoExpand, counter, startOpen };\n return (\n <InputGroup\n className={clsx(\"jkl-text-area\", className, {\n \"jkl-text-area--start-open\": startOpen,\n \"jkl-text-area--auto-expand\": autoExpand,\n })}\n data-testid=\"jkl-text-area\"\n {...inputGroupProps}\n >\n <BaseTextArea ref={ref} {...rest} {...textAreaProps} />\n </InputGroup>\n );\n },\n);\nTextArea.displayName = \"TextArea\";\n"],"names":["TextArea","forwardRef","props","ref","autoExpand","className","counter","density","errorLabel","helpLabel","inline","label","labelProps","startOpen","supportLabelProps","tooltip","rest","inputGroupProps","textAreaProps","jsx","InputGroup","clsx","children","BaseTextArea","displayName"],"mappings":"oOAMO,MAAMA,EAAWC,GACpB,CAACC,EAAOC,KACE,MACFC,WAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,kBAAAA,EACAC,QAAAA,KACGC,GACHd,EACEe,EAAkB,CACpBN,MAAAA,EACAJ,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAG,WAAAA,EACAF,OAAAA,EACAI,kBAAAA,EACAC,QAAAA,GAEEG,EAAgB,CAAEd,WAAAA,EAAYE,QAAAA,EAASO,UAAAA,GAEzC,OAAAM,EAACC,EAAA,CACGf,UAAWgB,EAAK,gBAAiBhB,EAAW,CACxC,4BAA6BQ,EAC7B,6BAA8BT,IAElC,cAAY,mBACRa,EAEJK,WAACC,EAAa,CAAApB,IAAAA,KAAca,KAAUE,KAC1C,IAIZlB,EAASwB,YAAc"}

package/build/es/components/text-input/BaseTextInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseTextInput.js","sources":["../../../../src/components/text-input/BaseTextInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type CSSProperties, forwardRef } from \"react\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport type { BaseTextInputProps } from \"./types.js\";\n\nfunction getWidthAsStyle(\n width?: string,\n maxLength?: number,\n): CSSProperties \| undefined {\n if (width) {\n return { width }; // prioritize width prop\n }\n\n if (maxLength) {\n // adapt to maxLength, but capped at 40ch\n const length = `${Math.min(maxLength, 40)}ch`;\n const padding = \"24px\"; // left + right padding\n return { width: `calc(${length} + ${padding})` };\n }\n\n return undefined;\n}\n\nexport const BaseTextInput = forwardRef<HTMLInputElement, BaseTextInputProps>(\n (props, ref) => {\n const {\n action,\n align = \"left\",\n \"aria-invalid\": ariaInvalid,\n className = \"\",\n density,\n maxLength,\n style,\n type = \"text\",\n unit,\n width,\n actionButton,\n ...rest\n } = props;\n\n return (\n <div\n className=\"jkl-text-input-wrapper\"\n data-invalid={ariaInvalid}\n style={{ ...style, ...getWidthAsStyle(width, maxLength) }}\n >\n <input\n aria-invalid={ariaInvalid}\n ref={ref}\n className={clsx(\"jkl-text-input__input\", className, {\n \"jkl-text-input__input--align-right\": align === \"right\",\n })}\n maxLength={maxLength}\n type={type}\n {...rest}\n />\n {unit && <span className=\"jkl-text-input__unit\">{unit}</span>}\n {!action &&\n actionButton &&\n React.cloneElement(actionButton, {\n className: clsx(\n \"jkl-text-input-action-button\",\n actionButton.props.className,\n ),\n })}\n {action && !actionButton && (\n <IconButton\n density={density}\n className={clsx(\n \"jkl-text-input-action-button\",\n action.className,\n )}\n title={action.label}\n onClick={action.onClick}\n onFocus={action.onFocus}\n onBlur={action.onBlur}\n ref={action.buttonRef}\n type={action.type \|\| \"button\"}\n >\n {action.icon}\n </IconButton>\n )}\n </div>\n );\n },\n);\n\nBaseTextInput.displayName = \"BaseInputField\";\n"],"names":["getWidthAsStyle","width","maxLength","Math","min","BaseTextInput","forwardRef","props","ref","action","align","ariaInvalid","className","density","style","type","unit","actionButton","rest","jsxs","children","jsx","clsx","React","cloneElement","IconButton","title","label","onClick","onFocus","onBlur","buttonRef","icon","displayName"],"mappings":"gMAKA,SAASA,EACLC,EACAC,GAEID,OAAAA,EACO,CAAEA,MAAAA,GAGTC,EAIO,CAAED,MAAO,QAFEE,KAAKC,IAAIF,EAAW,sBAFtCA,CAQR,CAEO,MAAMG,EAAgBC,GACzB,CAACC,EAAOC,KACE,MACFC,OAAAA,EACAC,MAAAA,EAAQ,OACR,eAAgBC,EAChBC,UAAAA,EAAY,GACZC,QAAAA,EACAX,UAAAA,EACAY,MAAAA,EACAC,KAAAA,EAAO,OACPC,KAAAA,EACAf,MAAAA,EACAgB,aAAAA,KACGC,GACHX,EAGA,OAAAY,EAAC,MAAA,CACGP,UAAU,yBACV,eAAcD,EACdG,MAAO,IAAKA,KAAUd,EAAgBC,EAAOC,IAE7CkB,SAAA,CAAAC,EAAC,QAAA,CACG,eAAcV,EACdH,IAAAA,EACAI,UAAWU,EAAK,wBAAyBV,EAAW,CAChD,qCAAgD,UAAVF,IAE1CR,UAAAA,EACAa,KAAAA,KACIG,IAEPF,GAAQK,EAAC,OAAK,CAAAT,UAAU,uBAAwBQ,SAAKJ,KACpDP,GACEQ,GACAM,EAAMC,aAAaP,EAAc,CAC7BL,UAAWU,EACP,+BACAL,EAAaV,MAAMK,aAG9BH,IAAWQ,GACRI,EAACI,EAAA,CACGZ,QAAAA,EACAD,UAAWU,EACP,+BACAb,EAAOG,WAEXc,MAAOjB,EAAOkB,MACdC,QAASnB,EAAOmB,QAChBC,QAASpB,EAAOoB,QAChBC,OAAQrB,EAAOqB,OACftB,IAAKC,EAAOsB,UACZhB,KAAMN,EAAOM,MAAQ,SAEpBK,SAAOX,EAAAuB,~~SACZ~~,~~IAOpB3B~~,EAAc4B,YAAc"}
1	+ {"version":3,"file":"BaseTextInput.js","sources":["../../../../src/components/text-input/BaseTextInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type CSSProperties, forwardRef } from \"react\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport type { BaseTextInputProps } from \"./types.js\";\n\nfunction getWidthAsStyle(\n width?: string,\n maxLength?: number,\n): CSSProperties \| undefined {\n if (width) {\n return { width }; // prioritize width prop\n }\n\n if (maxLength) {\n // adapt to maxLength, but capped at 40ch\n const length = `${Math.min(maxLength, 40)}ch`;\n const padding = \"24px\"; // left + right padding\n return { width: `calc(${length} + ${padding})` };\n }\n\n return undefined;\n}\n\nexport const BaseTextInput = forwardRef<HTMLInputElement, BaseTextInputProps>(\n (props, ref) => {\n const {\n action,\n align = \"left\",\n \"aria-invalid\": ariaInvalid,\n className = \"\",\n density,\n maxLength,\n style,\n type = \"text\",\n unit,\n width,\n actionButton,\n ...rest\n } = props;\n\n return (\n <div\n className=\"jkl-text-input-wrapper\"\n data-invalid={ariaInvalid}\n style={{ ...style, ...getWidthAsStyle(width, maxLength) }}\n >\n <input\n aria-invalid={ariaInvalid}\n ref={ref}\n className={clsx(\"jkl-text-input__input\", className, {\n \"jkl-text-input__input--align-right\": align === \"right\",\n })}\n maxLength={maxLength}\n type={type}\n {...rest}\n />\n {unit && <span className=\"jkl-text-input__unit\">{unit}</span>}\n {!action &&\n actionButton &&\n React.cloneElement(actionButton, {\n className: clsx(\n \"jkl-text-input-action-button\",\n actionButton.props.className,\n ),\n })}\n {action && !actionButton && (\n <IconButton\n density={density}\n className={clsx(\n \"jkl-text-input-action-button\",\n action.className,\n )}\n title={action.label}\n onClick={action.onClick}\n onFocus={action.onFocus}\n onBlur={action.onBlur}\n ref={action.buttonRef}\n type={action.type \|\| \"button\"}\n >\n {action.icon}\n </IconButton>\n )}\n </div>\n );\n },\n);\n\nBaseTextInput.displayName = \"BaseInputField\";\n"],"names":["getWidthAsStyle","width","maxLength","Math","min","BaseTextInput","forwardRef","props","ref","action","align","ariaInvalid","className","density","style","type","unit","actionButton","rest","jsxs","children","jsx","clsx","React","cloneElement","IconButton","title","label","onClick","onFocus","onBlur","buttonRef","icon","displayName"],"mappings":"gMAKA,SAASA,EACLC,EACAC,GAEID,OAAAA,EACO,CAAEA,MAAAA,GAGTC,EAIO,CAAED,MAAO,QAFEE,KAAKC,IAAIF,EAAW,sBAFtCA,CAQR,CAEO,MAAMG,EAAgBC,GACzB,CAACC,EAAOC,KACE,MACFC,OAAAA,EACAC,MAAAA,EAAQ,OACR,eAAgBC,EAChBC,UAAAA,EAAY,GACZC,QAAAA,EACAX,UAAAA,EACAY,MAAAA,EACAC,KAAAA,EAAO,OACPC,KAAAA,EACAf,MAAAA,EACAgB,aAAAA,KACGC,GACHX,EAGA,OAAAY,EAAC,MAAA,CACGP,UAAU,yBACV,eAAcD,EACdG,MAAO,IAAKA,KAAUd,EAAgBC,EAAOC,IAE7CkB,SAAA,CAAAC,EAAC,QAAA,CACG,eAAcV,EACdH,IAAAA,EACAI,UAAWU,EAAK,wBAAyBV,EAAW,CAChD,qCAAgD,UAAVF,IAE1CR,UAAAA,EACAa,KAAAA,KACIG,IAEPF,GAAQK,EAAC,OAAK,CAAAT,UAAU,uBAAwBQ,SAAKJ,KACpDP,GACEQ,GACAM,EAAMC,aAAaP,EAAc,CAC7BL,UAAWU,EACP,+BACAL,EAAaV,MAAMK,aAG9BH,IAAWQ,GACRI,EAACI,EAAA,CACGZ,QAAAA,EACAD,UAAWU,EACP,+BACAb,EAAOG,WAEXc,MAAOjB,EAAOkB,MACdC,QAASnB,EAAOmB,QAChBC,QAASpB,EAAOoB,QAChBC,OAAQrB,EAAOqB,OACftB,IAAKC,EAAOsB,UACZhB,KAAMN,EAAOM,MAAQ,SAEpBK,SAAOX,EAAAuB,SAGpB,IAKZ3B,EAAc4B,YAAc"}

package/build/es/components/text-input/TextInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextInput.js","sources":["../../../../src/components/text-input/TextInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { BaseTextInput } from \"./BaseTextInput.js\";\nimport type { TextInputProps } from \"./types.js\";\n\nexport const TextInput = forwardRef<HTMLInputElement, TextInputProps>(\n (props, ref) => {\n const {\n label,\n className,\n density,\n errorLabel,\n helpLabel,\n inline,\n inputClassName,\n labelProps,\n supportLabelProps,\n tooltip,\n ...rest\n } = props;\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltip,\n };\n return (\n <InputGroup\n {...inputGroupProps}\n className={clsx(className, \"jkl-text-input\", {\n \"jkl-text-input--inline\": inline,\n })}\n data-testid=\"jkl-text-input\"\n density={inline ? \"compact\" : density}\n >\n <BaseTextInput ref={ref} {...rest} className={inputClassName} />\n </InputGroup>\n );\n },\n);\n\nTextInput.displayName = \"TextInput\";\n"],"names":["TextInput","forwardRef","props","ref","label","className","density","errorLabel","helpLabel","inline","inputClassName","labelProps","supportLabelProps","tooltip","rest","jsx","InputGroup","clsx","children","BaseTextInput","displayName"],"mappings":"sOAMO,MAAMA,EAAYC,GACrB,CAACC,EAAOC,KACE,MACFC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,KACGC,GACHZ,EAYA,OAAAa,EAACC,EAAA,CAVDZ,MAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAG,WAAAA,EACAF,OAAAA,EACAG,kBAAAA,EACAC,QAAAA,EAKIR,UAAWY,EAAKZ,EAAW,iBAAkB,CACzC,yBAA0BI,IAE9B,cAAY,iBACZH,QAASG,EAAS,UAAYH,EAE9BY,WAACC,EAAc,CAAAhB,IAAAA,KAAcW,EAAMT,UAAWK,~~KAAgB~~,~~IAM9EV~~,EAAUoB,YAAc"}
1	+ {"version":3,"file":"TextInput.js","sources":["../../../../src/components/text-input/TextInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { BaseTextInput } from \"./BaseTextInput.js\";\nimport type { TextInputProps } from \"./types.js\";\n\nexport const TextInput = forwardRef<HTMLInputElement, TextInputProps>(\n (props, ref) => {\n const {\n label,\n className,\n density,\n errorLabel,\n helpLabel,\n inline,\n inputClassName,\n labelProps,\n supportLabelProps,\n tooltip,\n ...rest\n } = props;\n const inputGroupProps = {\n label,\n density,\n errorLabel,\n helpLabel,\n labelProps,\n inline,\n supportLabelProps,\n tooltip,\n };\n return (\n <InputGroup\n {...inputGroupProps}\n className={clsx(className, \"jkl-text-input\", {\n \"jkl-text-input--inline\": inline,\n })}\n data-testid=\"jkl-text-input\"\n density={inline ? \"compact\" : density}\n >\n <BaseTextInput ref={ref} {...rest} className={inputClassName} />\n </InputGroup>\n );\n },\n);\n\nTextInput.displayName = \"TextInput\";\n"],"names":["TextInput","forwardRef","props","ref","label","className","density","errorLabel","helpLabel","inline","inputClassName","labelProps","supportLabelProps","tooltip","rest","jsx","InputGroup","clsx","children","BaseTextInput","displayName"],"mappings":"sOAMO,MAAMA,EAAYC,GACrB,CAACC,EAAOC,KACE,MACFC,MAAAA,EACAC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,KACGC,GACHZ,EAYA,OAAAa,EAACC,EAAA,CAVDZ,MAAAA,EACAE,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAG,WAAAA,EACAF,OAAAA,EACAG,kBAAAA,EACAC,QAAAA,EAKIR,UAAWY,EAAKZ,EAAW,iBAAkB,CACzC,yBAA0BI,IAE9B,cAAY,iBACZH,QAASG,EAAS,UAAYH,EAE9BY,WAACC,EAAc,CAAAhB,IAAAA,KAAcW,EAAMT,UAAWK,KAClD,IAKZV,EAAUoB,YAAc"}

package/build/es/components/toast/Toast.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.js","sources":["../../../../src/components/toast/Toast.tsx"],"sourcesContent":["import { type AriaToastProps, useToast } from \"@react-aria/toast\";\nimport type { QueuedToast, ToastState } from \"@react-stately/toast\";\nimport clsx from \"clsx\";\nimport React, { useEffect, useRef } from \"react\";\nimport { useBrowserPreferences } from \"../../hooks/useBrowserPreferences/useBrowserPreferences.js\";\nimport { Button } from \"../button/Button.js\";\nimport { Countdown } from \"../countdown/Countdown.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { CloseIcon } from \"../icon/icons/CloseIcon.js\";\nimport { ErrorIcon } from \"../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../icon/icons/WarningIcon.js\";\nimport type { ToastContent, ToastOptions } from \"./types.js\";\n\nexport interface ToastProps<T extends ToastContent> extends AriaToastProps<T> {\n className?: string;\n state: ToastState<T>;\n toast: QueuedToast<T> & ToastOptions;\n}\n\nconst getIcon = (messageType?: \"error\" \| \"info\" \| \"success\" \| \"warning\") => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-toast__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-toast__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-toast__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-toast__icon\" />;\n default:\n return null;\n }\n};\n\nexport function Toast<T extends ToastContent>({\n className,\n state,\n ...props\n}: ToastProps<T>) {\n const ref = useRef(null);\n const { toastProps, titleProps } = useToast(props, state, ref);\n\n const content =\n typeof props.toast.content === \"string\"\n ? props.toast.content\n : props.toast.content.content;\n const title =\n typeof props.toast.content === \"string\"\n ? undefined\n : props.toast.content.title;\n\n // @ts-ignore Proxy for å sjekke om timeren er pauset: https://github.com/adobe/react-spectrum/blob/b1545c0d225b12672fb6a4e7b787268591d66b90/packages/%40react-stately/toast/src/useToastState.ts#L222\n const isPaused = props.toast.timer?.timerId == null;\n\n const { prefersReducedMotion } = useBrowserPreferences();\n\n useEffect(() => {\n if (prefersReducedMotion && props.toast.animation === \"exiting\") {\n // If user has prefers-reduced-motion the exit animation won't run and our\n // onAnimationEnd callback won't be invoked. In this case, remove the toast\n // manually.\n state.remove(props.toast.key);\n }\n }, [prefersReducedMotion, props.toast.animation, props.toast.key, state]);\n\n return (\n <div\n {...toastProps}\n ref={ref}\n className={clsx(\n \"jkl-toast\",\n {\n \"jkl-toast--info\": props.toast.variant === \"info\",\n \"jkl-toast--error\": props.toast.variant === \"error\",\n \"jkl-toast--warning\": props.toast.variant === \"warning\",\n \"jkl-toast--success\": props.toast.variant === \"success\",\n },\n className,\n )}\n data-animation={props.toast.animation}\n onAnimationEnd={() => {\n // Remove the toast when the exiting animation completes.\n if (props.toast.animation === \"exiting\") {\n state.remove(props.toast.key);\n }\n }}\n >\n <span className=\"jkl-toast__progress\">\n {props.toast.timeout ? (\n <Countdown\n from={props.toast.timeout}\n isPaused={isPaused}\n onAnimationEnd={(e) => {\n // Avoid triggering the toast's onAnimationEnd handler so we still get our exit animation\n e.stopPropagation();\n }}\n />\n ) : null}\n </span>\n {getIcon(props.toast.variant)}\n <div {...titleProps} className=\"jkl-toast__content\">\n {title && <p className=\"jkl-toast__title\">{title}</p>}\n <p className=\"jkl-toast__message\">{content}</p>\n {props.toast.action && (\n <div className=\"jkl-toast__action\">\n <Button\n variant=\"secondary\"\n density=\"compact\"\n onClick={props.toast.action.onClick}\n >\n {props.toast.action.label}\n </Button>\n </div>\n )}\n </div>\n <IconButton\n data-theme={!props.toast.variant ? undefined : \"light\"}\n aria-label=\"Lukk varsel\"\n className=\"jkl-toast__dismiss-button\"\n onClick={() => {\n state.close(props.toast.key);\n }}\n >\n <CloseIcon />\n </IconButton>\n </div>\n );\n}\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","Toast","state","props","ref","useRef","toastProps","titleProps","useToast","content","toast","title","isPaused","_a","timer","timerId","prefersReducedMotion","useBrowserPreferences","useEffect","animation","remove","key","jsxs","clsx","variant","onAnimationEnd","children","timeout","Countdown","from","e","stopPropagation","action","Button","density","onClick","label","IconButton","close","CloseIcon"],"mappings":"otBAqBA,MAAMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACM,OAAAC,EAACC,EAAU,CAAAC,UAAU,oBAChC,IAAK,OACM,OAAAF,EAACG,EAAS,CAAAD,UAAU,oBAC/B,IAAK,UACM,OAAAF,EAACI,EAAY,CAAAF,UAAU,oBAClC,IAAK,UACM,OAAAF,EAACK,EAAY,CAAAH,UAAU,oBAClC,QACW,OAAA,~~KACf~~,~~EAGG~~,SAASI,GACZJ,UAAAA,EACAK,MAAAA,KACGC,UAEGC,MAAAA,EAAMC,EAAO,OACXC,WAAAA,EAAYC,WAAAA,GAAeC,EAASL,EAAOD,EAAOE,GAEpDK,EAC6B,iBAAxBN,EAAMO,MAAMD,QACbN,EAAMO,MAAMD,QACZN,EAAMO,MAAMD,QAAQA,QACxBE,EAC6B,iBAAxBR,EAAMO,MAAMD,aACb,EACAN,EAAMO,MAAMD,QAAQE,MAGxBC,EAAyC,OAA9B,OAAAC,EAAAV,EAAMO,MAAMI,YAAZ,EAAAD,EAAmBE,UAE5BC,qBAAAA,GAAyBC,IAEjC,OAAAC,GAAU,KACFF,GAAkD,YAA1Bb,EAAMO,MAAMS,WAI9BjB,EAAAkB,OAAOjB,EAAMO,MAAMW,IAAG,GAEjC,CAACL,EAAsBb,EAAMO,MAAMS,UAAWhB,EAAMO,MAAMW,IAAKnB,IAG9DoB,EAAC,MAAA,IACOhB,EACJF,IAAAA,EACAP,UAAW0B,EACP,YACA,CACI,kBAA2C,SAAxBpB,EAAMO,MAAMc,QAC/B,mBAA4C,UAAxBrB,EAAMO,MAAMc,QAChC,qBAA8C,YAAxBrB,EAAMO,MAAMc,QAClC,qBAA8C,YAAxBrB,EAAMO,MAAMc,SAEtC3B,GAEJ,iBAAgBM,EAAMO,MAAMS,UAC5BM,eAAgB,KAEkB,YAA1BtB,EAAMO,MAAMS,WACNjB,EAAAkB,OAAOjB,EAAMO,MAAMW,IAAG,EAIpCK,SAAA,CAAA/B,EAAC,OAAK,CAAAE,UAAU,sBACX6B,SAAAvB,EAAMO,MAAMiB,QACThC,EAACiC,EAAA,CACGC,KAAM1B,EAAMO,MAAMiB,QAClBf,SAAAA,EACAa,eAAiBK,IAEbA,EAAEC,iBAAgB,IAG1B,OAEPtC,EAAQU,EAAMO,MAAMc,SACpBF,EAAA,MAAA,IAAQf,EAAYV,UAAU,qBAC1B6B,SAAA,CAAAf,GAAUhB,EAAA,IAAA,CAAEE,UAAU,mBAAoB6B,SAAMf,IAChDhB,EAAA,IAAA,CAAEE,UAAU,qBAAsB6B,SAAQjB,IAC1CN,EAAMO,MAAMsB,QACRrC,EAAA,MAAA,CAAIE,UAAU,oBACX6B,SAAA/B,EAACsC,EAAA,CACGT,QAAQ,YACRU,QAAQ,UACRC,QAAShC,EAAMO,MAAMsB,OAAOG,QAE3BT,SAAAvB,EAAMO,MAAMsB,OAAOI,aAKpCzC,EAAC0C,EAAA,CACG,aAAalC,EAAMO,MAAMc,QAAsB,aAAZ,EACnC,aAAW,cACX3B,UAAU,4BACVsC,QAAS,KACCjC,EAAAoC,MAAMnC,EAAMO,MAAMW,IAAG,EAG/BK,WAACa,EAAU,~~QAI3B~~"}
1	+ {"version":3,"file":"Toast.js","sources":["../../../../src/components/toast/Toast.tsx"],"sourcesContent":["import { type AriaToastProps, useToast } from \"@react-aria/toast\";\nimport type { QueuedToast, ToastState } from \"@react-stately/toast\";\nimport clsx from \"clsx\";\nimport React, { useEffect, useRef } from \"react\";\nimport { useBrowserPreferences } from \"../../hooks/useBrowserPreferences/useBrowserPreferences.js\";\nimport { Button } from \"../button/Button.js\";\nimport { Countdown } from \"../countdown/Countdown.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { CloseIcon } from \"../icon/icons/CloseIcon.js\";\nimport { ErrorIcon } from \"../icon/icons/ErrorIcon.js\";\nimport { InfoIcon } from \"../icon/icons/InfoIcon.js\";\nimport { SuccessIcon } from \"../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../icon/icons/WarningIcon.js\";\nimport type { ToastContent, ToastOptions } from \"./types.js\";\n\nexport interface ToastProps<T extends ToastContent> extends AriaToastProps<T> {\n className?: string;\n state: ToastState<T>;\n toast: QueuedToast<T> & ToastOptions;\n}\n\nconst getIcon = (messageType?: \"error\" \| \"info\" \| \"success\" \| \"warning\") => {\n switch (messageType) {\n case \"error\":\n return <ErrorIcon className=\"jkl-toast__icon\" />;\n case \"info\":\n return <InfoIcon className=\"jkl-toast__icon\" />;\n case \"success\":\n return <SuccessIcon className=\"jkl-toast__icon\" />;\n case \"warning\":\n return <WarningIcon className=\"jkl-toast__icon\" />;\n default:\n return null;\n }\n};\n\nexport function Toast<T extends ToastContent>({\n className,\n state,\n ...props\n}: ToastProps<T>) {\n const ref = useRef(null);\n const { toastProps, titleProps } = useToast(props, state, ref);\n\n const content =\n typeof props.toast.content === \"string\"\n ? props.toast.content\n : props.toast.content.content;\n const title =\n typeof props.toast.content === \"string\"\n ? undefined\n : props.toast.content.title;\n\n // @ts-ignore Proxy for å sjekke om timeren er pauset: https://github.com/adobe/react-spectrum/blob/b1545c0d225b12672fb6a4e7b787268591d66b90/packages/%40react-stately/toast/src/useToastState.ts#L222\n const isPaused = props.toast.timer?.timerId == null;\n\n const { prefersReducedMotion } = useBrowserPreferences();\n\n useEffect(() => {\n if (prefersReducedMotion && props.toast.animation === \"exiting\") {\n // If user has prefers-reduced-motion the exit animation won't run and our\n // onAnimationEnd callback won't be invoked. In this case, remove the toast\n // manually.\n state.remove(props.toast.key);\n }\n }, [prefersReducedMotion, props.toast.animation, props.toast.key, state]);\n\n return (\n <div\n {...toastProps}\n ref={ref}\n className={clsx(\n \"jkl-toast\",\n {\n \"jkl-toast--info\": props.toast.variant === \"info\",\n \"jkl-toast--error\": props.toast.variant === \"error\",\n \"jkl-toast--warning\": props.toast.variant === \"warning\",\n \"jkl-toast--success\": props.toast.variant === \"success\",\n },\n className,\n )}\n data-animation={props.toast.animation}\n onAnimationEnd={() => {\n // Remove the toast when the exiting animation completes.\n if (props.toast.animation === \"exiting\") {\n state.remove(props.toast.key);\n }\n }}\n >\n <span className=\"jkl-toast__progress\">\n {props.toast.timeout ? (\n <Countdown\n from={props.toast.timeout}\n isPaused={isPaused}\n onAnimationEnd={(e) => {\n // Avoid triggering the toast's onAnimationEnd handler so we still get our exit animation\n e.stopPropagation();\n }}\n />\n ) : null}\n </span>\n {getIcon(props.toast.variant)}\n <div {...titleProps} className=\"jkl-toast__content\">\n {title && <p className=\"jkl-toast__title\">{title}</p>}\n <p className=\"jkl-toast__message\">{content}</p>\n {props.toast.action && (\n <div className=\"jkl-toast__action\">\n <Button\n variant=\"secondary\"\n density=\"compact\"\n onClick={props.toast.action.onClick}\n >\n {props.toast.action.label}\n </Button>\n </div>\n )}\n </div>\n <IconButton\n data-theme={!props.toast.variant ? undefined : \"light\"}\n aria-label=\"Lukk varsel\"\n className=\"jkl-toast__dismiss-button\"\n onClick={() => {\n state.close(props.toast.key);\n }}\n >\n <CloseIcon />\n </IconButton>\n </div>\n );\n}\n"],"names":["getIcon","messageType","jsx","ErrorIcon","className","InfoIcon","SuccessIcon","WarningIcon","Toast","state","props","ref","useRef","toastProps","titleProps","useToast","content","toast","title","isPaused","_a","timer","timerId","prefersReducedMotion","useBrowserPreferences","useEffect","animation","remove","key","jsxs","clsx","variant","onAnimationEnd","children","timeout","Countdown","from","e","stopPropagation","action","Button","density","onClick","label","IconButton","close","CloseIcon"],"mappings":"otBAqBA,MAAMA,EAAWC,IACb,OAAQA,GACJ,IAAK,QACM,OAAAC,EAACC,EAAU,CAAAC,UAAU,oBAChC,IAAK,OACM,OAAAF,EAACG,EAAS,CAAAD,UAAU,oBAC/B,IAAK,UACM,OAAAF,EAACI,EAAY,CAAAF,UAAU,oBAClC,IAAK,UACM,OAAAF,EAACK,EAAY,CAAAH,UAAU,oBAClC,QACW,OAAA,KAAA,EAIZ,SAASI,GACZJ,UAAAA,EACAK,MAAAA,KACGC,UAEGC,MAAAA,EAAMC,EAAO,OACXC,WAAAA,EAAYC,WAAAA,GAAeC,EAASL,EAAOD,EAAOE,GAEpDK,EAC6B,iBAAxBN,EAAMO,MAAMD,QACbN,EAAMO,MAAMD,QACZN,EAAMO,MAAMD,QAAQA,QACxBE,EAC6B,iBAAxBR,EAAMO,MAAMD,aACb,EACAN,EAAMO,MAAMD,QAAQE,MAGxBC,EAAyC,OAA9B,OAAAC,EAAAV,EAAMO,MAAMI,YAAZ,EAAAD,EAAmBE,UAE5BC,qBAAAA,GAAyBC,IAEjC,OAAAC,GAAU,KACFF,GAAkD,YAA1Bb,EAAMO,MAAMS,WAI9BjB,EAAAkB,OAAOjB,EAAMO,MAAMW,IAAG,GAEjC,CAACL,EAAsBb,EAAMO,MAAMS,UAAWhB,EAAMO,MAAMW,IAAKnB,IAG9DoB,EAAC,MAAA,IACOhB,EACJF,IAAAA,EACAP,UAAW0B,EACP,YACA,CACI,kBAA2C,SAAxBpB,EAAMO,MAAMc,QAC/B,mBAA4C,UAAxBrB,EAAMO,MAAMc,QAChC,qBAA8C,YAAxBrB,EAAMO,MAAMc,QAClC,qBAA8C,YAAxBrB,EAAMO,MAAMc,SAEtC3B,GAEJ,iBAAgBM,EAAMO,MAAMS,UAC5BM,eAAgB,KAEkB,YAA1BtB,EAAMO,MAAMS,WACNjB,EAAAkB,OAAOjB,EAAMO,MAAMW,IAAG,EAIpCK,SAAA,CAAA/B,EAAC,OAAK,CAAAE,UAAU,sBACX6B,SAAAvB,EAAMO,MAAMiB,QACThC,EAACiC,EAAA,CACGC,KAAM1B,EAAMO,MAAMiB,QAClBf,SAAAA,EACAa,eAAiBK,IAEbA,EAAEC,iBAAgB,IAG1B,OAEPtC,EAAQU,EAAMO,MAAMc,SACpBF,EAAA,MAAA,IAAQf,EAAYV,UAAU,qBAC1B6B,SAAA,CAAAf,GAAUhB,EAAA,IAAA,CAAEE,UAAU,mBAAoB6B,SAAMf,IAChDhB,EAAA,IAAA,CAAEE,UAAU,qBAAsB6B,SAAQjB,IAC1CN,EAAMO,MAAMsB,QACRrC,EAAA,MAAA,CAAIE,UAAU,oBACX6B,SAAA/B,EAACsC,EAAA,CACGT,QAAQ,YACRU,QAAQ,UACRC,QAAShC,EAAMO,MAAMsB,OAAOG,QAE3BT,SAAAvB,EAAMO,MAAMsB,OAAOI,aAKpCzC,EAAC0C,EAAA,CACG,aAAalC,EAAMO,MAAMc,QAAsB,aAAZ,EACnC,aAAW,cACX3B,UAAU,4BACVsC,QAAS,KACCjC,EAAAoC,MAAMnC,EAAMO,MAAMW,IAAG,EAG/BK,WAACa,EAAU,CAAA,OAI3B"}

package/build/es/components/toast/stories/ToastInCotext.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToastInCotext.stories.js","sources":["../../../../../src/components/toast/stories/ToastInCotext.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React, { useState } from \"react\";\nimport { Button } from \"../../button/index.js\";\nimport { Toast as ToastComponent, type ToastProps } from \"../Toast.js\";\nimport { ToastProvider, useToast } from \"../toastContext.js\";\n\nimport \"../styles/_index.scss\";\nimport \"../../button/styles/_index.scss\";\n\nconst meta = {\n title: \"Komponenter/Toast\",\n component: ToastComponent,\n tags: [\"autodocs\"],\n argTypes: {\n state: { table: { disable: true } },\n toast: {\n name: \"eksempel\",\n description:\n \"Obs: Dette er en forenklet versjon av 'toast'-propen for å vise variantene.\",\n options: [\n \"Med timeout\",\n \"Med handling\",\n \"Info\",\n \"Error\",\n \"Success\",\n \"Warning\",\n \"Uten variant\",\n ],\n mapping: {\n \"Med timeout\": {\n content: \"Søknad sendt\",\n key: \"\",\n variant: \"success\",\n timeout: 5000,\n },\n \"Med handling\": {\n content: \"Utkastet er slettet\",\n key: \"\",\n variant: \"success\",\n action: {\n label: \"Angre\",\n onClick: () => {},\n },\n },\n Info: {\n content: {\n title: \"En infomelding\",\n content: \"Lenger tekst om infomeldinga\",\n },\n key: \"\",\n variant: \"info\",\n timeout: 0,\n },\n Error: {\n content: {\n title: \"Kunne ikke sende søknaden\",\n content:\n \"Sjekk internettforbindelsen din og prøv igjen senere.\",\n },\n key: \"\",\n variant: \"error\",\n timeout: 0,\n },\n Success: {\n content: \"Søknad sendt\",\n key: \"\",\n variant: \"success\",\n timeout: 0,\n },\n Warning: {\n content: \"Du blir snart logget ut\",\n key: \"\",\n variant: \"warning\",\n timeout: 0,\n },\n \"Uten variant\": {\n content: \"Hei verden\",\n key: \"\",\n timeout: 0,\n },\n },\n },\n },\n args: {\n state: {\n add: () => \"\",\n close: () => \"\",\n pauseAll: () => \"\",\n remove: () => \"\",\n resumeAll: () => \"\",\n visibleToasts: [\n { content: \"Hei verden\", key: Date.now().toString() },\n ],\n },\n toast: {\n content: {\n title: \"Her kommer en tittel\",\n content: \"Her kommer en lenger tekst.\",\n },\n key: \"\",\n },\n },\n} satisfies Meta<typeof ToastComponent>;\n\nexport default meta;\ntype ToastStory = StoryObj<typeof meta>;\n\nexport const ToastInContext: ToastStory = {\n render: (args) => {\n const example: ToastProps<any> = { ...args };\n\n function ToastUsageExample() {\n const { add } = useToast();\n const [keys, setKeys] = useState<string[]>([]);\n\n return (\n <Button\n variant=\"primary\"\n onClick={() => {\n setKeys([\n ...keys,\n add(example.toast.content, example.toast),\n ]);\n }}\n >\n Vis toast\n </Button>\n );\n }\n\n return (\n <ToastProvider>\n <ToastUsageExample />\n </ToastProvider>\n );\n },\n};\n"],"names":["meta","title","component","ToastComponent","tags","argTypes","state","table","disable","toast","name","description","options","mapping","content","key","variant","timeout","action","label","onClick","Info","Error","Success","Warning","args","add","close","pauseAll","remove","resumeAll","visibleToasts","Date","now","toString","ToastInContext","render","example","ToastUsageExample","useToast","keys","setKeys","useState","jsx","Button","children","ToastProvider"],"mappings":"4SASA,MAAMA,EAAO,CACTC,MAAO,oBACPC,UAAWC,EACXC,KAAM,CAAC,YACPC,SAAU,CACNC,MAAO,CAAEC,MAAO,CAAEC,SAAS,IAC3BC,MAAO,CACHC,KAAM,WACNC,YACI,8EACJC,QAAS,CACL,cACA,eACA,OACA,QACA,UACA,UACA,gBAEJC,QAAS,CACL,cAAe,CACXC,QAAS,eACTC,IAAK,GACLC,QAAS,UACTC,QAAS,KAEb,eAAgB,CACZH,QAAS,sBACTC,IAAK,GACLC,QAAS,UACTE,OAAQ,CACJC,MAAO,QACPC,QAAS,SAGjBC,KAAM,CACFP,QAAS,CACLb,MAAO,iBACPa,QAAS,gCAEbC,IAAK,GACLC,QAAS,OACTC,QAAS,GAEbK,MAAO,CACHR,QAAS,CACLb,MAAO,4BACPa,QACI,yDAERC,IAAK,GACLC,QAAS,QACTC,QAAS,GAEbM,QAAS,CACLT,QAAS,eACTC,IAAK,GACLC,QAAS,UACTC,QAAS,GAEbO,QAAS,CACLV,QAAS,0BACTC,IAAK,GACLC,QAAS,UACTC,QAAS,GAEb,eAAgB,CACZH,QAAS,aACTC,IAAK,GACLE,QAAS,MAKzBQ,KAAM,CACFnB,MAAO,CACHoB,IAAK,IAAM,GACXC,MAAO,IAAM,GACbC,SAAU,IAAM,GAChBC,OAAQ,IAAM,GACdC,UAAW,IAAM,GACjBC,cAAe,CACX,CAAEjB,QAAS,aAAcC,IAAKiB,KAAKC,MAAMC,cAGjDzB,MAAO,CACHK,QAAS,CACLb,MAAO,uBACPa,QAAS,+BAEbC,IAAK,MAQJoB,EAA6B,CACtCC,OAASX,IACCY,MAAAA,EAA2B,IAAKZ,GAEtC,SAASa,IACC,MAAEZ,IAAAA,GAAQa,KACTC,EAAMC,GAAWC,EAAmB,IAGvC,OAAAC,EAACC,EAAA,CACG5B,QAAQ,UACRI,QAAS,KACGqB,EAAA,IACDD,EACHd,EAAIW,EAAQ5B,MAAMK,QAASuB,EAAQ5B,QACtC,EAERoC,SAAA,~~aAIT~~,~~CAGK~~,OAAAF,EAAAG,EAAA,CACGD,SAACF,EAAAL,EAAA,~~CAAA~~,~~IACL~~"}
1	+ {"version":3,"file":"ToastInCotext.stories.js","sources":["../../../../../src/components/toast/stories/ToastInCotext.stories.tsx"],"sourcesContent":["import type { Meta, StoryObj } from \"@storybook/react\";\nimport React, { useState } from \"react\";\nimport { Button } from \"../../button/index.js\";\nimport { Toast as ToastComponent, type ToastProps } from \"../Toast.js\";\nimport { ToastProvider, useToast } from \"../toastContext.js\";\n\nimport \"../styles/_index.scss\";\nimport \"../../button/styles/_index.scss\";\n\nconst meta = {\n title: \"Komponenter/Toast\",\n component: ToastComponent,\n tags: [\"autodocs\"],\n argTypes: {\n state: { table: { disable: true } },\n toast: {\n name: \"eksempel\",\n description:\n \"Obs: Dette er en forenklet versjon av 'toast'-propen for å vise variantene.\",\n options: [\n \"Med timeout\",\n \"Med handling\",\n \"Info\",\n \"Error\",\n \"Success\",\n \"Warning\",\n \"Uten variant\",\n ],\n mapping: {\n \"Med timeout\": {\n content: \"Søknad sendt\",\n key: \"\",\n variant: \"success\",\n timeout: 5000,\n },\n \"Med handling\": {\n content: \"Utkastet er slettet\",\n key: \"\",\n variant: \"success\",\n action: {\n label: \"Angre\",\n onClick: () => {},\n },\n },\n Info: {\n content: {\n title: \"En infomelding\",\n content: \"Lenger tekst om infomeldinga\",\n },\n key: \"\",\n variant: \"info\",\n timeout: 0,\n },\n Error: {\n content: {\n title: \"Kunne ikke sende søknaden\",\n content:\n \"Sjekk internettforbindelsen din og prøv igjen senere.\",\n },\n key: \"\",\n variant: \"error\",\n timeout: 0,\n },\n Success: {\n content: \"Søknad sendt\",\n key: \"\",\n variant: \"success\",\n timeout: 0,\n },\n Warning: {\n content: \"Du blir snart logget ut\",\n key: \"\",\n variant: \"warning\",\n timeout: 0,\n },\n \"Uten variant\": {\n content: \"Hei verden\",\n key: \"\",\n timeout: 0,\n },\n },\n },\n },\n args: {\n state: {\n add: () => \"\",\n close: () => \"\",\n pauseAll: () => \"\",\n remove: () => \"\",\n resumeAll: () => \"\",\n visibleToasts: [\n { content: \"Hei verden\", key: Date.now().toString() },\n ],\n },\n toast: {\n content: {\n title: \"Her kommer en tittel\",\n content: \"Her kommer en lenger tekst.\",\n },\n key: \"\",\n },\n },\n} satisfies Meta<typeof ToastComponent>;\n\nexport default meta;\ntype ToastStory = StoryObj<typeof meta>;\n\nexport const ToastInContext: ToastStory = {\n render: (args) => {\n const example: ToastProps<any> = { ...args };\n\n function ToastUsageExample() {\n const { add } = useToast();\n const [keys, setKeys] = useState<string[]>([]);\n\n return (\n <Button\n variant=\"primary\"\n onClick={() => {\n setKeys([\n ...keys,\n add(example.toast.content, example.toast),\n ]);\n }}\n >\n Vis toast\n </Button>\n );\n }\n\n return (\n <ToastProvider>\n <ToastUsageExample />\n </ToastProvider>\n );\n },\n};\n"],"names":["meta","title","component","ToastComponent","tags","argTypes","state","table","disable","toast","name","description","options","mapping","content","key","variant","timeout","action","label","onClick","Info","Error","Success","Warning","args","add","close","pauseAll","remove","resumeAll","visibleToasts","Date","now","toString","ToastInContext","render","example","ToastUsageExample","useToast","keys","setKeys","useState","jsx","Button","children","ToastProvider"],"mappings":"4SASA,MAAMA,EAAO,CACTC,MAAO,oBACPC,UAAWC,EACXC,KAAM,CAAC,YACPC,SAAU,CACNC,MAAO,CAAEC,MAAO,CAAEC,SAAS,IAC3BC,MAAO,CACHC,KAAM,WACNC,YACI,8EACJC,QAAS,CACL,cACA,eACA,OACA,QACA,UACA,UACA,gBAEJC,QAAS,CACL,cAAe,CACXC,QAAS,eACTC,IAAK,GACLC,QAAS,UACTC,QAAS,KAEb,eAAgB,CACZH,QAAS,sBACTC,IAAK,GACLC,QAAS,UACTE,OAAQ,CACJC,MAAO,QACPC,QAAS,SAGjBC,KAAM,CACFP,QAAS,CACLb,MAAO,iBACPa,QAAS,gCAEbC,IAAK,GACLC,QAAS,OACTC,QAAS,GAEbK,MAAO,CACHR,QAAS,CACLb,MAAO,4BACPa,QACI,yDAERC,IAAK,GACLC,QAAS,QACTC,QAAS,GAEbM,QAAS,CACLT,QAAS,eACTC,IAAK,GACLC,QAAS,UACTC,QAAS,GAEbO,QAAS,CACLV,QAAS,0BACTC,IAAK,GACLC,QAAS,UACTC,QAAS,GAEb,eAAgB,CACZH,QAAS,aACTC,IAAK,GACLE,QAAS,MAKzBQ,KAAM,CACFnB,MAAO,CACHoB,IAAK,IAAM,GACXC,MAAO,IAAM,GACbC,SAAU,IAAM,GAChBC,OAAQ,IAAM,GACdC,UAAW,IAAM,GACjBC,cAAe,CACX,CAAEjB,QAAS,aAAcC,IAAKiB,KAAKC,MAAMC,cAGjDzB,MAAO,CACHK,QAAS,CACLb,MAAO,uBACPa,QAAS,+BAEbC,IAAK,MAQJoB,EAA6B,CACtCC,OAASX,IACCY,MAAAA,EAA2B,IAAKZ,GAEtC,SAASa,IACC,MAAEZ,IAAAA,GAAQa,KACTC,EAAMC,GAAWC,EAAmB,IAGvC,OAAAC,EAACC,EAAA,CACG5B,QAAQ,UACRI,QAAS,KACGqB,EAAA,IACDD,EACHd,EAAIW,EAAQ5B,MAAMK,QAASuB,EAAQ5B,QACtC,EAERoC,SAAA,aAED,CAKH,OAAAF,EAAAG,EAAA,CACGD,SAACF,EAAAL,EAAA,CAAkB,IACvB"}

package/build/es/components/toast/toastContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"toastContext.js","sources":["../../../../src/components/toast/toastContext.tsx"],"sourcesContent":["import { ToastQueue } from \"@react-stately/toast\";\nimport React, { createContext, useContext, useState, type FC } from \"react\";\nimport { ToastRegion } from \"./ToastRegion.js\";\nimport type {\n ToastContent,\n ToastContext,\n ToastContextProviderProps,\n ToastOptions,\n} from \"./types.js\";\n\nconst context = createContext<ToastContext>({\n add: () => {\n return \"missing-provider\";\n },\n close: () => {},\n});\n\nexport const useToast = (): ToastContext => useContext(context);\n\nexport const ToastProvider: FC<ToastContextProviderProps> = ({\n children,\n maxVisibleToasts = 5,\n placement = \"center\",\n}) => {\n const [queue] = useState(\n new ToastQueue<ToastContent>({\n maxVisibleToasts,\n hasExitAnimation: true,\n }),\n );\n\n return (\n <context.Provider\n value={{\n close: queue.close.bind(queue),\n add: (toast: ToastContent, options?: ToastOptions) => {\n let timeout: number \| undefined = 5000;\n\n if (typeof options?.timeout === \"number\") {\n timeout = options.timeout as number;\n } else if (\n options?.timeout === null \|\|\n options?.timeout === \"off\"\n ) {\n timeout = undefined;\n }\n\n return queue.add(toast, {\n ...options,\n timeout,\n });\n },\n }}\n >\n {children}\n <ToastRegion queue={queue} placement={placement} />\n </context.Provider>\n );\n};\n"],"names":["context","createContext","add","close","useToast","useContext","ToastProvider","children","maxVisibleToasts","placement","queue","useState","ToastQueue","hasExitAnimation","jsxs","Provider","value","bind","toast","options","timeout","jsx","ToastRegion"],"mappings":"uNAUA,MAAMA,EAAUC,EAA4B,CACxCC,IAAK,IACM,mBAEXC,MAAO,SAGEC,EAAW,IAAoBC,EAAWL,GAE1CM,EAA+C,EACxDC,SAAAA,EACAC,iBAAAA,EAAmB,EACnBC,UAAAA,EAAY,aAEN,MAACC,GAASC,EACZ,IAAIC,EAAyB,CACzBJ,iBAAAA,EACAK,kBAAkB,KAKtB,OAAAC,EAACd,EAAQe,SAAR,CACGC,MAAO,CACHb,MAAOO,EAAMP,MAAMc,KAAKP,GACxBR,IAAK,CAACgB,EAAqBC,KACvB,IAAIC,EAA8B,IAE9B,MAA4B,iBAArB,MAAAD,OAAAA,EAAAA,EAASC,SAChBA,EAAUD,EAAQC,SAEG,QAArB,MAAAD,OAAA,EAAAA,EAASC,UACY,SAArB,MAAAD,OAAA,EAAAA,EAASC,YAECA,OAAA,GAGPV,EAAMR,IAAIgB,EAAO,IACjBC,EACHC,QAAAA,GACH,GAIRb,SAAA,CAAAA,EACDc,EAACC,EAAY,CAAAZ,MAAAA,EAAcD,UAAAA,~~MAAsB~~"}
1	+ {"version":3,"file":"toastContext.js","sources":["../../../../src/components/toast/toastContext.tsx"],"sourcesContent":["import { ToastQueue } from \"@react-stately/toast\";\nimport React, { createContext, useContext, useState, type FC } from \"react\";\nimport { ToastRegion } from \"./ToastRegion.js\";\nimport type {\n ToastContent,\n ToastContext,\n ToastContextProviderProps,\n ToastOptions,\n} from \"./types.js\";\n\nconst context = createContext<ToastContext>({\n add: () => {\n return \"missing-provider\";\n },\n close: () => {},\n});\n\nexport const useToast = (): ToastContext => useContext(context);\n\nexport const ToastProvider: FC<ToastContextProviderProps> = ({\n children,\n maxVisibleToasts = 5,\n placement = \"center\",\n}) => {\n const [queue] = useState(\n new ToastQueue<ToastContent>({\n maxVisibleToasts,\n hasExitAnimation: true,\n }),\n );\n\n return (\n <context.Provider\n value={{\n close: queue.close.bind(queue),\n add: (toast: ToastContent, options?: ToastOptions) => {\n let timeout: number \| undefined = 5000;\n\n if (typeof options?.timeout === \"number\") {\n timeout = options.timeout as number;\n } else if (\n options?.timeout === null \|\|\n options?.timeout === \"off\"\n ) {\n timeout = undefined;\n }\n\n return queue.add(toast, {\n ...options,\n timeout,\n });\n },\n }}\n >\n {children}\n <ToastRegion queue={queue} placement={placement} />\n </context.Provider>\n );\n};\n"],"names":["context","createContext","add","close","useToast","useContext","ToastProvider","children","maxVisibleToasts","placement","queue","useState","ToastQueue","hasExitAnimation","jsxs","Provider","value","bind","toast","options","timeout","jsx","ToastRegion"],"mappings":"uNAUA,MAAMA,EAAUC,EAA4B,CACxCC,IAAK,IACM,mBAEXC,MAAO,SAGEC,EAAW,IAAoBC,EAAWL,GAE1CM,EAA+C,EACxDC,SAAAA,EACAC,iBAAAA,EAAmB,EACnBC,UAAAA,EAAY,aAEN,MAACC,GAASC,EACZ,IAAIC,EAAyB,CACzBJ,iBAAAA,EACAK,kBAAkB,KAKtB,OAAAC,EAACd,EAAQe,SAAR,CACGC,MAAO,CACHb,MAAOO,EAAMP,MAAMc,KAAKP,GACxBR,IAAK,CAACgB,EAAqBC,KACvB,IAAIC,EAA8B,IAE9B,MAA4B,iBAArB,MAAAD,OAAAA,EAAAA,EAASC,SAChBA,EAAUD,EAAQC,SAEG,QAArB,MAAAD,OAAA,EAAAA,EAASC,UACY,SAArB,MAAAD,OAAA,EAAAA,EAASC,YAECA,OAAA,GAGPV,EAAMR,IAAIgB,EAAO,IACjBC,EACHC,QAAAA,GACH,GAIRb,SAAA,CAAAA,EACDc,EAACC,EAAY,CAAAZ,MAAAA,EAAcD,UAAAA,MAC/B"}