@fremtind/jokul 0.44.7 → 0.45.0

package/build/es/components/input-group/FieldGroup.d.ts

@@ -1,15 +1,3 @@
-import { FC, FieldsetHTMLAttributes, ReactNode } from 'react';
-import { DataTestAutoId, Density } from '../../core/types.js';
-import { LabelProps } from './Label.js';
-import { SupportLabelProps } from './SupportLabel.js';
-export interface FieldGroupProps extends DataTestAutoId, FieldsetHTMLAttributes<HTMLFieldSetElement> {
-    legend: string;
-    labelProps?: Omit<LabelProps, "children" | "density">;
-    supportLabelProps?: Omit<SupportLabelProps, "id" | "errorLabel" | "helpLabel" | "density">;
-    tooltip?: ReactNode;
-    className?: string;
-    helpLabel?: string;
-    errorLabel?: string;
-    density?: Density;
-}
+import { FC } from 'react';
+import { FieldGroupProps } from './types.js';
 export declare const FieldGroup: FC<FieldGroupProps>;

package/build/es/components/input-group/FieldGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroup.js","sources":["../../../../src/components/input-group/FieldGroup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC, FieldsetHTMLAttributes, type ReactNode } from \"react\";\nimport { DataTestAutoId, Density } from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { Label, LabelProps } from \"./Label.js\";\nimport { SupportLabel, SupportLabelProps } from \"./SupportLabel.js\";\n\nexport interface FieldGroupProps\n    extends DataTestAutoId,\n        FieldsetHTMLAttributes<HTMLFieldSetElement> {\n    legend: string;\n    labelProps?: Omit<LabelProps, \"children\" | \"density\">;\n    supportLabelProps?: Omit<\n        SupportLabelProps,\n        \"id\" | \"errorLabel\" | \"helpLabel\" | \"density\"\n    >;\n    tooltip?: ReactNode;\n    className?: string;\n    helpLabel?: string;\n    errorLabel?: string;\n    density?: Density;\n}\n\nexport const FieldGroup: FC<FieldGroupProps> = (props) => {\n    const {\n        id,\n        legend,\n        labelProps,\n        supportLabelProps,\n        tooltip,\n        className,\n        children,\n        helpLabel,\n        errorLabel,\n        density,\n        \"data-testautoid\": testAutoId,\n        ...rest\n    } = props;\n\n    const uid = useId(id || \"jkl-field-group\", { generateSuffix: !id });\n    const supportId = `${uid}_support-label`;\n\n    const supportText = errorLabel || helpLabel;\n    const supportTextType = errorLabel\n        ? \"error\"\n        : helpLabel\n        ? \"help\"\n        : undefined;\n\n    const describedBy = supportText ? supportId : undefined;\n\n    return (\n        <fieldset\n            id={uid}\n            className={clsx(\"jkl-field-group\", className)}\n            data-testautoid={testAutoId}\n            {...rest}\n            aria-describedby={describedBy}\n            data-density={density}\n        >\n            <legend className=\"jkl-field-group__legend\">\n                <Label {...labelProps} density={density}>\n                    {tooltip ? (\n                        <>\n                            <span style={{ whiteSpace: \"normal\" }}>\n                                {legend}\n                            </span>\n                            {`\\u00A0`}\n                            {tooltip}\n                        </>\n                    ) : (\n                        legend\n                    )}\n                </Label>\n            </legend>\n            {children}\n            {(helpLabel || errorLabel) && (\n                <SupportLabel\n                    {...supportLabelProps}\n                    label={supportText}\n                    labelType={supportTextType}\n                    id={supportId}\n                    density={density}\n                />\n            )}\n        </fieldset>\n    );\n};\n"],"names":["FieldGroup","props","id","legend","labelProps","supportLabelProps","tooltip","className","children","helpLabel","errorLabel","density","testAutoId","rest","uid","useId","generateSuffix","supportId","supportText","supportTextType","describedBy","jsxs","clsx","jsx","Label","Fragment","style","whiteSpace","SupportLabel","label","labelType"],"mappings":"qPAuBa,MAAAA,EAAmCC,IACtC,MACFC,GAAAA,EACAC,OAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,QAAAA,EACA,kBAAmBC,KAChBC,GACHZ,EAEEa,EAAMC,EAAMb,GAAM,kBAAmB,CAAEc,gBAAiBd,IACxDe,EAAY,GAAGH,kBAEfI,EAAcR,GAAcD,EAC5BU,EAAkBT,EAClB,QACAD,EACA,YACA,EAEAW,EAAcF,EAAcD,OAAY,EAG1C,OAAAI,EAAC,WAAA,CACGnB,GAAIY,EACJP,UAAWe,EAAK,kBAAmBf,GACnC,kBAAiBK,KACbC,EACJ,mBAAkBO,EAClB,eAAcT,EAEdH,SAAA,CAACe,EAAA,SAAA,CAAOhB,UAAU,0BACdC,SAAAe,EAACC,MAAUpB,EAAYO,QAAAA,EAClBH,SAAAF,EAEOe,EAAAI,EAAA,CAAAjB,SAAA,CAAAe,EAAC,QAAKG,MAAO,CAAEC,WAAY,UACtBnB,SACLL,IACC,IACAG,KAGLH,MAIXK,GACCC,GAAaC,IACXa,EAACK,EAAA,IACOvB,EACJwB,MAAOX,EACPY,UAAWX,EACXjB,GAAIe,EACJN,QAAAA,MACJ"}
+{"version":3,"file":"FieldGroup.js","sources":["../../../../src/components/input-group/FieldGroup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { FC } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { Label } from \"./Label.js\";\nimport { SupportLabel } from \"./SupportLabel.js\";\nimport { FieldGroupProps } from \"./types.js\";\n\nexport const FieldGroup: FC<FieldGroupProps> = (props) => {\n    const {\n        id,\n        legend,\n        labelProps,\n        supportLabelProps,\n        tooltip,\n        className,\n        children,\n        helpLabel,\n        errorLabel,\n        density,\n        \"data-testautoid\": testAutoId,\n        ...rest\n    } = props;\n\n    const uid = useId(id || \"jkl-field-group\", { generateSuffix: !id });\n    const supportId = `${uid}_support-label`;\n\n    const supportText = errorLabel || helpLabel;\n    const supportTextType = errorLabel\n        ? \"error\"\n        : helpLabel\n        ? \"help\"\n        : undefined;\n\n    const describedBy = supportText ? supportId : undefined;\n\n    return (\n        <fieldset\n            id={uid}\n            className={clsx(\"jkl-field-group\", className)}\n            data-testautoid={testAutoId}\n            {...rest}\n            aria-describedby={describedBy}\n            data-density={density}\n        >\n            <legend className=\"jkl-field-group__legend\">\n                <Label {...labelProps} density={density}>\n                    {tooltip ? (\n                        <>\n                            <span style={{ whiteSpace: \"normal\" }}>\n                                {legend}\n                            </span>\n                            {`\\u00A0`}\n                            {tooltip}\n                        </>\n                    ) : (\n                        legend\n                    )}\n                </Label>\n            </legend>\n            {children}\n            {(helpLabel || errorLabel) && (\n                <SupportLabel\n                    {...supportLabelProps}\n                    label={supportText}\n                    labelType={supportTextType}\n                    id={supportId}\n                    density={density}\n                />\n            )}\n        </fieldset>\n    );\n};\n"],"names":["FieldGroup","props","id","legend","labelProps","supportLabelProps","tooltip","className","children","helpLabel","errorLabel","density","testAutoId","rest","uid","useId","generateSuffix","supportId","supportText","supportTextType","describedBy","jsxs","clsx","jsx","Label","Fragment","style","whiteSpace","SupportLabel","label","labelType"],"mappings":"qPAOa,MAAAA,EAAmCC,IACtC,MACFC,GAAAA,EACAC,OAAAA,EACAC,WAAAA,EACAC,kBAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,SAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,QAAAA,EACA,kBAAmBC,KAChBC,GACHZ,EAEEa,EAAMC,EAAMb,GAAM,kBAAmB,CAAEc,gBAAiBd,IACxDe,EAAY,GAAGH,kBAEfI,EAAcR,GAAcD,EAC5BU,EAAkBT,EAClB,QACAD,EACA,YACA,EAEAW,EAAcF,EAAcD,OAAY,EAG1C,OAAAI,EAAC,WAAA,CACGnB,GAAIY,EACJP,UAAWe,EAAK,kBAAmBf,GACnC,kBAAiBK,KACbC,EACJ,mBAAkBO,EAClB,eAAcT,EAEdH,SAAA,CAACe,EAAA,SAAA,CAAOhB,UAAU,0BACdC,SAAAe,EAACC,MAAUpB,EAAYO,QAAAA,EAClBH,SAAAF,EAEOe,EAAAI,EAAA,CAAAjB,SAAA,CAAAe,EAAC,QAAKG,MAAO,CAAEC,WAAY,UACtBnB,SACLL,IACC,IACAG,KAGLH,MAIXK,GACCC,GAAaC,IACXa,EAACK,EAAA,IACOvB,EACJwB,MAAOX,EACPY,UAAWX,EACXjB,GAAIe,EACJN,QAAAA,MACJ"}

package/build/es/components/input-group/InputGroup.d.ts

@@ -1,39 +1,17 @@
-import { default as React, CSSProperties, ReactNode } from 'react';
-import { DataTestAutoId, Density, WithOptionalChildren } from '../../core/types.js';
-import { LabelProps } from './Label.js';
-import { SupportLabelProps } from './SupportLabel.js';
-export interface InputProps {
-    "aria-describedby"?: string;
-    "aria-invalid"?: boolean;
-    id?: string;
-}
-export type InputGroupProps = WithOptionalChildren & DataTestAutoId & {
-    id?: string;
-    className?: string;
-    "data-testid"?: string;
-    density?: Density;
-    errorLabel?: ReactNode;
-    helpLabel?: ReactNode;
-    inline?: boolean;
-    label: ReactNode;
-    labelProps?: Omit<LabelProps, "children" | "density">;
-    supportLabelProps?: Omit<SupportLabelProps, "id" | "errorLabel" | "helpLabel" | "density">;
-    tooltip?: ReactNode;
-    style?: CSSProperties;
-    render?: (props: InputProps) => JSX.Element;
-};
-export declare const InputGroup: React.ForwardRefExoticComponent<WithOptionalChildren & DataTestAutoId & {
+import { default as React } from 'react';
+import { InputProps } from './types.js';
+export declare const InputGroup: React.ForwardRefExoticComponent<import('../../index.js').WithOptionalChildren & import('../../index.js').DataTestAutoId & {
     id?: string;
     className?: string;
     "data-testid"?: string;
-    density?: Density;
-    errorLabel?: ReactNode;
-    helpLabel?: ReactNode;
+    density?: import('../../index.js').Density;
+    errorLabel?: React.ReactNode;
+    helpLabel?: React.ReactNode;
     inline?: boolean;
-    label: ReactNode;
-    labelProps?: Omit<LabelProps, "children" | "density">;
-    supportLabelProps?: Omit<SupportLabelProps, "id" | "errorLabel" | "helpLabel" | "density">;
-    tooltip?: ReactNode;
-    style?: CSSProperties;
+    label: React.ReactNode;
+    labelProps?: Omit<import('./types.js').LabelProps, "children" | "density">;
+    supportLabelProps?: Omit<import('./types.js').SupportLabelProps, "id" | "errorLabel" | "helpLabel" | "density">;
+    tooltip?: React.ReactNode;
+    style?: React.CSSProperties;
     render?: (props: InputProps) => JSX.Element;
 } & React.RefAttributes<HTMLDivElement>>;

package/build/es/components/input-group/InputGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputGroup.js","sources":["../../../../src/components/input-group/InputGroup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef, type CSSProperties, type ReactNode } from \"react\";\nimport {\n    DataTestAutoId,\n    Density,\n    WithOptionalChildren,\n} from \"../../core/types.js\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { Label, LabelProps } from \"./Label.js\";\nimport { SupportLabel, SupportLabelProps } from \"./SupportLabel.js\";\n\nexport interface InputProps {\n    \"aria-describedby\"?: string;\n    \"aria-invalid\"?: boolean;\n    id?: string;\n}\n\nexport type InputGroupProps = WithOptionalChildren &\n    DataTestAutoId & {\n        id?: string;\n        className?: string;\n        \"data-testid\"?: string;\n        density?: Density;\n        errorLabel?: ReactNode;\n        helpLabel?: ReactNode;\n        inline?: boolean;\n        label: ReactNode;\n        labelProps?: Omit<LabelProps, \"children\" | \"density\">;\n        supportLabelProps?: Omit<\n            SupportLabelProps,\n            \"id\" | \"errorLabel\" | \"helpLabel\" | \"density\"\n        >;\n        tooltip?: ReactNode;\n        style?: CSSProperties;\n        render?: (props: InputProps) => JSX.Element;\n    };\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(\n    (props, ref) => {\n        const {\n            className,\n            children,\n            density,\n            errorLabel,\n            helpLabel,\n            inline,\n            label,\n            labelProps,\n            render,\n            supportLabelProps,\n            tooltip,\n            id,\n            ...rest\n        } = props;\n\n        const uid = useId(id || \"jkl-input\", { generateSuffix: !id });\n        const supportId = useId(\"jkl-support-label\");\n\n        const hasTooltip = !!tooltip;\n\n        const supportText = errorLabel || helpLabel;\n        const supportTextType = errorLabel\n            ? \"error\"\n            : helpLabel\n            ? \"help\"\n            : undefined;\n\n        const describedBy = supportText ? supportId : undefined;\n\n        const inputProps: InputProps = {\n            \"aria-describedby\": describedBy,\n            \"aria-invalid\": Boolean(errorLabel) ? true : undefined,\n            id: uid,\n        };\n\n        const renderInput = render\n            ? () => render(inputProps)\n            : () => {\n                  const input = React.Children.toArray(props.children)[0];\n\n                  if (!React.isValidElement<InputProps>(input)) return;\n\n                  return React.cloneElement<InputProps>(input, {\n                      ...inputProps,\n                      ...input.props,\n                  });\n              };\n\n        return (\n            <div\n                ref={ref}\n                className={clsx(className, \"jkl-input-group\", {\n                    \"jkl-input-group--inline\": inline,\n                })}\n                data-density={density}\n                {...rest}\n            >\n                <Label\n                    standAlone\n                    htmlFor={uid}\n                    srOnly={inline}\n                    {...labelProps}\n                    style={{\n                        whiteSpace: hasTooltip ? \"nowrap\" : undefined,\n                        ...labelProps?.style,\n                    }}\n                    density={density}\n                >\n                    {hasTooltip ? (\n                        <>\n                            <span style={{ whiteSpace: \"normal\" }}>\n                                {label}\n                            </span>\n                            {`\\u00A0`}\n                            {tooltip}\n                        </>\n                    ) : (\n                        label\n                    )}\n                </Label>\n                {renderInput()}\n                <SupportLabel\n                    srOnly={inline}\n                    {...supportLabelProps}\n                    label={supportText}\n                    labelType={supportTextType}\n                    id={supportId}\n                    density={density}\n                />\n            </div>\n        );\n    },\n);\n\nInputGroup.displayName = \"InputGroup\";\n"],"names":["InputGroup","forwardRef","props","ref","className","children","density","errorLabel","helpLabel","inline","label","labelProps","render","supportLabelProps","tooltip","id","rest","uid","useId","generateSuffix","supportId","hasTooltip","supportText","supportTextType","inputProps","renderInput","input","React","Children","toArray","isValidElement","cloneElement","jsxs","clsx","jsx","Label","standAlone","htmlFor","srOnly","style","whiteSpace","Fragment","SupportLabel","labelType","displayName"],"mappings":"2RAqCO,MAAMA,EAAaC,GACtB,CAACC,EAAOC,KACE,MACFC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,OAAAA,EACAC,kBAAAA,EACAC,QAAAA,EACAC,GAAAA,KACGC,GACHd,EAEEe,EAAMC,EAAMH,GAAM,YAAa,CAAEI,gBAAiBJ,IAClDK,EAAYF,EAAM,qBAElBG,IAAeP,EAEfQ,EAAcf,GAAcC,EAC5Be,EAAkBhB,EAClB,QACAC,EACA,YACA,EAIAgB,EAAyB,CAC3B,mBAHgBF,EAAcF,OAAY,EAI1C,iBAAwBb,QAAqB,EAC7CQ,GAAIE,GAGFQ,EAAcb,EACd,IAAMA,EAAOY,GACb,KACI,MAAME,EAAQC,EAAMC,SAASC,QAAQ3B,EAAMG,UAAU,GAEhDsB,GAAAA,EAAMG,eAA2BJ,GAE/BC,OAAAA,EAAMI,aAAyBL,EAAO,IACtCF,KACAE,EAAMxB,OACZ,EAIP,OAAA8B,EAAC,MAAA,CACG7B,IAAAA,EACAC,UAAW6B,EAAK7B,EAAW,kBAAmB,CAC1C,0BAA2BK,IAE/B,eAAcH,KACVU,EAEJX,SAAA,CAAA6B,EAACC,EAAA,CACGC,YAAU,EACVC,QAASpB,EACTqB,OAAQ7B,KACJE,EACJ4B,MAAO,CACHC,WAAYnB,EAAa,cAAW,KACjC,MAAAV,OAAA,EAAAA,EAAY4B,OAEnBjC,QAAAA,EAECD,WAEO2B,EAAAS,EAAA,CAAApC,SAAA,CAAA6B,EAAC,QAAKK,MAAO,CAAEC,WAAY,UACtBnC,SACLK,IACC,IACAI,KAGLJ,IAGPe,IACDS,EAACQ,EAAA,CACGJ,OAAQ7B,KACJI,EACJH,MAAOY,EACPqB,UAAWpB,EACXR,GAAIK,EACJd,QAAAA,MACJ,IAMhBN,EAAW4C,YAAc"}
+{"version":3,"file":"InputGroup.js","sources":["../../../../src/components/input-group/InputGroup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { forwardRef } from \"react\";\nimport { useId } from \"../../hooks/useId/useId.js\";\nimport { Label } from \"./Label.js\";\nimport { SupportLabel } from \"./SupportLabel.js\";\nimport { InputGroupProps, InputProps } from \"./types.js\";\n\nexport const InputGroup = forwardRef<HTMLDivElement, InputGroupProps>(\n    (props, ref) => {\n        const {\n            className,\n            children,\n            density,\n            errorLabel,\n            helpLabel,\n            inline,\n            label,\n            labelProps,\n            render,\n            supportLabelProps,\n            tooltip,\n            id,\n            ...rest\n        } = props;\n\n        const uid = useId(id || \"jkl-input\", { generateSuffix: !id });\n        const supportId = useId(\"jkl-support-label\");\n\n        const hasTooltip = !!tooltip;\n\n        const supportText = errorLabel || helpLabel;\n        const supportTextType = errorLabel\n            ? \"error\"\n            : helpLabel\n            ? \"help\"\n            : undefined;\n\n        const describedBy = supportText ? supportId : undefined;\n\n        const inputProps: InputProps = {\n            \"aria-describedby\": describedBy,\n            \"aria-invalid\": Boolean(errorLabel) ? true : undefined,\n            id: uid,\n        };\n\n        const renderInput = render\n            ? () => render(inputProps)\n            : () => {\n                  const input = React.Children.toArray(props.children)[0];\n\n                  if (!React.isValidElement<InputProps>(input)) return;\n\n                  return React.cloneElement<InputProps>(input, {\n                      ...inputProps,\n                      ...input.props,\n                  });\n              };\n\n        return (\n            <div\n                ref={ref}\n                className={clsx(className, \"jkl-input-group\", {\n                    \"jkl-input-group--inline\": inline,\n                })}\n                data-density={density}\n                {...rest}\n            >\n                <Label\n                    standAlone\n                    htmlFor={uid}\n                    srOnly={inline}\n                    {...labelProps}\n                    style={{\n                        whiteSpace: hasTooltip ? \"nowrap\" : undefined,\n                        ...labelProps?.style,\n                    }}\n                    density={density}\n                >\n                    {hasTooltip ? (\n                        <>\n                            <span style={{ whiteSpace: \"normal\" }}>\n                                {label}\n                            </span>\n                            {`\\u00A0`}\n                            {tooltip}\n                        </>\n                    ) : (\n                        label\n                    )}\n                </Label>\n                {renderInput()}\n                <SupportLabel\n                    srOnly={inline}\n                    {...supportLabelProps}\n                    label={supportText}\n                    labelType={supportTextType}\n                    id={supportId}\n                    density={density}\n                />\n            </div>\n        );\n    },\n);\n\nInputGroup.displayName = \"InputGroup\";\n"],"names":["InputGroup","forwardRef","props","ref","className","children","density","errorLabel","helpLabel","inline","label","labelProps","render","supportLabelProps","tooltip","id","rest","uid","useId","generateSuffix","supportId","hasTooltip","supportText","supportTextType","inputProps","renderInput","input","React","Children","toArray","isValidElement","cloneElement","jsxs","clsx","jsx","Label","standAlone","htmlFor","srOnly","style","whiteSpace","Fragment","SupportLabel","labelType","displayName"],"mappings":"2RAOO,MAAMA,EAAaC,GACtB,CAACC,EAAOC,KACE,MACFC,UAAAA,EACAC,SAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,UAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,WAAAA,EACAC,OAAAA,EACAC,kBAAAA,EACAC,QAAAA,EACAC,GAAAA,KACGC,GACHd,EAEEe,EAAMC,EAAMH,GAAM,YAAa,CAAEI,gBAAiBJ,IAClDK,EAAYF,EAAM,qBAElBG,IAAeP,EAEfQ,EAAcf,GAAcC,EAC5Be,EAAkBhB,EAClB,QACAC,EACA,YACA,EAIAgB,EAAyB,CAC3B,mBAHgBF,EAAcF,OAAY,EAI1C,iBAAwBb,QAAqB,EAC7CQ,GAAIE,GAGFQ,EAAcb,EACd,IAAMA,EAAOY,GACb,KACI,MAAME,EAAQC,EAAMC,SAASC,QAAQ3B,EAAMG,UAAU,GAEhDsB,GAAAA,EAAMG,eAA2BJ,GAE/BC,OAAAA,EAAMI,aAAyBL,EAAO,IACtCF,KACAE,EAAMxB,OACZ,EAIP,OAAA8B,EAAC,MAAA,CACG7B,IAAAA,EACAC,UAAW6B,EAAK7B,EAAW,kBAAmB,CAC1C,0BAA2BK,IAE/B,eAAcH,KACVU,EAEJX,SAAA,CAAA6B,EAACC,EAAA,CACGC,YAAU,EACVC,QAASpB,EACTqB,OAAQ7B,KACJE,EACJ4B,MAAO,CACHC,WAAYnB,EAAa,cAAW,KACjC,MAAAV,OAAA,EAAAA,EAAY4B,OAEnBjC,QAAAA,EAECD,WAEO2B,EAAAS,EAAA,CAAApC,SAAA,CAAA6B,EAAC,QAAKK,MAAO,CAAEC,WAAY,UACtBnC,SACLK,IACC,IACAI,KAGLJ,IAGPe,IACDS,EAACQ,EAAA,CACGJ,OAAQ7B,KACJI,EACJH,MAAOY,EACPqB,UAAWpB,EACXR,GAAIK,EACJd,QAAAA,MACJ,IAMhBN,EAAW4C,YAAc"}

package/build/es/components/input-group/Label.d.ts

@@ -1,14 +1,3 @@
-import { CSSProperties, FC } from 'react';
-import { Density, WithChildren } from '../../core/types.js';
-export type LabelVariant = "small" | "medium" | "large";
-export interface LabelProps extends WithChildren {
-    id?: string;
-    variant?: LabelVariant;
-    density?: Density;
-    srOnly?: boolean;
-    standAlone?: boolean;
-    htmlFor?: string;
-    className?: string;
-    style?: CSSProperties;
-}
+import { FC } from 'react';
+import { LabelProps } from './types.js';
 export declare const Label: FC<LabelProps>;

package/build/es/components/input-group/Label.js.map

@@ -1 +1 @@
-{"version":3,"file":"Label.js","sources":["../../../../src/components/input-group/Label.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type CSSProperties, type FC } from \"react\";\nimport { Density, WithChildren } from \"../../core/types.js\";\n\nexport type LabelVariant = \"small\" | \"medium\" | \"large\";\n\nexport interface LabelProps extends WithChildren {\n    id?: string;\n    variant?: LabelVariant;\n    density?: Density;\n    srOnly?: boolean;\n    standAlone?: boolean;\n    htmlFor?: string;\n    className?: string;\n    style?: CSSProperties;\n}\n\nexport const Label: FC<LabelProps> = ({\n    variant = \"small\",\n    density,\n    srOnly,\n    children,\n    standAlone,\n    htmlFor,\n    className = \"\",\n    ...rest\n}) => {\n    const labelClassNames = clsx(\"jkl-label\", className, {\n        [`jkl-label--${variant}`]: variant,\n        \"jkl-label--sr-only\": srOnly,\n    });\n\n    const C = standAlone ? \"label\" : \"span\";\n\n    if (!standAlone && htmlFor) {\n        htmlFor = undefined;\n        if (process.env.NODE_ENV !== \"production\") {\n            console.warn(\n                \"WARNING: The standard Label component renders as a <span> element, which does not take a htmlFor prop. If you want the Label to belong to a specific input, use the standAlone prop, which renders as a <label> element instead. In most cases the Label component should not be used directly, as it is part of all our input components.\",\n            );\n        }\n    }\n\n    return (\n        <C\n            {...rest}\n            className={labelClassNames}\n            htmlFor={htmlFor}\n            data-density={density}\n        >\n            {children}\n        </C>\n    );\n};\n"],"names":["Label","variant","density","srOnly","children","standAlone","htmlFor","className","rest","labelClassNames","clsx","C","process","env","NODE_ENV","console","warn","jsx"],"mappings":"sFAiBO,MAAMA,EAAwB,EACjCC,QAAAA,EAAU,QACVC,QAAAA,EACAC,OAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,UAAAA,EAAY,MACTC,MAEGC,MAAAA,EAAkBC,EAAK,YAAaH,EAAW,CACjD,CAAC,cAAcN,KAAYA,EAC3B,qBAAsBE,IAGpBQ,EAAIN,EAAa,QAAU,OAE7B,OAACA,GAAcC,IACLA,OAAA,EACmB,eAAzBM,QAAQC,IAAIC,UACJC,QAAAC,KACJ,+UAMRC,EAACN,EAAA,IACOH,EACJD,UAAWE,EACXH,QAAAA,EACA,eAAcJ,EAEbE,SAAAA,GAAA"}
+{"version":3,"file":"Label.js","sources":["../../../../src/components/input-group/Label.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { LabelProps } from \"./types.js\";\n\nexport const Label: FC<LabelProps> = ({\n    variant = \"small\",\n    density,\n    srOnly,\n    children,\n    standAlone,\n    htmlFor,\n    className = \"\",\n    ...rest\n}) => {\n    const labelClassNames = clsx(\"jkl-label\", className, {\n        [`jkl-label--${variant}`]: variant,\n        \"jkl-label--sr-only\": srOnly,\n    });\n\n    const C = standAlone ? \"label\" : \"span\";\n\n    if (!standAlone && htmlFor) {\n        htmlFor = undefined;\n        if (process.env.NODE_ENV !== \"production\") {\n            console.warn(\n                \"WARNING: The standard Label component renders as a <span> element, which does not take a htmlFor prop. If you want the Label to belong to a specific input, use the standAlone prop, which renders as a <label> element instead. In most cases the Label component should not be used directly, as it is part of all our input components.\",\n            );\n        }\n    }\n\n    return (\n        <C\n            {...rest}\n            className={labelClassNames}\n            htmlFor={htmlFor}\n            data-density={density}\n        >\n            {children}\n        </C>\n    );\n};\n"],"names":["Label","variant","density","srOnly","children","standAlone","htmlFor","className","rest","labelClassNames","clsx","C","process","env","NODE_ENV","console","warn","jsx"],"mappings":"sFAIO,MAAMA,EAAwB,EACjCC,QAAAA,EAAU,QACVC,QAAAA,EACAC,OAAAA,EACAC,SAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,UAAAA,EAAY,MACTC,MAEGC,MAAAA,EAAkBC,EAAK,YAAaH,EAAW,CACjD,CAAC,cAAcN,KAAYA,EAC3B,qBAAsBE,IAGpBQ,EAAIN,EAAa,QAAU,OAE7B,OAACA,GAAcC,IACLA,OAAA,EACmB,eAAzBM,QAAQC,IAAIC,UACJC,QAAAC,KACJ,+UAMRC,EAACN,EAAA,IACOH,EACJD,UAAWE,EACXH,QAAAA,EACA,eAAcJ,EAEbE,SAAAA,GAAA"}

package/build/es/components/input-group/SupportLabel.d.ts

@@ -1,61 +1,3 @@
-import { FC, ReactNode } from 'react';
-import { Density } from '../../core/types.js';
-export type SupportLabelType = "help" | "error" | "warning" | "success";
-export interface SupportLabelProps {
-    /**
-     * En ID er påkrevd for å kunne referere til SupportLabel med aria-describedby.
-     *
-     * @example
-     *  ```tsx
-     *  const uid = useId();
-     *  const supportId = useId();
-     *  const hasSupportText = helpLabel || errorLabel;
-     *  const describedBy = hasSupportText ? supportId : undefined;
-     *
-     *  return (
-     *    <div>
-     *      <Label standAlone htmlFor={uid}>
-     *        Velg en tekst
-     *      </Label>
-     *      <select
-     *        id={uid}
-     *        aria-describedby={describedBy}
-     *      >
-     *        <option value="e">Example</option>
-     *      </select>
-     *      <SupportLabel
-     *        id={supportId}
-     *        label={errorLabel}
-     *        labelType="error"
-     *        density={density}
-     *      />
-     *    </div>
-     *  );
-     *  ```
-     */
-    id: string;
-    /**
-     * @deprecated Bruk `label` for å få samme resultat.
-     */
-    helpLabel?: ReactNode;
-    /**
-     * @deprecated Bruk `label` og `labelType="warning"` for å få samme resultat.
-     */
-    errorLabel?: ReactNode;
-    label?: ReactNode;
-    /**
-     * Bestemmer hvilket ikon som skal vises:
-     *
-     * - "help" viser ikke noe ikon
-     * - "warning" viser WarningIcon, det som tidligere ble vist med `errorLabel`
-     * - "error" viser ErrorIcon
-     * - "success" viser SuccessIcon
-     *
-     * @default "help"
-     */
-    labelType?: SupportLabelType;
-    density?: Density;
-    className?: string;
-    srOnly?: boolean;
-}
+import { FC } from 'react';
+import { SupportLabelProps } from './types.js';
 export declare const SupportLabel: FC<SupportLabelProps>;

package/build/es/components/input-group/SupportLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"SupportLabel.js","sources":["../../../../src/components/input-group/SupportLabel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC, type ReactNode } from \"react\";\nimport { Density } from \"../../core/types.js\";\nimport { ErrorIcon } from \"../icon/icons/ErrorIcon.js\";\nimport { SuccessIcon } from \"../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../icon/icons/WarningIcon.js\";\n\nexport type SupportLabelType = \"help\" | \"error\" | \"warning\" | \"success\";\n\nexport interface SupportLabelProps {\n    /**\n     * En ID er påkrevd for å kunne referere til SupportLabel med aria-describedby.\n     *\n     * @example\n     *  ```tsx\n     *  const uid = useId();\n     *  const supportId = useId();\n     *  const hasSupportText = helpLabel || errorLabel;\n     *  const describedBy = hasSupportText ? supportId : undefined;\n     *\n     *  return (\n     *    <div>\n     *      <Label standAlone htmlFor={uid}>\n     *        Velg en tekst\n     *      </Label>\n     *      <select\n     *        id={uid}\n     *        aria-describedby={describedBy}\n     *      >\n     *        <option value=\"e\">Example</option>\n     *      </select>\n     *      <SupportLabel\n     *        id={supportId}\n     *        label={errorLabel}\n     *        labelType=\"error\"\n     *        density={density}\n     *      />\n     *    </div>\n     *  );\n     *  ```\n     */\n    id: string;\n    /**\n     * @deprecated Bruk `label` for å få samme resultat.\n     */\n    helpLabel?: ReactNode;\n    /**\n     * @deprecated Bruk `label` og `labelType=\"warning\"` for å få samme resultat.\n     */\n    errorLabel?: ReactNode;\n    label?: ReactNode;\n    /**\n     * Bestemmer hvilket ikon som skal vises:\n     *\n     * - \"help\" viser ikke noe ikon\n     * - \"warning\" viser WarningIcon, det som tidligere ble vist med `errorLabel`\n     * - \"error\" viser ErrorIcon\n     * - \"success\" viser SuccessIcon\n     *\n     * @default \"help\"\n     */\n    labelType?: SupportLabelType;\n    density?: Density;\n    className?: string;\n    srOnly?: boolean;\n}\n\nexport const SupportLabel: FC<SupportLabelProps> = ({\n    id,\n    helpLabel,\n    errorLabel,\n    label,\n    labelType = \"help\",\n    density,\n    className,\n    srOnly,\n    ...rest\n}) => {\n    const hasLabel = errorLabel || helpLabel || label;\n\n    const isHelp = labelType === \"help\" || (helpLabel && !errorLabel);\n    const isWarning = labelType === \"warning\" || errorLabel;\n    const isError = labelType === \"error\";\n    const isSuccess = labelType === \"success\";\n\n    const componentClassName = hasLabel\n        ? clsx(\"jkl-form-support-label\", className, {\n              \"jkl-form-support-label--sr-only\": srOnly,\n              \"jkl-form-support-label--help\": isHelp,\n              \"jkl-form-support-label--error\": isError,\n              \"jkl-form-support-label--warning\": isWarning,\n              \"jkl-form-support-label--success\": isSuccess,\n          })\n        : \"jkl-dormant-form-support-label\";\n\n    const restProps = hasLabel ? rest : {};\n\n    const Icon = isError ? ErrorIcon : isSuccess ? SuccessIcon : WarningIcon;\n\n    return (\n        <span\n            id={id}\n            className={componentClassName}\n            {...restProps}\n            data-density={density}\n        >\n            <Icon variant=\"small\" className=\"jkl-form-support-label__icon\" />\n            <span>{errorLabel || helpLabel || label}</span>\n        </span>\n    );\n};\n"],"names":["SupportLabel","id","helpLabel","errorLabel","label","labelType","density","className","srOnly","rest","hasLabel","isError","isSuccess","componentClassName","clsx","jsxs","children","jsx","ErrorIcon","SuccessIcon","WarningIcon","variant"],"mappings":"6QAmEO,MAAMA,EAAsC,EAC/CC,GAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,MAAAA,EACAC,UAAAA,EAAY,OACZC,QAAAA,EACAC,UAAAA,EACAC,OAAAA,KACGC,MAEGC,MAAAA,EAAWP,GAAcD,GAAaE,EAItCO,EAAwB,UAAdN,EACVO,EAA0B,YAAdP,EAEZQ,EAAqBH,EACrBI,EAAK,yBAA0BP,EAAW,CACtC,kCAAmCC,EACnC,+BARmB,SAAdH,GAAyBH,IAAcC,EAS5C,gCAAiCQ,EACjC,kCATsB,YAAdN,GAA2BF,EAUnC,kCAAmCS,IAEvC,iCAOF,OAAAG,EAAC,OAAA,CACGd,GAAAA,EACAM,UAAWM,KAPDH,EAAWD,EAAO,GAS5B,eAAcH,EAEdU,SAAA,CAAAC,EATKN,EAAUO,EAAYN,EAAYO,EAAcC,EAS/C,CAAAC,QAAQ,QAAQd,UAAU,iCAC/BU,EAAA,OAAA,CAAMD,SAAcb,GAAAD,GAAaE,MAAM"}
+{"version":3,"file":"SupportLabel.js","sources":["../../../../src/components/input-group/SupportLabel.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { type FC } from \"react\";\nimport { ErrorIcon } from \"../icon/icons/ErrorIcon.js\";\nimport { SuccessIcon } from \"../icon/icons/SuccessIcon.js\";\nimport { WarningIcon } from \"../icon/icons/WarningIcon.js\";\nimport { SupportLabelProps } from \"./types.js\";\n\nexport const SupportLabel: FC<SupportLabelProps> = ({\n    id,\n    helpLabel,\n    errorLabel,\n    label,\n    labelType = \"help\",\n    density,\n    className,\n    srOnly,\n    ...rest\n}) => {\n    const hasLabel = errorLabel || helpLabel || label;\n\n    const isHelp = labelType === \"help\" || (helpLabel && !errorLabel);\n    const isWarning = labelType === \"warning\" || errorLabel;\n    const isError = labelType === \"error\";\n    const isSuccess = labelType === \"success\";\n\n    const componentClassName = hasLabel\n        ? clsx(\"jkl-form-support-label\", className, {\n              \"jkl-form-support-label--sr-only\": srOnly,\n              \"jkl-form-support-label--help\": isHelp,\n              \"jkl-form-support-label--error\": isError,\n              \"jkl-form-support-label--warning\": isWarning,\n              \"jkl-form-support-label--success\": isSuccess,\n          })\n        : \"jkl-dormant-form-support-label\";\n\n    const restProps = hasLabel ? rest : {};\n\n    const Icon = isError ? ErrorIcon : isSuccess ? SuccessIcon : WarningIcon;\n\n    return (\n        <span\n            id={id}\n            className={componentClassName}\n            {...restProps}\n            data-density={density}\n        >\n            <Icon variant=\"small\" className=\"jkl-form-support-label__icon\" />\n            <span>{errorLabel || helpLabel || label}</span>\n        </span>\n    );\n};\n"],"names":["SupportLabel","id","helpLabel","errorLabel","label","labelType","density","className","srOnly","rest","hasLabel","isError","isSuccess","componentClassName","clsx","jsxs","children","jsx","ErrorIcon","SuccessIcon","WarningIcon","variant"],"mappings":"6QAOO,MAAMA,EAAsC,EAC/CC,GAAAA,EACAC,UAAAA,EACAC,WAAAA,EACAC,MAAAA,EACAC,UAAAA,EAAY,OACZC,QAAAA,EACAC,UAAAA,EACAC,OAAAA,KACGC,MAEGC,MAAAA,EAAWP,GAAcD,GAAaE,EAItCO,EAAwB,UAAdN,EACVO,EAA0B,YAAdP,EAEZQ,EAAqBH,EACrBI,EAAK,yBAA0BP,EAAW,CACtC,kCAAmCC,EACnC,+BARmB,SAAdH,GAAyBH,IAAcC,EAS5C,gCAAiCQ,EACjC,kCATsB,YAAdN,GAA2BF,EAUnC,kCAAmCS,IAEvC,iCAOF,OAAAG,EAAC,OAAA,CACGd,GAAAA,EACAM,UAAWM,KAPDH,EAAWD,EAAO,GAS5B,eAAcH,EAEdU,SAAA,CAAAC,EATKN,EAAUO,EAAYN,EAAYO,EAAcC,EAS/C,CAAAC,QAAQ,QAAQd,UAAU,iCAC/BU,EAAA,OAAA,CAAMD,SAAcb,GAAAD,GAAaE,MAAM"}

package/build/es/components/input-group/index.d.ts

@@ -1,4 +1,5 @@
-export { FieldGroup, type FieldGroupProps } from './FieldGroup.js';
-export { InputGroup, type InputGroupProps, type InputProps, } from './InputGroup.js';
-export { Label, type LabelProps, type LabelVariant } from './Label.js';
-export { SupportLabel, type SupportLabelProps, type SupportLabelType, } from './SupportLabel.js';
+export { FieldGroup } from './FieldGroup.js';
+export { InputGroup } from './InputGroup.js';
+export { Label } from './Label.js';
+export { SupportLabel } from './SupportLabel.js';
+export type { FieldGroupProps, InputGroupProps, InputProps, LabelProps, LabelVariant, SupportLabelProps, SupportLabelType, } from './types.js';

package/build/es/components/input-group/types.d.ts

@@ -0,0 +1,101 @@
+import { CSSProperties, FieldsetHTMLAttributes, ReactNode } from 'react';
+import { DataTestAutoId, Density, WithChildren, WithOptionalChildren } from '../../core/types.js';
+export interface FieldGroupProps extends DataTestAutoId, FieldsetHTMLAttributes<HTMLFieldSetElement> {
+    legend: string;
+    labelProps?: Omit<LabelProps, "children" | "density">;
+    supportLabelProps?: Omit<SupportLabelProps, "id" | "errorLabel" | "helpLabel" | "density">;
+    tooltip?: ReactNode;
+    className?: string;
+    helpLabel?: string;
+    errorLabel?: string;
+    density?: Density;
+}
+export interface InputProps {
+    "aria-describedby"?: string;
+    "aria-invalid"?: boolean;
+    id?: string;
+}
+export type InputGroupProps = WithOptionalChildren & DataTestAutoId & {
+    id?: string;
+    className?: string;
+    "data-testid"?: string;
+    density?: Density;
+    errorLabel?: ReactNode;
+    helpLabel?: ReactNode;
+    inline?: boolean;
+    label: ReactNode;
+    labelProps?: Omit<LabelProps, "children" | "density">;
+    supportLabelProps?: Omit<SupportLabelProps, "id" | "errorLabel" | "helpLabel" | "density">;
+    tooltip?: ReactNode;
+    style?: CSSProperties;
+    render?: (props: InputProps) => JSX.Element;
+};
+export type LabelVariant = "small" | "medium" | "large";
+export interface LabelProps extends WithChildren {
+    id?: string;
+    variant?: LabelVariant;
+    density?: Density;
+    srOnly?: boolean;
+    standAlone?: boolean;
+    htmlFor?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+export type SupportLabelType = "help" | "error" | "warning" | "success";
+export interface SupportLabelProps {
+    /**
+     * En ID er påkrevd for å kunne referere til SupportLabel med aria-describedby.
+     *
+     * @example
+     *  ```tsx
+     *  const uid = useId();
+     *  const supportId = useId();
+     *  const hasSupportText = helpLabel || errorLabel;
+     *  const describedBy = hasSupportText ? supportId : undefined;
+     *
+     *  return (
+     *    <div>
+     *      <Label standAlone htmlFor={uid}>
+     *        Velg en tekst
+     *      </Label>
+     *      <select
+     *        id={uid}
+     *        aria-describedby={describedBy}
+     *      >
+     *        <option value="e">Example</option>
+     *      </select>
+     *      <SupportLabel
+     *        id={supportId}
+     *        label={errorLabel}
+     *        labelType="error"
+     *        density={density}
+     *      />
+     *    </div>
+     *  );
+     *  ```
+     */
+    id: string;
+    /**
+     * @deprecated Bruk `label` for å få samme resultat.
+     */
+    helpLabel?: ReactNode;
+    /**
+     * @deprecated Bruk `label` og `labelType="warning"` for å få samme resultat.
+     */
+    errorLabel?: ReactNode;
+    label?: ReactNode;
+    /**
+     * Bestemmer hvilket ikon som skal vises:
+     *
+     * - "help" viser ikke noe ikon
+     * - "warning" viser WarningIcon, det som tidligere ble vist med `errorLabel`
+     * - "error" viser ErrorIcon
+     * - "success" viser SuccessIcon
+     *
+     * @default "help"
+     */
+    labelType?: SupportLabelType;
+    density?: Density;
+    className?: string;
+    srOnly?: boolean;
+}

package/build/es/components/input-group/types.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.js.map

package/build/es/components/input-group/types.js.map

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

package/build/es/components/link/Link.d.ts

@@ -1,7 +1,5 @@
 import { default as React } from 'react';
-import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.js';
-export type LinkProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
-    external?: boolean;
-}>;
-export type LinkComponent = <ElementType extends React.ElementType = "a">(props: LinkProps<ElementType>) => React.ReactElement | null;
-export declare const Link: React.ForwardRefExoticComponent<Omit<LinkProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>>;
+import { LinkProps } from './types.js';
+type LinkComponent = <ElementType extends React.ElementType = "a">(props: LinkProps<ElementType>) => React.ReactElement | null;
+export declare const Link: LinkComponent;
+export {};

package/build/es/components/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../../../src/components/link/Link.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport React, { useId } from \"react\";\nimport {\n    PolymorphicPropsWithRef,\n    PolymorphicRef,\n} from \"../../utilities/polymorphism/polymorphism.js\";\nimport { OpenInNewIcon } from \"../icon/icons/OpenInNewIcon.js\";\n\nexport type LinkProps<ElementType extends React.ElementType> =\n    PolymorphicPropsWithRef<\n        ElementType,\n        {\n            external?: boolean;\n        }\n    >;\n\nexport type LinkComponent = <ElementType extends React.ElementType = \"a\">(\n    props: LinkProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const Link = React.forwardRef(function Link<\n    ElementType extends React.ElementType = \"a\",\n>(props: LinkProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        external = false,\n        className = \"\",\n        children,\n        as = \"a\",\n        ...rest\n    } = props;\n    const Component = as;\n\n    const srId = useId();\n\n    return (\n        <Component\n            ref={ref}\n            className={clsx(\"jkl-link\", className, {})}\n            aria-describedby={external ? srId : undefined}\n            {...rest}\n        >\n            <span className=\"jkl-link__content\">{children}</span>\n            {(external || rest.target === \"_blank\") && (\n                <OpenInNewIcon variant=\"small\" />\n            )}\n            {external && (\n                <span hidden={true} id={srId}>\n                    Ekstern lenke\n                </span>\n            )}\n        </Component>\n    );\n});\n"],"names":["Link","React","forwardRef","props","ref","external","className","children","as","rest","Component","srId","useId","jsxs","clsx","jsx","target","OpenInNewIcon","variant","hidden","id"],"mappings":"gMAoBO,MAAMA,EAAOC,EAAMC,YAAW,SAEnCC,EAA+BC,GACvB,MACFC,SAAAA,GAAW,EACXC,UAAAA,EAAY,GACZC,SAAAA,EACAC,GAAAA,EAAK,OACFC,GACHN,EACEO,EAAYF,EAEZG,EAAOC,IAGT,OAAAC,EAACH,EAAA,CACGN,IAAAA,EACAE,UAAWQ,EAAK,WAAYR,EAAW,CAAA,GACvC,mBAAkBD,EAAWM,OAAO,KAChCF,EAEJF,SAAA,CAACQ,EAAA,OAAA,CAAKT,UAAU,oBAAqBC,SAAAA,KACnCF,GAA4B,WAAhBI,EAAKO,SACdD,EAAAE,EAAA,CAAcC,QAAQ,UAE1Bb,GACIU,EAAA,OAAA,CAAKI,QAAQ,EAAMC,GAAIT,EAAMJ,SAE9B,oBAIhB"}
+{"version":3,"file":"Link.js","sources":["../../../../src/components/link/Link.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport React, { useId } from \"react\";\nimport { PolymorphicRef } from \"../../utilities/polymorphism/polymorphism.js\";\nimport { OpenInNewIcon } from \"../icon/icons/OpenInNewIcon.js\";\nimport { LinkProps } from \"./types.js\";\n\ntype LinkComponent = <ElementType extends React.ElementType = \"a\">(\n    props: LinkProps<ElementType>,\n) => React.ReactElement | null;\n\nexport const Link = React.forwardRef(function Link<\n    ElementType extends React.ElementType = \"a\",\n>(props: LinkProps<ElementType>, ref?: PolymorphicRef<ElementType>) {\n    const {\n        external = false,\n        className = \"\",\n        children,\n        as = \"a\",\n        ...rest\n    } = props;\n    const Component = as;\n\n    const srId = useId();\n\n    return (\n        <Component\n            ref={ref}\n            className={clsx(\"jkl-link\", className, {})}\n            aria-describedby={external ? srId : undefined}\n            {...rest}\n        >\n            <span className=\"jkl-link__content\">{children}</span>\n            {(external || rest.target === \"_blank\") && (\n                <OpenInNewIcon variant=\"small\" />\n            )}\n            {external && (\n                <span hidden={true} id={srId}>\n                    Ekstern lenke\n                </span>\n            )}\n        </Component>\n    );\n}) as LinkComponent;\n"],"names":["Link","React","forwardRef","props","ref","external","className","children","as","rest","Component","srId","useId","jsxs","clsx","jsx","target","OpenInNewIcon","variant","hidden","id"],"mappings":"gMAUO,MAAMA,EAAOC,EAAMC,YAAW,SAEnCC,EAA+BC,GACvB,MACFC,SAAAA,GAAW,EACXC,UAAAA,EAAY,GACZC,SAAAA,EACAC,GAAAA,EAAK,OACFC,GACHN,EACEO,EAAYF,EAEZG,EAAOC,IAGT,OAAAC,EAACH,EAAA,CACGN,IAAAA,EACAE,UAAWQ,EAAK,WAAYR,EAAW,CAAA,GACvC,mBAAkBD,EAAWM,OAAO,KAChCF,EAEJF,SAAA,CAACQ,EAAA,OAAA,CAAKT,UAAU,oBAAqBC,SAAAA,KACnCF,GAA4B,WAAhBI,EAAKO,SACdD,EAAAE,EAAA,CAAcC,QAAQ,UAE1Bb,GACIU,EAAA,OAAA,CAAKI,QAAQ,EAAMC,GAAIT,EAAMJ,SAE9B,oBAIhB"}

package/build/es/components/link/index.d.ts

@@ -1,2 +1,2 @@
-export { Link, type LinkProps } from './Link.js';
-export { NavLink, type NavLinkProps } from './NavLink.js';
+export { Link } from './Link.js';
+export type { LinkProps } from './types.js';

package/build/es/components/link/index.js

@@ -1,2 +1,2 @@
-import{Link as i}from"./Link.js";import{NavLink as a}from"./NavLink.js";export{i as Link,a as NavLink};
+import{Link as i}from"./Link.js";export{i as Link};
 //# sourceMappingURL=index.js.map

package/build/es/components/link/types.d.ts

@@ -0,0 +1,4 @@
+import { PolymorphicPropsWithRef } from '../../utilities/polymorphism/polymorphism.js';
+export type LinkProps<ElementType extends React.ElementType> = PolymorphicPropsWithRef<ElementType, {
+    external?: boolean;
+}>;

package/build/es/components/link/types.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=types.js.map

package/build/es/components/link/types.js.map

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

package/build/es/components/loader/Loader.d.ts

@@ -1,16 +1,2 @@
-import { AriaRole } from 'react';
-export type LoaderVariant = "small" | "medium" | "large";
-export interface LoaderProps {
-    variant?: LoaderVariant;
-    textDescription: string;
-    className?: string;
-    dataTestAutoId?: string;
-    role?: AriaRole;
-    inline?: boolean;
-    /**
-     * Antall millisekunder komponenten vil vente før den rendrer
-     * @default 0
-     */
-    delay?: number;
-}
+import { LoaderProps } from './types.js';
 export declare const Loader: ({ delay, variant, textDescription, className, dataTestAutoId, inline, ...rest }: LoaderProps) => JSX.Element | null;

package/build/es/components/loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../../src/components/loader/Loader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AriaRole } from \"react\";\nimport { useDelayedRender } from \"./useDelayedRender.js\";\n\nexport type LoaderVariant = \"small\" | \"medium\" | \"large\";\n\nexport interface LoaderProps {\n    variant?: LoaderVariant;\n    textDescription: string;\n    className?: string;\n    dataTestAutoId?: string;\n    role?: AriaRole;\n    inline?: boolean;\n    /**\n     * Antall millisekunder komponenten vil vente før den rendrer\n     * @default 0\n     */\n    delay?: number;\n}\n\nexport const Loader = ({\n    delay = 0,\n    variant = \"large\",\n    textDescription,\n    className,\n    dataTestAutoId = \"jkl-loader\",\n    inline = false,\n    ...rest\n}: LoaderProps): JSX.Element | null => {\n    const renderComponent = useDelayedRender(delay);\n\n    if (delay && !renderComponent) {\n        return null;\n    }\n\n    const componentClassName = clsx(\"jkl-loader\", className, {\n        \"jkl-loader--medium\": variant === \"medium\",\n        \"jkl-loader--small\": variant === \"small\",\n        \"jkl-loader--inline\": inline,\n    });\n\n    return (\n        <span\n            aria-busy=\"true\"\n            className={componentClassName}\n            data-testautoid={dataTestAutoId}\n            data-testid=\"jkl-loader\"\n            title={textDescription}\n            {...rest}\n        >\n            <span className=\"jkl-loader__dot jkl-loader__dot--left\" />\n            <span className=\"jkl-loader__dot jkl-loader__dot--middle\" />\n            <span className=\"jkl-loader__dot jkl-loader__dot--right\" />\n            <span className=\"jkl-sr-only\">{textDescription}</span>\n        </span>\n    );\n};\n"],"names":["Loader","delay","variant","textDescription","className","dataTestAutoId","inline","rest","renderComponent","useDelayedRender","componentClassName","clsx","jsxs","title","children","jsx"],"mappings":"yJAoBO,MAAMA,EAAS,EAClBC,MAAAA,EAAQ,EACRC,QAAAA,EAAU,QACVC,gBAAAA,EACAC,UAAAA,EACAC,eAAAA,EAAiB,aACjBC,OAAAA,GAAS,KACNC,MAEGC,MAAAA,EAAkBC,EAAiBR,GAErC,GAAAA,IAAUO,EACH,OAAA,KAGLE,MAAAA,EAAqBC,EAAK,aAAcP,EAAW,CACrD,qBAAkC,WAAZF,EACtB,oBAAiC,UAAZA,EACrB,qBAAsBI,IAItB,OAAAM,EAAC,OAAA,CACG,YAAU,OACVR,UAAWM,EACX,kBAAiBL,EACjB,cAAY,aACZQ,MAAOV,KACHI,EAEJO,SAAA,CAACC,EAAA,OAAA,CAAKX,UAAU,0CAChBW,EAAC,OAAK,CAAAX,UAAU,4CAChBW,EAAC,OAAK,CAAAX,UAAU,2CACfW,EAAA,OAAA,CAAKX,UAAU,cAAeU,SAAgBX,MAAA"}
+{"version":3,"file":"Loader.js","sources":["../../../../src/components/loader/Loader.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { LoaderProps } from \"./types.js\";\nimport { useDelayedRender } from \"./useDelayedRender.js\";\n\nexport const Loader = ({\n    delay = 0,\n    variant = \"large\",\n    textDescription,\n    className,\n    dataTestAutoId = \"jkl-loader\",\n    inline = false,\n    ...rest\n}: LoaderProps): JSX.Element | null => {\n    const renderComponent = useDelayedRender(delay);\n\n    if (delay && !renderComponent) {\n        return null;\n    }\n\n    const componentClassName = clsx(\"jkl-loader\", className, {\n        \"jkl-loader--medium\": variant === \"medium\",\n        \"jkl-loader--small\": variant === \"small\",\n        \"jkl-loader--inline\": inline,\n    });\n\n    return (\n        <span\n            aria-busy=\"true\"\n            className={componentClassName}\n            data-testautoid={dataTestAutoId}\n            data-testid=\"jkl-loader\"\n            title={textDescription}\n            {...rest}\n        >\n            <span className=\"jkl-loader__dot jkl-loader__dot--left\" />\n            <span className=\"jkl-loader__dot jkl-loader__dot--middle\" />\n            <span className=\"jkl-loader__dot jkl-loader__dot--right\" />\n            <span className=\"jkl-sr-only\">{textDescription}</span>\n        </span>\n    );\n};\n"],"names":["Loader","delay","variant","textDescription","className","dataTestAutoId","inline","rest","renderComponent","useDelayedRender","componentClassName","clsx","jsxs","title","children","jsx"],"mappings":"yJAKO,MAAMA,EAAS,EAClBC,MAAAA,EAAQ,EACRC,QAAAA,EAAU,QACVC,gBAAAA,EACAC,UAAAA,EACAC,eAAAA,EAAiB,aACjBC,OAAAA,GAAS,KACNC,MAEGC,MAAAA,EAAkBC,EAAiBR,GAErC,GAAAA,IAAUO,EACH,OAAA,KAGLE,MAAAA,EAAqBC,EAAK,aAAcP,EAAW,CACrD,qBAAkC,WAAZF,EACtB,oBAAiC,UAAZA,EACrB,qBAAsBI,IAItB,OAAAM,EAAC,OAAA,CACG,YAAU,OACVR,UAAWM,EACX,kBAAiBL,EACjB,cAAY,aACZQ,MAAOV,KACHI,EAEJO,SAAA,CAACC,EAAA,OAAA,CAAKX,UAAU,0CAChBW,EAAC,OAAK,CAAAX,UAAU,4CAChBW,EAAC,OAAK,CAAAX,UAAU,2CACfW,EAAA,OAAA,CAAKX,UAAU,cAAeU,SAAgBX,MAAA"}

package/build/es/components/loader/index.d.ts

@@ -1,9 +1,10 @@
-export { Loader, type LoaderVariant, type LoaderProps } from './Loader.js';
-export { SkeletonAnimation, type SkeletonAnimationProps, } from './skeletons/SkeletonAnimation.js';
-export { SkeletonButton, type SkeletonButtonProps, } from './skeletons/SkeletonButton.js';
-export { SkeletonCheckboxGroup, type SkeletonCheckboxGroupProps, } from './skeletons/SkeletonCheckboxGroup.js';
-export { SkeletonElement, type SkeletonElementProps, } from './skeletons/SkeletonElement.js';
-export { SkeletonInput, type SkeletonInputProps, } from './skeletons/SkeletonInput.js';
-export { SkeletonRadioButtonGroup, type SkeletonRadioButtonGroupProps, } from './skeletons/SkeletonRadioButtonGroup.js';
-export { SkeletonTable, SkeletonTableHeader, SkeletonTableRow, type SkeletonTableProps, type SkeletonTableHeaderProps, type SkeletonTableRowProps, } from './skeletons/SkeletonTable.js';
-export { SkeletonTextArea, type SkeletonTextAreaProps, } from './skeletons/SkeletonTextArea.js';
+export { Loader } from './Loader.js';
+export { SkeletonAnimation } from './skeletons/SkeletonAnimation.js';
+export { SkeletonButton } from './skeletons/SkeletonButton.js';
+export { SkeletonCheckboxGroup } from './skeletons/SkeletonCheckboxGroup.js';
+export { SkeletonElement } from './skeletons/SkeletonElement.js';
+export { SkeletonInput } from './skeletons/SkeletonInput.js';
+export { SkeletonRadioButtonGroup } from './skeletons/SkeletonRadioButtonGroup.js';
+export { SkeletonTable, SkeletonTableHeader, SkeletonTableRow, } from './skeletons/SkeletonTable.js';
+export { SkeletonTextArea } from './skeletons/SkeletonTextArea.js';
+export type { LoaderVariant, LoaderProps, SkeletonAnimationProps, SkeletonButtonProps, SkeletonCheckboxGroupProps, SkeletonElementProps, SkeletonInputProps, SkeletonRadioButtonGroupProps, SkeletonTableProps, SkeletonTableHeaderProps, SkeletonTableRowProps, SkeletonTextAreaProps, } from './types.js';

package/build/es/components/loader/skeletons/SkeletonAnimation.d.ts

@@ -1,16 +1,3 @@
-import { default as React, AriaRole, HTMLProps, ReactNode } from 'react';
-import { Density } from '../../../core/types.js';
-export interface SkeletonAnimationProps extends Pick<HTMLProps<HTMLDivElement>, "style"> {
-    className?: string;
-    children: ReactNode;
-    density?: Density;
-    /** @default "Vennligst vent" */
-    textDescription?: string;
-    role?: AriaRole;
-    /**
-     * Antall millisekunder komponenten vil vente før den rendrer
-     * @default 0
-     */
-    delay?: number;
-}
+import { default as React } from 'react';
+import { SkeletonAnimationProps } from '../types.js';
 export declare const SkeletonAnimation: ({ className, delay, density, textDescription, ...rest }: SkeletonAnimationProps) => React.JSX.Element | null;

package/build/es/components/loader/skeletons/SkeletonAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonAnimation.js","sources":["../../../../../src/components/loader/skeletons/SkeletonAnimation.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { AriaRole, HTMLProps, ReactNode } from \"react\";\nimport { Density } from \"../../../core/types.js\";\nimport { useDelayedRender } from \"../useDelayedRender.js\";\n\nexport interface SkeletonAnimationProps\n    extends Pick<HTMLProps<HTMLDivElement>, \"style\"> {\n    className?: string;\n    children: ReactNode;\n    density?: Density;\n    /** @default \"Vennligst vent\" */\n    textDescription?: string;\n    role?: AriaRole;\n    /**\n     * Antall millisekunder komponenten vil vente før den rendrer\n     * @default 0\n     */\n    delay?: number;\n}\n\nexport const SkeletonAnimation = ({\n    className,\n    delay = 0,\n    density,\n    textDescription = \"Vennligst vent\",\n    ...rest\n}: SkeletonAnimationProps) => {\n    const renderComponent = useDelayedRender(delay);\n\n    if (delay && !renderComponent) {\n        return null;\n    }\n\n    return (\n        <div\n            className={clsx(\"jkl-skeleton-animation\", className)}\n            aria-busy=\"true\"\n            aria-label={textDescription}\n            {...rest}\n            data-density={density}\n        />\n    );\n};\n"],"names":["SkeletonAnimation","className","delay","density","textDescription","rest","renderComponent","useDelayedRender","jsx","clsx"],"mappings":"mJAoBO,MAAMA,EAAoB,EAC7BC,UAAAA,EACAC,MAAAA,EAAQ,EACRC,QAAAA,EACAC,gBAAAA,EAAkB,oBACfC,MAEGC,MAAAA,EAAkBC,EAAiBL,GAErC,OAAAA,IAAUI,EACH,KAIPE,EAAC,MAAA,CACGP,UAAWQ,EAAK,yBAA0BR,GAC1C,YAAU,OACV,aAAYG,KACRC,EACJ,eAAcF,GAAA"}
+{"version":3,"file":"SkeletonAnimation.js","sources":["../../../../../src/components/loader/skeletons/SkeletonAnimation.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { SkeletonAnimationProps } from \"../types.js\";\nimport { useDelayedRender } from \"../useDelayedRender.js\";\n\nexport const SkeletonAnimation = ({\n    className,\n    delay = 0,\n    density,\n    textDescription = \"Vennligst vent\",\n    ...rest\n}: SkeletonAnimationProps) => {\n    const renderComponent = useDelayedRender(delay);\n\n    if (delay && !renderComponent) {\n        return null;\n    }\n\n    return (\n        <div\n            className={clsx(\"jkl-skeleton-animation\", className)}\n            aria-busy=\"true\"\n            aria-label={textDescription}\n            {...rest}\n            data-density={density}\n        />\n    );\n};\n"],"names":["SkeletonAnimation","className","delay","density","textDescription","rest","renderComponent","useDelayedRender","jsx","clsx"],"mappings":"mJAKO,MAAMA,EAAoB,EAC7BC,UAAAA,EACAC,MAAAA,EAAQ,EACRC,QAAAA,EACAC,gBAAAA,EAAkB,oBACfC,MAEGC,MAAAA,EAAkBC,EAAiBL,GAErC,OAAAA,IAAUI,EACH,KAIPE,EAAC,MAAA,CACGP,UAAWQ,EAAK,yBAA0BR,GAC1C,YAAU,OACV,aAAYG,KACRC,EACJ,eAAcF,GAAA"}

package/build/es/components/loader/skeletons/SkeletonButton.d.ts

@@ -1,7 +1,3 @@
 import { default as React } from 'react';
-import { Density } from '../../../core/types.js';
-import { SkeletonElementProps } from './SkeletonElement.js';
-export interface SkeletonButtonProps extends Omit<SkeletonElementProps, "height"> {
-    density?: Density;
-}
+import { SkeletonButtonProps } from '../types.js';
 export declare const SkeletonButton: ({ style, density, ...rest }: SkeletonButtonProps) => React.JSX.Element;

package/build/es/components/loader/skeletons/SkeletonButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonButton.js","sources":["../../../../../src/components/loader/skeletons/SkeletonButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { Density } from \"../../../core/types.js\";\nimport { SkeletonElement, SkeletonElementProps } from \"./SkeletonElement.js\";\n\nexport interface SkeletonButtonProps\n    extends Omit<SkeletonElementProps, \"height\"> {\n    density?: Density;\n}\n\nexport const SkeletonButton = ({\n    style,\n    density,\n    ...rest\n}: SkeletonButtonProps) => {\n    return (\n        <SkeletonElement\n            {...rest}\n            height={density === \"compact\" ? 24 : 40}\n            style={{ borderRadius: \"999px\", ...style }}\n        />\n    );\n};\n"],"names":["SkeletonButton","style","density","rest","jsx","SkeletonElement","height","borderRadius"],"mappings":"+FASO,MAAMA,EAAiB,EAC1BC,MAAAA,EACAC,QAAAA,KACGC,KAGCC,EAACC,EAAA,IACOF,EACJG,OAAoB,YAAZJ,EAAwB,GAAK,GACrCD,MAAO,CAAEM,aAAc,WAAYN"}
+{"version":3,"file":"SkeletonButton.js","sources":["../../../../../src/components/loader/skeletons/SkeletonButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { SkeletonButtonProps } from \"../types.js\";\nimport { SkeletonElement } from \"./SkeletonElement.js\";\n\nexport const SkeletonButton = ({\n    style,\n    density,\n    ...rest\n}: SkeletonButtonProps) => {\n    return (\n        <SkeletonElement\n            {...rest}\n            height={density === \"compact\" ? 24 : 40}\n            style={{ borderRadius: \"999px\", ...style }}\n        />\n    );\n};\n"],"names":["SkeletonButton","style","density","rest","jsx","SkeletonElement","height","borderRadius"],"mappings":"+FAIO,MAAMA,EAAiB,EAC1BC,MAAAA,EACAC,QAAAA,KACGC,KAGCC,EAACC,EAAA,IACOF,EACJG,OAAoB,YAAZJ,EAAwB,GAAK,GACrCD,MAAO,CAAEM,aAAc,WAAYN"}

package/build/es/components/loader/skeletons/SkeletonCheckboxGroup.d.ts

@@ -1,12 +1,3 @@
 import { default as React } from 'react';
-import { Density } from '../../../core/types.js';
-import { SkeletonElementProps } from './SkeletonElement.js';
-import { SkeletonLabelProps } from './SkeletonLabel.js';
-export interface SkeletonCheckboxGroupProps {
-    className?: string;
-    checkboxes: number;
-    density?: Density;
-    labelProps?: SkeletonLabelProps;
-    inputProps?: SkeletonElementProps;
-}
+import { SkeletonCheckboxGroupProps } from '../types.js';
 export declare const SkeletonCheckboxGroup: ({ className, checkboxes, density, labelProps, inputProps, ...rest }: SkeletonCheckboxGroupProps) => React.JSX.Element;

package/build/es/components/loader/skeletons/SkeletonCheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonCheckboxGroup.js","sources":["../../../../../src/components/loader/skeletons/SkeletonCheckboxGroup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Density } from \"../../../core/types.js\";\nimport { SkeletonElement, SkeletonElementProps } from \"./SkeletonElement.js\";\nimport { SkeletonLabel, SkeletonLabelProps } from \"./SkeletonLabel.js\";\n\nexport interface SkeletonCheckboxGroupProps {\n    className?: string;\n    checkboxes: number;\n    density?: Density;\n    labelProps?: SkeletonLabelProps;\n    inputProps?: SkeletonElementProps;\n}\n\nexport const SkeletonCheckboxGroup = ({\n    className,\n    checkboxes,\n    density,\n    labelProps,\n    inputProps,\n    ...rest\n}: SkeletonCheckboxGroupProps) => {\n    const compact = density === \"compact\";\n    return (\n        <div className={clsx(\"jkl-skeleton-input\", className)} {...rest}>\n            <SkeletonLabel density={density} {...labelProps} />\n            {Array.from(Array(checkboxes)).map((_, index) => (\n                <div\n                    key={`jkl-skeleton-checkbox-${index}`}\n                    className=\"jkl-skeleton-input__checkbox\"\n                >\n                    <SkeletonElement\n                        width={compact ? 22 : 24}\n                        height={compact ? 22 : 24}\n                    />\n                    <SkeletonElement\n                        width={compact ? 201 : 216}\n                        height={compact ? 22 : 24}\n                        {...inputProps}\n                    />\n                </div>\n            ))}\n        </div>\n    );\n};\n"],"names":["SkeletonCheckboxGroup","className","checkboxes","density","labelProps","inputProps","rest","compact","jsxs","clsx","children","jsx","SkeletonLabel","Array","from","map","_","index","SkeletonElement","width","height"],"mappings":"6MAcO,MAAMA,EAAwB,EACjCC,UAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,WAAAA,KACGC,MAEH,MAAMC,EAAsB,YAAZJ,EAEZ,OAAAK,EAAC,OAAIP,UAAWQ,EAAK,qBAAsBR,MAAgBK,EACvDI,SAAA,CAACC,EAAAC,EAAA,CAAcT,QAAAA,KAAsBC,IACpCS,MAAMC,KAAKD,MAAMX,IAAaa,KAAI,CAACC,EAAGC,IACnCT,EAAC,MAAA,CAEGP,UAAU,+BAEVS,SAAA,CAAAC,EAACO,EAAA,CACGC,MAAOZ,EAAU,GAAK,GACtBa,OAAQb,EAAU,GAAK,KAE3BI,EAACO,EAAA,CACGC,MAAOZ,EAAU,IAAM,IACvBa,OAAQb,EAAU,GAAK,MACnBF,MAVH,yBAAyBY,SAc1C"}
+{"version":3,"file":"SkeletonCheckboxGroup.js","sources":["../../../../../src/components/loader/skeletons/SkeletonCheckboxGroup.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { SkeletonCheckboxGroupProps } from \"../types.js\";\nimport { SkeletonElement } from \"./SkeletonElement.js\";\nimport { SkeletonLabel } from \"./SkeletonLabel.js\";\n\nexport const SkeletonCheckboxGroup = ({\n    className,\n    checkboxes,\n    density,\n    labelProps,\n    inputProps,\n    ...rest\n}: SkeletonCheckboxGroupProps) => {\n    const compact = density === \"compact\";\n    return (\n        <div className={clsx(\"jkl-skeleton-input\", className)} {...rest}>\n            <SkeletonLabel density={density} {...labelProps} />\n            {Array.from(Array(checkboxes)).map((_, index) => (\n                <div\n                    key={`jkl-skeleton-checkbox-${index}`}\n                    className=\"jkl-skeleton-input__checkbox\"\n                >\n                    <SkeletonElement\n                        width={compact ? 22 : 24}\n                        height={compact ? 22 : 24}\n                    />\n                    <SkeletonElement\n                        width={compact ? 201 : 216}\n                        height={compact ? 22 : 24}\n                        {...inputProps}\n                    />\n                </div>\n            ))}\n        </div>\n    );\n};\n"],"names":["SkeletonCheckboxGroup","className","checkboxes","density","labelProps","inputProps","rest","compact","jsxs","clsx","children","jsx","SkeletonLabel","Array","from","map","_","index","SkeletonElement","width","height"],"mappings":"6MAMO,MAAMA,EAAwB,EACjCC,UAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,WAAAA,KACGC,MAEH,MAAMC,EAAsB,YAAZJ,EAEZ,OAAAK,EAAC,OAAIP,UAAWQ,EAAK,qBAAsBR,MAAgBK,EACvDI,SAAA,CAACC,EAAAC,EAAA,CAAcT,QAAAA,KAAsBC,IACpCS,MAAMC,KAAKD,MAAMX,IAAaa,KAAI,CAACC,EAAGC,IACnCT,EAAC,MAAA,CAEGP,UAAU,+BAEVS,SAAA,CAAAC,EAACO,EAAA,CACGC,MAAOZ,EAAU,GAAK,GACtBa,OAAQb,EAAU,GAAK,KAE3BI,EAACO,EAAA,CACGC,MAAOZ,EAAU,IAAM,IACvBa,OAAQb,EAAU,GAAK,MACnBF,MAVH,yBAAyBY,SAc1C"}

package/build/es/components/loader/skeletons/SkeletonElement.d.ts

@@ -1,8 +1,3 @@
-import { default as React, HTMLProps } from 'react';
-export interface SkeletonElementProps extends Pick<HTMLProps<HTMLDivElement>, "style"> {
-    className?: string;
-    shape?: "rect" | "circle";
-    width: number | string;
-    height: number | string;
-}
+import { default as React } from 'react';
+import { SkeletonElementProps } from '../types.js';
 export declare const SkeletonElement: ({ shape, width, height, style, className, ...rest }: SkeletonElementProps) => React.JSX.Element;

package/build/es/components/loader/skeletons/SkeletonElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonElement.js","sources":["../../../../../src/components/loader/skeletons/SkeletonElement.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { HTMLProps } from \"react\";\n\nexport interface SkeletonElementProps\n    extends Pick<HTMLProps<HTMLDivElement>, \"style\"> {\n    className?: string;\n    shape?: \"rect\" | \"circle\";\n    width: number | string;\n    height: number | string;\n}\n\nexport const SkeletonElement = ({\n    shape = \"rect\",\n    width,\n    height,\n    style,\n    className,\n    ...rest\n}: SkeletonElementProps) => {\n    return (\n        <div\n            className={clsx(\n                \"jkl-skeleton-element\",\n                `jkl-skeleton-element--${shape}`,\n                className,\n            )}\n            style={{ width, height, ...style }}\n            {...rest}\n        />\n    );\n};\n"],"names":["SkeletonElement","shape","width","height","style","className","rest","jsx","clsx"],"mappings":"yFAWO,MAAMA,EAAkB,EAC3BC,MAAAA,EAAQ,OACRC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,UAAAA,KACGC,KAGCC,EAAC,MAAA,CACGF,UAAWG,EACP,uBACA,yBAAyBP,IACzBI,GAEJD,MAAO,CAAEF,MAAAA,EAAOC,OAAAA,KAAWC,MACvBE"}
+{"version":3,"file":"SkeletonElement.js","sources":["../../../../../src/components/loader/skeletons/SkeletonElement.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { SkeletonElementProps } from \"../types.js\";\n\nexport const SkeletonElement = ({\n    shape = \"rect\",\n    width,\n    height,\n    style,\n    className,\n    ...rest\n}: SkeletonElementProps) => {\n    return (\n        <div\n            className={clsx(\n                \"jkl-skeleton-element\",\n                `jkl-skeleton-element--${shape}`,\n                className,\n            )}\n            style={{ width, height, ...style }}\n            {...rest}\n        />\n    );\n};\n"],"names":["SkeletonElement","shape","width","height","style","className","rest","jsx","clsx"],"mappings":"yFAIO,MAAMA,EAAkB,EAC3BC,MAAAA,EAAQ,OACRC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,UAAAA,KACGC,KAGCC,EAAC,MAAA,CACGF,UAAWG,EACP,uBACA,yBAAyBP,IACzBI,GAEJD,MAAO,CAAEF,MAAAA,EAAOC,OAAAA,KAAWC,MACvBE"}

package/build/es/components/loader/skeletons/SkeletonInput.d.ts

@@ -1,11 +1,3 @@
 import { default as React } from 'react';
-import { Density } from '../../../core/types.js';
-import { SkeletonElementProps } from './SkeletonElement.js';
-import { SkeletonLabelProps } from './SkeletonLabel.js';
-export interface SkeletonInputProps {
-    className?: string;
-    density?: Density;
-    labelProps?: SkeletonLabelProps;
-    inputProps?: SkeletonElementProps;
-}
+import { SkeletonInputProps } from '../types.js';
 export declare const SkeletonInput: ({ className, density, labelProps, inputProps, ...rest }: SkeletonInputProps) => React.JSX.Element;

package/build/es/components/loader/skeletons/SkeletonInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonInput.js","sources":["../../../../../src/components/loader/skeletons/SkeletonInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { Density } from \"../../../core/types.js\";\nimport { SkeletonElementProps, SkeletonElement } from \"./SkeletonElement.js\";\nimport { SkeletonLabel, SkeletonLabelProps } from \"./SkeletonLabel.js\";\n\nexport interface SkeletonInputProps {\n    className?: string;\n    density?: Density;\n    labelProps?: SkeletonLabelProps;\n    inputProps?: SkeletonElementProps;\n}\n\nexport const SkeletonInput = ({\n    className,\n    density,\n    labelProps,\n    inputProps,\n    ...rest\n}: SkeletonInputProps) => {\n    const compact = density === \"compact\";\n    return (\n        <div className={clsx(\"jkl-skeleton-input\", className)} {...rest}>\n            <SkeletonLabel density={density} {...labelProps} />\n            <SkeletonElement\n                width={compact ? 301 : 316}\n                height={compact ? 32 : 48}\n                {...inputProps}\n            />\n        </div>\n    );\n};\n"],"names":["SkeletonInput","className","density","labelProps","inputProps","rest","compact","jsxs","clsx","children","jsx","SkeletonLabel","SkeletonElement","width","height"],"mappings":"6MAaO,MAAMA,EAAgB,EACzBC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,WAAAA,KACGC,MAEH,MAAMC,EAAsB,YAAZJ,EAEZ,OAAAK,EAAC,OAAIN,UAAWO,EAAK,qBAAsBP,MAAgBI,EACvDI,SAAA,CAACC,EAAAC,EAAA,CAAcT,QAAAA,KAAsBC,IACrCO,EAACE,EAAA,CACGC,MAAOP,EAAU,IAAM,IACvBQ,OAAQR,EAAU,GAAK,MACnBF,MAEZ"}
+{"version":3,"file":"SkeletonInput.js","sources":["../../../../../src/components/loader/skeletons/SkeletonInput.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React from \"react\";\nimport { SkeletonInputProps } from \"../types.js\";\nimport { SkeletonElement } from \"./SkeletonElement.js\";\nimport { SkeletonLabel } from \"./SkeletonLabel.js\";\n\nexport const SkeletonInput = ({\n    className,\n    density,\n    labelProps,\n    inputProps,\n    ...rest\n}: SkeletonInputProps) => {\n    const compact = density === \"compact\";\n    return (\n        <div className={clsx(\"jkl-skeleton-input\", className)} {...rest}>\n            <SkeletonLabel density={density} {...labelProps} />\n            <SkeletonElement\n                width={compact ? 301 : 316}\n                height={compact ? 32 : 48}\n                {...inputProps}\n            />\n        </div>\n    );\n};\n"],"names":["SkeletonInput","className","density","labelProps","inputProps","rest","compact","jsxs","clsx","children","jsx","SkeletonLabel","SkeletonElement","width","height"],"mappings":"6MAMO,MAAMA,EAAgB,EACzBC,UAAAA,EACAC,QAAAA,EACAC,WAAAA,EACAC,WAAAA,KACGC,MAEH,MAAMC,EAAsB,YAAZJ,EAEZ,OAAAK,EAAC,OAAIN,UAAWO,EAAK,qBAAsBP,MAAgBI,EACvDI,SAAA,CAACC,EAAAC,EAAA,CAAcT,QAAAA,KAAsBC,IACrCO,EAACE,EAAA,CACGC,MAAOP,EAAU,IAAM,IACvBQ,OAAQR,EAAU,GAAK,MACnBF,MAEZ"}