@mattilsynet/design 2.2.24 → 2.2.26

package/mtds/field/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","sources":["../../designsystem/field/field.tsx"],"sourcesContent":["\"use client\";\nimport type { Placement } from \"@floating-ui/dom\";\nimport type {\n\tReactUcombobox,\n\tUHTMLComboboxElement,\n} from \"@u-elements/u-combobox\";\nimport clsx from \"clsx\";\nimport type { JSX } from \"react\";\nimport { forwardRef, useEffect, useImperativeHandle, useRef } from \"react\";\nimport { HelpText } from \"../helptext/helptext\";\nimport { Input, type InputProps } from \"../input/input\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\nimport { toCustomElementProps } from \"../utils\";\nimport { Validation } from \"../validation/validation\";\n\ntype FieldBaseProps = {\n\t\"data-validation\"?: \"form\" | \"false\" | false;\n\tcount?: number;\n\tdescription?: React.ReactNode;\n\terror?: React.ReactNode; // Kept for backwards compatibility\n\thelpText?: React.ReactNode;\n\thelpTextLabel?: string;\n\tlabel?: React.ReactNode;\n\toptions?: string[] | FieldComboboxSelected;\n\tprefix?: string;\n\treadOnly?: boolean; // Allow readoOnly also on <select>\n\tsuffix?: string;\n\tvalidation?: React.ReactNode;\n};\n\nexport type FieldProps<As extends React.ElementType = \"div\"> =\n\tPolymorphicComponentPropWithRef<As, FieldBaseProps>;\n\ntype FieldComponent = <As extends React.ElementType = \"div\">(\n\tprops: FieldProps<As>,\n) => JSX.Element;\n\nconst toOption = (\n\to: FieldComboboxSelected[number] | string,\n): FieldComboboxSelected[number] =>\n\ttypeof o === \"string\" ? { label: o, value: o } : o;\n\nexport const FieldComp: FieldComponent = forwardRef<null>(function Field<\n\tAs extends React.ElementType = \"div\",\n>(\n\t{\n\t\t\"data-size\": size,\n\t\t\"data-validation\": validationType,\n\t\tas,\n\t\tclassName,\n\t\tcount,\n\t\tdescription,\n\t\terror,\n\t\thelpText,\n\t\thelpTextLabel,\n\t\tlabel,\n\t\tprefix,\n\t\tstyle,\n\t\tsuffix,\n\t\tvalidation: validationContent,\n\t\t...rest\n\t}: FieldProps<As>,\n\tref?: PolymorphicRef<As>,\n) {\n\tconst Tag = as || \"div\";\n\tconst affixes = !!suffix || !!prefix;\n\tconst validation = validationContent || error; // error kept for backwards compatibility\n\tconst shared = {\n\t\t\"data-size\": size,\n\t\t\"data-validation\": validationType,\n\t\tclassName: clsx(styles.field, className),\n\t\tstyle,\n\t};\n\n\t// Render options if select\n\tif (as === \"select\" && !rest.children)\n\t\tObject.assign(rest, {\n\t\t\toptions: undefined, // Ensure options is not passed to DOM\n\t\t\tchildren: (\n\t\t\t\t<>\n\t\t\t\t\t{(rest.options as FieldBaseProps[\"options\"])\n\t\t\t\t\t\t?.map(toOption)\n\t\t\t\t\t\t.map(({ label, value }) => (\n\t\t\t\t\t\t\t<option key={value} value={value}>\n\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t))}\n\t\t\t\t</>\n\t\t\t),\n\t\t});\n\n\t// Using suppressHydrationWarning to avoid Next.js vs field-observer.ts hydration conflict\n\treturn as ? (\n\t\t<div {...shared}>\n\t\t\t{!!label && <label suppressHydrationWarning>{label}</label>}\n\t\t\t{!!helpText && <HelpText aria-label={helpTextLabel}>{helpText}</HelpText>}\n\t\t\t{!!description && <p suppressHydrationWarning>{description}</p>}\n\t\t\t{affixes ? (\n\t\t\t\t<FieldAffixes>\n\t\t\t\t\t{!!prefix && <span>{prefix}</span>}\n\t\t\t\t\t<Tag\n\t\t\t\t\t\tclassName={styles.input}\n\t\t\t\t\t\tsuppressHydrationWarning\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t{...rest}\n\t\t\t\t\t/>\n\t\t\t\t\t{!!suffix && <span>{suffix}</span>}\n\t\t\t\t</FieldAffixes>\n\t\t\t) : (\n\t\t\t\t<Tag\n\t\t\t\t\tclassName={typeof as === \"string\" ? styles.input : undefined}\n\t\t\t\t\tsuppressHydrationWarning\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{!!validation && (\n\t\t\t\t<Validation hidden={validationType === \"form\"}>{validation}</Validation>\n\t\t\t)}\n\t\t\t{!!count && <p suppressHydrationWarning data-count={count} />}\n\t\t</div>\n\t) : (\n\t\t<div ref={ref} {...shared} {...rest} />\n\t);\n}) as FieldComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n\nexport type FieldAffixProps = React.ComponentPropsWithoutRef<\"div\">;\nconst FieldAffixes = forwardRef<HTMLDivElement, FieldAffixProps>(\n\tfunction FieldAffixes({ className, ...rest }, ref) {\n\t\treturn (\n\t\t\t<div className={clsx(styles.affixes, className)} ref={ref} {...rest} />\n\t\t);\n\t},\n);\n\nexport type FieldDatalistProps = React.ComponentPropsWithoutRef<\"datalist\"> & {\n\t\"data-nofilter\"?: boolean;\n\t\"data-position\"?: Placement;\n};\n\nconst FieldDatalist = forwardRef<HTMLDataListElement, FieldDatalistProps>(\n\tfunction FieldDatalist({ \"data-nofilter\": filter, ...rest }, ref) {\n\t\treturn (\n\t\t\t<u-datalist\n\t\t\t\tdata-nofilter={!!filter || undefined} // Ensure data-nofilter is set correctly\n\t\t\t\tref={ref}\n\t\t\t\t{...toCustomElementProps(rest)}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nexport type FieldOptionProps = React.ComponentPropsWithoutRef<\"option\">;\nconst FieldOption = forwardRef<HTMLOptionElement, FieldOptionProps>(\n\tfunction FieldOption(props, ref) {\n\t\treturn <u-option ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport type FieldComboboxSelected = {\n\tlabel: string;\n\tvalue: string;\n\tchildren?: React.ReactNode;\n}[];\nexport type FieldComboboxProps = Omit<\n\tReactUcombobox,\n\t\"onChange\" | \"onInput\"\n> & {\n\t\"data-creatable\"?: boolean;\n\t\"data-multiple\"?: boolean;\n\tonAfterChange?: (e: CustomEvent<HTMLDataElement>) => void; // deprecated\n\tonAfterSelect?: (e: CustomEvent<HTMLDataElement>) => void; // Custom event to handle before change\n\tonBeforeChange?: (e: CustomEvent<HTMLDataElement>) => void; // deprecated\n\tonBeforeMatch?: (e: CustomEvent<HTMLOptionElement>) => void; // Custom event to handle before change\n\tonBeforeSelect?: (e: CustomEvent<HTMLDataElement>) => void; // Custom event to handle before change\n\tonSelectedChange?: (selected: FieldComboboxSelected) => void; // Allow onChange to be a function that returns void\n\toptions?: FieldComboboxSelected;\n\tselected?: FieldComboboxSelected; // Allow value to be a string or an array of strings for multiple select\n} & Pick<\n\t\tInputProps,\n\t\t| \"disabled\"\n\t\t| \"name\"\n\t\t| \"onChange\"\n\t\t| \"onInput\"\n\t\t| \"placeholder\"\n\t\t| \"readOnly\"\n\t\t| \"type\"\n\t\t| \"value\"\n\t> & // Allow input props to be passed down\n\tPick<FieldDatalistProps, \"data-position\" | \"data-nofilter\">; // Allow datalist props to be passed down\n\nconst FieldCombobox = forwardRef<UHTMLComboboxElement, FieldComboboxProps>(\n\tfunction FieldCombobox(\n\t\t{\n\t\t\t\"aria-required\": required,\n\t\t\t\"data-position\": position,\n\t\t\t\"data-nofilter\": nofilter,\n\t\t\t\"data-multiple\": multiple,\n\t\t\tonAfterChange,\n\t\t\tonAfterSelect,\n\t\t\tonBeforeChange,\n\t\t\tonBeforeMatch,\n\t\t\tonBeforeSelect,\n\t\t\tonSelectedChange,\n\t\t\tchildren,\n\t\t\tdisabled,\n\t\t\tname,\n\t\t\toptions,\n\t\t\tplaceholder,\n\t\t\treadOnly,\n\t\t\tselected,\n\t\t\ttype,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst innerRef = useRef<UHTMLComboboxElement>(null);\n\t\tconst onSelected = useRef(onSelectedChange);\n\t\tonSelected.current = onSelectedChange; // Sync the latest onSelectedChange function\n\n\t\t// Deprecated props\n\t\tif (onAfterChange) {\n\t\t\tonAfterSelect = onAfterChange;\n\t\t\tconsole.warn(\n\t\t\t\t`Combobox onAfterChange is deprecated, use onAfterSelect instead.`,\n\t\t\t);\n\t\t}\n\t\tif (onBeforeChange) {\n\t\t\tonBeforeSelect = onBeforeChange;\n\t\t\tconsole.warn(\n\t\t\t\t`Combobox onBeforeChange is deprecated, use onBeforeSelect instead.`,\n\t\t\t);\n\t\t}\n\n\t\t// Using useEffect for React 18 and lower compatibility\n\t\tuseImperativeHandle(ref, () => innerRef.current as UHTMLComboboxElement); // Forward innerRef\n\t\tuseEffect(() => {\n\t\t\tconst self = innerRef.current;\n\t\t\tconst handleChange = (event: CustomEvent<HTMLDataElement>) => {\n\t\t\t\tconst handleSelected = onSelected.current;\n\t\t\t\tif (!onSelected) return; // No onSelectedChange function provided, let u-combobox handle it\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst { isConnected: remove, textContent, value } = event.detail;\n\t\t\t\tconst label = textContent?.trim() || \"\";\n\t\t\t\tconst prev = selected || [];\n\n\t\t\t\tif (remove) handleSelected?.(prev.filter((i) => i.value !== value));\n\t\t\t\telse if (multiple) handleSelected?.([...prev, { value, label }]);\n\t\t\t\telse handleSelected?.([{ value, label }]);\n\t\t\t};\n\n\t\t\tself?.addEventListener(\"comboboxbeforeselect\", handleChange);\n\t\t\treturn () =>\n\t\t\t\tself?.removeEventListener(\"comboboxbeforeselect\", handleChange);\n\t\t}, [multiple, selected]);\n\n\t\treturn (\n\t\t\t<u-combobox\n\t\t\t\tdata-multiple={multiple || undefined}\n\t\t\t\t{...toCustomElementProps({\n\t\t\t\t\toncomboboxbeforeselect: onBeforeSelect,\n\t\t\t\t\toncomboboxbeforematch: onBeforeMatch,\n\t\t\t\t\toncomboboxafterselect: onAfterSelect,\n\t\t\t\t\tref: innerRef,\n\t\t\t\t\t...props,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{selected?.map(({ children, label, value }) => (\n\t\t\t\t\t<data key={value} value={value} suppressHydrationWarning>\n\t\t\t\t\t\t{children ?? label}\n\t\t\t\t\t</data>\n\t\t\t\t))}\n\t\t\t\t{children || (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\taria-required={required}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<del {...toCustomElementProps({ \"aria-label\": \"Fjern tekst\" })} />\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{!!options && (\n\t\t\t\t\t<FieldDatalist data-nofilter={nofilter} data-position={position}>\n\t\t\t\t\t\t{options.map(toOption).map(({ children, label, value }) => (\n\t\t\t\t\t\t\t<FieldOption key={value} value={value} label={label}>\n\t\t\t\t\t\t\t\t{children ?? label}\n\t\t\t\t\t\t\t</FieldOption>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</FieldDatalist>\n\t\t\t\t)}\n\t\t\t</u-combobox>\n\t\t);\n\t},\n);\n\nexport type FieldLabelProps = React.ComponentPropsWithoutRef<\"label\">;\nexport const Field = Object.assign(FieldComp, {\n\tAffixes: FieldAffixes,\n\tCombobox: FieldCombobox,\n\tDatalist: FieldDatalist,\n\tOption: FieldOption,\n\tLabel: forwardRef<HTMLLabelElement, FieldLabelProps>(\n\t\tfunction FieldLabel(rest, ref) {\n\t\t\treturn <label suppressHydrationWarning ref={ref} {...rest} />;\n\t\t},\n\t),\n});\n"],"names":["toOption","FieldComp","forwardRef","size","validationType","as","className","count","description","error","helpText","helpTextLabel","label","prefix","style","suffix","validationContent","rest","ref","Tag","affixes","validation","shared","clsx","styles","value","jsx","jsxs","HelpText","FieldAffixes","Validation","FieldDatalist","filter","toCustomElementProps","FieldOption","props","FieldCombobox","required","position","nofilter","multiple","onAfterChange","onAfterSelect","onBeforeChange","onBeforeMatch","onBeforeSelect","onSelectedChange","children","disabled","name","options","placeholder","readOnly","selected","type","innerRef","useRef","onSelected","useImperativeHandle","useEffect","self","handleChange","event","handleSelected","remove","textContent","prev","i","Fragment","Input","Field"],"mappings":"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"}
+{"version":3,"file":"field.js","sources":["../../designsystem/field/field.tsx"],"sourcesContent":["\"use client\";\nimport type { Placement } from \"@floating-ui/dom\";\nimport type {\n\tReactUcombobox,\n\tUHTMLComboboxElement,\n} from \"@u-elements/u-combobox\";\nimport clsx from \"clsx\";\nimport type { JSX } from \"react\";\nimport { forwardRef, useEffect, useImperativeHandle, useRef } from \"react\";\nimport { HelpText } from \"../helptext/helptext\";\nimport { Input, type InputProps } from \"../input/input\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\nimport { toCustomElementProps } from \"../utils\";\nimport { Validation } from \"../validation/validation\";\n\ntype FieldBaseProps = {\n\t\"data-validation\"?: \"form\" | \"false\" | false;\n\tcount?: number;\n\tdescription?: React.ReactNode;\n\terror?: React.ReactNode; // Kept for backwards compatibility\n\thelpText?: React.ReactNode;\n\thelpTextLabel?: string;\n\tlabel?: React.ReactNode;\n\toptions?: string[] | FieldComboboxSelected;\n\tprefix?: string;\n\treadOnly?: boolean; // Allow readoOnly also on <select>\n\tsuffix?: string;\n\tvalidation?: React.ReactNode;\n};\n\nexport type FieldProps<As extends React.ElementType = \"div\"> =\n\tPolymorphicComponentPropWithRef<As, FieldBaseProps>;\n\ntype FieldComponent = <As extends React.ElementType = \"div\">(\n\tprops: FieldProps<As>,\n) => JSX.Element;\n\nconst toOption = (\n\to: FieldComboboxSelected[number] | string,\n): FieldComboboxSelected[number] =>\n\ttypeof o === \"string\" ? { label: o, value: o } : o;\n\nexport const FieldComp: FieldComponent = forwardRef<null>(function Field<\n\tAs extends React.ElementType = \"div\",\n>(\n\t{\n\t\t\"data-size\": size,\n\t\t\"data-validation\": validationType,\n\t\tas,\n\t\tclassName,\n\t\tcount,\n\t\tdescription,\n\t\terror,\n\t\thelpText,\n\t\thelpTextLabel,\n\t\tlabel,\n\t\tprefix,\n\t\tstyle,\n\t\tsuffix,\n\t\tvalidation: validationContent,\n\t\t...rest\n\t}: FieldProps<As>,\n\tref?: PolymorphicRef<As>,\n) {\n\tconst Tag = as || \"div\";\n\tconst affixes = !!suffix || !!prefix;\n\tconst validation = validationContent || error; // error kept for backwards compatibility\n\tconst shared = {\n\t\t\"data-size\": size,\n\t\t\"data-validation\": validationType,\n\t\tclassName: clsx(styles.field, className),\n\t\tstyle,\n\t};\n\n\t// Render options if select\n\tif (as === \"select\" && !rest.children)\n\t\tObject.assign(rest, {\n\t\t\toptions: undefined, // Ensure options is not passed to DOM\n\t\t\tchildren: (\n\t\t\t\t<>\n\t\t\t\t\t{(rest.options as FieldBaseProps[\"options\"])\n\t\t\t\t\t\t?.map(toOption)\n\t\t\t\t\t\t.map(({ label, value }) => (\n\t\t\t\t\t\t\t<option key={value} value={value}>\n\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t))}\n\t\t\t\t</>\n\t\t\t),\n\t\t});\n\n\t// Using suppressHydrationWarning to avoid Next.js vs field-observer.ts hydration conflict\n\treturn as ? (\n\t\t<div {...shared}>\n\t\t\t{!!label && <label suppressHydrationWarning>{label}</label>}\n\t\t\t{!!helpText && <HelpText aria-label={helpTextLabel}>{helpText}</HelpText>}\n\t\t\t{!!description && <p suppressHydrationWarning>{description}</p>}\n\t\t\t{affixes ? (\n\t\t\t\t<FieldAffixes>\n\t\t\t\t\t{!!prefix && <span>{prefix}</span>}\n\t\t\t\t\t<Tag\n\t\t\t\t\t\tclassName={styles.input}\n\t\t\t\t\t\tsuppressHydrationWarning\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\t{...rest}\n\t\t\t\t\t/>\n\t\t\t\t\t{!!suffix && <span>{suffix}</span>}\n\t\t\t\t</FieldAffixes>\n\t\t\t) : (\n\t\t\t\t<Tag\n\t\t\t\t\tclassName={typeof as === \"string\" ? styles.input : undefined}\n\t\t\t\t\tsuppressHydrationWarning\n\t\t\t\t\tref={ref}\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{!!validation && (\n\t\t\t\t<Validation hidden={validationType === \"form\"}>{validation}</Validation>\n\t\t\t)}\n\t\t\t{!!count && <p suppressHydrationWarning data-count={count} />}\n\t\t</div>\n\t) : (\n\t\t<div ref={ref} {...shared} {...rest} />\n\t);\n}) as FieldComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n\nexport type FieldAffixProps = React.ComponentPropsWithoutRef<\"div\">;\nconst FieldAffixes = forwardRef<HTMLDivElement, FieldAffixProps>(\n\tfunction FieldAffixes({ className, ...rest }, ref) {\n\t\treturn (\n\t\t\t<div className={clsx(styles.affixes, className)} ref={ref} {...rest} />\n\t\t);\n\t},\n);\n\nexport type FieldDatalistProps = React.ComponentPropsWithoutRef<\"datalist\"> & {\n\t\"data-nofilter\"?: boolean;\n\t\"data-position\"?: Placement;\n};\n\nconst FieldDatalist = forwardRef<HTMLDataListElement, FieldDatalistProps>(\n\tfunction FieldDatalist({ \"data-nofilter\": filter, ...rest }, ref) {\n\t\treturn (\n\t\t\t<u-datalist\n\t\t\t\tdata-nofilter={!!filter || undefined} // Ensure data-nofilter is set correctly\n\t\t\t\tref={ref}\n\t\t\t\t{...toCustomElementProps(rest)}\n\t\t\t/>\n\t\t);\n\t},\n);\n\nexport type FieldOptionProps = React.ComponentPropsWithoutRef<\"option\">;\nconst FieldOption = forwardRef<HTMLOptionElement, FieldOptionProps>(\n\tfunction FieldOption(props, ref) {\n\t\treturn <u-option ref={ref} {...toCustomElementProps(props)} />;\n\t},\n);\n\nexport type FieldComboboxSelected = {\n\tlabel: string;\n\tvalue: string;\n\tchildren?: React.ReactNode;\n}[];\nexport type FieldComboboxProps = Omit<\n\tReactUcombobox,\n\t\"onChange\" | \"onInput\"\n> & {\n\t\"data-creatable\"?: boolean;\n\t\"data-multiple\"?: boolean;\n\tonAfterChange?: (e: CustomEvent<HTMLDataElement>) => void; // deprecated\n\tonAfterSelect?: (e: CustomEvent<HTMLDataElement>) => void; // Custom event to handle before change\n\tonBeforeChange?: (e: CustomEvent<HTMLDataElement>) => void; // deprecated\n\tonBeforeMatch?: (e: CustomEvent<HTMLOptionElement>) => void; // Custom event to handle before change\n\tonBeforeSelect?: (e: CustomEvent<HTMLDataElement>) => void; // Custom event to handle before change\n\tonSelectedChange?: (selected: FieldComboboxSelected) => void; // Allow onChange to be a function that returns void\n\toptions?: FieldComboboxSelected;\n\tselected?: FieldComboboxSelected; // Allow value to be a string or an array of strings for multiple select\n} & Pick<\n\t\tInputProps,\n\t\t| \"disabled\"\n\t\t| \"name\"\n\t\t| \"onChange\"\n\t\t| \"onInput\"\n\t\t| \"placeholder\"\n\t\t| \"readOnly\"\n\t\t| \"type\"\n\t\t| \"value\"\n\t> & // Allow input props to be passed down\n\tPick<FieldDatalistProps, \"data-position\" | \"data-nofilter\">; // Allow datalist props to be passed down\n\nconst FieldCombobox = forwardRef<UHTMLComboboxElement, FieldComboboxProps>(\n\tfunction FieldCombobox(\n\t\t{\n\t\t\t\"aria-required\": required,\n\t\t\t\"data-position\": position,\n\t\t\t\"data-nofilter\": nofilter,\n\t\t\t\"data-multiple\": multiple,\n\t\t\tonAfterChange,\n\t\t\tonAfterSelect,\n\t\t\tonBeforeChange,\n\t\t\tonBeforeMatch,\n\t\t\tonBeforeSelect,\n\t\t\tonSelectedChange,\n\t\t\tonInput,\n\t\t\tonChange,\n\t\t\tchildren,\n\t\t\tdisabled,\n\t\t\tname,\n\t\t\toptions,\n\t\t\tplaceholder,\n\t\t\treadOnly,\n\t\t\tselected,\n\t\t\ttype,\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) {\n\t\tconst innerRef = useRef<UHTMLComboboxElement>(null);\n\t\tconst onSelected = useRef(onSelectedChange);\n\t\tonSelected.current = onSelectedChange; // Sync the latest onSelectedChange function\n\n\t\t// Deprecated props\n\t\tif (onAfterChange) {\n\t\t\tonAfterSelect = onAfterChange;\n\t\t\tconsole.warn(\n\t\t\t\t`Combobox onAfterChange is deprecated, use onAfterSelect instead.`,\n\t\t\t);\n\t\t}\n\t\tif (onBeforeChange) {\n\t\t\tonBeforeSelect = onBeforeChange;\n\t\t\tconsole.warn(\n\t\t\t\t`Combobox onBeforeChange is deprecated, use onBeforeSelect instead.`,\n\t\t\t);\n\t\t}\n\n\t\t// Using useEffect for React 18 and lower compatibility\n\t\tuseImperativeHandle(ref, () => innerRef.current as UHTMLComboboxElement); // Forward innerRef\n\t\tuseEffect(() => {\n\t\t\tconst self = innerRef.current;\n\t\t\tconst handleChange = (event: CustomEvent<HTMLDataElement>) => {\n\t\t\t\tconst handleSelected = onSelected.current;\n\t\t\t\tif (!onSelected) return; // No onSelectedChange function provided, let u-combobox handle it\n\t\t\t\tevent.preventDefault();\n\t\t\t\tconst { isConnected: remove, textContent, value } = event.detail;\n\t\t\t\tconst label = textContent?.trim() || \"\";\n\t\t\t\tconst prev = selected || [];\n\n\t\t\t\tif (remove) handleSelected?.(prev.filter((i) => i.value !== value));\n\t\t\t\telse if (multiple) handleSelected?.([...prev, { value, label }]);\n\t\t\t\telse handleSelected?.([{ value, label }]);\n\t\t\t};\n\n\t\t\tself?.addEventListener(\"comboboxbeforeselect\", handleChange);\n\t\t\treturn () =>\n\t\t\t\tself?.removeEventListener(\"comboboxbeforeselect\", handleChange);\n\t\t}, [multiple, selected]);\n\n\t\treturn (\n\t\t\t<u-combobox\n\t\t\t\tdata-multiple={multiple || undefined}\n\t\t\t\t{...toCustomElementProps({\n\t\t\t\t\toncomboboxbeforeselect: onBeforeSelect,\n\t\t\t\t\toncomboboxbeforematch: onBeforeMatch,\n\t\t\t\t\toncomboboxafterselect: onAfterSelect,\n\t\t\t\t\tref: innerRef,\n\t\t\t\t\t...props,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{selected?.map(({ children, label, value }) => (\n\t\t\t\t\t<data key={value} value={value} suppressHydrationWarning>\n\t\t\t\t\t\t{children ?? label}\n\t\t\t\t\t</data>\n\t\t\t\t))}\n\t\t\t\t{children || (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\taria-required={required}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tname={name}\n\t\t\t\t\t\t\tonInput={onInput}\n\t\t\t\t\t\t\tonChange={onChange}\n\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\treadOnly={readOnly}\n\t\t\t\t\t\t\ttype={type}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<del {...toCustomElementProps({ \"aria-label\": \"Fjern tekst\" })} />\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t\t{!!options && (\n\t\t\t\t\t<FieldDatalist data-nofilter={nofilter} data-position={position}>\n\t\t\t\t\t\t{options.map(toOption).map(({ children, label, value }) => (\n\t\t\t\t\t\t\t<FieldOption key={value} value={value} label={label}>\n\t\t\t\t\t\t\t\t{children ?? label}\n\t\t\t\t\t\t\t</FieldOption>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</FieldDatalist>\n\t\t\t\t)}\n\t\t\t</u-combobox>\n\t\t);\n\t},\n);\n\nexport type FieldLabelProps = React.ComponentPropsWithoutRef<\"label\">;\nexport const Field = Object.assign(FieldComp, {\n\tAffixes: FieldAffixes,\n\tCombobox: FieldCombobox,\n\tDatalist: FieldDatalist,\n\tOption: FieldOption,\n\tLabel: forwardRef<HTMLLabelElement, FieldLabelProps>(\n\t\tfunction FieldLabel(rest, ref) {\n\t\t\treturn <label suppressHydrationWarning ref={ref} {...rest} />;\n\t\t},\n\t),\n});\n"],"names":["Field","label","FieldAffixes","FieldDatalist","FieldOption","FieldCombobox","children"],"mappings":"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"}

package/mtds/field/field.stories.d.ts

@@ -152,10 +152,12 @@ export declare const WithCharacterCount: Story;
 export declare const WithCustomDescriptionTag: Story;
 export declare const WithCombobox: Story;
 export declare const WithComboboxMultiple: Story;
+export declare const WithComboboxCreatable: Story;
 export declare const WithComboboxAPI: Story;
 export declare const WithComboboxCustomFilter: Story;
 export declare const ReactWithCombobox: Story;
 export declare const ReactWithComboboxWithChildren: Story;
 export declare const ReactWithComboboxMultiple: Story;
+export declare const ReactWithComboboxCreatable: Story;
 export declare const ReactWithComboboxLong: Story;
 export declare const ReactWithCombobxCustomFilter: Story;

package/mtds/fieldset/fieldset-observer.js

@@ -1,20 +1,30 @@
-import a from "../styles.module.css.js";
-import { IS_BROWSER as d, onLoaded as r, onMutation as f, attr as s, useId as u, isInputLike as I } from "../utils.js";
-const m = a.fieldset.split(" ")[0], S = a.validation.split(" ")[0], l = "aria-describedby", p = "aria-invalid", E = d ? document.getElementsByClassName(m) : [];
-function A() {
+import styles from "../styles.module.css.js";
+import { isBrowser, onLoaded, onMutation, attr, useId, isInputLike } from "../utils.js";
+const CSS_FIELDSET = styles.fieldset.split(" ")[0];
+const CSS_VALIDATION = styles.validation.split(" ")[0];
+const ARIA_DESC = "aria-describedby";
+const ARIA_INVALID = "aria-invalid";
+const FIELDSETS = isBrowser() ? document.getElementsByClassName(CSS_FIELDSET) : [];
+function handleFieldsetMutation() {
   setTimeout(() => {
-    for (const i of E)
-      if (i.isConnected) {
-        const o = [];
-        let e = null, n = !0;
-        for (const t of i.getElementsByTagName("*"))
-          t.classList.contains(S) ? (n = s(t, "data-color") === "success" || !t.clientHeight, e = u(t)) : I(t) && o.push(t);
-        for (const t of o) {
-          const c = s(t, l)?.replace(e || "#", "");
-          s(t, l, `${e || ""} ${c || ""}`.trim()), s(t, p, `${!n}`);
+    for (const fieldset of FIELDSETS)
+      if (fieldset.isConnected) {
+        const inputs = [];
+        let validId = null;
+        let valid = true;
+        for (const el of fieldset.getElementsByTagName("*")) {
+          if (el.classList.contains(CSS_VALIDATION)) {
+            valid = attr(el, "data-color") === "success" || !el.clientHeight;
+            validId = useId(el);
+          } else if (isInputLike(el)) inputs.push(el);
+        }
+        for (const input of inputs) {
+          const desc = attr(input, ARIA_DESC)?.replace(validId || "#", "");
+          attr(input, ARIA_DESC, `${validId || ""} ${desc || ""}`.trim());
+          attr(input, ARIA_INVALID, `${!valid}`);
         }
       }
   });
 }
-r(() => [f(A, "class")]);
+onLoaded(() => [onMutation(handleFieldsetMutation, "class")]);
 //# sourceMappingURL=fieldset-observer.js.map

package/mtds/fieldset/fieldset-observer.js.map

@@ -1 +1 @@
-{"version":3,"file":"fieldset-observer.js","sources":["../../designsystem/fieldset/fieldset-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tattr,\n\tIS_BROWSER,\n\tisInputLike,\n\tonLoaded,\n\tonMutation,\n\tuseId,\n} from \"../utils\";\n\nconst CSS_FIELDSET = styles.fieldset.split(\" \")[0];\nconst CSS_VALIDATION = styles.validation.split(\" \")[0];\nconst ARIA_DESC = \"aria-describedby\";\nconst ARIA_INVALID = \"aria-invalid\";\nconst FIELDSETS = IS_BROWSER\n\t? document.getElementsByClassName(CSS_FIELDSET)\n\t: [];\n\n// Using setTimeout to ensure it runs after field-observer\nfunction handleFieldsetMutation() {\n\tsetTimeout(() => {\n\t\tfor (const fieldset of FIELDSETS)\n\t\t\tif (fieldset.isConnected) {\n\t\t\t\tconst inputs: HTMLInputElement[] = [];\n\t\t\t\tlet validId: string | null = null;\n\t\t\t\tlet valid = true;\n\n\t\t\t\tfor (const el of fieldset.getElementsByTagName(\"*\")) {\n\t\t\t\t\tif (el.classList.contains(CSS_VALIDATION)) {\n\t\t\t\t\t\tvalid = attr(el, \"data-color\") === \"success\" || !el.clientHeight; // Only set invalid if Validation is visible\n\t\t\t\t\t\tvalidId = useId(el);\n\t\t\t\t\t} else if (isInputLike(el)) inputs.push(el);\n\t\t\t\t}\n\n\t\t\t\tfor (const input of inputs) {\n\t\t\t\t\tconst desc = attr(input, ARIA_DESC)?.replace(validId || \"#\", \"\");\n\n\t\t\t\t\tattr(input, ARIA_DESC, `${validId || \"\"} ${desc || \"\"}`.trim());\n\t\t\t\t\tattr(input, ARIA_INVALID, `${!valid}`);\n\t\t\t\t}\n\t\t\t}\n\t});\n}\n\nonLoaded(() => [onMutation(handleFieldsetMutation, \"class\")]);\n"],"names":["CSS_FIELDSET","styles","CSS_VALIDATION","ARIA_DESC","ARIA_INVALID","FIELDSETS","IS_BROWSER","handleFieldsetMutation","fieldset","inputs","validId","valid","el","attr","useId","isInputLike","input","desc","onLoaded","onMutation"],"mappings":";;AAUA,MAAMA,IAAeC,EAAO,SAAS,MAAM,GAAG,EAAE,CAAC,GAC3CC,IAAiBD,EAAO,WAAW,MAAM,GAAG,EAAE,CAAC,GAC/CE,IAAY,oBACZC,IAAe,gBACfC,IAAYC,IACf,SAAS,uBAAuBN,CAAY,IAC5C,CAAA;AAGH,SAASO,IAAyB;AACjC,aAAW,MAAM;AAChB,eAAWC,KAAYH;AACtB,UAAIG,EAAS,aAAa;AACzB,cAAMC,IAA6B,CAAA;AACnC,YAAIC,IAAyB,MACzBC,IAAQ;AAEZ,mBAAWC,KAAMJ,EAAS,qBAAqB,GAAG;AACjD,UAAII,EAAG,UAAU,SAASV,CAAc,KACvCS,IAAQE,EAAKD,GAAI,YAAY,MAAM,aAAa,CAACA,EAAG,cACpDF,IAAUI,EAAMF,CAAE,KACRG,EAAYH,CAAE,KAAGH,EAAO,KAAKG,CAAE;AAG3C,mBAAWI,KAASP,GAAQ;AAC3B,gBAAMQ,IAAOJ,EAAKG,GAAOb,CAAS,GAAG,QAAQO,KAAW,KAAK,EAAE;AAE/D,UAAAG,EAAKG,GAAOb,GAAW,GAAGO,KAAW,EAAE,IAAIO,KAAQ,EAAE,GAAG,KAAA,CAAM,GAC9DJ,EAAKG,GAAOZ,GAAc,GAAG,CAACO,CAAK,EAAE;AAAA,QACtC;AAAA,MACD;AAAA,EACF,CAAC;AACF;AAEAO,EAAS,MAAM,CAACC,EAAWZ,GAAwB,OAAO,CAAC,CAAC;"}
+{"version":3,"file":"fieldset-observer.js","sources":["../../designsystem/fieldset/fieldset-observer.ts"],"sourcesContent":["import styles from \"../styles.module.css\";\nimport {\n\tattr,\n\tisBrowser,\n\tisInputLike,\n\tonLoaded,\n\tonMutation,\n\tuseId,\n} from \"../utils\";\n\nconst CSS_FIELDSET = styles.fieldset.split(\" \")[0];\nconst CSS_VALIDATION = styles.validation.split(\" \")[0];\nconst ARIA_DESC = \"aria-describedby\";\nconst ARIA_INVALID = \"aria-invalid\";\nconst FIELDSETS = isBrowser()\n\t? document.getElementsByClassName(CSS_FIELDSET)\n\t: [];\n\n// Using setTimeout to ensure it runs after field-observer\nfunction handleFieldsetMutation() {\n\tsetTimeout(() => {\n\t\tfor (const fieldset of FIELDSETS)\n\t\t\tif (fieldset.isConnected) {\n\t\t\t\tconst inputs: HTMLInputElement[] = [];\n\t\t\t\tlet validId: string | null = null;\n\t\t\t\tlet valid = true;\n\n\t\t\t\tfor (const el of fieldset.getElementsByTagName(\"*\")) {\n\t\t\t\t\tif (el.classList.contains(CSS_VALIDATION)) {\n\t\t\t\t\t\tvalid = attr(el, \"data-color\") === \"success\" || !el.clientHeight; // Only set invalid if Validation is visible\n\t\t\t\t\t\tvalidId = useId(el);\n\t\t\t\t\t} else if (isInputLike(el)) inputs.push(el);\n\t\t\t\t}\n\n\t\t\t\tfor (const input of inputs) {\n\t\t\t\t\tconst desc = attr(input, ARIA_DESC)?.replace(validId || \"#\", \"\");\n\n\t\t\t\t\tattr(input, ARIA_DESC, `${validId || \"\"} ${desc || \"\"}`.trim());\n\t\t\t\t\tattr(input, ARIA_INVALID, `${!valid}`);\n\t\t\t\t}\n\t\t\t}\n\t});\n}\n\nonLoaded(() => [onMutation(handleFieldsetMutation, \"class\")]);\n"],"names":[],"mappings":";;AAUA,MAAM,eAAe,OAAO,SAAS,MAAM,GAAG,EAAE,CAAC;AACjD,MAAM,iBAAiB,OAAO,WAAW,MAAM,GAAG,EAAE,CAAC;AACrD,MAAM,YAAY;AAClB,MAAM,eAAe;AACrB,MAAM,YAAY,UAAA,IACf,SAAS,uBAAuB,YAAY,IAC5C,CAAA;AAGH,SAAS,yBAAyB;AACjC,aAAW,MAAM;AAChB,eAAW,YAAY;AACtB,UAAI,SAAS,aAAa;AACzB,cAAM,SAA6B,CAAA;AACnC,YAAI,UAAyB;AAC7B,YAAI,QAAQ;AAEZ,mBAAW,MAAM,SAAS,qBAAqB,GAAG,GAAG;AACpD,cAAI,GAAG,UAAU,SAAS,cAAc,GAAG;AAC1C,oBAAQ,KAAK,IAAI,YAAY,MAAM,aAAa,CAAC,GAAG;AACpD,sBAAU,MAAM,EAAE;AAAA,UACnB,WAAW,YAAY,EAAE,EAAG,QAAO,KAAK,EAAE;AAAA,QAC3C;AAEA,mBAAW,SAAS,QAAQ;AAC3B,gBAAM,OAAO,KAAK,OAAO,SAAS,GAAG,QAAQ,WAAW,KAAK,EAAE;AAE/D,eAAK,OAAO,WAAW,GAAG,WAAW,EAAE,IAAI,QAAQ,EAAE,GAAG,KAAA,CAAM;AAC9D,eAAK,OAAO,cAAc,GAAG,CAAC,KAAK,EAAE;AAAA,QACtC;AAAA,MACD;AAAA,EACF,CAAC;AACF;AAEA,SAAS,MAAM,CAAC,WAAW,wBAAwB,OAAO,CAAC,CAAC;"}

package/mtds/fieldset/fieldset.d.ts

@@ -1,2 +1,2 @@
 export type FieldsetProps = React.ComponentPropsWithoutRef<"fieldset">;
-export declare const Fieldset: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref"> & React.RefAttributes<HTMLFieldSetElement>>;
+export declare const Fieldset: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, "ref"> & import('react').RefAttributes<HTMLFieldSetElement>>;

package/mtds/fieldset/fieldset.js

@@ -1,20 +1,20 @@
-import { jsx as o } from "react/jsx-runtime";
-import s from "clsx";
-import { forwardRef as f } from "react";
-import i from "../styles.module.css.js";
-const n = f(
-  function({ className: e, ...r }, t) {
-    return /* @__PURE__ */ o(
+import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { forwardRef } from "react";
+import styles from "../styles.module.css.js";
+const Fieldset = forwardRef(
+  function Fieldset2({ className, ...rest }, ref) {
+    return /* @__PURE__ */ jsx(
       "fieldset",
       {
-        className: s(i.fieldset, e),
-        ref: t,
-        ...r
+        className: clsx(styles.fieldset, className),
+        ref,
+        ...rest
       }
     );
   }
 );
 export {
-  n as Fieldset
+  Fieldset
 };
 //# sourceMappingURL=fieldset.js.map

package/mtds/fieldset/fieldset.js.map

@@ -1 +1 @@
-{"version":3,"file":"fieldset.js","sources":["../../designsystem/fieldset/fieldset.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\n\nexport type FieldsetProps = React.ComponentPropsWithoutRef<\"fieldset\">;\n\nexport const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(\n\tfunction Fieldset({ className, ...rest }, ref) {\n\t\treturn (\n\t\t\t<fieldset\n\t\t\t\tclassName={clsx(styles.fieldset, className)}\n\t\t\t\tref={ref}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t);\n\t},\n);\n"],"names":["Fieldset","forwardRef","className","rest","ref","jsx","clsx","styles"],"mappings":";;;;AAMO,MAAMA,IAAWC;AAAA,EACvB,SAAkB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAAQC,GAAK;AAC9C,WACC,gBAAAC;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,WAAWC,EAAKC,EAAO,UAAUL,CAAS;AAAA,QAC1C,KAAAE;AAAA,QACC,GAAGD;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACD;"}
+{"version":3,"file":"fieldset.js","sources":["../../designsystem/fieldset/fieldset.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef } from \"react\";\nimport styles from \"../styles.module.css\";\n\nexport type FieldsetProps = React.ComponentPropsWithoutRef<\"fieldset\">;\n\nexport const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(\n\tfunction Fieldset({ className, ...rest }, ref) {\n\t\treturn (\n\t\t\t<fieldset\n\t\t\t\tclassName={clsx(styles.fieldset, className)}\n\t\t\t\tref={ref}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t);\n\t},\n);\n"],"names":["Fieldset"],"mappings":";;;;AAMO,MAAM,WAAW;AAAA,EACvB,SAASA,UAAS,EAAE,WAAW,GAAG,KAAA,GAAQ,KAAK;AAC9C,WACC;AAAA,MAAC;AAAA,MAAA;AAAA,QACA,WAAW,KAAK,OAAO,UAAU,SAAS;AAAA,QAC1C;AAAA,QACC,GAAG;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACD;"}

package/mtds/fileupload/fileupload.js

@@ -1,13 +1,14 @@
-import { jsx as a } from "react/jsx-runtime";
-import e from "clsx";
-import { forwardRef as m } from "react";
-import f from "../styles.module.css.js";
-const d = m(
-  function({ as: o, className: r, ...l }, t) {
-    return /* @__PURE__ */ a(o || "label", { className: e(f.fileupload, r), ref: t, ...l });
+import { jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { forwardRef } from "react";
+import styles from "../styles.module.css.js";
+const Fileupload = forwardRef(
+  function Fileupload2({ as, className, ...rest }, ref) {
+    const Tag = as || "label";
+    return /* @__PURE__ */ jsx(Tag, { className: clsx(styles.fileupload, className), ref, ...rest });
   }
 );
 export {
-  d as Fileupload
+  Fileupload
 };
 //# sourceMappingURL=fileupload.js.map

package/mtds/fileupload/fileupload.js.map

@@ -1 +1 @@
-{"version":3,"file":"fileupload.js","sources":["../../designsystem/fileupload/fileupload.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, type JSX } from \"react\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\n\nexport type FileuploadProps<As extends React.ElementType = \"label\"> =\n\tPolymorphicComponentPropWithRef<As>;\n\ntype FileuploadComponent = <As extends React.ElementType = \"label\">(\n\tprops: FileuploadProps<As>,\n) => JSX.Element;\n\nexport const Fileupload: FileuploadComponent = forwardRef<null>(\n\tfunction Fileupload<As extends React.ElementType = \"label\">(\n\t\t{ as, className, ...rest }: FileuploadProps<As>,\n\t\tref?: PolymorphicRef<As>,\n\t) {\n\t\tconst Tag = as || \"label\";\n\n\t\treturn (\n\t\t\t<Tag className={clsx(styles.fileupload, className)} ref={ref} {...rest} />\n\t\t);\n\t},\n) as FileuploadComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n"],"names":["Fileupload","forwardRef","as","className","rest","ref","jsx","clsx","styles"],"mappings":";;;;AAeO,MAAMA,IAAkCC;AAAA,EAC9C,SACC,EAAE,IAAAC,GAAI,WAAAC,GAAW,GAAGC,EAAA,GACpBC,GACC;AAGD,WACC,gBAAAC,EAHWJ,KAAM,SAGhB,EAAI,WAAWK,EAAKC,EAAO,YAAYL,CAAS,GAAG,KAAAE,GAAW,GAAGD,EAAA,CAAM;AAAA,EAE1E;AACD;"}
+{"version":3,"file":"fileupload.js","sources":["../../designsystem/fileupload/fileupload.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, type JSX } from \"react\";\nimport type {\n\tPolymorphicComponentPropWithRef,\n\tPolymorphicRef,\n} from \"../react-types\";\nimport styles from \"../styles.module.css\";\n\nexport type FileuploadProps<As extends React.ElementType = \"label\"> =\n\tPolymorphicComponentPropWithRef<As>;\n\ntype FileuploadComponent = <As extends React.ElementType = \"label\">(\n\tprops: FileuploadProps<As>,\n) => JSX.Element;\n\nexport const Fileupload: FileuploadComponent = forwardRef<null>(\n\tfunction Fileupload<As extends React.ElementType = \"label\">(\n\t\t{ as, className, ...rest }: FileuploadProps<As>,\n\t\tref?: PolymorphicRef<As>,\n\t) {\n\t\tconst Tag = as || \"label\";\n\n\t\treturn (\n\t\t\t<Tag className={clsx(styles.fileupload, className)} ref={ref} {...rest} />\n\t\t);\n\t},\n) as FileuploadComponent; // Needed to tell Typescript this does not return ReactNode but acutally JSX.Element\n"],"names":["Fileupload"],"mappings":";;;;AAeO,MAAM,aAAkC;AAAA,EAC9C,SAASA,YACR,EAAE,IAAI,WAAW,GAAG,KAAA,GACpB,KACC;AACD,UAAM,MAAM,MAAM;AAElB,WACC,oBAAC,KAAA,EAAI,WAAW,KAAK,OAAO,YAAY,SAAS,GAAG,KAAW,GAAG,KAAA,CAAM;AAAA,EAE1E;AACD;"}

package/mtds/helptext/helptext.d.ts

@@ -1,2 +1,2 @@
 export type HelpTextProps = React.ComponentPropsWithoutRef<"button">;
-export declare const HelpText: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export declare const HelpText: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;

package/mtds/helptext/helptext.js

@@ -1,27 +1,27 @@
-import { jsxs as l, Fragment as m, jsx as o } from "react/jsx-runtime";
-import i from "clsx";
-import { forwardRef as n, useId as c } from "react";
-import t from "../styles.module.css.js";
-const b = n(
-  function({ className: r, children: p, ...s }, a) {
-    const e = c();
-    return /* @__PURE__ */ l(m, { children: [
-      /* @__PURE__ */ o(
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { forwardRef, useId } from "react";
+import styles from "../styles.module.css.js";
+const HelpText = forwardRef(
+  function HelpText2({ className, children, ...rest }, ref) {
+    const popoverId = useId();
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
         "button",
         {
           "aria-label": "Hjelptekst",
-          className: i(t.helptext, r),
-          popoverTarget: e,
-          ref: a,
+          className: clsx(styles.helptext, className),
+          popoverTarget: popoverId,
+          ref,
           type: "button",
-          ...s
+          ...rest
         }
       ),
-      /* @__PURE__ */ o("div", { className: t.popover, id: e, popover: "auto", children: p })
+      /* @__PURE__ */ jsx("div", { className: styles.popover, id: popoverId, popover: "auto", children })
     ] });
   }
 );
 export {
-  b as HelpText
+  HelpText
 };
 //# sourceMappingURL=helptext.js.map

package/mtds/helptext/helptext.js.map

@@ -1 +1 @@
-{"version":3,"file":"helptext.js","sources":["../../designsystem/helptext/helptext.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, useId } from \"react\";\nimport styles from \"../styles.module.css\";\n\nexport type HelpTextProps = React.ComponentPropsWithoutRef<\"button\">;\n\nexport const HelpText = forwardRef<HTMLButtonElement, HelpTextProps>(\n\tfunction HelpText({ className, children, ...rest }, ref) {\n\t\tconst popoverId = useId();\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<button\n\t\t\t\t\taria-label=\"Hjelptekst\"\n\t\t\t\t\tclassName={clsx(styles.helptext, className)}\n\t\t\t\t\tpopoverTarget={popoverId}\n\t\t\t\t\tref={ref}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\t\t\t\t<div className={styles.popover} id={popoverId} popover=\"auto\">\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</>\n\t\t);\n\t},\n);\n"],"names":["HelpText","forwardRef","className","children","rest","ref","popoverId","useId","jsxs","Fragment","jsx","clsx","styles"],"mappings":";;;;AAMO,MAAMA,IAAWC;AAAA,EACvB,SAAkB,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAAQC,GAAK;AACxD,UAAMC,IAAYC,EAAA;AAClB,WACC,gBAAAC,EAAAC,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACA,cAAW;AAAA,UACX,WAAWC,EAAKC,EAAO,UAAUV,CAAS;AAAA,UAC1C,eAAeI;AAAA,UACf,KAAAD;AAAA,UACA,MAAK;AAAA,UACJ,GAAGD;AAAA,QAAA;AAAA,MAAA;AAAA,MAEL,gBAAAM,EAAC,SAAI,WAAWE,EAAO,SAAS,IAAIN,GAAW,SAAQ,QACrD,UAAAH,EAAA,CACF;AAAA,IAAA,GACD;AAAA,EAEF;AACD;"}
+{"version":3,"file":"helptext.js","sources":["../../designsystem/helptext/helptext.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport { forwardRef, useId } from \"react\";\nimport styles from \"../styles.module.css\";\n\nexport type HelpTextProps = React.ComponentPropsWithoutRef<\"button\">;\n\nexport const HelpText = forwardRef<HTMLButtonElement, HelpTextProps>(\n\tfunction HelpText({ className, children, ...rest }, ref) {\n\t\tconst popoverId = useId();\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<button\n\t\t\t\t\taria-label=\"Hjelptekst\"\n\t\t\t\t\tclassName={clsx(styles.helptext, className)}\n\t\t\t\t\tpopoverTarget={popoverId}\n\t\t\t\t\tref={ref}\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t{...rest}\n\t\t\t\t/>\n\t\t\t\t<div className={styles.popover} id={popoverId} popover=\"auto\">\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</>\n\t\t);\n\t},\n);\n"],"names":["HelpText"],"mappings":";;;;AAMO,MAAM,WAAW;AAAA,EACvB,SAASA,UAAS,EAAE,WAAW,UAAU,GAAG,KAAA,GAAQ,KAAK;AACxD,UAAM,YAAY,MAAA;AAClB,WACC,qBAAA,UAAA,EACC,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACA,cAAW;AAAA,UACX,WAAW,KAAK,OAAO,UAAU,SAAS;AAAA,UAC1C,eAAe;AAAA,UACf;AAAA,UACA,MAAK;AAAA,UACJ,GAAG;AAAA,QAAA;AAAA,MAAA;AAAA,MAEL,oBAAC,SAAI,WAAW,OAAO,SAAS,IAAI,WAAW,SAAQ,QACrD,SAAA,CACF;AAAA,IAAA,GACD;AAAA,EAEF;AACD;"}