npm - @fremtind/jokul - Versions diffs - 5.0.5 → 5.1.0 - Mend

@fremtind/jokul 5.0.5 → 5.1.0

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

Files changed (121) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Combobox.js","sources":["../../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n type FC,\n type FocusEvent,\n type KeyboardEvent,\n type MouseEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { useListNavigation } from \"../../hooks/useListNavigation/useListNavigation.js\";\nimport type { ValuePair } from \"../../utilities/valuePair.js\";\nimport { Chip } from \"../chip/Chip.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { CheckIcon } from \"../icon/icons/CheckIcon.js\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { Tooltip } from \"../tooltip/Tooltip.js\";\nimport { TooltipContent } from \"../tooltip/TooltipContent.js\";\nimport { TooltipTrigger } from \"../tooltip/TooltipTrigger.js\";\nimport type { ComboboxProps, ComboboxValuePair } from \"./types.js\";\n\nexport function getComboboxValuePair(\n item: string \| ComboboxValuePair,\n): ComboboxValuePair {\n return typeof item === \"string\" ? { value: item, label: item } : item;\n}\n\nexport const Combobox: FC<ComboboxProps> = (props) => {\n const {\n \"data-size\": dataSize,\n id,\n placeholder,\n items,\n onChange,\n onFocus,\n onBlur,\n value,\n label,\n noMatchingOption,\n labelProps,\n helpLabel,\n errorLabel,\n width,\n name,\n className,\n invalid,\n description,\n hasTagHover,\n } = props;\n const listId = useId(id \|\| \"jkl-combobox\", { generateSuffix: !id });\n const labelId = `${listId}_label`;\n const buttonId = `${listId}_button`;\n const inputId = `${listId}_search-input`;\n\n const [selectedValue, setSelectedValue] = useState<\n Array<ComboboxValuePair>\n >(value \|\| []);\n const [showMenu, setShowMenu] = useState<boolean>(false);\n const [searchValue, setSearchValue] = useState<string>(\"\");\n const [noResults, setNoResults] = useState(false);\n const [marked, setMarked] = useState<boolean>(false);\n\n const searchRef = useRef<HTMLInputElement>(null);\n const inputRef = useRef<HTMLDivElement>(null);\n const focusInsideRef = useRef(false);\n\n useEffect(() => {\n setSearchValue(\"\");\n if (showMenu && searchRef.current) {\n searchRef.current.focus();\n }\n }, [showMenu]);\n\n useEffect(() => {\n setSelectedValue((prev) => value \|\| prev);\n }, [value]);\n\n // Funksjon for å stile valgt element\n const isSelected = (option: ValuePair) => {\n if (!selectedValue) {\n return false;\n }\n\n return selectedValue.some((value) => value.value === option.value);\n };\n\n // Fjerne ett eller flere valg\n const removeOption = useCallback(\n (option: string) => {\n return selectedValue.filter((value) => value.value !== option);\n },\n [selectedValue],\n );\n\n const onTagRemove = useCallback(\n (\n e:\n \| React.MouseEvent<HTMLButtonElement, globalThis.MouseEvent>\n \| React.KeyboardEvent<HTMLInputElement>,\n option: string,\n ) => {\n const newValue = removeOption(option);\n setSelectedValue(newValue);\n onChange({\n type: \"change\",\n target: { name, value: option, selectedOptions: newValue },\n });\n e.stopPropagation();\n\n if (newValue.length === 0) {\n setMarked(false);\n }\n },\n [removeOption, onChange, name],\n );\n\n // Håndtere valgt verdi i listen\n const onItemClick = useCallback(\n (option: string) => {\n let newValue: Array<ValuePair>;\n\n if (selectedValue.some((value) => value.value === option)) {\n newValue = removeOption(option);\n } else {\n const item = items.find((i) => i.value === option);\n newValue = [...selectedValue, item as ValuePair];\n }\n searchRef.current?.focus();\n setSelectedValue(newValue);\n onChange({\n type: \"change\",\n target: { name, value: option, selectedOptions: newValue },\n });\n },\n [selectedValue, onChange, name, removeOption, items],\n );\n\n // Funksjon for søk\n const onSearch = (e: {\n target: { value: React.SetStateAction<string> };\n }) => {\n searchRef.current?.focus();\n setShowMenu(true);\n setSearchValue(e.target.value);\n };\n\n const options = useMemo(() => {\n if (!searchValue) {\n return items;\n }\n\n const filteredOptions = items.filter(\n (option) =>\n option.label.toLowerCase().indexOf(searchValue.toLowerCase()) >=\n 0,\n );\n\n setNoResults(filteredOptions.length === 0);\n\n return filteredOptions;\n }, [searchValue, items]);\n\n // Det første elementet i listen skal være aktivt fram til brukeren klikker på noe annet\n const [activeDescendant, setActiveDescendant] = useState<\n string \| undefined\n >(options[0]?.value ? `${listId}-${options[0]?.value}` : undefined);\n\n // Håndtere arrow-state\n const isPointingDown = !showMenu;\n\n // Lukk meny med ESC\n useEffect(() => {\n const handleEscape = (e: globalThis.KeyboardEvent) => {\n if (e.key === \"Escape\" && showMenu) {\n setShowMenu(false);\n }\n };\n if (typeof window !== \"undefined\") {\n window.addEventListener(\"keydown\", handleEscape);\n }\n return () => {\n if (typeof window !== \"undefined\" && showMenu) {\n window.removeEventListener(\"keydown\", handleEscape);\n }\n };\n }, [showMenu]);\n\n // Fokushåndtering\n const handleFocusPlacement = useCallback((isOpen: boolean) => {\n if (isOpen) {\n if (searchRef.current) {\n searchRef.current.focus();\n }\n } else {\n if (focusInsideRef.current && inputRef.current) {\n inputRef.current.focus();\n }\n }\n }, []);\n\n const handleFocus = useCallback(() => {\n if (!focusInsideRef.current) {\n if (onFocus) {\n onFocus({\n type: \"change\",\n target: {\n name,\n value: selectedValue?.[0].value \|\| \"\",\n selectedOptions: selectedValue,\n },\n });\n }\n focusInsideRef.current = true;\n setShowMenu(true);\n }\n }, [onFocus, selectedValue, name]);\n\n const [dropdownRef] = useAnimatedHeight<HTMLDivElement>(showMenu, {\n onFirstVisible: handleFocusPlacement,\n onTransitionEnd: handleFocusPlacement,\n });\n\n useListNavigation({ ref: dropdownRef });\n\n const componentRootElementRef = useRef<HTMLDivElement>(null);\n\n const handleBlur = useCallback(\n (\n e: FocusEvent<\n HTMLDivElement \| HTMLInputElement \| HTMLButtonElement\n >,\n ) => {\n const componentRootElement = componentRootElementRef.current;\n const nextFocusIsInsideComponent = componentRootElement?.contains(\n e.relatedTarget as Node,\n );\n if (!nextFocusIsInsideComponent) {\n setSearchValue(\"\");\n\n if (onBlur) {\n onBlur({\n type: \"blur\",\n target: {\n name,\n value: selectedValue?.[0]?.value \|\| \"\",\n selectedOptions: selectedValue,\n },\n });\n inputRef.current?.dispatchEvent(\n new Event(\"focusout\", { bubbles: true }),\n );\n }\n focusInsideRef.current = false;\n setShowMenu(false);\n }\n },\n [onBlur, name, selectedValue],\n );\n\n const handleMouseOver = useCallback((e: MouseEvent<HTMLButtonElement>) => {\n // Ved mouseOver på options flytter vi fokus til dem for å unngå \"dobbel fokus\"\n // der det ser ut som to forskjellige elementer er fokusert/hovered samtidig\n (e.target as HTMLButtonElement).focus({ preventScroll: true });\n }, []);\n\n // Tastaturnavigasjon\n const handleSearchOnKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n e.stopPropagation();\n const listElement = dropdownRef.current;\n if (listElement) {\n listElement\n .querySelector<HTMLButtonElement>('[role=\"option\"]')\n ?.focus();\n }\n } else if (e.key === \"Escape\") {\n e.preventDefault();\n e.stopPropagation();\n setShowMenu(false);\n }\n\n if ((e.metaKey && e.key === \"a\") \|\| (e.ctrlKey && e.key === \"a\")) {\n e.preventDefault();\n e.stopPropagation();\n const updatedSelectedValue = selectedValue.map((item) => ({\n ...item,\n isMarked: true,\n }));\n setMarked(true);\n setSelectedValue(updatedSelectedValue);\n } else if (e.key === \"Backspace\") {\n e.stopPropagation();\n setMarked(false);\n\n // Sjekk om selectedValue er markert\n const selectedValueIsMarked = selectedValue.some(\n (item) => item.isMarked,\n );\n\n if (selectedValueIsMarked) {\n const updatedSelectedValue = selectedValue.filter(\n (item) => !item.isMarked,\n );\n setSelectedValue(updatedSelectedValue);\n setSearchValue(\"\");\n } else if (selectedValue.length > 0 && searchValue === \"\") {\n // Hvis ingen items er markert, fjern siste valgte item\n onTagRemove(\n e,\n selectedValue[selectedValue.length - 1].value,\n );\n }\n }\n },\n [selectedValue, searchValue, dropdownRef, onTagRemove],\n );\n\n const handleOptionOnKeyDown = useCallback(\n (e: KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === \"Tab\") {\n if (searchRef.current) {\n e.preventDefault();\n e.stopPropagation();\n\n if (e.shiftKey) {\n searchRef.current.focus();\n } else {\n setShowMenu(false);\n searchRef.current.focus();\n }\n }\n } else if (e.key === \"ArrowUp\") {\n if (dropdownRef.current && searchRef.current) {\n // Can't be based on index since the first item might be filtered out\n const firstVisible = dropdownRef.current.querySelector(\n '[role=\"option\"]:not([hidden])',\n );\n if (\n e.currentTarget.id === firstVisible?.id &&\n searchRef.current\n ) {\n searchRef.current.focus();\n }\n }\n }\n },\n [dropdownRef],\n );\n\n const hasSelection = selectedValue.length >= 1;\n\n const renderSelectedOption = useCallback(\n (option: ComboboxValuePair) => (\n <Chip\n key={option.value}\n data-testid=\"jkl-chip\"\n aria-label={`Fjern ${option.tagLabel}`}\n className={`jkl-combobox__selected-option ${\n marked && \"jkl-combobox__selected-option--marked\"\n }`}\n variant=\"input\"\n onClick={(e) => {\n if (searchRef.current) {\n searchRef.current.focus();\n }\n onTagRemove(e, option.value);\n }}\n onBlur={handleBlur}\n >\n {option.tagLabel ? option.tagLabel : option.label}\n </Chip>\n ),\n [handleBlur, onTagRemove, marked],\n );\n\n return (\n <InputGroup\n label={label}\n id={inputId}\n ref={componentRootElementRef}\n data-testid=\"jkl-combobox\"\n data-size={dataSize}\n className={clsx(\"jkl-combobox\", className, {\n \"jkl-combobox--invalid\": !!errorLabel \|\| invalid,\n \"jkl-combobox--menu-open\": showMenu,\n \"jkl-combobox--menu-closed\": !showMenu && hasSelection,\n })}\n labelProps={{\n id: labelId,\n ...labelProps,\n }}\n helpLabel={helpLabel}\n errorLabel={errorLabel}\n description={description}\n render={(inputProps) => (\n <div\n className={clsx(\"jkl-combobox__wrapper\", {\n \"jkl-combobox__wrapper--active-value\": hasSelection,\n })}\n style={{ width }}\n tabIndex={-1}\n onFocus={handleFocus}\n onBlur={handleBlur}\n >\n <div\n className=\"jkl-combobox__chips\"\n data-testid=\"jkl-combobox__chips\"\n >\n {selectedValue\n .map(getComboboxValuePair)\n .map((option) => {\n return hasTagHover ? (\n <Tooltip key={option.value}>\n <TooltipTrigger>\n {renderSelectedOption(option)}\n </TooltipTrigger>\n <TooltipContent>\n {option.label}\n </TooltipContent>\n </Tooltip>\n ) : (\n renderSelectedOption(option)\n );\n })}\n <input\n {...inputProps}\n className=\"jkl-combobox__search-input\"\n onChange={onSearch}\n data-testid=\"jkl-combobox__search-input\"\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleSearchOnKeyDown}\n value={searchValue}\n ref={searchRef}\n aria-controls={listId}\n role=\"combobox\"\n aria-autocomplete=\"list\"\n aria-expanded={showMenu}\n placeholder={\n selectedValue.length > 0 ? \"\" : placeholder\n }\n autoComplete=\"off\"\n />\n </div>\n\n <div\n className=\"jkl-combobox__menu\"\n // biome-ignore lint/a11y/useSemanticElements: Dette er en reimplementering av en liste\n role=\"listbox\"\n ref={dropdownRef}\n id={listId}\n aria-labelledby={labelId}\n aria-multiselectable=\"true\"\n aria-activedescendant={activeDescendant}\n onFocus={handleFocus}\n onBlur={handleBlur}\n tabIndex={-1}\n >\n {options.map((option, i) => (\n <button\n key={`${listId}-${option.value}`}\n type=\"button\"\n id={`${listId}__${option.value}`}\n aria-selected={isSelected(option)}\n // biome-ignore lint/a11y/useSemanticElements: Dette er en reimplementering av en liste\n role=\"option\"\n value={option.value}\n onBlur={handleBlur}\n className={`jkl-combobox__option ${\n isSelected(option) &&\n \"jkl-combobox__option--selected\"\n }`}\n data-testid=\"jkl-combobox__option\"\n data-testautoid={`jkl-combobox__option-${i}`}\n onFocus={handleFocus}\n onKeyDown={handleOptionOnKeyDown}\n onClick={(e) => {\n setActiveDescendant(\n `${listId}__${option.value}`,\n ); // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role#required_javascript_features\n e.stopPropagation();\n onItemClick(option.value);\n setSearchValue(\"\");\n }}\n onMouseOver={handleMouseOver}\n >\n {option.description ? (\n <span>\n {option.label}\n <span className=\"jkl-combobox__option-description\">\n {option.description}\n </span>\n </span>\n ) : (\n option.label\n )}\n {isSelected(option) ? (\n <span>\n <CheckIcon />{\" \"}\n </span>\n ) : null}\n </button>\n ))}\n {noResults && (\n <div className=\"jkl-combobox__no-option\">\n {noMatchingOption}\n </div>\n )}\n </div>\n <IconButton\n id={buttonId}\n onFocus={handleFocus}\n onBlur={handleBlur}\n className=\"jkl-text-input-action-button\"\n data-testid=\"jkl-combobox__button\"\n aria-label=\"Åpne meny\"\n aria-expanded={showMenu}\n aria-controls={listId}\n onClick={() => setShowMenu((previous) => !previous)}\n onMouseDown={(e) => {\n e.preventDefault();\n inputRef.current?.focus();\n }}\n >\n <ArrowVerticalAnimated pointingDown={isPointingDown} />\n </IconButton>\n </div>\n )}\n />\n );\n};\nCombobox.displayName = \"Combobox\";\n"],"names":["getComboboxValuePair","item","value","label","Combobox","props","dataSize","id","placeholder","items","onChange","onFocus","onBlur","noMatchingOption","labelProps","helpLabel","errorLabel","width","name","className","invalid","description","hasTagHover","listId","useId","generateSuffix","labelId","buttonId","inputId","selectedValue","setSelectedValue","useState","showMenu","setShowMenu","searchValue","setSearchValue","noResults","setNoResults","marked","setMarked","searchRef","useRef","inputRef","focusInsideRef","useEffect","current","focus","prev","isSelected","option","some","removeOption","useCallback","filter","onTagRemove","e","newValue","type","target","selectedOptions","stopPropagation","length","onItemClick","find","i","onSearch","options","useMemo","filteredOptions","toLowerCase","indexOf","activeDescendant","setActiveDescendant","isPointingDown","handleEscape","key","window","addEventListener","removeEventListener","handleFocusPlacement","isOpen","handleFocus","dropdownRef","useAnimatedHeight","onFirstVisible","onTransitionEnd","useListNavigation","ref","componentRootElementRef","handleBlur","contains","relatedTarget","dispatchEvent","Event","bubbles","handleMouseOver","preventScroll","handleSearchOnKeyDown","preventDefault","listElement","querySelector","metaKey","ctrlKey","updatedSelectedValue","map","isMarked","handleOptionOnKeyDown","shiftKey","firstVisible","currentTarget","hasSelection","renderSelectedOption","jsx","Chip","tagLabel","variant","onClick","children","InputGroup","clsx","render","inputProps","jsxs","style","tabIndex","Tooltip","TooltipTrigger","TooltipContent","onKeyDown","role","autoComplete","onMouseOver","CheckIcon","IconButton","previous","onMouseDown","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"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"}
1	+ {"version":3,"file":"Combobox.js","sources":["../../../../src/components/combobox/Combobox.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, {\n type FC,\n type FocusEvent,\n type KeyboardEvent,\n type MouseEvent,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { useAnimatedHeight } from \"../../hooks/useAnimatedHeight/useAnimatedHeight.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { useListNavigation } from \"../../hooks/useListNavigation/useListNavigation.js\";\nimport type { ValuePair } from \"../../utilities/valuePair.js\";\nimport { Chip } from \"../chip/Chip.js\";\nimport { IconButton } from \"../icon-button/IconButton.js\";\nimport { CheckIcon } from \"../icon/icons/CheckIcon.js\";\nimport { ArrowVerticalAnimated } from \"../icon/icons/animated/ArrowVerticalAnimated.js\";\nimport { InputGroup } from \"../input-group/InputGroup.js\";\nimport { Tooltip } from \"../tooltip/Tooltip.js\";\nimport { TooltipContent } from \"../tooltip/TooltipContent.js\";\nimport { TooltipTrigger } from \"../tooltip/TooltipTrigger.js\";\nimport type { ComboboxProps, ComboboxValuePair } from \"./types.js\";\n\nexport function getComboboxValuePair(\n item: string \| ComboboxValuePair,\n): ComboboxValuePair {\n return typeof item === \"string\" ? { value: item, label: item } : item;\n}\n\nexport const Combobox: FC<ComboboxProps> = (props) => {\n const {\n \"data-size\": dataSize,\n id,\n placeholder,\n items,\n onChange,\n onFocus,\n onBlur,\n value,\n label,\n noMatchingOption,\n labelProps,\n helpLabel,\n errorLabel,\n width,\n name,\n className,\n invalid,\n description,\n hasTagHover,\n } = props;\n const listId = useId(id \|\| \"jkl-combobox\", { generateSuffix: !id });\n const labelId = `${listId}_label`;\n const buttonId = `${listId}_button`;\n const inputId = `${listId}_search-input`;\n\n const [selectedValue, setSelectedValue] = useState<\n Array<ComboboxValuePair>\n >(value \|\| []);\n const [showMenu, setShowMenu] = useState<boolean>(false);\n const [searchValue, setSearchValue] = useState<string>(\"\");\n const [noResults, setNoResults] = useState(false);\n const [marked, setMarked] = useState<boolean>(false);\n\n const searchRef = useRef<HTMLInputElement>(null);\n const inputRef = useRef<HTMLDivElement>(null);\n const focusInsideRef = useRef(false);\n\n useEffect(() => {\n setSearchValue(\"\");\n if (showMenu && searchRef.current) {\n searchRef.current.focus();\n }\n }, [showMenu]);\n\n useEffect(() => {\n setSelectedValue((prev) => value \|\| prev);\n }, [value]);\n\n // Funksjon for å stile valgt element\n const isSelected = (option: ValuePair) => {\n if (!selectedValue) {\n return false;\n }\n\n return selectedValue.some((value) => value.value === option.value);\n };\n\n // Fjerne ett eller flere valg\n const removeOption = useCallback(\n (option: string) => {\n return selectedValue.filter((value) => value.value !== option);\n },\n [selectedValue],\n );\n\n const onTagRemove = useCallback(\n (\n e:\n \| React.MouseEvent<HTMLButtonElement, globalThis.MouseEvent>\n \| React.KeyboardEvent<HTMLInputElement>,\n option: string,\n ) => {\n const newValue = removeOption(option);\n setSelectedValue(newValue);\n onChange({\n type: \"change\",\n target: { name, value: option, selectedOptions: newValue },\n });\n e.stopPropagation();\n\n if (newValue.length === 0) {\n setMarked(false);\n }\n },\n [removeOption, onChange, name],\n );\n\n // Håndtere valgt verdi i listen\n const onItemClick = useCallback(\n (option: string) => {\n let newValue: Array<ValuePair>;\n\n if (selectedValue.some((value) => value.value === option)) {\n newValue = removeOption(option);\n } else {\n const item = items.find((i) => i.value === option);\n newValue = [...selectedValue, item as ValuePair];\n }\n searchRef.current?.focus();\n setSelectedValue(newValue);\n onChange({\n type: \"change\",\n target: { name, value: option, selectedOptions: newValue },\n });\n },\n [selectedValue, onChange, name, removeOption, items],\n );\n\n // Funksjon for søk\n const onSearch = (e: {\n target: { value: React.SetStateAction<string> };\n }) => {\n searchRef.current?.focus();\n setShowMenu(true);\n setSearchValue(e.target.value);\n };\n\n const options = useMemo(() => {\n if (!searchValue) {\n return items;\n }\n\n const filteredOptions = items.filter(\n (option) =>\n option.label.toLowerCase().indexOf(searchValue.toLowerCase()) >=\n 0,\n );\n\n setNoResults(filteredOptions.length === 0);\n\n return filteredOptions;\n }, [searchValue, items]);\n\n // Det første elementet i listen skal være aktivt fram til brukeren klikker på noe annet\n const [activeDescendant, setActiveDescendant] = useState<\n string \| undefined\n >(options[0]?.value ? `${listId}-${options[0]?.value}` : undefined);\n\n // Håndtere arrow-state\n const isPointingDown = !showMenu;\n\n // Lukk meny med ESC\n useEffect(() => {\n const handleEscape = (e: globalThis.KeyboardEvent) => {\n if (e.key === \"Escape\" && showMenu) {\n setShowMenu(false);\n }\n };\n if (typeof window !== \"undefined\") {\n window.addEventListener(\"keydown\", handleEscape);\n }\n return () => {\n if (typeof window !== \"undefined\" && showMenu) {\n window.removeEventListener(\"keydown\", handleEscape);\n }\n };\n }, [showMenu]);\n\n // Fokushåndtering\n const handleFocusPlacement = useCallback((isOpen: boolean) => {\n if (isOpen) {\n if (searchRef.current) {\n searchRef.current.focus();\n }\n } else {\n if (focusInsideRef.current && inputRef.current) {\n inputRef.current.focus();\n }\n }\n }, []);\n\n const handleFocus = useCallback(() => {\n if (!focusInsideRef.current) {\n if (onFocus) {\n onFocus({\n type: \"change\",\n target: {\n name,\n value: selectedValue?.[0].value \|\| \"\",\n selectedOptions: selectedValue,\n },\n });\n }\n focusInsideRef.current = true;\n setShowMenu(true);\n }\n }, [onFocus, selectedValue, name]);\n\n const [dropdownRef] = useAnimatedHeight<HTMLDivElement>(showMenu, {\n onFirstVisible: handleFocusPlacement,\n onTransitionEnd: handleFocusPlacement,\n });\n\n useListNavigation({ ref: dropdownRef });\n\n const componentRootElementRef = useRef<HTMLDivElement>(null);\n\n const handleBlur = useCallback(\n (\n e: FocusEvent<\n HTMLDivElement \| HTMLInputElement \| HTMLButtonElement\n >,\n ) => {\n const componentRootElement = componentRootElementRef.current;\n const nextFocusIsInsideComponent = componentRootElement?.contains(\n e.relatedTarget as Node,\n );\n if (!nextFocusIsInsideComponent) {\n setSearchValue(\"\");\n\n if (onBlur) {\n onBlur({\n type: \"blur\",\n target: {\n name,\n value: selectedValue?.[0]?.value \|\| \"\",\n selectedOptions: selectedValue,\n },\n });\n inputRef.current?.dispatchEvent(\n new Event(\"focusout\", { bubbles: true }),\n );\n }\n focusInsideRef.current = false;\n setShowMenu(false);\n }\n },\n [onBlur, name, selectedValue],\n );\n\n const handleMouseOver = useCallback((e: MouseEvent<HTMLButtonElement>) => {\n // Ved mouseOver på options flytter vi fokus til dem for å unngå \"dobbel fokus\"\n // der det ser ut som to forskjellige elementer er fokusert/hovered samtidig\n (e.target as HTMLButtonElement).focus({ preventScroll: true });\n }, []);\n\n // Tastaturnavigasjon\n const handleSearchOnKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n e.stopPropagation();\n const listElement = dropdownRef.current;\n if (listElement) {\n listElement\n .querySelector<HTMLButtonElement>('[role=\"option\"]')\n ?.focus();\n }\n } else if (e.key === \"Escape\") {\n e.preventDefault();\n e.stopPropagation();\n setShowMenu(false);\n }\n\n if ((e.metaKey && e.key === \"a\") \|\| (e.ctrlKey && e.key === \"a\")) {\n e.preventDefault();\n e.stopPropagation();\n const updatedSelectedValue = selectedValue.map((item) => ({\n ...item,\n isMarked: true,\n }));\n setMarked(true);\n setSelectedValue(updatedSelectedValue);\n } else if (e.key === \"Backspace\") {\n e.stopPropagation();\n setMarked(false);\n\n // Sjekk om selectedValue er markert\n const selectedValueIsMarked = selectedValue.some(\n (item) => item.isMarked,\n );\n\n if (selectedValueIsMarked) {\n const updatedSelectedValue = selectedValue.filter(\n (item) => !item.isMarked,\n );\n setSelectedValue(updatedSelectedValue);\n setSearchValue(\"\");\n } else if (selectedValue.length > 0 && searchValue === \"\") {\n // Hvis ingen items er markert, fjern siste valgte item\n onTagRemove(\n e,\n selectedValue[selectedValue.length - 1].value,\n );\n }\n }\n },\n [selectedValue, searchValue, dropdownRef, onTagRemove],\n );\n\n const handleOptionOnKeyDown = useCallback(\n (e: KeyboardEvent<HTMLButtonElement>) => {\n if (e.key === \"Tab\") {\n if (searchRef.current) {\n e.preventDefault();\n e.stopPropagation();\n\n if (e.shiftKey) {\n searchRef.current.focus();\n } else {\n setShowMenu(false);\n searchRef.current.focus();\n }\n }\n } else if (e.key === \"ArrowUp\") {\n if (dropdownRef.current && searchRef.current) {\n // Can't be based on index since the first item might be filtered out\n const firstVisible = dropdownRef.current.querySelector(\n '[role=\"option\"]:not([hidden])',\n );\n if (\n e.currentTarget.id === firstVisible?.id &&\n searchRef.current\n ) {\n searchRef.current.focus();\n }\n }\n }\n },\n [dropdownRef],\n );\n\n const hasSelection = selectedValue.length >= 1;\n\n const renderSelectedOption = useCallback(\n (option: ComboboxValuePair) => (\n <Chip\n key={option.value}\n data-testid=\"jkl-chip\"\n aria-label={`Fjern ${option.tagLabel}`}\n className={`jkl-combobox__selected-option ${\n marked && \"jkl-combobox__selected-option--marked\"\n }`}\n variant=\"input\"\n onClick={(e) => {\n if (searchRef.current) {\n searchRef.current.focus();\n }\n onTagRemove(e, option.value);\n }}\n onBlur={handleBlur}\n >\n {option.tagLabel ? option.tagLabel : option.label}\n </Chip>\n ),\n [handleBlur, onTagRemove, marked],\n );\n\n return (\n <InputGroup\n label={label}\n id={inputId}\n ref={componentRootElementRef}\n data-testid=\"jkl-combobox\"\n data-size={dataSize}\n className={clsx(\"jkl-combobox\", className, {\n \"jkl-combobox--invalid\": !!errorLabel \|\| invalid,\n \"jkl-combobox--menu-open\": showMenu,\n \"jkl-combobox--menu-closed\": !showMenu && hasSelection,\n })}\n labelProps={{\n id: labelId,\n ...labelProps,\n }}\n helpLabel={helpLabel}\n errorLabel={errorLabel}\n description={description}\n render={(inputProps) => (\n <div\n className={clsx(\"jkl-combobox__wrapper\", {\n \"jkl-combobox__wrapper--active-value\": hasSelection,\n })}\n style={{ width }}\n tabIndex={-1}\n onFocus={handleFocus}\n onBlur={handleBlur}\n data-invalid={!!errorLabel \|\| invalid}\n >\n <div\n className=\"jkl-combobox__chips\"\n data-testid=\"jkl-combobox__chips\"\n >\n {selectedValue\n .map(getComboboxValuePair)\n .map((option) => {\n return hasTagHover ? (\n <Tooltip key={option.value}>\n <TooltipTrigger>\n {renderSelectedOption(option)}\n </TooltipTrigger>\n <TooltipContent>\n {option.label}\n </TooltipContent>\n </Tooltip>\n ) : (\n renderSelectedOption(option)\n );\n })}\n <input\n {...inputProps}\n className=\"jkl-combobox__search-input\"\n onChange={onSearch}\n data-testid=\"jkl-combobox__search-input\"\n onFocus={handleFocus}\n onBlur={handleBlur}\n onKeyDown={handleSearchOnKeyDown}\n value={searchValue}\n ref={searchRef}\n aria-controls={listId}\n role=\"combobox\"\n aria-autocomplete=\"list\"\n aria-expanded={showMenu}\n placeholder={\n selectedValue.length > 0 ? \"\" : placeholder\n }\n autoComplete=\"off\"\n />\n </div>\n\n <div\n className=\"jkl-combobox__menu\"\n // biome-ignore lint/a11y/useSemanticElements: Dette er en reimplementering av en liste\n role=\"listbox\"\n ref={dropdownRef}\n id={listId}\n aria-labelledby={labelId}\n aria-multiselectable=\"true\"\n aria-activedescendant={activeDescendant}\n onFocus={handleFocus}\n onBlur={handleBlur}\n tabIndex={-1}\n >\n {options.map((option, i) => (\n <button\n key={`${listId}-${option.value}`}\n type=\"button\"\n id={`${listId}__${option.value}`}\n aria-selected={isSelected(option)}\n // biome-ignore lint/a11y/useSemanticElements: Dette er en reimplementering av en liste\n role=\"option\"\n value={option.value}\n onBlur={handleBlur}\n className={`jkl-combobox__option ${\n isSelected(option) &&\n \"jkl-combobox__option--selected\"\n }`}\n data-testid=\"jkl-combobox__option\"\n data-testautoid={`jkl-combobox__option-${i}`}\n onFocus={handleFocus}\n onKeyDown={handleOptionOnKeyDown}\n onClick={(e) => {\n setActiveDescendant(\n `${listId}__${option.value}`,\n ); // https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role#required_javascript_features\n e.stopPropagation();\n onItemClick(option.value);\n setSearchValue(\"\");\n }}\n onMouseOver={handleMouseOver}\n >\n {option.description ? (\n <span>\n {option.label}\n <span className=\"jkl-combobox__option-description\">\n {option.description}\n </span>\n </span>\n ) : (\n option.label\n )}\n {isSelected(option) ? (\n <span>\n <CheckIcon />{\" \"}\n </span>\n ) : null}\n </button>\n ))}\n {noResults && (\n <div className=\"jkl-combobox__no-option\">\n {noMatchingOption}\n </div>\n )}\n </div>\n <IconButton\n id={buttonId}\n onFocus={handleFocus}\n onBlur={handleBlur}\n className=\"jkl-text-input-action-button\"\n data-testid=\"jkl-combobox__button\"\n aria-label=\"Åpne meny\"\n aria-expanded={showMenu}\n aria-controls={listId}\n onClick={() => setShowMenu((previous) => !previous)}\n onMouseDown={(e) => {\n e.preventDefault();\n inputRef.current?.focus();\n }}\n >\n <ArrowVerticalAnimated pointingDown={isPointingDown} />\n </IconButton>\n </div>\n )}\n />\n );\n};\nCombobox.displayName = \"Combobox\";\n"],"names":["getComboboxValuePair","item","value","label","Combobox","props","dataSize","id","placeholder","items","onChange","onFocus","onBlur","noMatchingOption","labelProps","helpLabel","errorLabel","width","name","className","invalid","description","hasTagHover","listId","useId","generateSuffix","labelId","buttonId","inputId","selectedValue","setSelectedValue","useState","showMenu","setShowMenu","searchValue","setSearchValue","noResults","setNoResults","marked","setMarked","searchRef","useRef","inputRef","focusInsideRef","useEffect","current","focus","prev","isSelected","option","some","removeOption","useCallback","filter","onTagRemove","e","newValue","type","target","selectedOptions","stopPropagation","length","onItemClick","find","i","onSearch","options","useMemo","filteredOptions","toLowerCase","indexOf","activeDescendant","setActiveDescendant","isPointingDown","handleEscape","key","window","addEventListener","removeEventListener","handleFocusPlacement","isOpen","handleFocus","dropdownRef","useAnimatedHeight","onFirstVisible","onTransitionEnd","useListNavigation","ref","componentRootElementRef","handleBlur","contains","relatedTarget","dispatchEvent","Event","bubbles","handleMouseOver","preventScroll","handleSearchOnKeyDown","preventDefault","listElement","querySelector","metaKey","ctrlKey","updatedSelectedValue","map","isMarked","handleOptionOnKeyDown","shiftKey","firstVisible","currentTarget","hasSelection","renderSelectedOption","jsx","Chip","tagLabel","variant","onClick","children","InputGroup","clsx","render","inputProps","jsxs","style","tabIndex","Tooltip","TooltipTrigger","TooltipContent","onKeyDown","role","autoComplete","onMouseOver","CheckIcon","IconButton","previous","onMouseDown","ArrowVerticalAnimated","pointingDown","displayName"],"mappings":"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"}

package/build/es/components/expander/types.d.ts CHANGED Viewed

@@ -10,7 +10,7 @@ export type ExpandablePanelProps<ElementType extends React.ElementType> = Polymo
 export type ExpandablePanelComponent = {
     Content: ExpandablePanelContentComponent;
     Header: ExpanderComponent;
-} & (<ElementType extends React.ElementType = "div">(props: ExpandablePanelProps<ElementType>) => React.ReactElement | null);
+} & (<ElementType extends React.ElementType = "details">(props: ExpandablePanelProps<ElementType>) => React.ReactElement | null);
 export type ExpanderProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
     icon?: React.ReactNode;
     open?: boolean;

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Help.js","sources":["../../../../src/components/help/Help.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Button } from \"../button/index.js\";\nimport { Icon } from \"../icon/Icon.js\";\nimport type { HelpProps } from \"./types.js\";\n\nexport const Help = ({\n position = \"top\",\n buttonText = \"Hjelp\",\n showButtonText = false,\n iconPosition = \"left\",\n className,\n children,\n ...rest\n}: HelpProps) => {\n return (\n <div className={clsx(\"jkl-help\", className)}>\n <Button\n {...rest}\n title={buttonText \|\| rest.title}\n iconPosition={iconPosition}\n variant=\"ghost\"\n className={\"jkl-help-trigger\"}\n icon={<Icon aria-hidden=\"true\">help</Icon>}\n data-testid=\"jkl-help-trigger\"\n // @ts-ignore\n popovertarget={`${~~buttonText~~}-popover`}\n ~~style={{ anchorName: `${buttonText}-popover` }}\n~~ >\n {showButtonText && buttonText}\n </Button>\n\n <output aria-live=\"assertive\">\n <div\n data-position={position}\n // @ts-ignore\n popover=\"auto\"\n id={`${~~buttonText~~}-popover`}\n className=\"jkl-help-popover\"\n >\n {children}\n </div>\n </output>\n </div>\n );\n};\n"],"names":["Help","position","buttonText","showButtonText","iconPosition","className","children","rest","clsx","jsx","Button","title","variant","icon","Icon","popovertarget","~~style","anchorName","~~popover","id"],"mappings":"~~kMAMO~~,MAAMA,EAAO,EAChBC,SAAAA,EAAW,MACXC,WAAAA,EAAa,QACbC,eAAAA,GAAiB,EACjBC,aAAAA,EAAe,OACfC,UAAAA,EACAC,SAAAA,KACGC,~~OAGE~~,MAAA,~~CAAIF~~,~~UAAWG~~,EAAK,~~WAAYH~~,GAC7BC,SAAA,~~CAAAG~~,EAACC,EAAA,~~IACOH~~,~~EACJI~~,~~MAAOT~~,GAAcK,~~EAAKI~~,~~MAC1BP~~,aAAAA,~~EACAQ~~,QAAQ,~~QACRP~~,UAAW,~~mBACXQ~~,KAAMJ,EAACK,EAAA,CAAK,cAAY,~~OAAOR~~,SAAA,SAC/B,cAAY,~~mBAEZS~~,cAAe,~~GAAGb~~,~~YAClBc~~,~~MAAO,CAAEC,WAAY,GAAGf,aAEvBI,~~SAAAH,GAAkBD,~~IAGvBO~~,EAAC,SAAA,CAAO,YAAU,~~YACdH~~,~~SAAAG~~,EAAC,MAAA,CACG,~~gBAAeR~~,EAEfiB,QAAQ,OACRC,GAAI,~~GAAGjB~~,~~YACPG~~,UAAU,mBAETC,SAAAA"}
1	+ {"version":3,"file":"Help.js","sources":["../../../../src/components/help/Help.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useId } from \"react\";\nimport { Button } from \"../button/index.js\";\nimport { Icon } from \"../icon/Icon.js\";\nimport type { HelpProps } from \"./types.js\";\n\nexport const Help = ({\n position = \"top\",\n buttonText = \"Hjelp\",\n showButtonText = false,\n iconPosition = \"left\",\n className,\n children,\n ...rest\n}: HelpProps) => {\n const helpId = useId();\n\n return (\n <div className={clsx(\"jkl-help\", className)}>\n <Button\n {...rest}\n title={buttonText \|\| rest.title}\n iconPosition={iconPosition}\n variant=\"ghost\"\n className={\"jkl-help-trigger\"}\n icon={<Icon aria-hidden=\"true\">help</Icon>}\n data-testid=\"jkl-help-trigger\"\n // @ts-ignore\n popovertarget={`${helpId}-popover`}\n >\n {showButtonText && buttonText}\n </Button>\n\n <output aria-live=\"assertive\">\n <div\n data-position={position}\n // @ts-ignore\n popover=\"auto\"\n id={`${helpId}-popover`}\n className=\"jkl-help-popover\"\n >\n {children}\n </div>\n </output>\n </div>\n );\n};\n"],"names":["Help","position","buttonText","showButtonText","iconPosition","className","children","rest","helpId","useId","clsx","jsx","Button","title","variant","icon","Icon","popovertarget","popover","id"],"mappings":"kNAMO,MAAMA,EAAO,EAChBC,SAAAA,EAAW,MACXC,WAAAA,EAAa,QACbC,eAAAA,GAAiB,EACjBC,aAAAA,EAAe,OACfC,UAAAA,EACAC,SAAAA,KACGC,MAEH,MAAMC,EAASC,IAEf,SACK,MAAA,CAAIJ,UAAWK,EAAK,WAAYL,GAC7BC,SAAA,CAAAK,EAACC,EAAA,IACOL,EACJM,MAAOX,GAAcK,EAAKM,MAC1BT,aAAAA,EACAU,QAAQ,QACRT,UAAW,mBACXU,KAAMJ,EAACK,EAAA,CAAK,cAAY,OAAOV,SAAA,SAC/B,cAAY,mBAEZW,cAAe,GAAGT,YAEjBF,SAAAH,GAAkBD,IAGvBS,EAAC,SAAA,CAAO,YAAU,YACdL,SAAAK,EAAC,MAAA,CACG,gBAAeV,EAEfiB,QAAQ,OACRC,GAAI,GAAGX,YACPH,UAAU,mBAETC,SAAAA"}

package/build/es/components/icon/icons/ErrorIcon.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as r}from"react/jsx-runtime";import"react";import{Icon as o}from"../Icon.js";const c=c=>r(o,{bold:!0,filled:!0,...c,children:""});c.displayName="ErrorIcon";export{c as ErrorIcon};
+import{jsx as r}from"react/jsx-runtime";import"react";import{Icon as o}from"../Icon.js";const c=c=>r(o,{bold:!0,filled:!0,...c,children:""});c.displayName="ErrorIcon";export{c as ErrorIcon};
 //# sourceMappingURL=ErrorIcon.js.map

package/build/es/components/icon/icons/ErrorIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ErrorIcon.js","sources":["../../../../../src/components/icon/icons/ErrorIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ErrorIcon: IconComponent = (props: IconProps) => (\n <Icon bold filled {...props}>\n {\"\\~~uf8b6~~\"}\n </Icon>\n);\nErrorIcon.displayName = \"ErrorIcon\";\n"],"names":["ErrorIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"wFAIO,MAAMA,EAA4BC,GACrCC,EAACC,EAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SAAA,MAGTN,EAAUO,YAAc"}
1	+ {"version":3,"file":"ErrorIcon.js","sources":["../../../../../src/components/icon/icons/ErrorIcon.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon, type IconComponent } from \"../Icon.js\";\nimport type { IconProps } from \"../types.js\";\n\nexport const ErrorIcon: IconComponent = (props: IconProps) => (\n <Icon bold filled {...props}>\n {\"\\ue82a\"}\n </Icon>\n);\nErrorIcon.displayName = \"ErrorIcon\";\n"],"names":["ErrorIcon","props","jsx","Icon","bold","filled","children","displayName"],"mappings":"wFAIO,MAAMA,EAA4BC,GACrCC,EAACC,EAAA,CAAKC,MAAI,EAACC,QAAM,KAAKJ,EACjBK,SAAA,MAGTN,EAAUO,YAAc"}

package/build/es/components/radio-button/RadioButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioButton.js","sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { SupportLabel } from \"../input-group/SupportLabel.js\";\nimport { BaseRadioButton } from \"./BaseRadioButton.js\";\nimport { useRadioGroupContext } from \"./radioGroupContext.js\";\nimport type { RadioButtonProps } from \"./types.js\";\n\nexport const RadioButton = forwardRef<HTMLInputElement, RadioButtonProps>(\n (props, ref) => {\n const { checked, value, supportLabelProps, helpLabel, ...rest } = props;\n const { value: selectedValue, ...context } = useRadioGroupContext();\n const supportId = useId(\"jkl-support-label\");\n\n return (\n <>\n <BaseRadioButton\n {...context}\n {...rest}\n ref={ref}\n checked={\n typeof checked !== \"undefined\"\n ? checked\n : typeof selectedValue !== \"undefined\"\n ? value === selectedValue\n : undefined\n }\n value={value}\n aria-describedby={helpLabel ? supportId : undefined}\n />\n <SupportLabel\n {...supportLabelProps}\n label={helpLabel}\n labelType={\"help\"}\n id={supportId}\n />\n </>\n );\n },\n);\n\nRadioButton.displayName = \"RadioButton\";\n"],"names":["RadioButton","forwardRef","props","ref","checked","value","supportLabelProps","helpLabel","rest","selectedValue","context","useRadioGroupContext","supportId","useId","jsxs","Fragment","children","jsx","BaseRadioButton","SupportLabel","label","labelType","id","displayName"],"mappings":"yUAOO,MAAMA,EAAcC,EACvB,CAACC,EAAOC,KACJ,MAAQC,QAAAA,EAASC,MAAAA,EAAOC,kBAAAA,EAAmBC,UAAAA,KAAcC,GAASN,GAC1DG,MAAOI,KAAkBC,GAAYC,~~IACvCC~~,EAAYC,EAAM,qBAExB,OACIC,EAAAC,EAAA,CACIC,SAAA,CAAAC,EAACC,EAAA,IACOR,KACAF,EACJL,IAAAA,EACAC,eACWA,EAAY,IACbA,SACOK,EAAkB,IACvBJ,IAAUI,OACV,EAEZJ,MAAAA,EACA,mBAAkBE,EAAYK,OAAY,IAE9CK,EAACE,EAAA,IACOb,EACJc,MAAOb,EACPc,UAAW,OACXC,GAAIV,SAOxBZ,EAAYuB,YAAc"}
1	+ {"version":3,"file":"RadioButton.js","sources":["../../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { SupportLabel } from \"../input-group/SupportLabel.js\";\nimport { BaseRadioButton } from \"./BaseRadioButton.js\";\nimport { useRadioGroupContext } from \"./radioGroupContext.js\";\nimport type { RadioButtonProps } from \"./types.js\";\n\nexport const RadioButton = forwardRef<HTMLInputElement, RadioButtonProps>(\n (props, ref) => {\n const { checked, value, supportLabelProps, helpLabel, ...rest } = props;\n const { value: selectedValue, ...context } = useRadioGroupContext();\n\n const supportId = useId(\"jkl-support-label\");\n\n return (\n <>\n <BaseRadioButton\n {...context}\n {...rest}\n ref={ref}\n checked={\n typeof checked !== \"undefined\"\n ? checked\n : typeof selectedValue !== \"undefined\"\n ? value === selectedValue\n : undefined\n }\n value={value}\n aria-describedby={helpLabel ? supportId : undefined}\n />\n <SupportLabel\n {...supportLabelProps}\n label={helpLabel}\n labelType={\"help\"}\n id={supportId}\n />\n </>\n );\n },\n);\n\nRadioButton.displayName = \"RadioButton\";\n"],"names":["RadioButton","forwardRef","props","ref","checked","value","supportLabelProps","helpLabel","rest","selectedValue","context","useRadioGroupContext","supportId","useId","jsxs","Fragment","children","jsx","BaseRadioButton","SupportLabel","label","labelType","id","displayName"],"mappings":"yUAOO,MAAMA,EAAcC,EACvB,CAACC,EAAOC,KACJ,MAAQC,QAAAA,EAASC,MAAAA,EAAOC,kBAAAA,EAAmBC,UAAAA,KAAcC,GAASN,GAC1DG,MAAOI,KAAkBC,GAAYC,IAEvCC,EAAYC,EAAM,qBAExB,OACIC,EAAAC,EAAA,CACIC,SAAA,CAAAC,EAACC,EAAA,IACOR,KACAF,EACJL,IAAAA,EACAC,eACWA,EAAY,IACbA,SACOK,EAAkB,IACvBJ,IAAUI,OACV,EAEZJ,MAAAA,EACA,mBAAkBE,EAAYK,OAAY,IAE9CK,EAACE,EAAA,IACOb,EACJc,MAAOb,EACPc,UAAW,OACXC,GAAIV,SAOxBZ,EAAYuB,YAAc"}

package/build/es/components/system-message/SystemMessage.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as s,jsxs as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import"react";import{useId as t}from"../../hooks/useId/useId.js";import{DismissButton as m}from"../message/DismissButton.js";import{MessageIcon as i}from"./common/MessageIcon.js";function n(n){return({id:l,className:d,maxContentWidth:o,paddingLeft:r,role:c="status",dismissed:g,dismissAction:y,children:h,...u})=>{const j=t(l||"jkl-system-message",{generateSuffix:!l});return s("div",{role:c,...u,id:j,className:a("jkl-system-message",`jkl-system-message--${n}`,d,{"jkl-system-message--dismissed":g}),children:e("div",{className:"jkl-system-message__content","data-testid":"system-message-content","data-theme":"light",style:{maxWidth:o,paddingLeft:r},children:[s(i,{variant:n||"info"}),s("span",{className:"jkl-system-message__message",children:h}),y?.handleDismiss&&s(m,{"data-theme":"light","aria-controls":j,className:"jkl-system-message__dismiss-button",label:y.buttonTitle||"Lukk",onClick:y.handleDismiss})]})})}}const l=({id:n,className:l,maxContentWidth:d,paddingLeft:o,role:r="status",dismissed:c,variant:g="info",dismissAction:y,children:h,...u})=>{const j=t(n||"jkl-system-message",{generateSuffix:!n});return s("div",{role:r,...u,id:j,className:a("jkl-system-message",`jkl-system-message--${g}`,l,{"jkl-system-message--dismissed":c}),children:e("div",{className:"jkl-system-message__content","data-testid":"system-message-content","data-theme":"light",style:{maxWidth:d,paddingLeft:o},children:[s(i,{variant:g}),s("span",{className:"jkl-system-message__message",children:h}),y?.handleDismiss&&s(m,{"data-theme":"light","aria-controls":j,className:"jkl-system-message__dismiss-button",label:y.buttonTitle||"Lukk",onClick:y.handleDismiss})]})})},d=n("info");d.displayName="InfoSystemMessage";const o=n("error");o.displayName="ErrorSystemMessage";const r=n("warning");r.displayName="WarningSystemMessage";const c=n("success");c.displayName="SuccessSystemMessage";export{o as ErrorSystemMessage,d as InfoSystemMessage,c as SuccessSystemMessage,l as SystemMessage,r as WarningSystemMessage};
+import{jsx as s,jsxs as e}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import"react";import{useId as t}from"../../hooks/useId/useId.js";import{DismissButton as m}from"../message/DismissButton.js";import{MessageIcon as i}from"./common/MessageIcon.js";function n(n){return({id:l,className:o,maxContentWidth:d,paddingLeft:r,role:c="status",dismissed:g,dismissAction:y,children:u,...j})=>{const k=t(l||"jkl-system-message",{generateSuffix:!l});return s("div",{role:c,...j,id:k,className:a("jkl-system-message",`jkl-system-message--${n}`,o,{"jkl-system-message--dismissed":g}),children:e("div",{className:"jkl-system-message__content","data-testid":"system-message-content",style:{maxWidth:d,paddingLeft:r},children:[s(i,{variant:n||"info"}),s("span",{className:"jkl-system-message__message",children:u}),y?.handleDismiss&&s(m,{"aria-controls":k,className:"jkl-system-message__dismiss-button",label:y.buttonTitle||"Lukk",onClick:y.handleDismiss})]})})}}const l=({id:n,className:l,maxContentWidth:o,paddingLeft:d,role:r="status",dismissed:c,variant:g="info",dismissAction:y,children:u,...j})=>{const k=t(n||"jkl-system-message",{generateSuffix:!n});return s("div",{role:r,...j,id:k,className:a("jkl-system-message",`jkl-system-message--${g}`,l,{"jkl-system-message--dismissed":c}),children:e("div",{className:"jkl-system-message__content","data-testid":"system-message-content",style:{maxWidth:o,paddingLeft:d},children:[s(i,{variant:g}),s("span",{className:"jkl-system-message__message",children:u}),y?.handleDismiss&&s(m,{"aria-controls":k,className:"jkl-system-message__dismiss-button",label:y.buttonTitle||"Lukk",onClick:y.handleDismiss})]})})},o=n("info");o.displayName="InfoSystemMessage";const d=n("error");d.displayName="ErrorSystemMessage";const r=n("warning");r.displayName="WarningSystemMessage";const c=n("success");c.displayName="SuccessSystemMessage";export{d as ErrorSystemMessage,o as InfoSystemMessage,c as SuccessSystemMessage,l as SystemMessage,r as WarningSystemMessage};
 //# sourceMappingURL=SystemMessage.js.map

package/build/es/components/system-message/SystemMessage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SystemMessage.js","sources":["../../../../src/components/system-message/SystemMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { DismissButton } from \"../message/DismissButton.js\";\nimport { MessageIcon } from \"./common/MessageIcon.js\";\nimport type { SystemMessageProps } from \"./types.js\";\n\nfunction systemFactory(\n variant: SystemMessageProps[\"variant\"],\n): React.FC<SystemMessageProps> {\n const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n dismissAction,\n children,\n ...rest\n }) => {\n const systemId = useId(id \|\| \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${variant}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n ~~data-theme=\"light\"\n~~ style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon variant={variant \|\| \"info\"} />\n <span className=\"jkl-system-message__message\">\n {children}\n </span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n ~~data-theme=\"light\"\n~~ aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle \|\| \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n };\n return SystemMessage;\n}\n\nexport const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n variant = \"info\",\n dismissAction,\n children,\n ...rest\n}) => {\n const systemId = useId(id \|\| \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${variant}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n ~~data-theme=\"light\"\n~~ style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon variant={variant} />\n <span className=\"jkl-system-message__message\">{children}</span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n ~~data-theme=\"light\"\n~~ aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle \|\| \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n};\n\n/*\n @deprecated bruk {@link SystemMessage} med variant=\"info\"\n /\nexport const InfoSystemMessage = systemFactory(\"info\");\nInfoSystemMessage.displayName = \"InfoSystemMessage\";\n/\n @deprecated bruk {@link SystemMessage} med variant=\"error\"\n /\nexport const ErrorSystemMessage = systemFactory(\"error\");\nErrorSystemMessage.displayName = \"ErrorSystemMessage\";\n/\n @deprecated bruk {@link SystemMessage} med variant=\"warning\"\n /\nexport const WarningSystemMessage = systemFactory(\"warning\");\nWarningSystemMessage.displayName = \"WarningSystemMessage\";\n/\n @deprecated bruk {@link SystemMessage} med variant=\"success\"\n */\nexport const SuccessSystemMessage = systemFactory(\"success\");\nSuccessSystemMessage.displayName = \"SuccessSystemMessage\";\n"],"names":["systemFactory","variant","id","className","maxContentWidth","paddingLeft","role","dismissed","dismissAction","children","rest","systemId","useId","generateSuffix","jsx","clsx","jsxs","style","maxWidth","MessageIcon","handleDismiss","DismissButton","label","buttonTitle","onClick","SystemMessage","InfoSystemMessage","displayName","ErrorSystemMessage","WarningSystemMessage","SuccessSystemMessage"],"mappings":"mRAOA,SAASA,EACLC,~~GAyDA~~,~~MAvDoD~~,EAChDC,GAAAA,EACAC,UAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAC,cAAAA,EACAC,SAAAA,KACGC,MAEH,MAAMC,EAAWC,EAAMV,GAAM,qBAAsB,CAC/CW,gBAAiBX,IAGrB,OACIY,EAAC,MAAA,CACGR,KAAAA,KACII,EACJR,GAAIS,EACJR,UAAWY,EACP,qBACA,uBAAuBd,IACvBE,EACA,CACI,gCAAiCI,IAIzCE,SAAAO,EAAC,MAAA,CACGb,UAAU,8BACV,cAAY,~~yBACZ~~,~~aAAW,QACXc,~~MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,EAACK,EAAA,CAAYlB,QAASA,GAAW,SACjCa,EAAC,OAAA,CAAKX,UAAU,8BACXM,SAAAA,IAEJD,GAAeY,eACZN,EAACO,EAAA,CACG,~~aAAW,QACX,~~gBAAeV,EACfR,UAAU,qCACVmB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,qBAQnD,CAEO,MAAMK,EAA8C,EACvDvB,GAAAA,EACAC,UAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAN,QAAAA,EAAU,OACVO,cAAAA,EACAC,SAAAA,KACGC,MAEH,MAAMC,EAAWC,EAAMV,GAAM,qBAAsB,CAC/CW,gBAAiBX,IAGrB,OACIY,EAAC,MAAA,CACGR,KAAAA,KACII,EACJR,GAAIS,EACJR,UAAWY,EACP,qBACA,uBAAuBd,IACvBE,EACA,CACI,gCAAiCI,IAIzCE,SAAAO,EAAC,MAAA,CACGb,UAAU,8BACV,cAAY,~~yBACZ~~,~~aAAW,QACXc,~~MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,EAACK,GAAYlB,QAAAA,IACba,EAAC,OAAA,CAAKX,UAAU,8BAA+BM,SAAAA,IAC9CD,GAAeY,eACZN,EAACO,EAAA,CACG,~~aAAW,QACX,~~gBAAeV,EACfR,UAAU,qCACVmB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,sBAWlCM,EAAoB1B,EAAc,QAC/C0B,EAAkBC,YAAc,oBAIzB,MAAMC,EAAqB5B,EAAc,SAChD4B,EAAmBD,YAAc,qBAI1B,MAAME,EAAuB7B,EAAc,WAClD6B,EAAqBF,YAAc,uBAI5B,MAAMG,EAAuB9B,EAAc,WAClD8B,EAAqBH,YAAc"}
1	+ {"version":3,"file":"SystemMessage.js","sources":["../../../../src/components/system-message/SystemMessage.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { DismissButton } from \"../message/DismissButton.js\";\nimport { MessageIcon } from \"./common/MessageIcon.js\";\nimport type { SystemMessageProps } from \"./types.js\";\n\nfunction systemFactory(\n variant: SystemMessageProps[\"variant\"],\n): React.FC<SystemMessageProps> {\n const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n dismissAction,\n children,\n ...rest\n }) => {\n const systemId = useId(id \|\| \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${variant}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon variant={variant \|\| \"info\"} />\n <span className=\"jkl-system-message__message\">\n {children}\n </span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle \|\| \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n };\n return SystemMessage;\n}\n\nexport const SystemMessage: React.FC<SystemMessageProps> = ({\n id,\n className,\n maxContentWidth,\n paddingLeft,\n role = \"status\",\n dismissed,\n variant = \"info\",\n dismissAction,\n children,\n ...rest\n}) => {\n const systemId = useId(id \|\| \"jkl-system-message\", {\n generateSuffix: !id,\n });\n\n return (\n <div\n role={role}\n {...rest}\n id={systemId}\n className={clsx(\n \"jkl-system-message\",\n `jkl-system-message--${variant}`,\n className,\n {\n \"jkl-system-message--dismissed\": dismissed,\n },\n )}\n >\n <div\n className=\"jkl-system-message__content\"\n data-testid=\"system-message-content\"\n style={{\n maxWidth: maxContentWidth,\n paddingLeft,\n }}\n >\n <MessageIcon variant={variant} />\n <span className=\"jkl-system-message__message\">{children}</span>\n {dismissAction?.handleDismiss && (\n <DismissButton\n aria-controls={systemId}\n className=\"jkl-system-message__dismiss-button\"\n label={dismissAction.buttonTitle \|\| \"Lukk\"}\n onClick={dismissAction.handleDismiss}\n />\n )}\n </div>\n </div>\n );\n};\n\n/*\n @deprecated bruk {@link SystemMessage} med variant=\"info\"\n /\nexport const InfoSystemMessage = systemFactory(\"info\");\nInfoSystemMessage.displayName = \"InfoSystemMessage\";\n/\n @deprecated bruk {@link SystemMessage} med variant=\"error\"\n /\nexport const ErrorSystemMessage = systemFactory(\"error\");\nErrorSystemMessage.displayName = \"ErrorSystemMessage\";\n/\n @deprecated bruk {@link SystemMessage} med variant=\"warning\"\n /\nexport const WarningSystemMessage = systemFactory(\"warning\");\nWarningSystemMessage.displayName = \"WarningSystemMessage\";\n/\n @deprecated bruk {@link SystemMessage} med variant=\"success\"\n */\nexport const SuccessSystemMessage = systemFactory(\"success\");\nSuccessSystemMessage.displayName = \"SuccessSystemMessage\";\n"],"names":["systemFactory","variant","id","className","maxContentWidth","paddingLeft","role","dismissed","dismissAction","children","rest","systemId","useId","generateSuffix","jsx","clsx","jsxs","style","maxWidth","MessageIcon","handleDismiss","DismissButton","label","buttonTitle","onClick","SystemMessage","InfoSystemMessage","displayName","ErrorSystemMessage","WarningSystemMessage","SuccessSystemMessage"],"mappings":"mRAOA,SAASA,EACLC,GAuDA,MArDoD,EAChDC,GAAAA,EACAC,UAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAC,cAAAA,EACAC,SAAAA,KACGC,MAEH,MAAMC,EAAWC,EAAMV,GAAM,qBAAsB,CAC/CW,gBAAiBX,IAGrB,OACIY,EAAC,MAAA,CACGR,KAAAA,KACII,EACJR,GAAIS,EACJR,UAAWY,EACP,qBACA,uBAAuBd,IACvBE,EACA,CACI,gCAAiCI,IAIzCE,SAAAO,EAAC,MAAA,CACGb,UAAU,8BACV,cAAY,yBACZc,MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,EAACK,EAAA,CAAYlB,QAASA,GAAW,SACjCa,EAAC,OAAA,CAAKX,UAAU,8BACXM,SAAAA,IAEJD,GAAeY,eACZN,EAACO,EAAA,CACG,gBAAeV,EACfR,UAAU,qCACVmB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,qBAQnD,CAEO,MAAMK,EAA8C,EACvDvB,GAAAA,EACAC,UAAAA,EACAC,gBAAAA,EACAC,YAAAA,EACAC,KAAAA,EAAO,SACPC,UAAAA,EACAN,QAAAA,EAAU,OACVO,cAAAA,EACAC,SAAAA,KACGC,MAEH,MAAMC,EAAWC,EAAMV,GAAM,qBAAsB,CAC/CW,gBAAiBX,IAGrB,OACIY,EAAC,MAAA,CACGR,KAAAA,KACII,EACJR,GAAIS,EACJR,UAAWY,EACP,qBACA,uBAAuBd,IACvBE,EACA,CACI,gCAAiCI,IAIzCE,SAAAO,EAAC,MAAA,CACGb,UAAU,8BACV,cAAY,yBACZc,MAAO,CACHC,SAAUd,EACVC,YAAAA,GAGJI,SAAA,CAAAK,EAACK,GAAYlB,QAAAA,IACba,EAAC,OAAA,CAAKX,UAAU,8BAA+BM,SAAAA,IAC9CD,GAAeY,eACZN,EAACO,EAAA,CACG,gBAAeV,EACfR,UAAU,qCACVmB,MAAOd,EAAce,aAAe,OACpCC,QAAShB,EAAcY,sBAWlCM,EAAoB1B,EAAc,QAC/C0B,EAAkBC,YAAc,oBAIzB,MAAMC,EAAqB5B,EAAc,SAChD4B,EAAmBD,YAAc,qBAI1B,MAAME,EAAuB7B,EAAc,WAClD6B,EAAqBF,YAAc,uBAI5B,MAAMG,EAAuB9B,EAAc,WAClD8B,EAAqBH,YAAc"}

package/build/es/components/typography/Text.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as s}from"react/jsx-runtime";import{c as t}from"../../../clsx-BeLtu-UY.js";import{forwardRef as r}from"react";const a=r(function({as:r,className:a,size:o="m",bold:e,short:m,srOnly:i,...l},c){return s(r||"p",{className:t("jkl-text",i&&"jkl-sr-only",a),"data-text-size":o,"data-bold":e||void 0,"data-short":m||void 0,ref:c,...l})});export{a as Text};
+import{jsx as t}from"react/jsx-runtime";import{c as a}from"../../../clsx-BeLtu-UY.js";import{forwardRef as s}from"react";const r=s(function({as:s,className:r,size:e="m",bold:o,short:d,srOnly:i,center:c,subdued:m,...l},n){return t(s||"p",{className:a("jkl-text",i&&"jkl-sr-only",r),"data-text-size":e,"data-bold":o||void 0,"data-short":d||void 0,"data-center":c||void 0,"data-subdued":m||void 0,ref:n,...l})});export{r as Text};
 //# sourceMappingURL=Text.js.map

package/build/es/components/typography/Text.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Text.js","sources":["../../../../src/components/typography/Text.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { TextElement, TextProps } from \"./types.js\";\n\ntype TextComponent = <As extends TextElement = \"p\">(\n props: TextProps<As>,\n) => React.ReactElement \| null;\n\nexport const Text: TextComponent = forwardRef(function Text<\n As extends TextElement = \"p\",\n>(\n { as, className, size = \"m\", bold, short, srOnly, ...rest }: TextProps<As>,\n ref?: PolymorphicRef<As>,\n) {\n const Component = (as \|\| \"p\") as React.ElementType;\n return (\n <Component\n className={clsx(\"jkl-text\", srOnly && \"jkl-sr-only\", className)}\n data-text-size={size}\n data-bold={bold \|\| undefined}\n data-short={short \|\| undefined}\n ref={ref}\n {...rest}\n />\n );\n}) as TextComponent;\n"],"names":["Text","forwardRef","as","className","size","bold","short","srOnly","rest","ref","jsx","clsx"],"mappings":"yHASO,MAAMA,EAAsBC,EAAW,~~UAGxCC~~,GAAAA,~~EAAIC~~,UAAAA,~~EAAWC~~,KAAAA,EAAO,~~IAAKC~~,KAAAA,~~EAAMC~~,MAAAA,~~EAAOC~~,OAAAA,~~KAAWC~~,~~GACrDC~~,GAGA,OACIC,~~EAFeR~~,GAAM,IAEpB,CACGC,~~UAAWQ~~,EAAK,~~WAAYJ~~,GAAU,cAAeJ,GACrD,iBAAgBC,EAChB,YAAWC,QAAQ,EACnB,aAAYC,QAAS,~~EACrBG~~,IAAAA,KACID,GAGhB"}
1	+ {"version":3,"file":"Text.js","sources":["../../../../src/components/typography/Text.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { TextElement, TextProps } from \"./types.js\";\n\ntype TextComponent = <As extends TextElement = \"p\">(\n props: TextProps<As>,\n) => React.ReactElement \| null;\n\nexport const Text: TextComponent = forwardRef(function Text<\n As extends TextElement = \"p\",\n>(\n {\n as,\n className,\n size = \"m\",\n bold,\n short,\n srOnly,\n center,\n subdued,\n ...rest\n }: TextProps<As>,\n ref?: PolymorphicRef<As>,\n) {\n const Component = (as \|\| \"p\") as React.ElementType;\n return (\n <Component\n className={clsx(\"jkl-text\", srOnly && \"jkl-sr-only\", className)}\n data-text-size={size}\n data-bold={bold \|\| undefined}\n data-short={short \|\| undefined}\n data-center={center \|\| undefined}\n data-subdued={subdued \|\| undefined}\n ref={ref}\n {...rest}\n />\n );\n}) as TextComponent;\n"],"names":["Text","forwardRef","as","className","size","bold","short","srOnly","center","subdued","rest","ref","jsx","clsx"],"mappings":"yHASO,MAAMA,EAAsBC,EAAW,UAItCC,GAAAA,EACAC,UAAAA,EACAC,KAAAA,EAAO,IACPC,KAAAA,EACAC,MAAAA,EACAC,OAAAA,EACAC,OAAAA,EACAC,QAAAA,KACGC,GAEPC,GAGA,OACIC,EAFeV,GAAM,IAEpB,CACGC,UAAWU,EAAK,WAAYN,GAAU,cAAeJ,GACrD,iBAAgBC,EAChB,YAAWC,QAAQ,EACnB,aAAYC,QAAS,EACrB,cAAaE,QAAU,EACvB,eAAcC,QAAW,EACzBE,IAAAA,KACID,GAGhB"}

package/build/es/components/typography/Title.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as s}from"react/jsx-runtime";import{c as r}from"../../../clsx-BeLtu-UY.js";import{forwardRef as a}from"react";const t=a(function({className:a,size:t="l",as:e,srOnly:o,...m},c){return s(e||"h2",{className:r(o&&"jkl-sr-only",a),"data-text-size":t,ref:c,...m})});export{t as Title};
+import{jsx as r}from"react/jsx-runtime";import{c as s}from"../../../clsx-BeLtu-UY.js";import{forwardRef as e}from"react";const t=e(function({className:e,size:t="l",as:a,srOnly:o,center:c,...i},m){return r(a||"h2",{className:s(o&&"jkl-sr-only",e),"data-text-size":t,"data-center":c||void 0,ref:m,...i})});export{t as Title};
 //# sourceMappingURL=Title.js.map

package/build/es/components/typography/Title.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Title.js","sources":["../../../../src/components/typography/Title.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { TitleElement, TitleProps } from \"./types.js\";\n\ntype TitleComponent = <As extends TitleElement = \"h2\">(\n props: TitleProps<As>,\n) => React.ReactElement \| null;\n\nexport const Title: TitleComponent = forwardRef(function Title<\n As extends TitleElement = \"h2\",\n>(\n { className, size = \"l\", as, srOnly, ...rest }: TitleProps<As>,\n ref?: PolymorphicRef<As>,\n) {\n const Tag = (as \|\| \"h2\") as React.ElementType;\n return (\n <Tag\n className={clsx(srOnly && \"jkl-sr-only\", className)}\n data-text-size={size}\n ref={ref}\n {...rest}\n />\n );\n}) as TitleComponent;\n"],"names":["Title","forwardRef","className","size","as","srOnly","rest","ref","jsx","clsx"],"mappings":"yHASO,MAAMA,EAAwBC,EAAW,UAG1CC,UAAAA,EAAWC,KAAAA,EAAO,IAAKC,GAAAA,EAAIC,OAAAA,KAAWC,~~GACxCC~~,GAGA,OACIC,~~EAFSJ~~,GAAM,KAEd,CACGF,~~UAAWO~~,~~EAAKJ~~,GAAU,cAAeH,GACzC,iBAAgBC,~~EAChBI~~,IAAAA,KACID,GAGhB"}
1	+ {"version":3,"file":"Title.js","sources":["../../../../src/components/typography/Title.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport type { PolymorphicRef } from \"../../utilities/index.js\";\nimport type { TitleElement, TitleProps } from \"./types.js\";\n\ntype TitleComponent = <As extends TitleElement = \"h2\">(\n props: TitleProps<As>,\n) => React.ReactElement \| null;\n\nexport const Title: TitleComponent = forwardRef(function Title<\n As extends TitleElement = \"h2\",\n>(\n { className, size = \"l\", as, srOnly, center, ...rest }: TitleProps<As>,\n ref?: PolymorphicRef<As>,\n) {\n const Tag = (as \|\| \"h2\") as React.ElementType;\n return (\n <Tag\n className={clsx(srOnly && \"jkl-sr-only\", className)}\n data-text-size={size}\n data-center={center \|\| undefined}\n ref={ref}\n {...rest}\n />\n );\n}) as TitleComponent;\n"],"names":["Title","forwardRef","className","size","as","srOnly","center","rest","ref","jsx","clsx"],"mappings":"yHASO,MAAMA,EAAwBC,EAAW,UAG1CC,UAAAA,EAAWC,KAAAA,EAAO,IAAKC,GAAAA,EAAIC,OAAAA,EAAQC,OAAAA,KAAWC,GAChDC,GAGA,OACIC,EAFSL,GAAM,KAEd,CACGF,UAAWQ,EAAKL,GAAU,cAAeH,GACzC,iBAAgBC,EAChB,cAAaG,QAAU,EACvBE,IAAAA,KACID,GAGhB"}

package/build/es/components/typography/types.d.ts CHANGED Viewed

@@ -27,6 +27,18 @@ type TextOwnProps = {
      * @default false
      */
     srOnly?: boolean;
+    /**
+     * Sentrerer teksten horisontalt (text-align: center).
+     * Bruk når sentrering ikke arves fra containeren, f.eks. inne i en Flex
+     * med alignItems: center.
+     * @default false
+     */
+    center?: boolean;
+    /**
+     * Bruker dempet tekstfarge (--jkl-color-text-subdued).
+     * @default false
+     */
+    subdued?: boolean;
 };
 type TitleOwnProps = {
     /**
@@ -42,6 +54,11 @@ type TitleOwnProps = {
      * @default false
      */
     srOnly?: boolean;
+    /**
+     * Sentrerer teksten horisontalt (text-align: center).
+     * @default false
+     */
+    center?: boolean;
 };
 export type TextProps<As extends TextElement = "p"> = PolymorphicPropsWithRef<As, TextOwnProps>;
 export type TitleProps<As extends TitleElement = "h2"> = PolymorphicPropsWithRef<As, TitleOwnProps>;

package/build/es/tokens.d.ts CHANGED Viewed

@@ -201,6 +201,7 @@ declare const _default: {
             regular: string;
             display: string;
             mono: string;
+            icons: string;
         };
     };
     lineHeight: {

package/build/es/tokens.js CHANGED Viewed

@@ -1,2 +1,2 @@
-const r={color:{"@":{background:{page:"var(--jkl-color-background-page)",container:"var(--jkl-color-background-container)","container-accent":"var(--jkl-color-background-container-accent)",contrast:"var(--jkl-color-background-contrast)"},text:{default:"var(--jkl-color-text-default)",subdued:"var(--jkl-color-text-subdued)",accent:"var(--jkl-color-text-accent)","on-contrast":"var(--jkl-color-text-on-contrast)"},border:{default:"var(--jkl-color-border-default)",subdued:"var(--jkl-color-border-subdued)",strong:"var(--jkl-color-border-strong)"}},warning:{background:{page:"var(--jkl-color-warning-background-page)",container:"var(--jkl-color-warning-background-container)","container-accent":"var(--jkl-color-warning-background-container-accent)",contrast:"var(--jkl-color-warning-background-contrast)"},text:{default:"var(--jkl-color-warning-text-default)",subdued:"var(--jkl-color-warning-text-subdued)",accent:"var(--jkl-color-warning-text-accent)","on-contrast":"var(--jkl-color-warning-text-on-contrast)"},border:{default:"var(--jkl-color-warning-border-default)",subdued:"var(--jkl-color-warning-border-subdued)",strong:"var(--jkl-color-warning-border-strong)"}},success:{background:{page:"var(--jkl-color-success-background-page)",container:"var(--jkl-color-success-background-container)","container-accent":"var(--jkl-color-success-background-container-accent)",contrast:"var(--jkl-color-success-background-contrast)"},text:{default:"var(--jkl-color-success-text-default)",subdued:"var(--jkl-color-success-text-subdued)",accent:"var(--jkl-color-success-text-accent)","on-contrast":"var(--jkl-color-success-text-on-contrast)"},border:{default:"var(--jkl-color-success-border-default)",subdued:"var(--jkl-color-success-border-subdued)",strong:"var(--jkl-color-success-border-strong)"}},info:{background:{page:"var(--jkl-color-info-background-page)",container:"var(--jkl-color-info-background-container)","container-accent":"var(--jkl-color-info-background-container-accent)",contrast:"var(--jkl-color-info-background-contrast)"},text:{default:"var(--jkl-color-info-text-default)",subdued:"var(--jkl-color-info-text-subdued)",accent:"var(--jkl-color-info-text-accent)","on-contrast":"var(--jkl-color-info-text-on-contrast)"},border:{default:"var(--jkl-color-info-border-default)",subdued:"var(--jkl-color-info-border-subdued)",strong:"var(--jkl-color-info-border-strong)"}},error:{background:{page:"var(--jkl-color-error-background-page)",container:"var(--jkl-color-error-background-container)","container-accent":"var(--jkl-color-error-background-container-accent)",contrast:"var(--jkl-color-error-background-contrast)"},text:{default:"var(--jkl-color-error-text-default)",subdued:"var(--jkl-color-error-text-subdued)",accent:"var(--jkl-color-error-text-accent)","on-contrast":"var(--jkl-color-error-text-on-contrast)"},border:{default:"var(--jkl-color-error-border-default)",subdued:"var(--jkl-color-error-border-subdued)",strong:"var(--jkl-color-error-border-strong)"}}},unit:{0:"var(--jkl-unit-0)",10:"var(--jkl-unit-10)",15:"var(--jkl-unit-15)",20:"var(--jkl-unit-20)",25:"var(--jkl-unit-25)",30:"var(--jkl-unit-30)",35:"var(--jkl-unit-35)",40:"var(--jkl-unit-40)",50:"var(--jkl-unit-50)",60:"var(--jkl-unit-60)",70:"var(--jkl-unit-70)",80:"var(--jkl-unit-80)",90:"var(--jkl-unit-90)",100:"var(--jkl-unit-100)",130:"var(--jkl-unit-130)",210:"var(--jkl-unit-210)",base:"var(--jkl-unit-base)","02":"var(--jkl-unit-02)","05":"var(--jkl-unit-05)"},spacing:{0:"var(--jkl-spacing-0)",2:"var(--jkl-spacing-2)",4:"var(--jkl-spacing-4)",8:"var(--jkl-spacing-8)",12:"var(--jkl-spacing-12)",16:"var(--jkl-spacing-16)",24:"var(--jkl-spacing-24)",32:"var(--jkl-spacing-32)",40:"var(--jkl-spacing-40)",64:"var(--jkl-spacing-64)",104:"var(--jkl-spacing-104)",168:"var(--jkl-spacing-168)",none:"var(--jkl-spacing-none)","2xs":"var(--jkl-spacing-2xs)",xs:"var(--jkl-spacing-xs)",s:"var(--jkl-spacing-s)",m:"var(--jkl-spacing-m)",l:"var(--jkl-spacing-l)",xl:"var(--jkl-spacing-xl)","2xl":"var(--jkl-spacing-2xl)"},border:{width:{1:"var(--jkl-border-width-1)",2:"var(--jkl-border-width-2)",3:"var(--jkl-border-width-3)"},radius:{none:"var(--jkl-border-radius-none)",xs:"var(--jkl-border-radius-xs)",s:"var(--jkl-border-radius-s)",m:"var(--jkl-border-radius-m)",l:"var(--jkl-border-radius-l)",full:"var(--jkl-border-radius-full)"}},breakpoint:{small:"0",medium:"680px",large:"1200px",xl:"1600px"},motion:{timing:{energetic:"var(--jkl-motion-timing-energetic)",snappy:"var(--jkl-motion-timing-snappy)",productive:"var(--jkl-motion-timing-productive)",polite:"var(--jkl-motion-timing-polite)",expressive:"var(--jkl-motion-timing-expressive)",lazy:"var(--jkl-motion-timing-lazy)"},easing:{standard:"var(--jkl-motion-easing-standard)",entrance:"var(--jkl-motion-easing-entrance)",exit:"var(--jkl-motion-easing-exit)",easeInBounceOut:"var(--jkl-motion-easing-ease-in-bounce-out)",focus:"var(--jkl-motion-easing-focus)"}},font:{size:{1:"var(--jkl-font-size-1)",2:"var(--jkl-font-size-2)",3:"var(--jkl-font-size-3)",4:"var(--jkl-font-size-4)",5:"var(--jkl-font-size-5)",6:"var(--jkl-font-size-6)",7:"var(--jkl-font-size-7)",8:"var(--jkl-font-size-8)",9:"var(--jkl-font-size-9)",10:"var(--jkl-font-size-10)"},weight:{normal:"var(--jkl-font-weight-normal)",bold:"var(--jkl-font-weight-bold)"},family:{regular:"var(--jkl-font-family-regular)",display:"var(--jkl-font-family-display)",mono:"var(--jkl-font-family-mono)"}},lineHeight:{flush:"var(--jkl-line-height-flush)",tight:"var(--jkl-line-height-tight)",relaxed:"var(--jkl-line-height-relaxed)"},textStyle:{title:"var(--jkl-text-style-title)","title-small":"var(--jkl-text-style-title-small)","heading-1":"var(--jkl-text-style-heading-1)","heading-2":"var(--jkl-text-style-heading-2)","heading-3":"var(--jkl-text-style-heading-3)","heading-4":"var(--jkl-text-style-heading-4)","heading-5":"var(--jkl-text-style-heading-5)","paragraph-large":"var(--jkl-text-style-paragraph-large)","paragraph-medium":"var(--jkl-text-style-paragraph-medium)","paragraph-small":"var(--jkl-text-style-paragraph-small)","text-large":"var(--jkl-text-style-text-large)","text-medium":"var(--jkl-text-style-text-medium)","text-small":"var(--jkl-text-style-text-small)","text-micro":"var(--jkl-text-style-text-micro)"}};export{r as default};
+const r={color:{"@":{background:{page:"var(--jkl-color-background-page)",container:"var(--jkl-color-background-container)","container-accent":"var(--jkl-color-background-container-accent)",contrast:"var(--jkl-color-background-contrast)"},text:{default:"var(--jkl-color-text-default)",subdued:"var(--jkl-color-text-subdued)",accent:"var(--jkl-color-text-accent)","on-contrast":"var(--jkl-color-text-on-contrast)"},border:{default:"var(--jkl-color-border-default)",subdued:"var(--jkl-color-border-subdued)",strong:"var(--jkl-color-border-strong)"}},warning:{background:{page:"var(--jkl-color-warning-background-page)",container:"var(--jkl-color-warning-background-container)","container-accent":"var(--jkl-color-warning-background-container-accent)",contrast:"var(--jkl-color-warning-background-contrast)"},text:{default:"var(--jkl-color-warning-text-default)",subdued:"var(--jkl-color-warning-text-subdued)",accent:"var(--jkl-color-warning-text-accent)","on-contrast":"var(--jkl-color-warning-text-on-contrast)"},border:{default:"var(--jkl-color-warning-border-default)",subdued:"var(--jkl-color-warning-border-subdued)",strong:"var(--jkl-color-warning-border-strong)"}},success:{background:{page:"var(--jkl-color-success-background-page)",container:"var(--jkl-color-success-background-container)","container-accent":"var(--jkl-color-success-background-container-accent)",contrast:"var(--jkl-color-success-background-contrast)"},text:{default:"var(--jkl-color-success-text-default)",subdued:"var(--jkl-color-success-text-subdued)",accent:"var(--jkl-color-success-text-accent)","on-contrast":"var(--jkl-color-success-text-on-contrast)"},border:{default:"var(--jkl-color-success-border-default)",subdued:"var(--jkl-color-success-border-subdued)",strong:"var(--jkl-color-success-border-strong)"}},info:{background:{page:"var(--jkl-color-info-background-page)",container:"var(--jkl-color-info-background-container)","container-accent":"var(--jkl-color-info-background-container-accent)",contrast:"var(--jkl-color-info-background-contrast)"},text:{default:"var(--jkl-color-info-text-default)",subdued:"var(--jkl-color-info-text-subdued)",accent:"var(--jkl-color-info-text-accent)","on-contrast":"var(--jkl-color-info-text-on-contrast)"},border:{default:"var(--jkl-color-info-border-default)",subdued:"var(--jkl-color-info-border-subdued)",strong:"var(--jkl-color-info-border-strong)"}},error:{background:{page:"var(--jkl-color-error-background-page)",container:"var(--jkl-color-error-background-container)","container-accent":"var(--jkl-color-error-background-container-accent)",contrast:"var(--jkl-color-error-background-contrast)"},text:{default:"var(--jkl-color-error-text-default)",subdued:"var(--jkl-color-error-text-subdued)",accent:"var(--jkl-color-error-text-accent)","on-contrast":"var(--jkl-color-error-text-on-contrast)"},border:{default:"var(--jkl-color-error-border-default)",subdued:"var(--jkl-color-error-border-subdued)",strong:"var(--jkl-color-error-border-strong)"}}},unit:{0:"var(--jkl-unit-0)",10:"var(--jkl-unit-10)",15:"var(--jkl-unit-15)",20:"var(--jkl-unit-20)",25:"var(--jkl-unit-25)",30:"var(--jkl-unit-30)",35:"var(--jkl-unit-35)",40:"var(--jkl-unit-40)",50:"var(--jkl-unit-50)",60:"var(--jkl-unit-60)",70:"var(--jkl-unit-70)",80:"var(--jkl-unit-80)",90:"var(--jkl-unit-90)",100:"var(--jkl-unit-100)",130:"var(--jkl-unit-130)",210:"var(--jkl-unit-210)",base:"var(--jkl-unit-base)","02":"var(--jkl-unit-02)","05":"var(--jkl-unit-05)"},spacing:{0:"var(--jkl-spacing-0)",2:"var(--jkl-spacing-2)",4:"var(--jkl-spacing-4)",8:"var(--jkl-spacing-8)",12:"var(--jkl-spacing-12)",16:"var(--jkl-spacing-16)",24:"var(--jkl-spacing-24)",32:"var(--jkl-spacing-32)",40:"var(--jkl-spacing-40)",64:"var(--jkl-spacing-64)",104:"var(--jkl-spacing-104)",168:"var(--jkl-spacing-168)",none:"var(--jkl-spacing-none)","2xs":"var(--jkl-spacing-2xs)",xs:"var(--jkl-spacing-xs)",s:"var(--jkl-spacing-s)",m:"var(--jkl-spacing-m)",l:"var(--jkl-spacing-l)",xl:"var(--jkl-spacing-xl)","2xl":"var(--jkl-spacing-2xl)"},border:{width:{1:"var(--jkl-border-width-1)",2:"var(--jkl-border-width-2)",3:"var(--jkl-border-width-3)"},radius:{none:"var(--jkl-border-radius-none)",xs:"var(--jkl-border-radius-xs)",s:"var(--jkl-border-radius-s)",m:"var(--jkl-border-radius-m)",l:"var(--jkl-border-radius-l)",full:"var(--jkl-border-radius-full)"}},breakpoint:{small:"0",medium:"680px",large:"1200px",xl:"1600px"},motion:{timing:{energetic:"var(--jkl-motion-timing-energetic)",snappy:"var(--jkl-motion-timing-snappy)",productive:"var(--jkl-motion-timing-productive)",polite:"var(--jkl-motion-timing-polite)",expressive:"var(--jkl-motion-timing-expressive)",lazy:"var(--jkl-motion-timing-lazy)"},easing:{standard:"var(--jkl-motion-easing-standard)",entrance:"var(--jkl-motion-easing-entrance)",exit:"var(--jkl-motion-easing-exit)",easeInBounceOut:"var(--jkl-motion-easing-ease-in-bounce-out)",focus:"var(--jkl-motion-easing-focus)"}},font:{size:{1:"var(--jkl-font-size-1)",2:"var(--jkl-font-size-2)",3:"var(--jkl-font-size-3)",4:"var(--jkl-font-size-4)",5:"var(--jkl-font-size-5)",6:"var(--jkl-font-size-6)",7:"var(--jkl-font-size-7)",8:"var(--jkl-font-size-8)",9:"var(--jkl-font-size-9)",10:"var(--jkl-font-size-10)"},weight:{normal:"var(--jkl-font-weight-normal)",bold:"var(--jkl-font-weight-bold)"},family:{regular:"var(--jkl-font-family-regular)",display:"var(--jkl-font-family-display)",mono:"var(--jkl-font-family-mono)",icons:"var(--jkl-font-family-icons)"}},lineHeight:{flush:"var(--jkl-line-height-flush)",tight:"var(--jkl-line-height-tight)",relaxed:"var(--jkl-line-height-relaxed)"},textStyle:{title:"var(--jkl-text-style-title)","title-small":"var(--jkl-text-style-title-small)","heading-1":"var(--jkl-text-style-heading-1)","heading-2":"var(--jkl-text-style-heading-2)","heading-3":"var(--jkl-text-style-heading-3)","heading-4":"var(--jkl-text-style-heading-4)","heading-5":"var(--jkl-text-style-heading-5)","paragraph-large":"var(--jkl-text-style-paragraph-large)","paragraph-medium":"var(--jkl-text-style-paragraph-medium)","paragraph-small":"var(--jkl-text-style-paragraph-small)","text-large":"var(--jkl-text-style-text-large)","text-medium":"var(--jkl-text-style-text-medium)","text-small":"var(--jkl-text-style-text-small)","text-micro":"var(--jkl-text-style-text-micro)"}};export{r as default};
 //# sourceMappingURL=tokens.js.map

package/build/es/tokens.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tokens.js","sources":["../../src/tokens.ts"],"sourcesContent":["/*\n Do not edit directly, this file was auto-generated.\n */\n\nexport default {\n color: {\n \"@\": {\n background: {\n page: \"var(--jkl-color-background-page)\",\n container: \"var(--jkl-color-background-container)\",\n \"container-accent\": \"var(--jkl-color-background-container-accent)\",\n contrast: \"var(--jkl-color-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-text-default)\",\n subdued: \"var(--jkl-color-text-subdued)\",\n accent: \"var(--jkl-color-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-border-default)\",\n subdued: \"var(--jkl-color-border-subdued)\",\n strong: \"var(--jkl-color-border-strong)\",\n },\n },\n warning: {\n background: {\n page: \"var(--jkl-color-warning-background-page)\",\n container: \"var(--jkl-color-warning-background-container)\",\n \"container-accent\":\n \"var(--jkl-color-warning-background-container-accent)\",\n contrast: \"var(--jkl-color-warning-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-warning-text-default)\",\n subdued: \"var(--jkl-color-warning-text-subdued)\",\n accent: \"var(--jkl-color-warning-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-warning-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-warning-border-default)\",\n subdued: \"var(--jkl-color-warning-border-subdued)\",\n strong: \"var(--jkl-color-warning-border-strong)\",\n },\n },\n success: {\n background: {\n page: \"var(--jkl-color-success-background-page)\",\n container: \"var(--jkl-color-success-background-container)\",\n \"container-accent\":\n \"var(--jkl-color-success-background-container-accent)\",\n contrast: \"var(--jkl-color-success-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-success-text-default)\",\n subdued: \"var(--jkl-color-success-text-subdued)\",\n accent: \"var(--jkl-color-success-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-success-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-success-border-default)\",\n subdued: \"var(--jkl-color-success-border-subdued)\",\n strong: \"var(--jkl-color-success-border-strong)\",\n },\n },\n info: {\n background: {\n page: \"var(--jkl-color-info-background-page)\",\n container: \"var(--jkl-color-info-background-container)\",\n \"container-accent\": \"var(--jkl-color-info-background-container-accent)\",\n contrast: \"var(--jkl-color-info-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-info-text-default)\",\n subdued: \"var(--jkl-color-info-text-subdued)\",\n accent: \"var(--jkl-color-info-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-info-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-info-border-default)\",\n subdued: \"var(--jkl-color-info-border-subdued)\",\n strong: \"var(--jkl-color-info-border-strong)\",\n },\n },\n error: {\n background: {\n page: \"var(--jkl-color-error-background-page)\",\n container: \"var(--jkl-color-error-background-container)\",\n \"container-accent\":\n \"var(--jkl-color-error-background-container-accent)\",\n contrast: \"var(--jkl-color-error-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-error-text-default)\",\n subdued: \"var(--jkl-color-error-text-subdued)\",\n accent: \"var(--jkl-color-error-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-error-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-error-border-default)\",\n subdued: \"var(--jkl-color-error-border-subdued)\",\n strong: \"var(--jkl-color-error-border-strong)\",\n },\n },\n },\n unit: {\n 0: \"var(--jkl-unit-0)\",\n 10: \"var(--jkl-unit-10)\",\n 15: \"var(--jkl-unit-15)\",\n 20: \"var(--jkl-unit-20)\",\n 25: \"var(--jkl-unit-25)\",\n 30: \"var(--jkl-unit-30)\",\n 35: \"var(--jkl-unit-35)\",\n 40: \"var(--jkl-unit-40)\",\n 50: \"var(--jkl-unit-50)\",\n 60: \"var(--jkl-unit-60)\",\n 70: \"var(--jkl-unit-70)\",\n 80: \"var(--jkl-unit-80)\",\n 90: \"var(--jkl-unit-90)\",\n 100: \"var(--jkl-unit-100)\",\n 130: \"var(--jkl-unit-130)\",\n 210: \"var(--jkl-unit-210)\",\n base: \"var(--jkl-unit-base)\",\n \"02\": \"var(--jkl-unit-02)\",\n \"05\": \"var(--jkl-unit-05)\",\n },\n spacing: {\n 0: \"var(--jkl-spacing-0)\",\n 2: \"var(--jkl-spacing-2)\",\n 4: \"var(--jkl-spacing-4)\",\n 8: \"var(--jkl-spacing-8)\",\n 12: \"var(--jkl-spacing-12)\",\n 16: \"var(--jkl-spacing-16)\",\n 24: \"var(--jkl-spacing-24)\",\n 32: \"var(--jkl-spacing-32)\",\n 40: \"var(--jkl-spacing-40)\",\n 64: \"var(--jkl-spacing-64)\",\n 104: \"var(--jkl-spacing-104)\",\n 168: \"var(--jkl-spacing-168)\",\n none: \"var(--jkl-spacing-none)\",\n \"2xs\": \"var(--jkl-spacing-2xs)\",\n xs: \"var(--jkl-spacing-xs)\",\n s: \"var(--jkl-spacing-s)\",\n m: \"var(--jkl-spacing-m)\",\n l: \"var(--jkl-spacing-l)\",\n xl: \"var(--jkl-spacing-xl)\",\n \"2xl\": \"var(--jkl-spacing-2xl)\",\n },\n border: {\n width: {\n 1: \"var(--jkl-border-width-1)\",\n 2: \"var(--jkl-border-width-2)\",\n 3: \"var(--jkl-border-width-3)\",\n },\n radius: {\n none: \"var(--jkl-border-radius-none)\",\n xs: \"var(--jkl-border-radius-xs)\",\n s: \"var(--jkl-border-radius-s)\",\n m: \"var(--jkl-border-radius-m)\",\n l: \"var(--jkl-border-radius-l)\",\n full: \"var(--jkl-border-radius-full)\",\n },\n },\n breakpoint: {\n small: \"0\",\n medium: \"680px\",\n large: \"1200px\",\n xl: \"1600px\",\n },\n motion: {\n timing: {\n energetic: \"var(--jkl-motion-timing-energetic)\",\n snappy: \"var(--jkl-motion-timing-snappy)\",\n productive: \"var(--jkl-motion-timing-productive)\",\n polite: \"var(--jkl-motion-timing-polite)\",\n expressive: \"var(--jkl-motion-timing-expressive)\",\n lazy: \"var(--jkl-motion-timing-lazy)\",\n },\n easing: {\n standard: \"var(--jkl-motion-easing-standard)\",\n entrance: \"var(--jkl-motion-easing-entrance)\",\n exit: \"var(--jkl-motion-easing-exit)\",\n easeInBounceOut: \"var(--jkl-motion-easing-ease-in-bounce-out)\",\n focus: \"var(--jkl-motion-easing-focus)\",\n },\n },\n font: {\n size: {\n 1: \"var(--jkl-font-size-1)\",\n 2: \"var(--jkl-font-size-2)\",\n 3: \"var(--jkl-font-size-3)\",\n 4: \"var(--jkl-font-size-4)\",\n 5: \"var(--jkl-font-size-5)\",\n 6: \"var(--jkl-font-size-6)\",\n 7: \"var(--jkl-font-size-7)\",\n 8: \"var(--jkl-font-size-8)\",\n 9: \"var(--jkl-font-size-9)\",\n 10: \"var(--jkl-font-size-10)\",\n },\n weight: {\n normal: \"var(--jkl-font-weight-normal)\",\n bold: \"var(--jkl-font-weight-bold)\",\n },\n family: {\n regular: \"var(--jkl-font-family-regular)\",\n display: \"var(--jkl-font-family-display)\",\n mono: \"var(--jkl-font-family-mono)\",\n },\n },\n lineHeight: {\n flush: \"var(--jkl-line-height-flush)\",\n tight: \"var(--jkl-line-height-tight)\",\n relaxed: \"var(--jkl-line-height-relaxed)\",\n },\n textStyle: {\n title: \"var(--jkl-text-style-title)\",\n \"title-small\": \"var(--jkl-text-style-title-small)\",\n \"heading-1\": \"var(--jkl-text-style-heading-1)\",\n \"heading-2\": \"var(--jkl-text-style-heading-2)\",\n \"heading-3\": \"var(--jkl-text-style-heading-3)\",\n \"heading-4\": \"var(--jkl-text-style-heading-4)\",\n \"heading-5\": \"var(--jkl-text-style-heading-5)\",\n \"paragraph-large\": \"var(--jkl-text-style-paragraph-large)\",\n \"paragraph-medium\": \"var(--jkl-text-style-paragraph-medium)\",\n \"paragraph-small\": \"var(--jkl-text-style-paragraph-small)\",\n \"text-large\": \"var(--jkl-text-style-text-large)\",\n \"text-medium\": \"var(--jkl-text-style-text-medium)\",\n \"text-small\": \"var(--jkl-text-style-text-small)\",\n \"text-micro\": \"var(--jkl-text-style-text-micro)\",\n },\n};\n"],"names":["tokens","color","background","page","container","contrast","text","default","subdued","accent","border","strong","warning","success","info","error","unit","base","spacing","none","xs","s","m","l","xl","width","radius","full","breakpoint","small","medium","large","motion","timing","energetic","snappy","productive","polite","expressive","lazy","easing","standard","entrance","exit","easeInBounceOut","focus","font","size","weight","normal","bold","family","regular","display","mono","lineHeight","flush","tight","relaxed","textStyle","title"],"mappings":"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"}
1	+ {"version":3,"file":"tokens.js","sources":["../../src/tokens.ts"],"sourcesContent":["/*\n Do not edit directly, this file was auto-generated.\n */\n\nexport default {\n color: {\n \"@\": {\n background: {\n page: \"var(--jkl-color-background-page)\",\n container: \"var(--jkl-color-background-container)\",\n \"container-accent\": \"var(--jkl-color-background-container-accent)\",\n contrast: \"var(--jkl-color-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-text-default)\",\n subdued: \"var(--jkl-color-text-subdued)\",\n accent: \"var(--jkl-color-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-border-default)\",\n subdued: \"var(--jkl-color-border-subdued)\",\n strong: \"var(--jkl-color-border-strong)\",\n },\n },\n warning: {\n background: {\n page: \"var(--jkl-color-warning-background-page)\",\n container: \"var(--jkl-color-warning-background-container)\",\n \"container-accent\":\n \"var(--jkl-color-warning-background-container-accent)\",\n contrast: \"var(--jkl-color-warning-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-warning-text-default)\",\n subdued: \"var(--jkl-color-warning-text-subdued)\",\n accent: \"var(--jkl-color-warning-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-warning-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-warning-border-default)\",\n subdued: \"var(--jkl-color-warning-border-subdued)\",\n strong: \"var(--jkl-color-warning-border-strong)\",\n },\n },\n success: {\n background: {\n page: \"var(--jkl-color-success-background-page)\",\n container: \"var(--jkl-color-success-background-container)\",\n \"container-accent\":\n \"var(--jkl-color-success-background-container-accent)\",\n contrast: \"var(--jkl-color-success-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-success-text-default)\",\n subdued: \"var(--jkl-color-success-text-subdued)\",\n accent: \"var(--jkl-color-success-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-success-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-success-border-default)\",\n subdued: \"var(--jkl-color-success-border-subdued)\",\n strong: \"var(--jkl-color-success-border-strong)\",\n },\n },\n info: {\n background: {\n page: \"var(--jkl-color-info-background-page)\",\n container: \"var(--jkl-color-info-background-container)\",\n \"container-accent\": \"var(--jkl-color-info-background-container-accent)\",\n contrast: \"var(--jkl-color-info-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-info-text-default)\",\n subdued: \"var(--jkl-color-info-text-subdued)\",\n accent: \"var(--jkl-color-info-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-info-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-info-border-default)\",\n subdued: \"var(--jkl-color-info-border-subdued)\",\n strong: \"var(--jkl-color-info-border-strong)\",\n },\n },\n error: {\n background: {\n page: \"var(--jkl-color-error-background-page)\",\n container: \"var(--jkl-color-error-background-container)\",\n \"container-accent\":\n \"var(--jkl-color-error-background-container-accent)\",\n contrast: \"var(--jkl-color-error-background-contrast)\",\n },\n text: {\n default: \"var(--jkl-color-error-text-default)\",\n subdued: \"var(--jkl-color-error-text-subdued)\",\n accent: \"var(--jkl-color-error-text-accent)\",\n \"on-contrast\": \"var(--jkl-color-error-text-on-contrast)\",\n },\n border: {\n default: \"var(--jkl-color-error-border-default)\",\n subdued: \"var(--jkl-color-error-border-subdued)\",\n strong: \"var(--jkl-color-error-border-strong)\",\n },\n },\n },\n unit: {\n 0: \"var(--jkl-unit-0)\",\n 10: \"var(--jkl-unit-10)\",\n 15: \"var(--jkl-unit-15)\",\n 20: \"var(--jkl-unit-20)\",\n 25: \"var(--jkl-unit-25)\",\n 30: \"var(--jkl-unit-30)\",\n 35: \"var(--jkl-unit-35)\",\n 40: \"var(--jkl-unit-40)\",\n 50: \"var(--jkl-unit-50)\",\n 60: \"var(--jkl-unit-60)\",\n 70: \"var(--jkl-unit-70)\",\n 80: \"var(--jkl-unit-80)\",\n 90: \"var(--jkl-unit-90)\",\n 100: \"var(--jkl-unit-100)\",\n 130: \"var(--jkl-unit-130)\",\n 210: \"var(--jkl-unit-210)\",\n base: \"var(--jkl-unit-base)\",\n \"02\": \"var(--jkl-unit-02)\",\n \"05\": \"var(--jkl-unit-05)\",\n },\n spacing: {\n 0: \"var(--jkl-spacing-0)\",\n 2: \"var(--jkl-spacing-2)\",\n 4: \"var(--jkl-spacing-4)\",\n 8: \"var(--jkl-spacing-8)\",\n 12: \"var(--jkl-spacing-12)\",\n 16: \"var(--jkl-spacing-16)\",\n 24: \"var(--jkl-spacing-24)\",\n 32: \"var(--jkl-spacing-32)\",\n 40: \"var(--jkl-spacing-40)\",\n 64: \"var(--jkl-spacing-64)\",\n 104: \"var(--jkl-spacing-104)\",\n 168: \"var(--jkl-spacing-168)\",\n none: \"var(--jkl-spacing-none)\",\n \"2xs\": \"var(--jkl-spacing-2xs)\",\n xs: \"var(--jkl-spacing-xs)\",\n s: \"var(--jkl-spacing-s)\",\n m: \"var(--jkl-spacing-m)\",\n l: \"var(--jkl-spacing-l)\",\n xl: \"var(--jkl-spacing-xl)\",\n \"2xl\": \"var(--jkl-spacing-2xl)\",\n },\n border: {\n width: {\n 1: \"var(--jkl-border-width-1)\",\n 2: \"var(--jkl-border-width-2)\",\n 3: \"var(--jkl-border-width-3)\",\n },\n radius: {\n none: \"var(--jkl-border-radius-none)\",\n xs: \"var(--jkl-border-radius-xs)\",\n s: \"var(--jkl-border-radius-s)\",\n m: \"var(--jkl-border-radius-m)\",\n l: \"var(--jkl-border-radius-l)\",\n full: \"var(--jkl-border-radius-full)\",\n },\n },\n breakpoint: {\n small: \"0\",\n medium: \"680px\",\n large: \"1200px\",\n xl: \"1600px\",\n },\n motion: {\n timing: {\n energetic: \"var(--jkl-motion-timing-energetic)\",\n snappy: \"var(--jkl-motion-timing-snappy)\",\n productive: \"var(--jkl-motion-timing-productive)\",\n polite: \"var(--jkl-motion-timing-polite)\",\n expressive: \"var(--jkl-motion-timing-expressive)\",\n lazy: \"var(--jkl-motion-timing-lazy)\",\n },\n easing: {\n standard: \"var(--jkl-motion-easing-standard)\",\n entrance: \"var(--jkl-motion-easing-entrance)\",\n exit: \"var(--jkl-motion-easing-exit)\",\n easeInBounceOut: \"var(--jkl-motion-easing-ease-in-bounce-out)\",\n focus: \"var(--jkl-motion-easing-focus)\",\n },\n },\n font: {\n size: {\n 1: \"var(--jkl-font-size-1)\",\n 2: \"var(--jkl-font-size-2)\",\n 3: \"var(--jkl-font-size-3)\",\n 4: \"var(--jkl-font-size-4)\",\n 5: \"var(--jkl-font-size-5)\",\n 6: \"var(--jkl-font-size-6)\",\n 7: \"var(--jkl-font-size-7)\",\n 8: \"var(--jkl-font-size-8)\",\n 9: \"var(--jkl-font-size-9)\",\n 10: \"var(--jkl-font-size-10)\",\n },\n weight: {\n normal: \"var(--jkl-font-weight-normal)\",\n bold: \"var(--jkl-font-weight-bold)\",\n },\n family: {\n regular: \"var(--jkl-font-family-regular)\",\n display: \"var(--jkl-font-family-display)\",\n mono: \"var(--jkl-font-family-mono)\",\n icons: \"var(--jkl-font-family-icons)\",\n },\n },\n lineHeight: {\n flush: \"var(--jkl-line-height-flush)\",\n tight: \"var(--jkl-line-height-tight)\",\n relaxed: \"var(--jkl-line-height-relaxed)\",\n },\n textStyle: {\n title: \"var(--jkl-text-style-title)\",\n \"title-small\": \"var(--jkl-text-style-title-small)\",\n \"heading-1\": \"var(--jkl-text-style-heading-1)\",\n \"heading-2\": \"var(--jkl-text-style-heading-2)\",\n \"heading-3\": \"var(--jkl-text-style-heading-3)\",\n \"heading-4\": \"var(--jkl-text-style-heading-4)\",\n \"heading-5\": \"var(--jkl-text-style-heading-5)\",\n \"paragraph-large\": \"var(--jkl-text-style-paragraph-large)\",\n \"paragraph-medium\": \"var(--jkl-text-style-paragraph-medium)\",\n \"paragraph-small\": \"var(--jkl-text-style-paragraph-small)\",\n \"text-large\": \"var(--jkl-text-style-text-large)\",\n \"text-medium\": \"var(--jkl-text-style-text-medium)\",\n \"text-small\": \"var(--jkl-text-style-text-small)\",\n \"text-micro\": \"var(--jkl-text-style-text-micro)\",\n },\n};\n"],"names":["tokens","color","background","page","container","contrast","text","default","subdued","accent","border","strong","warning","success","info","error","unit","base","spacing","none","xs","s","m","l","xl","width","radius","full","breakpoint","small","medium","large","motion","timing","energetic","snappy","productive","polite","expressive","lazy","easing","standard","entrance","exit","easeInBounceOut","focus","font","size","weight","normal","bold","family","regular","display","mono","icons","lineHeight","flush","tight","relaxed","textStyle","title"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fremtind/jokul",
-  "version": "5.0.5",
+  "version": "5.1.0",
   "type": "module",
   "engines": {
     "node": "^20.19.0 || >=22.12.0"
@@ -116,7 +116,7 @@
     "tsx": "^4.20.6",
     "vite": "^7.3.2",
     "vite-plugin-dts": "^4.5.4",
-    "vitest": "^3.2.4",
+    "vitest": "^4.1.0",
     "vitest-axe": "^0.1.0"
   },
   "peerDependencies": {

package/styles/base.css CHANGED Viewed

@@ -274,13 +274,6 @@
     font-style: normal;
     src: url("/fonts/InterVariable.woff2") format("woff2");
   }
-  @font-face {
-    font-family: "Jokul Mono";
-    font-display: fallback;
-    font-weight: 400;
-    font-style: normal;
-    src: url("/fonts/InterVariable.woff2") format("woff2");
-  }
   @font-face {
     font-family: "Jokul Icons";
     font-weight: 300 400;
@@ -627,7 +620,8 @@
     --jkl-font-weight-bold: 530;
     --jkl-font-family-regular: "Jokul", "Adjusted Arial Fallback", arial, sans-serif;
     --jkl-font-family-display: "Jokul Display", "Adjusted Arial Display Fallback", arial, sans-serif;
-    --jkl-font-family-mono: "Jokul Mono", "Adjusted Courier New Fallback", -apple-system, blinkmacsystemfont, monospace;
+    --jkl-font-family-mono: monospace;
+    --jkl-font-family-icons: "Jokul Icons", "Jokul Icons Fallback", monospace;
     --jkl-line-height-flush: 1;
     --jkl-line-height-tight: 1.3;
     --jkl-line-height-relaxed: 1.6;