@bi-digital/react 0.12.3 → 0.12.4

package/dist/components/popover/popover-trigger-context.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"popover-trigger-context.mjs","names":[],"sources":["../../../src/components/popover/popover-trigger-context.tsx"],"sourcesContent":["import { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { createContext, useId, useState } from 'react';\nimport type { ReactNode } from 'react';\n\nexport const Context = createContext<{\n  popoverId?: string;\n  setPopoverId?: (id: string) => void;\n  popoverOpen?: boolean;\n  setPopoverOpen?: React.Dispatch<React.SetStateAction<boolean>>;\n}>({});\n\nexport type PopoverTriggerContextProps = {\n  children: ReactNode;\n  /**\n   * When a boolean is provided, the popover will be controlled.\n   * @default undefined\n   */\n  open?: boolean;\n  /**\n   * Callback when the open state changes.\n   * @param open - The new open state of the popover.\n   */\n  onOpenChange?: (open: boolean) => void;\n};\n\n/**\n * PopoverTriggerContext component, use to wrap a PopoverTrigger and Popover.\n *\n * @example\n * <PopoverTriggerContext>\n *   <PopoverTrigger>Open Popover</PopoverTrigger>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n */\nexport const PopoverTriggerContext = ({ children, open, onOpenChange }: PopoverTriggerContextProps) => {\n  const randomPopoverId = useId();\n  const [popoverId, setPopoverId] = useState(randomPopoverId);\n  const [popoverOpen, setPopoverOpen] = useControllableState({\n    prop: open,\n    onChange: onOpenChange,\n    defaultProp: false,\n    caller: 'PopoverTriggerContext',\n  });\n\n  return <Context value={{ popoverId, setPopoverId, popoverOpen, setPopoverOpen }}>{children}</Context>;\n};\n"],"mappings":";;;;AAIA,MAAa,UAAU,cAKpB,EAAE,CAAC;;;;;;;;;;;;AA2BN,MAAa,yBAAyB,EAAE,UAAU,MAAM,mBAA+C;CAErG,MAAM,CAAC,WAAW,gBAAgB,SADV,OACkC,CAAC;CAC3D,MAAM,CAAC,aAAa,kBAAkB,qBAAqB;EACzD,MAAM;EACN,UAAU;EACV,aAAa;EACb,QAAQ;EACT,CAAC;CAEF,OAAO,oBAAC,SAAD;EAAS,OAAO;GAAE;GAAW;GAAc;GAAa;GAAgB;EAAG;EAAmB,CAAA"}
+{"version":3,"file":"popover-trigger-context.mjs","names":[],"sources":["../../../src/components/popover/popover-trigger-context.tsx"],"sourcesContent":["import { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { createContext, useId, useState } from 'react';\nimport type { ReactNode } from 'react';\n\nexport const Context = createContext<{\n  popoverId?: string;\n  setPopoverId?: (id: string) => void;\n  popoverOpen?: boolean;\n  setPopoverOpen?: React.Dispatch<React.SetStateAction<boolean>>;\n}>({});\n\nexport type PopoverTriggerContextProps = {\n  children: ReactNode;\n  /**\n   * When a boolean is provided, the popover will be controlled.\n   * @default undefined\n   */\n  open?: boolean;\n  /**\n   * Callback when the open state changes.\n   * @param open - The new open state of the popover.\n   */\n  onOpenChange?: (open: boolean) => void;\n};\n\n/**\n * PopoverTriggerContext component, use to wrap a PopoverTrigger and Popover.\n *\n * @example\n * <PopoverTriggerContext>\n *   <PopoverTrigger>Open Popover</PopoverTrigger>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n */\nexport const PopoverTriggerContext = ({ children, open, onOpenChange }: PopoverTriggerContextProps) => {\n  const randomPopoverId = useId();\n  const [popoverId, setPopoverId] = useState(randomPopoverId);\n  const [popoverOpen, setPopoverOpen] = useControllableState({\n    prop: open,\n    onChange: onOpenChange,\n    defaultProp: false,\n    caller: 'PopoverTriggerContext',\n  });\n\n  return <Context value={{ popoverId, setPopoverId, popoverOpen, setPopoverOpen }}>{children}</Context>;\n};\n"],"mappings":";;;;AAIA,MAAa,UAAU,cAKpB,CAAC,CAAC;;;;;;;;;;;;AA2BL,MAAa,yBAAyB,EAAE,UAAU,MAAM,mBAA+C;CACrG,MAAM,kBAAkB,MAAM;CAC9B,MAAM,CAAC,WAAW,gBAAgB,SAAS,eAAe;CAC1D,MAAM,CAAC,aAAa,kBAAkB,qBAAqB;EACzD,MAAM;EACN,UAAU;EACV,aAAa;EACb,QAAQ;CACV,CAAC;CAED,OAAO,oBAAC,SAAD;EAAS,OAAO;GAAE;GAAW;GAAc;GAAa;EAAe;EAAI;CAAkB,CAAA;AACtG"}

package/dist/components/popover/popover-trigger.d.mts

@@ -1,2 +1,2 @@
-import { Dt as PopoverTrigger, Ot as PopoverTriggerProps } from "../../alert-footer-B80k5mkX.mjs";
+import { Dt as PopoverTrigger, Ot as PopoverTriggerProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { PopoverTrigger, PopoverTriggerProps };

package/dist/components/popover/popover-trigger.mjs

@@ -28,14 +28,16 @@ import { use } from "react";
 */
 const PopoverTrigger = ({ id, inline, asChild, ref, ...rest }) => {
 	const { popoverId, popoverOpen, setPopoverOpen } = use(Context);
-	return /* @__PURE__ */ jsx(asChild ? Slot : inline ? "button" : Button, {
+	const Component = asChild ? Slot : inline ? "button" : Button;
+	const popoverProps = Object.assign({
+		onClick: () => setPopoverOpen?.((prev) => !prev),
+		"aria-controls": popoverId,
+		"aria-expanded": popoverOpen,
+		...inline ? { "data-popover": "inline" } : {}
+	}, rest);
+	return /* @__PURE__ */ jsx(Component, {
 		ref,
-		...Object.assign({
-			onClick: () => setPopoverOpen?.((prev) => !prev),
-			"aria-controls": popoverId,
-			"aria-expanded": popoverOpen,
-			...inline ? { "data-popover": "inline" } : {}
-		}, rest)
+		...popoverProps
 	});
 };
 //#endregion

package/dist/components/popover/popover-trigger.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"popover-trigger.mjs","names":[],"sources":["../../../src/components/popover/popover-trigger.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport { type HTMLAttributes, Ref, use } from 'react';\nimport type { DefaultProps } from '../../types';\nimport { Button, type ButtonProps } from '../button';\nimport { Context } from './popover-trigger-context';\n\nexport type PopoverTriggerProps =\n  | ({\n      /**\n       * Will render the trigger as inline text.\n       * @default false\n       */\n      inline?: true;\n      /**\n       * Change the default rendered element for the one passed as a child, merging their props and behavior.\n       * @default false\n       */\n      asChild?: boolean;\n      ref?: Ref<HTMLButtonElement>;\n    } & HTMLAttributes<HTMLButtonElement> &\n      DefaultProps)\n  | ({\n      /**\n       * Will not render the trigger as inline text.\n       * @default false\n       */\n      inline?: false;\n    } & ButtonProps);\n\n/**\n * PopoverTrigger component, used to trigger a popover.\n *\n * @example\n * <PopoverTriggerContext>\n *   <PopoverTrigger>Open Popover</PopoverTrigger>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n *\n * @example inline\n * <PopoverTriggerContext>\n *   <Paragraph>\n *    We can use it <PopoverTrigger inline={true}>inline</PopoverTrigger>.\n *   </Paragraph>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n */\n// oxlint-disable-next-line no-unused-vars\nexport const PopoverTrigger = ({ id, inline, asChild, ref, ...rest }: PopoverTriggerProps) => {\n  const { popoverId, popoverOpen, setPopoverOpen } = use(Context);\n  const Component = asChild ? Slot : inline ? 'button' : Button;\n\n  const popoverProps = Object.assign(\n    {\n      onClick: () => setPopoverOpen?.((prev) => !prev),\n      'aria-controls': popoverId,\n      'aria-expanded': popoverOpen,\n      ...(inline\n        ? {\n            'data-popover': 'inline',\n          }\n        : {}),\n    },\n    rest,\n  );\n\n  return <Component ref={ref} {...popoverProps} />;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,MAAa,kBAAkB,EAAE,IAAI,QAAQ,SAAS,KAAK,GAAG,WAAgC;CAC5F,MAAM,EAAE,WAAW,aAAa,mBAAmB,IAAI,QAAQ;CAiB/D,OAAO,oBAhBW,UAAU,OAAO,SAAS,WAAW,QAgBhD;EAAgB;EAAK,GAdP,OAAO,OAC1B;GACE,eAAe,kBAAkB,SAAS,CAAC,KAAK;GAChD,iBAAiB;GACjB,iBAAiB;GACjB,GAAI,SACA,EACE,gBAAgB,UACjB,GACD,EAAE;GACP,EACD,KAG0C;EAAI,CAAA"}
+{"version":3,"file":"popover-trigger.mjs","names":[],"sources":["../../../src/components/popover/popover-trigger.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport { type HTMLAttributes, Ref, use } from 'react';\nimport type { DefaultProps } from '../../types';\nimport { Button, type ButtonProps } from '../button';\nimport { Context } from './popover-trigger-context';\n\nexport type PopoverTriggerProps =\n  | ({\n      /**\n       * Will render the trigger as inline text.\n       * @default false\n       */\n      inline?: true;\n      /**\n       * Change the default rendered element for the one passed as a child, merging their props and behavior.\n       * @default false\n       */\n      asChild?: boolean;\n      ref?: Ref<HTMLButtonElement>;\n    } & HTMLAttributes<HTMLButtonElement> &\n      DefaultProps)\n  | ({\n      /**\n       * Will not render the trigger as inline text.\n       * @default false\n       */\n      inline?: false;\n    } & ButtonProps);\n\n/**\n * PopoverTrigger component, used to trigger a popover.\n *\n * @example\n * <PopoverTriggerContext>\n *   <PopoverTrigger>Open Popover</PopoverTrigger>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n *\n * @example inline\n * <PopoverTriggerContext>\n *   <Paragraph>\n *    We can use it <PopoverTrigger inline={true}>inline</PopoverTrigger>.\n *   </Paragraph>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n */\n// oxlint-disable-next-line no-unused-vars\nexport const PopoverTrigger = ({ id, inline, asChild, ref, ...rest }: PopoverTriggerProps) => {\n  const { popoverId, popoverOpen, setPopoverOpen } = use(Context);\n  const Component = asChild ? Slot : inline ? 'button' : Button;\n\n  const popoverProps = Object.assign(\n    {\n      onClick: () => setPopoverOpen?.((prev) => !prev),\n      'aria-controls': popoverId,\n      'aria-expanded': popoverOpen,\n      ...(inline\n        ? {\n            'data-popover': 'inline',\n          }\n        : {}),\n    },\n    rest,\n  );\n\n  return <Component ref={ref} {...popoverProps} />;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmDA,MAAa,kBAAkB,EAAE,IAAI,QAAQ,SAAS,KAAK,GAAG,WAAgC;CAC5F,MAAM,EAAE,WAAW,aAAa,mBAAmB,IAAI,OAAO;CAC9D,MAAM,YAAY,UAAU,OAAO,SAAS,WAAW;CAEvD,MAAM,eAAe,OAAO,OAC1B;EACE,eAAe,kBAAkB,SAAS,CAAC,IAAI;EAC/C,iBAAiB;EACjB,iBAAiB;EACjB,GAAI,SACA,EACE,gBAAgB,SAClB,IACA,CAAC;CACP,GACA,IACF;CAEA,OAAO,oBAAC,WAAD;EAAgB;EAAK,GAAI;CAAe,CAAA;AACjD"}

package/dist/components/popover/popover.d.mts

@@ -1,2 +1,2 @@
-import { At as PopoverProps, kt as Popover } from "../../alert-footer-B80k5mkX.mjs";
+import { At as PopoverProps, kt as Popover } from "../../alert-footer-BoTu7E1s.mjs";
 export { Popover, PopoverProps };

package/dist/components/popover/popover.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"popover.mjs","names":["cl"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["// Thanks to Designsystemet:\n// https://github.com/digdir/designsystemet/blob/8aa6dc274e5b0338d15572f44b5dd3fab6fa4eb1/packages/react/src/components/Popover/Popover.tsx\n\nimport { autoUpdate, computePosition, flip, offset, shift, hide, size } from '@floating-ui/dom';\nimport type { Middleware, Placement } from '@floating-ui/dom';\nimport { Slot } from '@radix-ui/react-slot';\nimport cl from 'clsx/lite';\nimport { use, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useEffect } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\nimport { Context } from './popover-trigger-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { arrowPseudoElement } from '../../vanilla/popover';\n\nexport type PopoverProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * `id` to connect the trigger with the popover - required when not using PopoverContext.\n     */\n    id?: string;\n    /**\n     * Placement of the popover on the trigger.\n     * @default 'top'\n     */\n    placement?: Placement;\n    /**\n     * When a boolean is provided, the popover will be controlled.\n     * @default undefined\n     */\n    open?: boolean;\n    /**\n     * Callback when the open state changes.\n     * @param open - The new open state of the popover.\n     */\n    onOpenChange?: (open: boolean) => void;\n    /**\n     * Whether to disable auto placement.\n     * @default false\n     */\n    disableAutoPlacement?: boolean;\n    /**\n     * Additional middleware to use for positioning the popover.\n     *\n     * @example\n     * Prevent the popover from overflowing the navbar by using the `size` middleware:\n     * ```ts\n     * positionMiddleware={[\n     *  size({\n     *    apply: ({ availableHeight, elements, ...state }) => {\n     *      const available = `${Math.max(0, availableHeight)}px`;\n     *      const maxHeight = state.placement.includes('top')\n     *        ? `calc(${available} - var(--bi-layout-navbar-height, 0))`\n     *        : available;\n     *      elements.floating.style.maxHeight = maxHeight;\n     *    },\n     *    padding,\n     *  })\n     * ]}\n     * ```\n     */\n    positionMiddleware?: Middleware[];\n    /**\n     * The padding used by the `offset` middleware.\n     * @default '20'\n     */\n    padding?: number;\n    /**\n     * Show an arrow on the popover, pointing toward the center of the reference element.\n     * @default false\n     */\n    arrow?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\n/**\n * Popover component, used to display content in a popover over an element.\n *\n * @example with TriggerContext\n * <PopoverTriggerContext>\n *   <PopoverTrigger>Open Popover</PopoverTrigger>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n *\n * @example without TriggerContext\n * <Button aria-controls=\"my-popover\" aria-expanded={open}>Open Popover</Button>\n * <Popover open={open} onOpenChange={onOpenChange} id=\"my-popover\">\n *   Content\n * </Popover>\n */\nexport const Popover = ({\n  id,\n  className,\n  onOpenChange,\n  open,\n  placement = 'top',\n  disableAutoPlacement = false,\n  positionMiddleware = [],\n  padding = 20,\n  arrow = false,\n  asChild = false,\n  ref,\n  ...rest\n}: PopoverProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const isControlled = useRef(open !== undefined);\n  const mergedRefs = useMergeRefs([popoverRef, ref]);\n  const { popoverId, setPopoverId, popoverOpen, setPopoverOpen } = use(Context);\n\n  const [isOpen, setIsOpen] = useControllableState({\n    // False positive: isControlled will never change, but is just used to store the initial controlled state\n    prop: isControlled.current ? open : popoverOpen,\n    onChange: (val) => {\n      onOpenChange?.(val);\n      setPopoverOpen?.(val);\n    },\n    defaultProp: false,\n    caller: 'Popover',\n  });\n\n  useEffect(() => {\n    const popover = popoverRef.current;\n    const handleClick = (event: MouseEvent) => {\n      const el = event.target as Element | null;\n      const isTrigger = el?.closest?.(`[aria-controls=\"${popover?.id}\"]`);\n      const isOutside = !isTrigger && !popover?.contains(el as Node);\n\n      if (isOutside) {\n        setIsOpen(false);\n      }\n    };\n\n    const handleKeydown = (event: KeyboardEvent) => {\n      if (event.key !== 'Escape' || !isOpen) return;\n      event.preventDefault(); // Prevent closing fullscreen in Safari\n      setIsOpen(false);\n    };\n\n    document.addEventListener('click', handleClick, true); // Use capture to execute before React event API\n    document.addEventListener('keydown', handleKeydown);\n    return () => {\n      document.removeEventListener('click', handleClick, true);\n      document.removeEventListener('keydown', handleKeydown);\n    };\n  }, [isOpen, setIsOpen]);\n\n  useEffect(() => {\n    const popover = popoverRef.current;\n    const trigger = document.querySelector(`[aria-controls=\"${popover?.id}\"]`);\n\n    if (popover && trigger && isOpen)\n      return autoUpdate(trigger, popover, () => {\n        computePosition(trigger, popover, {\n          middleware: [\n            offset(padding),\n            ...(disableAutoPlacement ? [] : [flip({ padding }), shift({ padding })]),\n            ...positionMiddleware,\n            hide({ padding, strategy: 'escaped' }),\n            ...(arrow ? [arrowPseudoElement] : []),\n            size({\n              apply({ rects, elements }) {\n                elements.floating.style.setProperty('--bic-popover-trigger-width', `${rects.reference.width}px`);\n              },\n            }),\n          ],\n          strategy: 'fixed',\n          placement,\n        }).then(({ x, y, middlewareData }) => {\n          popover.style.translate = `${x}px ${y}px`;\n          popover.style.visibility = middlewareData.hide?.referenceHidden ? 'hidden' : 'visible';\n        });\n      });\n  }, [isOpen, placement, id, disableAutoPlacement, positionMiddleware, padding, arrow]);\n\n  // Update context with id\n  useEffect(() => {\n    if (id) setPopoverId?.(id);\n  }, [id, setPopoverId]);\n\n  return (\n    <Component\n      className={cl('bi-popover', className)}\n      id={id || popoverId}\n      aria-hidden={!isOpen}\n      data-arrow={arrow || undefined}\n      ref={mergedRefs}\n      {...rest}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA,MAAa,WAAW,EACtB,IACA,WACA,cACA,MACA,YAAY,OACZ,uBAAuB,OACvB,qBAAqB,EAAE,EACvB,UAAU,IACV,QAAQ,OACR,UAAU,OACV,KACA,GAAG,WACe;CAClB,MAAM,YAAY,UAAU,OAAO;CAEnC,MAAM,aAAa,OAAuB,KAAK;CAC/C,MAAM,eAAe,OAAO,SAAS,KAAA,EAAU;CAC/C,MAAM,aAAa,aAAa,CAAC,YAAY,IAAI,CAAC;CAClD,MAAM,EAAE,WAAW,cAAc,aAAa,mBAAmB,IAAI,QAAQ;CAE7E,MAAM,CAAC,QAAQ,aAAa,qBAAqB;EAE/C,MAAM,aAAa,UAAU,OAAO;EACpC,WAAW,QAAQ;GACjB,eAAe,IAAI;GACnB,iBAAiB,IAAI;;EAEvB,aAAa;EACb,QAAQ;EACT,CAAC;CAEF,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,MAAM,eAAe,UAAsB;GACzC,MAAM,KAAK,MAAM;GAIjB,IAFkB,CADA,IAAI,UAAU,mBAAmB,SAAS,GAAG,IAAI,IACnC,CAAC,SAAS,SAAS,GAAW,EAG5D,UAAU,MAAM;;EAIpB,MAAM,iBAAiB,UAAyB;GAC9C,IAAI,MAAM,QAAQ,YAAY,CAAC,QAAQ;GACvC,MAAM,gBAAgB;GACtB,UAAU,MAAM;;EAGlB,SAAS,iBAAiB,SAAS,aAAa,KAAK;EACrD,SAAS,iBAAiB,WAAW,cAAc;EACnD,aAAa;GACX,SAAS,oBAAoB,SAAS,aAAa,KAAK;GACxD,SAAS,oBAAoB,WAAW,cAAc;;IAEvD,CAAC,QAAQ,UAAU,CAAC;CAEvB,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,MAAM,UAAU,SAAS,cAAc,mBAAmB,SAAS,GAAG,IAAI;EAE1E,IAAI,WAAW,WAAW,QACxB,OAAO,WAAW,SAAS,eAAe;GACxC,gBAAgB,SAAS,SAAS;IAChC,YAAY;KACV,OAAO,QAAQ;KACf,GAAI,uBAAuB,EAAE,GAAG,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC;KACvE,GAAG;KACH,KAAK;MAAE;MAAS,UAAU;MAAW,CAAC;KACtC,GAAI,QAAQ,CAAC,mBAAmB,GAAG,EAAE;KACrC,KAAK,EACH,MAAM,EAAE,OAAO,YAAY;MACzB,SAAS,SAAS,MAAM,YAAY,+BAA+B,GAAG,MAAM,UAAU,MAAM,IAAI;QAEnG,CAAC;KACH;IACD,UAAU;IACV;IACD,CAAC,CAAC,MAAM,EAAE,GAAG,GAAG,qBAAqB;IACpC,QAAQ,MAAM,YAAY,GAAG,EAAE,KAAK,EAAE;IACtC,QAAQ,MAAM,aAAa,eAAe,MAAM,kBAAkB,WAAW;KAC7E;IACF;IACH;EAAC;EAAQ;EAAW;EAAI;EAAsB;EAAoB;EAAS;EAAM,CAAC;CAGrF,gBAAgB;EACd,IAAI,IAAI,eAAe,GAAG;IACzB,CAAC,IAAI,aAAa,CAAC;CAEtB,OACE,oBAAC,WAAD;EACE,WAAWA,KAAG,cAAc,UAAU;EACtC,IAAI,MAAM;EACV,eAAa,CAAC;EACd,cAAY,SAAS,KAAA;EACrB,KAAK;EACL,GAAI;EACJ,CAAA"}
+{"version":3,"file":"popover.mjs","names":["cl"],"sources":["../../../src/components/popover/popover.tsx"],"sourcesContent":["// Thanks to Designsystemet:\n// https://github.com/digdir/designsystemet/blob/8aa6dc274e5b0338d15572f44b5dd3fab6fa4eb1/packages/react/src/components/Popover/Popover.tsx\n\nimport { autoUpdate, computePosition, flip, offset, shift, hide, size } from '@floating-ui/dom';\nimport type { Middleware, Placement } from '@floating-ui/dom';\nimport { Slot } from '@radix-ui/react-slot';\nimport cl from 'clsx/lite';\nimport { use, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useEffect } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\nimport { Context } from './popover-trigger-context';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { arrowPseudoElement } from '../../vanilla/popover';\n\nexport type PopoverProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * `id` to connect the trigger with the popover - required when not using PopoverContext.\n     */\n    id?: string;\n    /**\n     * Placement of the popover on the trigger.\n     * @default 'top'\n     */\n    placement?: Placement;\n    /**\n     * When a boolean is provided, the popover will be controlled.\n     * @default undefined\n     */\n    open?: boolean;\n    /**\n     * Callback when the open state changes.\n     * @param open - The new open state of the popover.\n     */\n    onOpenChange?: (open: boolean) => void;\n    /**\n     * Whether to disable auto placement.\n     * @default false\n     */\n    disableAutoPlacement?: boolean;\n    /**\n     * Additional middleware to use for positioning the popover.\n     *\n     * @example\n     * Prevent the popover from overflowing the navbar by using the `size` middleware:\n     * ```ts\n     * positionMiddleware={[\n     *  size({\n     *    apply: ({ availableHeight, elements, ...state }) => {\n     *      const available = `${Math.max(0, availableHeight)}px`;\n     *      const maxHeight = state.placement.includes('top')\n     *        ? `calc(${available} - var(--bi-layout-navbar-height, 0))`\n     *        : available;\n     *      elements.floating.style.maxHeight = maxHeight;\n     *    },\n     *    padding,\n     *  })\n     * ]}\n     * ```\n     */\n    positionMiddleware?: Middleware[];\n    /**\n     * The padding used by the `offset` middleware.\n     * @default '20'\n     */\n    padding?: number;\n    /**\n     * Show an arrow on the popover, pointing toward the center of the reference element.\n     * @default false\n     */\n    arrow?: boolean;\n    /**\n     * Change the default rendered element for the one passed as a child, merging their props and behavior.\n     * @default false\n     */\n    asChild?: boolean;\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\n/**\n * Popover component, used to display content in a popover over an element.\n *\n * @example with TriggerContext\n * <PopoverTriggerContext>\n *   <PopoverTrigger>Open Popover</PopoverTrigger>\n *   <Popover>\n *     Content\n *   </Popover>\n * </PopoverTriggerContext>\n *\n * @example without TriggerContext\n * <Button aria-controls=\"my-popover\" aria-expanded={open}>Open Popover</Button>\n * <Popover open={open} onOpenChange={onOpenChange} id=\"my-popover\">\n *   Content\n * </Popover>\n */\nexport const Popover = ({\n  id,\n  className,\n  onOpenChange,\n  open,\n  placement = 'top',\n  disableAutoPlacement = false,\n  positionMiddleware = [],\n  padding = 20,\n  arrow = false,\n  asChild = false,\n  ref,\n  ...rest\n}: PopoverProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const isControlled = useRef(open !== undefined);\n  const mergedRefs = useMergeRefs([popoverRef, ref]);\n  const { popoverId, setPopoverId, popoverOpen, setPopoverOpen } = use(Context);\n\n  const [isOpen, setIsOpen] = useControllableState({\n    // False positive: isControlled will never change, but is just used to store the initial controlled state\n    prop: isControlled.current ? open : popoverOpen,\n    onChange: (val) => {\n      onOpenChange?.(val);\n      setPopoverOpen?.(val);\n    },\n    defaultProp: false,\n    caller: 'Popover',\n  });\n\n  useEffect(() => {\n    const popover = popoverRef.current;\n    const handleClick = (event: MouseEvent) => {\n      const el = event.target as Element | null;\n      const isTrigger = el?.closest?.(`[aria-controls=\"${popover?.id}\"]`);\n      const isOutside = !isTrigger && !popover?.contains(el as Node);\n\n      if (isOutside) {\n        setIsOpen(false);\n      }\n    };\n\n    const handleKeydown = (event: KeyboardEvent) => {\n      if (event.key !== 'Escape' || !isOpen) return;\n      event.preventDefault(); // Prevent closing fullscreen in Safari\n      setIsOpen(false);\n    };\n\n    document.addEventListener('click', handleClick, true); // Use capture to execute before React event API\n    document.addEventListener('keydown', handleKeydown);\n    return () => {\n      document.removeEventListener('click', handleClick, true);\n      document.removeEventListener('keydown', handleKeydown);\n    };\n  }, [isOpen, setIsOpen]);\n\n  useEffect(() => {\n    const popover = popoverRef.current;\n    const trigger = document.querySelector(`[aria-controls=\"${popover?.id}\"]`);\n\n    if (popover && trigger && isOpen)\n      return autoUpdate(trigger, popover, () => {\n        computePosition(trigger, popover, {\n          middleware: [\n            offset(padding),\n            ...(disableAutoPlacement ? [] : [flip({ padding }), shift({ padding })]),\n            ...positionMiddleware,\n            hide({ padding, strategy: 'escaped' }),\n            ...(arrow ? [arrowPseudoElement] : []),\n            size({\n              apply({ rects, elements }) {\n                elements.floating.style.setProperty('--bic-popover-trigger-width', `${rects.reference.width}px`);\n              },\n            }),\n          ],\n          strategy: 'fixed',\n          placement,\n        }).then(({ x, y, middlewareData }) => {\n          popover.style.translate = `${x}px ${y}px`;\n          popover.style.visibility = middlewareData.hide?.referenceHidden ? 'hidden' : 'visible';\n        });\n      });\n  }, [isOpen, placement, id, disableAutoPlacement, positionMiddleware, padding, arrow]);\n\n  // Update context with id\n  useEffect(() => {\n    if (id) setPopoverId?.(id);\n  }, [id, setPopoverId]);\n\n  return (\n    <Component\n      className={cl('bi-popover', className)}\n      id={id || popoverId}\n      aria-hidden={!isOpen}\n      data-arrow={arrow || undefined}\n      ref={mergedRefs}\n      {...rest}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAqGA,MAAa,WAAW,EACtB,IACA,WACA,cACA,MACA,YAAY,OACZ,uBAAuB,OACvB,qBAAqB,CAAC,GACtB,UAAU,IACV,QAAQ,OACR,UAAU,OACV,KACA,GAAG,WACe;CAClB,MAAM,YAAY,UAAU,OAAO;CAEnC,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,eAAe,OAAO,SAAS,KAAA,CAAS;CAC9C,MAAM,aAAa,aAAa,CAAC,YAAY,GAAG,CAAC;CACjD,MAAM,EAAE,WAAW,cAAc,aAAa,mBAAmB,IAAI,OAAO;CAE5E,MAAM,CAAC,QAAQ,aAAa,qBAAqB;EAE/C,MAAM,aAAa,UAAU,OAAO;EACpC,WAAW,QAAQ;GACjB,eAAe,GAAG;GAClB,iBAAiB,GAAG;EACtB;EACA,aAAa;EACb,QAAQ;CACV,CAAC;CAED,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,MAAM,eAAe,UAAsB;GACzC,MAAM,KAAK,MAAM;GAIjB,IAFkB,CADA,IAAI,UAAU,mBAAmB,SAAS,GAAG,GAAG,KAClC,CAAC,SAAS,SAAS,EAAU,GAG3D,UAAU,KAAK;EAEnB;EAEA,MAAM,iBAAiB,UAAyB;GAC9C,IAAI,MAAM,QAAQ,YAAY,CAAC,QAAQ;GACvC,MAAM,eAAe;GACrB,UAAU,KAAK;EACjB;EAEA,SAAS,iBAAiB,SAAS,aAAa,IAAI;EACpD,SAAS,iBAAiB,WAAW,aAAa;EAClD,aAAa;GACX,SAAS,oBAAoB,SAAS,aAAa,IAAI;GACvD,SAAS,oBAAoB,WAAW,aAAa;EACvD;CACF,GAAG,CAAC,QAAQ,SAAS,CAAC;CAEtB,gBAAgB;EACd,MAAM,UAAU,WAAW;EAC3B,MAAM,UAAU,SAAS,cAAc,mBAAmB,SAAS,GAAG,GAAG;EAEzE,IAAI,WAAW,WAAW,QACxB,OAAO,WAAW,SAAS,eAAe;GACxC,gBAAgB,SAAS,SAAS;IAChC,YAAY;KACV,OAAO,OAAO;KACd,GAAI,uBAAuB,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,MAAM,EAAE,QAAQ,CAAC,CAAC;KACtE,GAAG;KACH,KAAK;MAAE;MAAS,UAAU;KAAU,CAAC;KACrC,GAAI,QAAQ,CAAC,kBAAkB,IAAI,CAAC;KACpC,KAAK,EACH,MAAM,EAAE,OAAO,YAAY;MACzB,SAAS,SAAS,MAAM,YAAY,+BAA+B,GAAG,MAAM,UAAU,MAAM,GAAG;KACjG,EACF,CAAC;IACH;IACA,UAAU;IACV;GACF,CAAC,CAAC,CAAC,MAAM,EAAE,GAAG,GAAG,qBAAqB;IACpC,QAAQ,MAAM,YAAY,GAAG,EAAE,KAAK,EAAE;IACtC,QAAQ,MAAM,aAAa,eAAe,MAAM,kBAAkB,WAAW;GAC/E,CAAC;EACH,CAAC;CACL,GAAG;EAAC;EAAQ;EAAW;EAAI;EAAsB;EAAoB;EAAS;CAAK,CAAC;CAGpF,gBAAgB;EACd,IAAI,IAAI,eAAe,EAAE;CAC3B,GAAG,CAAC,IAAI,YAAY,CAAC;CAErB,OACE,oBAAC,WAAD;EACE,WAAWA,KAAG,cAAc,SAAS;EACrC,IAAI,MAAM;EACV,eAAa,CAAC;EACd,cAAY,SAAS,KAAA;EACrB,KAAK;EACL,GAAI;CACL,CAAA;AAEL"}

package/dist/components/radio/index.d.mts

@@ -1,2 +1,2 @@
-import { B as RadioProps, z as Radio } from "../../alert-footer-B80k5mkX.mjs";
-export { Radio, RadioProps };
+import { B as RadioProps, z as Radio } from "../../alert-footer-BoTu7E1s.mjs";
+export { Radio, type RadioProps };

package/dist/components/radio/radio.d.mts

@@ -1,2 +1,2 @@
-import { B as RadioProps, z as Radio } from "../../alert-footer-B80k5mkX.mjs";
+import { B as RadioProps, z as Radio } from "../../alert-footer-BoTu7E1s.mjs";
 export { Radio, RadioProps };

package/dist/components/radio/radio.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio.mjs","names":[],"sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type RadioProps = MergeRight<\n  LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'>,\n  {\n    /** Label */\n    label?: ReactNode;\n    /** Description */\n    description?: ReactNode;\n    /** Add error indication to the radio. */\n    error?: boolean;\n    /** If true, the radio will take up the full width of the container, and not just \"fit-content\" which is default */\n    fullwidth?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Radio = ({\n  label,\n  description,\n  error,\n  fullwidth,\n  style,\n  className,\n  ref,\n  id,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: RadioProps) => {\n  const descriptionId = useId();\n\n  const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n  return (\n    <Field\n      className={className}\n      data-color={color}\n      data-color-scheme={colorScheme}\n      style={style}\n      fullwidth={fullwidth}\n      asChild\n    >\n      <label>\n        <Input\n          type='radio'\n          id={id}\n          ref={ref}\n          aria-invalid={error || undefined}\n          aria-describedby={ariaDescribedBy}\n          {...props}\n        />\n        {label && (\n          <Label weight='medium' htmlFor={id} asChild>\n            <span>{label}</span>\n          </Label>\n        )}\n        {description && (\n          // Aria-hidden is used to prevent screen readers from reading the description twice:\n          // once as part of the label and once from being connected through aria-describedby.\n          <FieldDescription aria-hidden='true' id={descriptionId}>\n            {description}\n          </FieldDescription>\n        )}\n      </label>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;AAuBA,MAAa,SAAS,EACpB,OACA,aACA,OACA,WACA,OACA,WACA,KACA,IACA,cAAc,OACd,qBAAqB,aACrB,oBAAoB,qBACpB,GAAG,YACa;CAChB,MAAM,gBAAgB,OAAO;CAE7B,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,oBAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CAEpG,OACE,oBAAC,OAAD;EACa;EACX,cAAY;EACZ,qBAAmB;EACZ;EACI;EACX,SAAA;YAEA,qBAAC,SAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACD;IACC;IACL,gBAAc,SAAS,KAAA;IACvB,oBAAkB;IAClB,GAAI;IACJ,CAAA;GACD,SACC,oBAAC,OAAD;IAAO,QAAO;IAAS,SAAS;IAAI,SAAA;cAClC,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA;IACd,CAAA;GAET,eAGC,oBAAC,kBAAD;IAAkB,eAAY;IAAO,IAAI;cACtC;IACgB,CAAA;GAEf,EAAA,CAAA;EACF,CAAA"}
+{"version":3,"file":"radio.mjs","names":[],"sources":["../../../src/components/radio/radio.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type RadioProps = MergeRight<\n  LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'>,\n  {\n    /** Label */\n    label?: ReactNode;\n    /** Description */\n    description?: ReactNode;\n    /** Add error indication to the radio. */\n    error?: boolean;\n    /** If true, the radio will take up the full width of the container, and not just \"fit-content\" which is default */\n    fullwidth?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Radio = ({\n  label,\n  description,\n  error,\n  fullwidth,\n  style,\n  className,\n  ref,\n  id,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: RadioProps) => {\n  const descriptionId = useId();\n\n  const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n  return (\n    <Field\n      className={className}\n      data-color={color}\n      data-color-scheme={colorScheme}\n      style={style}\n      fullwidth={fullwidth}\n      asChild\n    >\n      <label>\n        <Input\n          type='radio'\n          id={id}\n          ref={ref}\n          aria-invalid={error || undefined}\n          aria-describedby={ariaDescribedBy}\n          {...props}\n        />\n        {label && (\n          <Label weight='medium' htmlFor={id} asChild>\n            <span>{label}</span>\n          </Label>\n        )}\n        {description && (\n          // Aria-hidden is used to prevent screen readers from reading the description twice:\n          // once as part of the label and once from being connected through aria-describedby.\n          <FieldDescription aria-hidden='true' id={descriptionId}>\n            {description}\n          </FieldDescription>\n        )}\n      </label>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;AAuBA,MAAa,SAAS,EACpB,OACA,aACA,OACA,WACA,OACA,WACA,KACA,IACA,cAAc,OACd,qBAAqB,aACrB,oBAAoB,qBACpB,GAAG,YACa;CAChB,MAAM,gBAAgB,MAAM;CAE5B,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,mBAAmB,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,KAAK,KAAA;CAEpG,OACE,oBAAC,OAAD;EACa;EACX,cAAY;EACZ,qBAAmB;EACZ;EACI;EACX,SAAA;EAEA,UAAA,qBAAC,SAAD,EAAA,UAAA;GACE,oBAAC,OAAD;IACE,MAAK;IACD;IACC;IACL,gBAAc,SAAS,KAAA;IACvB,oBAAkB;IAClB,GAAI;GACL,CAAA;GACA,SACC,oBAAC,OAAD;IAAO,QAAO;IAAS,SAAS;IAAI,SAAA;IAClC,UAAA,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA;GACd,CAAA;GAER,eAGC,oBAAC,kBAAD;IAAkB,eAAY;IAAO,IAAI;IACtC,UAAA;GACe,CAAA;EAEf,EAAA,CAAA;CACF,CAAA;AAEX"}

package/dist/components/search/index.d.mts

@@ -1,2 +1,2 @@
-import { L as Search, R as SearchProps } from "../../alert-footer-B80k5mkX.mjs";
-export { Search, SearchProps };
+import { L as Search, R as SearchProps } from "../../alert-footer-BoTu7E1s.mjs";
+export { Search, type SearchProps };

package/dist/components/search/search.d.mts

@@ -1,2 +1,2 @@
-import { L as Search, R as SearchProps } from "../../alert-footer-B80k5mkX.mjs";
+import { L as Search, R as SearchProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { Search, SearchProps };

package/dist/components/search/search.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"search.mjs","names":[],"sources":["../../../src/components/search/search.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Field, FieldAffixes, FieldAffix } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { CrossSmallIcon, MagnifyingGlassIcon } from '@bi-digital/icons';\nimport type { MergeRight } from '../../utilities';\nimport { Button } from '../button';\n\nexport type SearchProps = MergeRight<\n  Omit<InputProps, 'type' | 'size'>,\n  {\n    /**\n     * Size of the search.\n     * @default 'medium'\n     */\n    size?: 'medium' | 'large';\n    /** Called when the user presses enter. You can use this to for example navigate on submit. */\n    onSubmit?: (value: string) => void;\n    /** Called when the user resets the search input. */\n    onReset?: (value: string) => void;\n    /**\n     * Aria-label for the clear button.\n     * @default 'Clear'\n     */\n    clearAriaLabel?: string;\n    /** If true, the selectfield will take up the full available width */\n    fullwidth?: boolean;\n  }\n>;\n\nexport const Search = ({\n  className,\n  onSubmit,\n  onReset,\n  clearAriaLabel = 'Clear',\n  size = 'medium',\n  ref,\n  style,\n  fullwidth,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  ...props\n}: SearchProps) => {\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    if (onSubmit) {\n      const input = e.currentTarget.querySelector('input');\n      onSubmit(input?.value || '');\n    }\n  };\n  const handleReset = () => {\n    if (onReset) {\n      onReset('');\n    }\n  };\n  return (\n    <Field\n      className={clsx('bi-search', className)}\n      data-color={color}\n      data-color-scheme={colorScheme}\n      style={style}\n      fullwidth={fullwidth}\n      asChild\n    >\n      <form onSubmit={handleSubmit} onReset={handleReset}>\n        <FieldAffixes>\n          <FieldAffix>\n            <MagnifyingGlassIcon size={size} />\n          </FieldAffix>\n          <Input type='text' ref={ref} size={size} {...props} />\n          <FieldAffix aria-hidden='false'>\n            <Button aria-label={clearAriaLabel} icon size={size} variant='text' type='reset'>\n              <CrossSmallIcon size={size} aria-hidden='true' />\n            </Button>\n          </FieldAffix>\n        </FieldAffixes>\n      </form>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;AA6BA,MAAa,UAAU,EACrB,WACA,UACA,SACA,iBAAiB,SACjB,OAAO,UACP,KACA,OACA,WACA,cAAc,OACd,qBAAqB,aACrB,GAAG,YACc;CACjB,MAAM,gBAAgB,MAAwC;EAC5D,EAAE,gBAAgB;EAClB,IAAI,UAEF,SADc,EAAE,cAAc,cAAc,QAC9B,EAAE,SAAS,GAAG;;CAGhC,MAAM,oBAAoB;EACxB,IAAI,SACF,QAAQ,GAAG;;CAGf,OACE,oBAAC,OAAD;EACE,WAAW,KAAK,aAAa,UAAU;EACvC,cAAY;EACZ,qBAAmB;EACZ;EACI;EACX,SAAA;YAEA,oBAAC,QAAD;GAAM,UAAU;GAAc,SAAS;aACrC,qBAAC,cAAD,EAAA,UAAA;IACE,oBAAC,YAAD,EAAA,UACE,oBAAC,qBAAD,EAA2B,MAAQ,CAAA,EACxB,CAAA;IACb,oBAAC,OAAD;KAAO,MAAK;KAAY;KAAW;KAAM,GAAI;KAAS,CAAA;IACtD,oBAAC,YAAD;KAAY,eAAY;eACtB,oBAAC,QAAD;MAAQ,cAAY;MAAgB,MAAA;MAAW;MAAM,SAAQ;MAAO,MAAK;gBACvE,oBAAC,gBAAD;OAAsB;OAAM,eAAY;OAAS,CAAA;MAC1C,CAAA;KACE,CAAA;IACA,EAAA,CAAA;GACV,CAAA;EACD,CAAA"}
+{"version":3,"file":"search.mjs","names":[],"sources":["../../../src/components/search/search.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Field, FieldAffixes, FieldAffix } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { CrossSmallIcon, MagnifyingGlassIcon } from '@bi-digital/icons';\nimport type { MergeRight } from '../../utilities';\nimport { Button } from '../button';\n\nexport type SearchProps = MergeRight<\n  Omit<InputProps, 'type' | 'size'>,\n  {\n    /**\n     * Size of the search.\n     * @default 'medium'\n     */\n    size?: 'medium' | 'large';\n    /** Called when the user presses enter. You can use this to for example navigate on submit. */\n    onSubmit?: (value: string) => void;\n    /** Called when the user resets the search input. */\n    onReset?: (value: string) => void;\n    /**\n     * Aria-label for the clear button.\n     * @default 'Clear'\n     */\n    clearAriaLabel?: string;\n    /** If true, the selectfield will take up the full available width */\n    fullwidth?: boolean;\n  }\n>;\n\nexport const Search = ({\n  className,\n  onSubmit,\n  onReset,\n  clearAriaLabel = 'Clear',\n  size = 'medium',\n  ref,\n  style,\n  fullwidth,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  ...props\n}: SearchProps) => {\n  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {\n    e.preventDefault();\n    if (onSubmit) {\n      const input = e.currentTarget.querySelector('input');\n      onSubmit(input?.value || '');\n    }\n  };\n  const handleReset = () => {\n    if (onReset) {\n      onReset('');\n    }\n  };\n  return (\n    <Field\n      className={clsx('bi-search', className)}\n      data-color={color}\n      data-color-scheme={colorScheme}\n      style={style}\n      fullwidth={fullwidth}\n      asChild\n    >\n      <form onSubmit={handleSubmit} onReset={handleReset}>\n        <FieldAffixes>\n          <FieldAffix>\n            <MagnifyingGlassIcon size={size} />\n          </FieldAffix>\n          <Input type='text' ref={ref} size={size} {...props} />\n          <FieldAffix aria-hidden='false'>\n            <Button aria-label={clearAriaLabel} icon size={size} variant='text' type='reset'>\n              <CrossSmallIcon size={size} aria-hidden='true' />\n            </Button>\n          </FieldAffix>\n        </FieldAffixes>\n      </form>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;AA6BA,MAAa,UAAU,EACrB,WACA,UACA,SACA,iBAAiB,SACjB,OAAO,UACP,KACA,OACA,WACA,cAAc,OACd,qBAAqB,aACrB,GAAG,YACc;CACjB,MAAM,gBAAgB,MAAwC;EAC5D,EAAE,eAAe;EACjB,IAAI,UAEF,SADc,EAAE,cAAc,cAAc,OAC/B,CAAC,EAAE,SAAS,EAAE;CAE/B;CACA,MAAM,oBAAoB;EACxB,IAAI,SACF,QAAQ,EAAE;CAEd;CACA,OACE,oBAAC,OAAD;EACE,WAAW,KAAK,aAAa,SAAS;EACtC,cAAY;EACZ,qBAAmB;EACZ;EACI;EACX,SAAA;EAEA,UAAA,oBAAC,QAAD;GAAM,UAAU;GAAc,SAAS;GACrC,UAAA,qBAAC,cAAD,EAAA,UAAA;IACE,oBAAC,YAAD,EAAA,UACE,oBAAC,qBAAD,EAA2B,KAAO,CAAA,EACxB,CAAA;IACZ,oBAAC,OAAD;KAAO,MAAK;KAAY;KAAW;KAAM,GAAI;IAAQ,CAAA;IACrD,oBAAC,YAAD;KAAY,eAAY;KACtB,UAAA,oBAAC,QAAD;MAAQ,cAAY;MAAgB,MAAA;MAAW;MAAM,SAAQ;MAAO,MAAK;MACvE,UAAA,oBAAC,gBAAD;OAAsB;OAAM,eAAY;MAAQ,CAAA;KAC1C,CAAA;IACE,CAAA;GACA,EAAA,CAAA;EACV,CAAA;CACD,CAAA;AAEX"}

package/dist/components/select/index.d.mts

@@ -1,2 +1,2 @@
-import { F as Select, I as SelectProps, M as SelectOptgroupProps, N as SelectOption, P as SelectOptionProps, j as SelectOptgroup } from "../../alert-footer-B80k5mkX.mjs";
-export { Select, SelectOptgroup, SelectOptgroupProps, SelectOption, SelectOptionProps, SelectProps };
+import { F as Select, I as SelectProps, M as SelectOptgroupProps, N as SelectOption, P as SelectOptionProps, j as SelectOptgroup } from "../../alert-footer-BoTu7E1s.mjs";
+export { Select, SelectOptgroup, type SelectOptgroupProps, SelectOption, type SelectOptionProps, type SelectProps };

package/dist/components/select/select-optgroup.d.mts

@@ -1,2 +1,2 @@
-import { M as SelectOptgroupProps, j as SelectOptgroup } from "../../alert-footer-B80k5mkX.mjs";
+import { M as SelectOptgroupProps, j as SelectOptgroup } from "../../alert-footer-BoTu7E1s.mjs";
 export { SelectOptgroup, SelectOptgroupProps };

package/dist/components/select/select-optgroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"select-optgroup.mjs","names":[],"sources":["../../../src/components/select/select-optgroup.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptgroupHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptgroupProps = MergeRight<\n  AsChildProps & OptgroupHTMLAttributes<HTMLOptGroupElement>,\n  {\n    ref?: Ref<HTMLOptGroupElement>;\n  }\n>;\n\nexport const SelectOptgroup = ({ asChild, ref, ...props }: SelectOptgroupProps) => {\n  const Component = asChild ? Slot : 'optgroup';\n  return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,kBAAkB,EAAE,SAAS,KAAK,GAAG,YAAiC;CAEjF,OAAO,oBADW,UAAU,OAAO,YAC5B;EAAW,GAAI;EAAY;EAAO,CAAA"}
+{"version":3,"file":"select-optgroup.mjs","names":[],"sources":["../../../src/components/select/select-optgroup.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptgroupHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptgroupProps = MergeRight<\n  AsChildProps & OptgroupHTMLAttributes<HTMLOptGroupElement>,\n  {\n    ref?: Ref<HTMLOptGroupElement>;\n  }\n>;\n\nexport const SelectOptgroup = ({ asChild, ref, ...props }: SelectOptgroupProps) => {\n  const Component = asChild ? Slot : 'optgroup';\n  return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,kBAAkB,EAAE,SAAS,KAAK,GAAG,YAAiC;CAEjF,OAAO,oBADW,UAAU,OAAO,YAC5B;EAAW,GAAI;EAAY;CAAM,CAAA;AAC1C"}

package/dist/components/select/select-option.d.mts

@@ -1,2 +1,2 @@
-import { N as SelectOption, P as SelectOptionProps } from "../../alert-footer-B80k5mkX.mjs";
+import { N as SelectOption, P as SelectOptionProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { SelectOption, SelectOptionProps };

package/dist/components/select/select-option.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"select-option.mjs","names":[],"sources":["../../../src/components/select/select-option.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptionHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptionProps = MergeRight<\n  AsChildProps & OptionHTMLAttributes<HTMLOptionElement>,\n  {\n    ref?: Ref<HTMLOptionElement>;\n  }\n>;\n\nexport const SelectOption = ({ asChild, ref, ...props }: SelectOptionProps) => {\n  const Component = asChild ? Slot : 'option';\n  return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,gBAAgB,EAAE,SAAS,KAAK,GAAG,YAA+B;CAE7E,OAAO,oBADW,UAAU,OAAO,UAC5B;EAAW,GAAI;EAAY;EAAO,CAAA"}
+{"version":3,"file":"select-option.mjs","names":[],"sources":["../../../src/components/select/select-option.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { OptionHTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps } from '../../types';\n\nexport type SelectOptionProps = MergeRight<\n  AsChildProps & OptionHTMLAttributes<HTMLOptionElement>,\n  {\n    ref?: Ref<HTMLOptionElement>;\n  }\n>;\n\nexport const SelectOption = ({ asChild, ref, ...props }: SelectOptionProps) => {\n  const Component = asChild ? Slot : 'option';\n  return <Component {...props} ref={ref} />;\n};\n"],"mappings":";;;AAYA,MAAa,gBAAgB,EAAE,SAAS,KAAK,GAAG,YAA+B;CAE7E,OAAO,oBADW,UAAU,OAAO,UAC5B;EAAW,GAAI;EAAY;CAAM,CAAA;AAC1C"}

package/dist/components/select/select.d.mts

@@ -1,2 +1,2 @@
-import { F as Select, I as SelectProps } from "../../alert-footer-B80k5mkX.mjs";
+import { F as Select, I as SelectProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { Select, SelectProps };

package/dist/components/select/select.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"select.mjs","names":[],"sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, SelectHTMLAttributes } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SelectProps = MergeRight<\n  DefaultProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, 'multiple' | 'size'>,\n  {\n    /**\n     * Size of the select.\n     * @default 'medium'\n     */\n    size?: 'medium' | 'large';\n    /** Mark the select as readOnly */\n    readOnly?: boolean;\n    ref?: Ref<HTMLSelectElement>;\n  }\n>;\n\nexport const Select = ({ className, onKeyDown, onMouseDown, size, ref, ...props }: SelectProps) => {\n  return (\n    <select\n      className={clsx('bi-input', className)}\n      data-size={size}\n      ref={ref}\n      onKeyDown={(event) => {\n        if (event.key === 'Tab') return;\n        if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n        onKeyDown?.(event);\n      }}\n      onMouseDown={(event) => {\n        if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n        onMouseDown?.(event);\n      }}\n      {...props}\n    />\n  );\n};\n"],"mappings":";;;AAmBA,MAAa,UAAU,EAAE,WAAW,WAAW,aAAa,MAAM,KAAK,GAAG,YAAyB;CACjG,OACE,oBAAC,UAAD;EACE,WAAW,KAAK,YAAY,UAAU;EACtC,aAAW;EACN;EACL,YAAY,UAAU;GACpB,IAAI,MAAM,QAAQ,OAAO;GACzB,IAAI,MAAM,UAAU,MAAM,gBAAgB;GAC1C,YAAY,MAAM;;EAEpB,cAAc,UAAU;GACtB,IAAI,MAAM,UAAU,MAAM,gBAAgB;GAC1C,cAAc,MAAM;;EAEtB,GAAI;EACJ,CAAA"}
+{"version":3,"file":"select.mjs","names":[],"sources":["../../../src/components/select/select.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, SelectHTMLAttributes } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SelectProps = MergeRight<\n  DefaultProps & Omit<SelectHTMLAttributes<HTMLSelectElement>, 'multiple' | 'size'>,\n  {\n    /**\n     * Size of the select.\n     * @default 'medium'\n     */\n    size?: 'medium' | 'large';\n    /** Mark the select as readOnly */\n    readOnly?: boolean;\n    ref?: Ref<HTMLSelectElement>;\n  }\n>;\n\nexport const Select = ({ className, onKeyDown, onMouseDown, size, ref, ...props }: SelectProps) => {\n  return (\n    <select\n      className={clsx('bi-input', className)}\n      data-size={size}\n      ref={ref}\n      onKeyDown={(event) => {\n        if (event.key === 'Tab') return;\n        if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n        onKeyDown?.(event);\n      }}\n      onMouseDown={(event) => {\n        if (props.readOnly) event.preventDefault(); // Make readOnly work for select\n        onMouseDown?.(event);\n      }}\n      {...props}\n    />\n  );\n};\n"],"mappings":";;;AAmBA,MAAa,UAAU,EAAE,WAAW,WAAW,aAAa,MAAM,KAAK,GAAG,YAAyB;CACjG,OACE,oBAAC,UAAD;EACE,WAAW,KAAK,YAAY,SAAS;EACrC,aAAW;EACN;EACL,YAAY,UAAU;GACpB,IAAI,MAAM,QAAQ,OAAO;GACzB,IAAI,MAAM,UAAU,MAAM,eAAe;GACzC,YAAY,KAAK;EACnB;EACA,cAAc,UAAU;GACtB,IAAI,MAAM,UAAU,MAAM,eAAe;GACzC,cAAc,KAAK;EACrB;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/components/selectfield/index.d.mts

@@ -1,2 +1,2 @@
-import { A as SelectfieldProps, k as Selectfield } from "../../alert-footer-B80k5mkX.mjs";
-export { Selectfield, SelectfieldProps };
+import { A as SelectfieldProps, k as Selectfield } from "../../alert-footer-BoTu7E1s.mjs";
+export { Selectfield, type SelectfieldProps };

package/dist/components/selectfield/selectfield.d.mts

@@ -1,2 +1,2 @@
-import { A as SelectfieldProps, k as Selectfield } from "../../alert-footer-B80k5mkX.mjs";
+import { A as SelectfieldProps, k as Selectfield } from "../../alert-footer-BoTu7E1s.mjs";
 export { Selectfield, SelectfieldProps };

package/dist/components/selectfield/selectfield.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"selectfield.mjs","names":[],"sources":["../../../src/components/selectfield/selectfield.tsx"],"sourcesContent":["import { useId, type ReactNode } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport { Field, FieldDescription } from '../field';\nimport { Label } from '../label';\nimport { Select, type SelectProps } from '../select';\nimport { ValidationMessage } from '../validation-message';\nimport { MergeRight } from '../../utilities';\n\nexport type SelectfieldProps = MergeRight<\n  LabelRequiredProps & SelectProps,\n  {\n    /** Description */\n    description?: ReactNode;\n    /** Error message for field */\n    error?: ReactNode;\n    /** If true, the selectfield will take up the full available width */\n    fullwidth?: boolean;\n  }\n>;\n\nexport const Selectfield = ({\n  children,\n  label,\n  description,\n  error,\n  style,\n  className,\n  fullwidth,\n  ref,\n  id: idProp,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: SelectfieldProps) => {\n  const generatedId = useId();\n  const descriptionId = useId();\n  const validationId = useId();\n  const id = idProp || generatedId;\n\n  const ariaDescribedBy =\n    [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n  return (\n    <Field className={className} data-color={color} data-color-scheme={colorScheme} style={style} fullwidth={fullwidth}>\n      {label && <Label htmlFor={id}>{label}</Label>}\n      {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n      <Select\n        id={id}\n        ref={ref}\n        aria-invalid={Boolean(error) || undefined}\n        aria-describedby={ariaDescribedBy}\n        {...props}\n      >\n        {children}\n      </Select>\n      {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,eAAe,EAC1B,UACA,OACA,aACA,OACA,OACA,WACA,WACA,KACA,IAAI,QACJ,cAAc,OACd,qBAAqB,aACrB,oBAAoB,qBACpB,GAAG,YACmB;CACtB,MAAM,cAAc,OAAO;CAC3B,MAAM,gBAAgB,OAAO;CAC7B,MAAM,eAAe,OAAO;CAC5B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;EAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CACzG,OACE,qBAAC,OAAD;EAAkB;EAAW,cAAY;EAAO,qBAAmB;EAAoB;EAAkB;YAAzG;GACG,SAAS,oBAAC,OAAD;IAAO,SAAS;cAAK;IAAc,CAAA;GAC5C,eAAe,oBAAC,kBAAD;IAAkB,IAAI;cAAgB;IAA+B,CAAA;GACrF,oBAAC,QAAD;IACM;IACC;IACL,gBAAc,QAAQ,MAAM,IAAI,KAAA;IAChC,oBAAkB;IAClB,GAAI;IAEH;IACM,CAAA;GACR,CAAC,CAAC,SAAS,oBAAC,mBAAD;IAAmB,IAAI;cAAe;IAA0B,CAAA;GACtE"}
+{"version":3,"file":"selectfield.mjs","names":[],"sources":["../../../src/components/selectfield/selectfield.tsx"],"sourcesContent":["import { useId, type ReactNode } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport { Field, FieldDescription } from '../field';\nimport { Label } from '../label';\nimport { Select, type SelectProps } from '../select';\nimport { ValidationMessage } from '../validation-message';\nimport { MergeRight } from '../../utilities';\n\nexport type SelectfieldProps = MergeRight<\n  LabelRequiredProps & SelectProps,\n  {\n    /** Description */\n    description?: ReactNode;\n    /** Error message for field */\n    error?: ReactNode;\n    /** If true, the selectfield will take up the full available width */\n    fullwidth?: boolean;\n  }\n>;\n\nexport const Selectfield = ({\n  children,\n  label,\n  description,\n  error,\n  style,\n  className,\n  fullwidth,\n  ref,\n  id: idProp,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: SelectfieldProps) => {\n  const generatedId = useId();\n  const descriptionId = useId();\n  const validationId = useId();\n  const id = idProp || generatedId;\n\n  const ariaDescribedBy =\n    [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n  return (\n    <Field className={className} data-color={color} data-color-scheme={colorScheme} style={style} fullwidth={fullwidth}>\n      {label && <Label htmlFor={id}>{label}</Label>}\n      {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n      <Select\n        id={id}\n        ref={ref}\n        aria-invalid={Boolean(error) || undefined}\n        aria-describedby={ariaDescribedBy}\n        {...props}\n      >\n        {children}\n      </Select>\n      {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAqBA,MAAa,eAAe,EAC1B,UACA,OACA,aACA,OACA,OACA,WACA,WACA,KACA,IAAI,QACJ,cAAc,OACd,qBAAqB,aACrB,oBAAoB,qBACpB,GAAG,YACmB;CACtB,MAAM,cAAc,MAAM;CAC1B,MAAM,gBAAgB,MAAM;CAC5B,MAAM,eAAe,MAAM;CAC3B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;CAAmB,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,KAAK,KAAA;CACzG,OACE,qBAAC,OAAD;EAAkB;EAAW,cAAY;EAAO,qBAAmB;EAAoB;EAAkB;EAAzG,UAAA;GACG,SAAS,oBAAC,OAAD;IAAO,SAAS;IAAK,UAAA;GAAa,CAAA;GAC3C,eAAe,oBAAC,kBAAD;IAAkB,IAAI;IAAgB,UAAA;GAA8B,CAAA;GACpF,oBAAC,QAAD;IACM;IACC;IACL,gBAAc,QAAQ,KAAK,KAAK,KAAA;IAChC,oBAAkB;IAClB,GAAI;IAEH;GACK,CAAA;GACP,CAAC,CAAC,SAAS,oBAAC,mBAAD;IAAmB,IAAI;IAAe,UAAA;GAAyB,CAAA;EACtE;;AAEX"}

package/dist/components/skip-link/index.d.mts

@@ -1,2 +1,2 @@
-import { D as SkipLink, O as SkipLinkProps } from "../../alert-footer-B80k5mkX.mjs";
-export { SkipLink, SkipLinkProps };
+import { D as SkipLink, O as SkipLinkProps } from "../../alert-footer-BoTu7E1s.mjs";
+export { SkipLink, type SkipLinkProps };

package/dist/components/skip-link/skip-link.d.mts

@@ -1,2 +1,2 @@
-import { D as SkipLink, O as SkipLinkProps } from "../../alert-footer-B80k5mkX.mjs";
+import { D as SkipLink, O as SkipLinkProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { SkipLink, SkipLinkProps };

package/dist/components/skip-link/skip-link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"skip-link.mjs","names":[],"sources":["../../../src/components/skip-link/skip-link.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps, DefaultProps } from '../../types';\nimport type { AnchorHTMLAttributes, Ref } from 'react';\n\nexport type SkipLinkProps = MergeRight<\n  DefaultProps & AsChildProps & AnchorHTMLAttributes<HTMLAnchorElement>,\n  {\n    ref?: Ref<HTMLAnchorElement>;\n  }\n>;\n\nexport const SkipLink = ({ asChild, children, className, ...props }: SkipLinkProps) => {\n  const Component = asChild ? Slot : 'a';\n  return (\n    <Component className={clsx('bi-skip-link', className)} {...props}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAaA,MAAa,YAAY,EAAE,SAAS,UAAU,WAAW,GAAG,YAA2B;CAErF,OACE,oBAFgB,UAAU,OAAO,KAEjC;EAAW,WAAW,KAAK,gBAAgB,UAAU;EAAE,GAAI;EACxD;EACS,CAAA"}
+{"version":3,"file":"skip-link.mjs","names":[],"sources":["../../../src/components/skip-link/skip-link.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport { Slot } from '@radix-ui/react-slot';\nimport type { MergeRight } from '../../utilities';\nimport type { AsChildProps, DefaultProps } from '../../types';\nimport type { AnchorHTMLAttributes, Ref } from 'react';\n\nexport type SkipLinkProps = MergeRight<\n  DefaultProps & AsChildProps & AnchorHTMLAttributes<HTMLAnchorElement>,\n  {\n    ref?: Ref<HTMLAnchorElement>;\n  }\n>;\n\nexport const SkipLink = ({ asChild, children, className, ...props }: SkipLinkProps) => {\n  const Component = asChild ? Slot : 'a';\n  return (\n    <Component className={clsx('bi-skip-link', className)} {...props}>\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;AAaA,MAAa,YAAY,EAAE,SAAS,UAAU,WAAW,GAAG,YAA2B;CAErF,OACE,oBAFgB,UAAU,OAAO,KAEjC;EAAW,WAAW,KAAK,gBAAgB,SAAS;EAAG,GAAI;EACxD;CACQ,CAAA;AAEf"}

package/dist/components/spinner/index.d.mts

@@ -1,2 +1,2 @@
-import { E as SpinnerProps, T as Spinner } from "../../alert-footer-B80k5mkX.mjs";
-export { Spinner, SpinnerProps };
+import { E as SpinnerProps, T as Spinner } from "../../alert-footer-BoTu7E1s.mjs";
+export { Spinner, type SpinnerProps };

package/dist/components/spinner/spinner.d.mts

@@ -1,2 +1,2 @@
-import { E as SpinnerProps, T as Spinner } from "../../alert-footer-B80k5mkX.mjs";
+import { E as SpinnerProps, T as Spinner } from "../../alert-footer-BoTu7E1s.mjs";
 export { Spinner, SpinnerProps };

package/dist/components/spinner/spinner.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.mjs","names":[],"sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SpinnerProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * The size of the spinner.\n     * It sets the font-size as the width and height is `1em`. If not set, the spinner will inherit the font size of its parent.\n     */\n    size?: 'small' | 'medium' | 'large' | 'xl' | '2xl';\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\nexport const Spinner = ({ size, className, ref, ...props }: SpinnerProps) => {\n  return <span className={clsx('bi-spinner', className)} data-size={size} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAiBA,MAAa,WAAW,EAAE,MAAM,WAAW,KAAK,GAAG,YAA0B;CAC3E,OAAO,oBAAC,QAAD;EAAM,WAAW,KAAK,cAAc,UAAU;EAAE,aAAW;EAAW;EAAK,GAAI;EAAS,CAAA"}
+{"version":3,"file":"spinner.mjs","names":[],"sources":["../../../src/components/spinner/spinner.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type SpinnerProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * The size of the spinner.\n     * It sets the font-size as the width and height is `1em`. If not set, the spinner will inherit the font size of its parent.\n     */\n    size?: 'small' | 'medium' | 'large' | 'xl' | '2xl';\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\nexport const Spinner = ({ size, className, ref, ...props }: SpinnerProps) => {\n  return <span className={clsx('bi-spinner', className)} data-size={size} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAiBA,MAAa,WAAW,EAAE,MAAM,WAAW,KAAK,GAAG,YAA0B;CAC3E,OAAO,oBAAC,QAAD;EAAM,WAAW,KAAK,cAAc,SAAS;EAAG,aAAW;EAAW;EAAK,GAAI;CAAQ,CAAA;AAChG"}

package/dist/components/sticky-header/index.d.mts

@@ -1,2 +1,3 @@
-import { n as StickyHeaderProps, t as StickyHeader } from "../../sticky-header-CVfE0TUC.mjs";
-export { StickyHeader, StickyHeaderProps };
+import { n as StickyHeaderProps, t as StickyHeader } from "../../sticky-header-BXlBWEWo.mjs";
+import "../../index-Dqg5-Rt-.mjs";
+export { StickyHeader, type StickyHeaderProps };

package/dist/components/sticky-header/sticky-header.d.mts

@@ -1,2 +1,2 @@
-import { n as StickyHeaderProps, t as StickyHeader } from "../../sticky-header-CVfE0TUC.mjs";
+import { n as StickyHeaderProps, t as StickyHeader } from "../../sticky-header-BXlBWEWo.mjs";
 export { StickyHeader, StickyHeaderProps };

package/dist/components/sticky-header/sticky-header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"sticky-header.mjs","names":["Component"],"sources":["../../../src/components/sticky-header/sticky-header.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { ReactNode } from 'react';\n\nexport type StickyHeaderProps = {\n  children: ReactNode;\n};\n\n/**\n * Make a sticky header that will stay at the top of the viewport when scrolling.\n * It handles different distance to the top based on sub-navbar, navbar and other factors.\n * This element is a Slot which simply adds the correct CSS styles to the children.\n * Make sure that the children passed to this component appends className and not overrides it.\n */\nexport const StickyHeader = ({ children }: StickyHeaderProps) => {\n  const Component = Slot;\n  return <Component className='bi-sticky-header'>{children}</Component>;\n};\n"],"mappings":";;;;;;;;;AAaA,MAAa,gBAAgB,EAAE,eAAkC;CAE/D,OAAO,oBAACA,MAAD;EAAW,WAAU;EAAoB;EAAqB,CAAA"}
+{"version":3,"file":"sticky-header.mjs","names":["Component"],"sources":["../../../src/components/sticky-header/sticky-header.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport type { ReactNode } from 'react';\n\nexport type StickyHeaderProps = {\n  children: ReactNode;\n};\n\n/**\n * Make a sticky header that will stay at the top of the viewport when scrolling.\n * It handles different distance to the top based on sub-navbar, navbar and other factors.\n * This element is a Slot which simply adds the correct CSS styles to the children.\n * Make sure that the children passed to this component appends className and not overrides it.\n */\nexport const StickyHeader = ({ children }: StickyHeaderProps) => {\n  const Component = Slot;\n  return <Component className='bi-sticky-header'>{children}</Component>;\n};\n"],"mappings":";;;;;;;;;AAaA,MAAa,gBAAgB,EAAE,eAAkC;CAE/D,OAAO,oBAACA,MAAD;EAAW,WAAU;EAAoB;CAAoB,CAAA;AACtE"}

package/dist/components/switch/index.d.mts

@@ -1,2 +1,2 @@
-import { C as Switch, w as SwitchProps } from "../../alert-footer-B80k5mkX.mjs";
-export { Switch, SwitchProps };
+import { C as Switch, w as SwitchProps } from "../../alert-footer-BoTu7E1s.mjs";
+export { Switch, type SwitchProps };

package/dist/components/switch/switch.d.mts

@@ -1,2 +1,2 @@
-import { C as Switch, w as SwitchProps } from "../../alert-footer-B80k5mkX.mjs";
+import { C as Switch, w as SwitchProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { Switch, SwitchProps };

package/dist/components/switch/switch.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"switch.mjs","names":[],"sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, type FieldProps } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type SwitchProps = MergeRight<\n  LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'> & Pick<FieldProps, 'position'>,\n  {\n    /** Label */\n    label?: ReactNode;\n    /** Add error indication to the switch. */\n    error?: boolean;\n    /** If true, the switch will take up the full width of the container, and not just \"fit-content\" which is default */\n    fullwidth?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Switch = ({\n  label,\n  error,\n  fullwidth,\n  style,\n  className,\n  ref,\n  id,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  position = 'end',\n  ...props\n}: SwitchProps) => {\n  return (\n    <Field\n      className={className}\n      data-color={color}\n      data-color-scheme={colorScheme}\n      style={style}\n      fullwidth={fullwidth}\n      position={position}\n      asChild\n    >\n      <label>\n        {/* oxlint-disable-next-line jsx-a11y/role-has-required-aria-props */}\n        <Input role='switch' type='checkbox' id={id} ref={ref} aria-invalid={error || undefined} {...props} />\n        {label && (\n          <Label weight='medium' htmlFor={id} asChild>\n            <span>{label}</span>\n          </Label>\n        )}\n      </label>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;AAqBA,MAAa,UAAU,EACrB,OACA,OACA,WACA,OACA,WACA,KACA,IACA,cAAc,OACd,qBAAqB,aACrB,WAAW,OACX,GAAG,YACc;CACjB,OACE,oBAAC,OAAD;EACa;EACX,cAAY;EACZ,qBAAmB;EACZ;EACI;EACD;EACV,SAAA;YAEA,qBAAC,SAAD,EAAA,UAAA,CAEE,oBAAC,OAAD;GAAO,MAAK;GAAS,MAAK;GAAe;GAAS;GAAK,gBAAc,SAAS,KAAA;GAAW,GAAI;GAAS,CAAA,EACrG,SACC,oBAAC,OAAD;GAAO,QAAO;GAAS,SAAS;GAAI,SAAA;aAClC,oBAAC,QAAD,EAAA,UAAO,OAAa,CAAA;GACd,CAAA,CAEJ,EAAA,CAAA;EACF,CAAA"}
+{"version":3,"file":"switch.mjs","names":[],"sources":["../../../src/components/switch/switch.tsx"],"sourcesContent":["import type { ReactNode, Ref } from 'react';\n\nimport type { LabelRequiredProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { Field, type FieldProps } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\n\nexport type SwitchProps = MergeRight<\n  LabelRequiredProps & Omit<InputProps, 'type' | 'role' | 'size'> & Pick<FieldProps, 'position'>,\n  {\n    /** Label */\n    label?: ReactNode;\n    /** Add error indication to the switch. */\n    error?: boolean;\n    /** If true, the switch will take up the full width of the container, and not just \"fit-content\" which is default */\n    fullwidth?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Switch = ({\n  label,\n  error,\n  fullwidth,\n  style,\n  className,\n  ref,\n  id,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  position = 'end',\n  ...props\n}: SwitchProps) => {\n  return (\n    <Field\n      className={className}\n      data-color={color}\n      data-color-scheme={colorScheme}\n      style={style}\n      fullwidth={fullwidth}\n      position={position}\n      asChild\n    >\n      <label>\n        {/* oxlint-disable-next-line jsx-a11y/role-has-required-aria-props */}\n        <Input role='switch' type='checkbox' id={id} ref={ref} aria-invalid={error || undefined} {...props} />\n        {label && (\n          <Label weight='medium' htmlFor={id} asChild>\n            <span>{label}</span>\n          </Label>\n        )}\n      </label>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;AAqBA,MAAa,UAAU,EACrB,OACA,OACA,WACA,OACA,WACA,KACA,IACA,cAAc,OACd,qBAAqB,aACrB,WAAW,OACX,GAAG,YACc;CACjB,OACE,oBAAC,OAAD;EACa;EACX,cAAY;EACZ,qBAAmB;EACZ;EACI;EACD;EACV,SAAA;EAEA,UAAA,qBAAC,SAAD,EAAA,UAAA,CAEE,oBAAC,OAAD;GAAO,MAAK;GAAS,MAAK;GAAe;GAAS;GAAK,gBAAc,SAAS,KAAA;GAAW,GAAI;EAAQ,CAAA,GACpG,SACC,oBAAC,OAAD;GAAO,QAAO;GAAS,SAAS;GAAI,SAAA;GAClC,UAAA,oBAAC,QAAD,EAAA,UAAO,MAAY,CAAA;EACd,CAAA,CAEJ,EAAA,CAAA;CACF,CAAA;AAEX"}

package/dist/components/tabs/index.d.mts

@@ -1,2 +1,2 @@
-import { S as TabsProps, _ as Tab, b as Tabs, g as TabsListProps, h as TabsList, m as TabsPanelProps, p as TabsPanel, v as TabProps, x as TabsContext } from "../../alert-footer-B80k5mkX.mjs";
-export { Tab, TabProps, Tabs, TabsContext, TabsList, TabsListProps, TabsPanel, TabsPanelProps, TabsProps };
+import { S as TabsProps, _ as Tab, b as Tabs, g as TabsListProps, h as TabsList, m as TabsPanelProps, p as TabsPanel, v as TabProps, x as TabsContext } from "../../alert-footer-BoTu7E1s.mjs";
+export { Tab, type TabProps, Tabs, type TabsContext, TabsList, type TabsListProps, TabsPanel, type TabsPanelProps, type TabsProps };

package/dist/components/tabs/tab.d.mts

@@ -1,2 +1,2 @@
-import { _ as Tab, v as TabProps } from "../../alert-footer-B80k5mkX.mjs";
+import { _ as Tab, v as TabProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { Tab, TabProps };

package/dist/components/tabs/tab.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tab.mjs","names":[],"sources":["../../../src/components/tabs/tab.tsx"],"sourcesContent":["import type { DSTabElement } from '@digdir/designsystemet-web';\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport '@digdir/designsystemet-web'; // Import ds-tab custom element\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabProps = MergeRight<\n  HTMLAttributes<DSTabElement>,\n  {\n    /** A unique value that associates the trigger with a content. */\n    value: string;\n    ref?: Ref<DSTabElement>;\n  }\n>;\n\nexport const Tab = ({ value, children, onClick, onClickCapture, ref, ...props }: TabProps) => {\n  const { onChange, getPrefixedValue, isControlled, currentValue } = use(Context);\n  return (\n    <ds-tab\n      aria-controls={props['aria-controls'] ?? getPrefixedValue?.(value)}\n      data-value={value}\n      ref={ref}\n      suppressHydrationWarning // Since <ds-tablist> adds attributes\n      onClickCapture={(e: React.MouseEvent<DSTabElement>) => {\n        onClickCapture?.(e);\n        if (isControlled && currentValue !== value) {\n          e.preventDefault();\n        }\n      }}\n      onClick={(e: React.MouseEvent<DSTabElement>) => {\n        if (e.isTrusted || !isControlled || currentValue !== value) {\n          onChange?.(value); // Only call onChange for user interactions, not programmatic clicks used to sync controlled state\n        }\n        onClick?.(e);\n      }}\n      {...props}\n    >\n      {children}\n    </ds-tab>\n  );\n};\n"],"mappings":";;;;;AAeA,MAAa,OAAO,EAAE,OAAO,UAAU,SAAS,gBAAgB,KAAK,GAAG,YAAsB;CAC5F,MAAM,EAAE,UAAU,kBAAkB,cAAc,iBAAiB,IAAI,QAAQ;CAC/E,OACE,oBAAC,UAAD;EACE,iBAAe,MAAM,oBAAoB,mBAAmB,MAAM;EAClE,cAAY;EACP;EACL,0BAAA;EACA,iBAAiB,MAAsC;GACrD,iBAAiB,EAAE;GACnB,IAAI,gBAAgB,iBAAiB,OACnC,EAAE,gBAAgB;;EAGtB,UAAU,MAAsC;GAC9C,IAAI,EAAE,aAAa,CAAC,gBAAgB,iBAAiB,OACnD,WAAW,MAAM;GAEnB,UAAU,EAAE;;EAEd,GAAI;EAEH;EACM,CAAA"}
+{"version":3,"file":"tab.mjs","names":[],"sources":["../../../src/components/tabs/tab.tsx"],"sourcesContent":["import type { DSTabElement } from '@digdir/designsystemet-web';\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport '@digdir/designsystemet-web'; // Import ds-tab custom element\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabProps = MergeRight<\n  HTMLAttributes<DSTabElement>,\n  {\n    /** A unique value that associates the trigger with a content. */\n    value: string;\n    ref?: Ref<DSTabElement>;\n  }\n>;\n\nexport const Tab = ({ value, children, onClick, onClickCapture, ref, ...props }: TabProps) => {\n  const { onChange, getPrefixedValue, isControlled, currentValue } = use(Context);\n  return (\n    <ds-tab\n      aria-controls={props['aria-controls'] ?? getPrefixedValue?.(value)}\n      data-value={value}\n      ref={ref}\n      suppressHydrationWarning // Since <ds-tablist> adds attributes\n      onClickCapture={(e: React.MouseEvent<DSTabElement>) => {\n        onClickCapture?.(e);\n        if (isControlled && currentValue !== value) {\n          e.preventDefault();\n        }\n      }}\n      onClick={(e: React.MouseEvent<DSTabElement>) => {\n        if (e.isTrusted || !isControlled || currentValue !== value) {\n          onChange?.(value); // Only call onChange for user interactions, not programmatic clicks used to sync controlled state\n        }\n        onClick?.(e);\n      }}\n      {...props}\n    >\n      {children}\n    </ds-tab>\n  );\n};\n"],"mappings":";;;;;AAeA,MAAa,OAAO,EAAE,OAAO,UAAU,SAAS,gBAAgB,KAAK,GAAG,YAAsB;CAC5F,MAAM,EAAE,UAAU,kBAAkB,cAAc,iBAAiB,IAAI,OAAO;CAC9E,OACE,oBAAC,UAAD;EACE,iBAAe,MAAM,oBAAoB,mBAAmB,KAAK;EACjE,cAAY;EACP;EACL,0BAAA;EACA,iBAAiB,MAAsC;GACrD,iBAAiB,CAAC;GAClB,IAAI,gBAAgB,iBAAiB,OACnC,EAAE,eAAe;EAErB;EACA,UAAU,MAAsC;GAC9C,IAAI,EAAE,aAAa,CAAC,gBAAgB,iBAAiB,OACnD,WAAW,KAAK;GAElB,UAAU,CAAC;EACb;EACA,GAAI;EAEH;CACK,CAAA;AAEZ"}

package/dist/components/tabs/tabs-list.d.mts

@@ -1,2 +1,2 @@
-import { g as TabsListProps, h as TabsList } from "../../alert-footer-B80k5mkX.mjs";
+import { g as TabsListProps, h as TabsList } from "../../alert-footer-BoTu7E1s.mjs";
 export { TabsList, TabsListProps };

package/dist/components/tabs/tabs-list.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-list.mjs","names":[],"sources":["../../../src/components/tabs/tabs-list.tsx"],"sourcesContent":["import type { DSTabListElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tablist custom element\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\n\nexport type TabsListProps = MergeRight<\n  HTMLAttributes<DSTabListElement>,\n  {\n    ref?: Ref<DSTabListElement>;\n  }\n>;\n\nexport const TabsList = ({ children, ref, ...props }: TabsListProps) => {\n  return (\n    <ds-tablist\n      suppressHydrationWarning // Since <ds-tablist> adds attributes\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </ds-tablist>\n  );\n};\n"],"mappings":";;;AAYA,MAAa,YAAY,EAAE,UAAU,KAAK,GAAG,YAA2B;CACtE,OACE,oBAAC,cAAD;EACE,0BAAA;EACK;EACL,GAAI;EAEH;EACU,CAAA"}
+{"version":3,"file":"tabs-list.mjs","names":[],"sources":["../../../src/components/tabs/tabs-list.tsx"],"sourcesContent":["import type { DSTabListElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tablist custom element\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\n\nexport type TabsListProps = MergeRight<\n  HTMLAttributes<DSTabListElement>,\n  {\n    ref?: Ref<DSTabListElement>;\n  }\n>;\n\nexport const TabsList = ({ children, ref, ...props }: TabsListProps) => {\n  return (\n    <ds-tablist\n      suppressHydrationWarning // Since <ds-tablist> adds attributes\n      ref={ref}\n      {...props}\n    >\n      {children}\n    </ds-tablist>\n  );\n};\n"],"mappings":";;;AAYA,MAAa,YAAY,EAAE,UAAU,KAAK,GAAG,YAA2B;CACtE,OACE,oBAAC,cAAD;EACE,0BAAA;EACK;EACL,GAAI;EAEH;CACS,CAAA;AAEhB"}

package/dist/components/tabs/tabs-panel.d.mts

@@ -1,2 +1,2 @@
-import { m as TabsPanelProps, p as TabsPanel } from "../../alert-footer-B80k5mkX.mjs";
+import { m as TabsPanelProps, p as TabsPanel } from "../../alert-footer-BoTu7E1s.mjs";
 export { TabsPanel, TabsPanelProps };

package/dist/components/tabs/tabs-panel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-panel.mjs","names":[],"sources":["../../../src/components/tabs/tabs-panel.tsx"],"sourcesContent":["import type { DSTabPanelElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabpanel custom element\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabsPanelProps = MergeRight<\n  HTMLAttributes<DSTabPanelElement>,\n  {\n    /** A unique value that associates the content with a trigger. */\n    value: string;\n    ref?: Ref<DSTabPanelElement>;\n  }\n>;\n\nexport const TabsPanel = ({ value, id, children, ref, ...props }: TabsPanelProps) => {\n  const { getPrefixedValue } = use(Context);\n\n  return (\n    <ds-tabpanel\n      suppressHydrationWarning // Since <ds-tablist> adds attributes\n      ref={ref}\n      id={id ?? getPrefixedValue?.(value)}\n      {...props}\n    >\n      {children}\n    </ds-tabpanel>\n  );\n};\n"],"mappings":";;;;;AAeA,MAAa,aAAa,EAAE,OAAO,IAAI,UAAU,KAAK,GAAG,YAA4B;CACnF,MAAM,EAAE,qBAAqB,IAAI,QAAQ;CAEzC,OACE,oBAAC,eAAD;EACE,0BAAA;EACK;EACL,IAAI,MAAM,mBAAmB,MAAM;EACnC,GAAI;EAEH;EACW,CAAA"}
+{"version":3,"file":"tabs-panel.mjs","names":[],"sources":["../../../src/components/tabs/tabs-panel.tsx"],"sourcesContent":["import type { DSTabPanelElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabpanel custom element\nimport { use, type HTMLAttributes, type Ref } from 'react';\nimport type { MergeRight } from '../../utilities';\nimport { Context } from './tabs';\n\nexport type TabsPanelProps = MergeRight<\n  HTMLAttributes<DSTabPanelElement>,\n  {\n    /** A unique value that associates the content with a trigger. */\n    value: string;\n    ref?: Ref<DSTabPanelElement>;\n  }\n>;\n\nexport const TabsPanel = ({ value, id, children, ref, ...props }: TabsPanelProps) => {\n  const { getPrefixedValue } = use(Context);\n\n  return (\n    <ds-tabpanel\n      suppressHydrationWarning // Since <ds-tablist> adds attributes\n      ref={ref}\n      id={id ?? getPrefixedValue?.(value)}\n      {...props}\n    >\n      {children}\n    </ds-tabpanel>\n  );\n};\n"],"mappings":";;;;;AAeA,MAAa,aAAa,EAAE,OAAO,IAAI,UAAU,KAAK,GAAG,YAA4B;CACnF,MAAM,EAAE,qBAAqB,IAAI,OAAO;CAExC,OACE,oBAAC,eAAD;EACE,0BAAA;EACK;EACL,IAAI,MAAM,mBAAmB,KAAK;EAClC,GAAI;EAEH;CACU,CAAA;AAEjB"}

package/dist/components/tabs/tabs.d.mts

@@ -1,2 +1,2 @@
-import { S as TabsProps, b as Tabs, x as TabsContext, y as Context } from "../../alert-footer-B80k5mkX.mjs";
+import { S as TabsProps, b as Tabs, x as TabsContext, y as Context } from "../../alert-footer-BoTu7E1s.mjs";
 export { Context, Tabs, TabsContext, TabsProps };

package/dist/components/tabs/tabs.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.mjs","names":[],"sources":["../../../src/components/tabs/tabs.tsx"],"sourcesContent":["import { createContext, useEffect, useId, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport type { DSTabsElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabs custom element\nimport clsx from 'clsx/lite';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\n\nexport type TabsProps = MergeRight<\n  DefaultProps & HTMLAttributes<DSTabsElement>,\n  {\n    /** The value of the tab that should be active when initially rendered. Use when you do not need to control the state of the tabs. */\n    defaultValue?: string;\n    /** The controlled value of the tab to activate. Should be used together with `onChange`. */\n    value?: string;\n    /** Event handler called when the value changes. */\n    onChange?: (value: string) => void;\n    ref?: Ref<DSTabsElement>;\n  }\n>;\n\nexport type TabsContext = {\n  isControlled?: boolean;\n  currentValue?: string;\n  onChange?: (value: string) => void;\n  getPrefixedValue?: (value?: string) => string | undefined;\n};\n\nexport const Context = createContext<TabsContext>({});\n\nexport const Tabs = ({ defaultValue, value: valueProp, onChange, children, className, ref, ...props }: TabsProps) => {\n  const isControlled = valueProp !== undefined;\n  const tabsRef = useRef<DSTabsElement>(null);\n  const isProgrammaticClick = useRef(false);\n  const valuePrefix = useId(); // Used for generation of unique value-based ids for tabs and panels\n  const mergedRefs = useMergeRefs([ref, tabsRef]);\n  const [value, setValue] = useControllableState({\n    prop: valueProp,\n    onChange,\n    defaultProp: defaultValue || '',\n    caller: 'Tabs',\n  });\n\n  useEffect(() => {\n    if (!tabsRef.current || valueProp === undefined) return;\n    tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n      if (tab.getAttribute('data-value') === valueProp) {\n        isProgrammaticClick.current = true;\n        tab.click();\n        isProgrammaticClick.current = false;\n      }\n    });\n  }, [valueProp]);\n\n  useEffect(() => {\n    if (!isControlled && defaultValue && tabsRef.current) {\n      tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n        const isSelected = tab.getAttribute('data-value') === defaultValue;\n        tab.setAttribute('aria-selected', isSelected ? 'true' : 'false');\n      });\n    }\n    // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <Context\n      value={{\n        isControlled,\n        currentValue: value,\n        onChange: setValue,\n        getPrefixedValue: (value?: string) => value && `${valuePrefix}-${value}`,\n      }}\n    >\n      <ds-tabs\n        suppressHydrationWarning // Since <ds-tablist> adds attributes\n        ref={mergedRefs}\n        className={clsx('bi-tabs', className)}\n        {...props}\n      >\n        {children}\n      </ds-tabs>\n    </Context>\n  );\n};\n"],"mappings":";;;;;;;AA8BA,MAAa,UAAU,cAA2B,EAAE,CAAC;AAErD,MAAa,QAAQ,EAAE,cAAc,OAAO,WAAW,UAAU,UAAU,WAAW,KAAK,GAAG,YAAuB;CACnH,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,UAAU,OAAsB,KAAK;CAC3C,MAAM,sBAAsB,OAAO,MAAM;CACzC,MAAM,cAAc,OAAO;CAC3B,MAAM,aAAa,aAAa,CAAC,KAAK,QAAQ,CAAC;CAC/C,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C,MAAM;EACN;EACA,aAAa,gBAAgB;EAC7B,QAAQ;EACT,CAAC;CAEF,gBAAgB;EACd,IAAI,CAAC,QAAQ,WAAW,cAAc,KAAA,GAAW;EACjD,QAAQ,SAAS,SAAS,MAAM,SAAS,QAAQ;GAC/C,IAAI,IAAI,aAAa,aAAa,KAAK,WAAW;IAChD,oBAAoB,UAAU;IAC9B,IAAI,OAAO;IACX,oBAAoB,UAAU;;IAEhC;IACD,CAAC,UAAU,CAAC;CAEf,gBAAgB;EACd,IAAI,CAAC,gBAAgB,gBAAgB,QAAQ,SAC3C,QAAQ,SAAS,SAAS,MAAM,SAAS,QAAQ;GAC/C,MAAM,aAAa,IAAI,aAAa,aAAa,KAAK;GACtD,IAAI,aAAa,iBAAiB,aAAa,SAAS,QAAQ;IAChE;IAGH,EAAE,CAAC;CAEN,OACE,oBAAC,SAAD;EACE,OAAO;GACL;GACA,cAAc;GACd,UAAU;GACV,mBAAmB,UAAmB,SAAS,GAAG,YAAY,GAAG;GAClE;YAED,oBAAC,WAAD;GACE,0BAAA;GACA,KAAK;GACL,WAAW,KAAK,WAAW,UAAU;GACrC,GAAI;GAEH;GACO,CAAA;EACF,CAAA"}
+{"version":3,"file":"tabs.mjs","names":[],"sources":["../../../src/components/tabs/tabs.tsx"],"sourcesContent":["import { createContext, useEffect, useId, useRef } from 'react';\nimport type { HTMLAttributes, Ref } from 'react';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport type { DSTabsElement } from '@digdir/designsystemet-web';\nimport '@digdir/designsystemet-web'; // Import ds-tabs custom element\nimport clsx from 'clsx/lite';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { useMergeRefs } from '../../utilities/hooks/useMergeRefs/useMergeRefs';\n\nexport type TabsProps = MergeRight<\n  DefaultProps & HTMLAttributes<DSTabsElement>,\n  {\n    /** The value of the tab that should be active when initially rendered. Use when you do not need to control the state of the tabs. */\n    defaultValue?: string;\n    /** The controlled value of the tab to activate. Should be used together with `onChange`. */\n    value?: string;\n    /** Event handler called when the value changes. */\n    onChange?: (value: string) => void;\n    ref?: Ref<DSTabsElement>;\n  }\n>;\n\nexport type TabsContext = {\n  isControlled?: boolean;\n  currentValue?: string;\n  onChange?: (value: string) => void;\n  getPrefixedValue?: (value?: string) => string | undefined;\n};\n\nexport const Context = createContext<TabsContext>({});\n\nexport const Tabs = ({ defaultValue, value: valueProp, onChange, children, className, ref, ...props }: TabsProps) => {\n  const isControlled = valueProp !== undefined;\n  const tabsRef = useRef<DSTabsElement>(null);\n  const isProgrammaticClick = useRef(false);\n  const valuePrefix = useId(); // Used for generation of unique value-based ids for tabs and panels\n  const mergedRefs = useMergeRefs([ref, tabsRef]);\n  const [value, setValue] = useControllableState({\n    prop: valueProp,\n    onChange,\n    defaultProp: defaultValue || '',\n    caller: 'Tabs',\n  });\n\n  useEffect(() => {\n    if (!tabsRef.current || valueProp === undefined) return;\n    tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n      if (tab.getAttribute('data-value') === valueProp) {\n        isProgrammaticClick.current = true;\n        tab.click();\n        isProgrammaticClick.current = false;\n      }\n    });\n  }, [valueProp]);\n\n  useEffect(() => {\n    if (!isControlled && defaultValue && tabsRef.current) {\n      tabsRef.current?.tabList?.tabs?.forEach((tab) => {\n        const isSelected = tab.getAttribute('data-value') === defaultValue;\n        tab.setAttribute('aria-selected', isSelected ? 'true' : 'false');\n      });\n    }\n    // oxlint-disable-next-line eslint-plugin-react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <Context\n      value={{\n        isControlled,\n        currentValue: value,\n        onChange: setValue,\n        getPrefixedValue: (value?: string) => value && `${valuePrefix}-${value}`,\n      }}\n    >\n      <ds-tabs\n        suppressHydrationWarning // Since <ds-tablist> adds attributes\n        ref={mergedRefs}\n        className={clsx('bi-tabs', className)}\n        {...props}\n      >\n        {children}\n      </ds-tabs>\n    </Context>\n  );\n};\n"],"mappings":";;;;;;;AA8BA,MAAa,UAAU,cAA2B,CAAC,CAAC;AAEpD,MAAa,QAAQ,EAAE,cAAc,OAAO,WAAW,UAAU,UAAU,WAAW,KAAK,GAAG,YAAuB;CACnH,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,UAAU,OAAsB,IAAI;CAC1C,MAAM,sBAAsB,OAAO,KAAK;CACxC,MAAM,cAAc,MAAM;CAC1B,MAAM,aAAa,aAAa,CAAC,KAAK,OAAO,CAAC;CAC9C,MAAM,CAAC,OAAO,YAAY,qBAAqB;EAC7C,MAAM;EACN;EACA,aAAa,gBAAgB;EAC7B,QAAQ;CACV,CAAC;CAED,gBAAgB;EACd,IAAI,CAAC,QAAQ,WAAW,cAAc,KAAA,GAAW;EACjD,QAAQ,SAAS,SAAS,MAAM,SAAS,QAAQ;GAC/C,IAAI,IAAI,aAAa,YAAY,MAAM,WAAW;IAChD,oBAAoB,UAAU;IAC9B,IAAI,MAAM;IACV,oBAAoB,UAAU;GAChC;EACF,CAAC;CACH,GAAG,CAAC,SAAS,CAAC;CAEd,gBAAgB;EACd,IAAI,CAAC,gBAAgB,gBAAgB,QAAQ,SAC3C,QAAQ,SAAS,SAAS,MAAM,SAAS,QAAQ;GAC/C,MAAM,aAAa,IAAI,aAAa,YAAY,MAAM;GACtD,IAAI,aAAa,iBAAiB,aAAa,SAAS,OAAO;EACjE,CAAC;CAGL,GAAG,CAAC,CAAC;CAEL,OACE,oBAAC,SAAD;EACE,OAAO;GACL;GACA,cAAc;GACd,UAAU;GACV,mBAAmB,UAAmB,SAAS,GAAG,YAAY,GAAG;EACnE;EAEA,UAAA,oBAAC,WAAD;GACE,0BAAA;GACA,KAAK;GACL,WAAW,KAAK,WAAW,SAAS;GACpC,GAAI;GAEH;EACM,CAAA;CACF,CAAA;AAEb"}

package/dist/components/textarea/index.d.mts

@@ -1,2 +1,2 @@
-import { d as Textarea, f as TextareaProps } from "../../alert-footer-B80k5mkX.mjs";
-export { Textarea, TextareaProps };
+import { d as Textarea, f as TextareaProps } from "../../alert-footer-BoTu7E1s.mjs";
+export { Textarea, type TextareaProps };

package/dist/components/textarea/textarea.d.mts

@@ -1,2 +1,2 @@
-import { d as Textarea, f as TextareaProps } from "../../alert-footer-B80k5mkX.mjs";
+import { d as Textarea, f as TextareaProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { Textarea, TextareaProps };

package/dist/components/textarea/textarea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.mjs","names":[],"sources":["../../../src/components/textarea/textarea.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, TextareaHTMLAttributes } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type TextareaProps = MergeRight<\n  DefaultProps & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'prefix'>,\n  {\n    /**\n     * Size of the textarea.\n     * @default 'medium'\n     */\n    size?: 'medium' | 'large';\n    ref?: Ref<HTMLTextAreaElement>;\n  }\n>;\n\nexport const Textarea = ({ className, size, ref, ...props }: TextareaProps) => {\n  return <textarea className={clsx('bi-input', className)} data-size={size} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAiBA,MAAa,YAAY,EAAE,WAAW,MAAM,KAAK,GAAG,YAA2B;CAC7E,OAAO,oBAAC,YAAD;EAAU,WAAW,KAAK,YAAY,UAAU;EAAE,aAAW;EAAW;EAAK,GAAI;EAAS,CAAA"}
+{"version":3,"file":"textarea.mjs","names":[],"sources":["../../../src/components/textarea/textarea.tsx"],"sourcesContent":["import clsx from 'clsx/lite';\nimport type { Ref, TextareaHTMLAttributes } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type TextareaProps = MergeRight<\n  DefaultProps & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'prefix'>,\n  {\n    /**\n     * Size of the textarea.\n     * @default 'medium'\n     */\n    size?: 'medium' | 'large';\n    ref?: Ref<HTMLTextAreaElement>;\n  }\n>;\n\nexport const Textarea = ({ className, size, ref, ...props }: TextareaProps) => {\n  return <textarea className={clsx('bi-input', className)} data-size={size} ref={ref} {...props} />;\n};\n"],"mappings":";;;AAiBA,MAAa,YAAY,EAAE,WAAW,MAAM,KAAK,GAAG,YAA2B;CAC7E,OAAO,oBAAC,YAAD;EAAU,WAAW,KAAK,YAAY,SAAS;EAAG,aAAW;EAAW;EAAK,GAAI;CAAQ,CAAA;AAClG"}

package/dist/components/textfield/index.d.mts

@@ -1,2 +1,2 @@
-import { l as Textfield, u as TextfieldProps } from "../../alert-footer-B80k5mkX.mjs";
-export { Textfield, TextfieldProps };
+import { l as Textfield, u as TextfieldProps } from "../../alert-footer-BoTu7E1s.mjs";
+export { Textfield, type TextfieldProps };

package/dist/components/textfield/textfield.d.mts

@@ -1,2 +1,2 @@
-import { l as Textfield, u as TextfieldProps } from "../../alert-footer-B80k5mkX.mjs";
+import { l as Textfield, u as TextfieldProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { Textfield, TextfieldProps };

package/dist/components/textfield/textfield.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"textfield.mjs","names":[],"sources":["../../../src/components/textfield/textfield.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { DefaultProps, LabelRequiredProps } from '../../types';\nimport { Field, FieldAffix, FieldAffixes, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\nimport { Textarea, type TextareaProps } from '../textarea';\nimport { ValidationMessage } from '../validation-message';\n\ntype InputPropsFiltered = Omit<InputProps, 'prefix' | 'className' | 'style'>;\ntype TextareaPropsFiltered = Omit<TextareaProps, 'prefix' | 'className' | 'style'>;\n\ntype BaseTextfieldProps = LabelRequiredProps &\n  DefaultProps & {\n    /** Label */\n    label?: ReactNode;\n    /** Description */\n    description?: ReactNode;\n    /** Prefix */\n    prefix?: string;\n    /** Suffix */\n    suffix?: string;\n    /** Error message for field */\n    error?: ReactNode;\n    /** `className` for the `Field` element */\n    className?: InputProps['className'];\n    /** `style` for the `Field` element */\n    style?: InputProps['style'];\n    /** If true, the selectfield will take up the full available width */\n    fullwidth?: boolean;\n  };\n\ntype TextfieldTextareaProps = {\n  /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n  multiline: true;\n} & TextareaPropsFiltered;\n\ntype TextfieldInputProps = {\n  /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n  multiline?: never | false;\n} & InputPropsFiltered;\n\nexport type TextfieldProps = BaseTextfieldProps & // We use either Textarea or Input props, depending on the `multiline` prop.\n  (TextfieldTextareaProps | TextfieldInputProps) & {\n    ref?: Ref<HTMLInputElement | HTMLTextAreaElement>;\n  };\n\nexport const Textfield = ({\n  label,\n  description,\n  error,\n  multiline,\n  prefix,\n  suffix,\n  style,\n  className,\n  fullwidth,\n  ref,\n  id: idProp,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: TextfieldProps) => {\n  const generatedId = useId();\n  const descriptionId = useId();\n  const validationId = useId();\n  const id = idProp || generatedId;\n\n  const ariaDescribedBy =\n    [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n  return (\n    <Field className={className} data-color={color} data-color-scheme={colorScheme} style={style} fullwidth={fullwidth}>\n      {label && <Label htmlFor={id}>{label}</Label>}\n      {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n      <FieldAffixes>\n        {prefix && <FieldAffix>{prefix}</FieldAffix>}\n        {multiline ? (\n          <Textarea\n            id={id}\n            ref={ref as Ref<HTMLTextAreaElement>}\n            aria-invalid={Boolean(error) || undefined}\n            aria-describedby={ariaDescribedBy}\n            {...(props as TextareaPropsFiltered)}\n          />\n        ) : (\n          <Input\n            id={id}\n            ref={ref as Ref<HTMLInputElement>}\n            aria-invalid={Boolean(error) || undefined}\n            aria-describedby={ariaDescribedBy}\n            {...(props as InputPropsFiltered)}\n          />\n        )}\n        {suffix && <FieldAffix>{suffix}</FieldAffix>}\n      </FieldAffixes>\n      {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AA+CA,MAAa,aAAa,EACxB,OACA,aACA,OACA,WACA,QACA,QACA,OACA,WACA,WACA,KACA,IAAI,QACJ,cAAc,OACd,qBAAqB,aACrB,oBAAoB,qBACpB,GAAG,YACiB;CACpB,MAAM,cAAc,OAAO;CAC3B,MAAM,gBAAgB,OAAO;CAC7B,MAAM,eAAe,OAAO;CAC5B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;EAAoB,CAAC,KAAK,IAAI,CAAC,MAAM,IAAI,KAAA;CACzG,OACE,qBAAC,OAAD;EAAkB;EAAW,cAAY;EAAO,qBAAmB;EAAoB;EAAkB;YAAzG;GACG,SAAS,oBAAC,OAAD;IAAO,SAAS;cAAK;IAAc,CAAA;GAC5C,eAAe,oBAAC,kBAAD;IAAkB,IAAI;cAAgB;IAA+B,CAAA;GACrF,qBAAC,cAAD,EAAA,UAAA;IACG,UAAU,oBAAC,YAAD,EAAA,UAAa,QAAoB,CAAA;IAC3C,YACC,oBAAC,UAAD;KACM;KACC;KACL,gBAAc,QAAQ,MAAM,IAAI,KAAA;KAChC,oBAAkB;KAClB,GAAK;KACL,CAAA,GAEF,oBAAC,OAAD;KACM;KACC;KACL,gBAAc,QAAQ,MAAM,IAAI,KAAA;KAChC,oBAAkB;KAClB,GAAK;KACL,CAAA;IAEH,UAAU,oBAAC,YAAD,EAAA,UAAa,QAAoB,CAAA;IAC/B,EAAA,CAAA;GACd,CAAC,CAAC,SAAS,oBAAC,mBAAD;IAAmB,IAAI;cAAe;IAA0B,CAAA;GACtE"}
+{"version":3,"file":"textfield.mjs","names":[],"sources":["../../../src/components/textfield/textfield.tsx"],"sourcesContent":["import { useId, type ReactNode, type Ref } from 'react';\n\nimport type { DefaultProps, LabelRequiredProps } from '../../types';\nimport { Field, FieldAffix, FieldAffixes, FieldDescription } from '../field';\nimport { Input, type InputProps } from '../input';\nimport { Label } from '../label';\nimport { Textarea, type TextareaProps } from '../textarea';\nimport { ValidationMessage } from '../validation-message';\n\ntype InputPropsFiltered = Omit<InputProps, 'prefix' | 'className' | 'style'>;\ntype TextareaPropsFiltered = Omit<TextareaProps, 'prefix' | 'className' | 'style'>;\n\ntype BaseTextfieldProps = LabelRequiredProps &\n  DefaultProps & {\n    /** Label */\n    label?: ReactNode;\n    /** Description */\n    description?: ReactNode;\n    /** Prefix */\n    prefix?: string;\n    /** Suffix */\n    suffix?: string;\n    /** Error message for field */\n    error?: ReactNode;\n    /** `className` for the `Field` element */\n    className?: InputProps['className'];\n    /** `style` for the `Field` element */\n    style?: InputProps['style'];\n    /** If true, the selectfield will take up the full available width */\n    fullwidth?: boolean;\n  };\n\ntype TextfieldTextareaProps = {\n  /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n  multiline: true;\n} & TextareaPropsFiltered;\n\ntype TextfieldInputProps = {\n  /** Render `Textarea` instead of a `Input`. The `Textarea` has support for multiple rows of input. */\n  multiline?: never | false;\n} & InputPropsFiltered;\n\nexport type TextfieldProps = BaseTextfieldProps & // We use either Textarea or Input props, depending on the `multiline` prop.\n  (TextfieldTextareaProps | TextfieldInputProps) & {\n    ref?: Ref<HTMLInputElement | HTMLTextAreaElement>;\n  };\n\nexport const Textfield = ({\n  label,\n  description,\n  error,\n  multiline,\n  prefix,\n  suffix,\n  style,\n  className,\n  fullwidth,\n  ref,\n  id: idProp,\n  'data-color': color,\n  'data-color-scheme': colorScheme,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: TextfieldProps) => {\n  const generatedId = useId();\n  const descriptionId = useId();\n  const validationId = useId();\n  const id = idProp || generatedId;\n\n  const ariaDescribedBy =\n    [description ? descriptionId : '', error ? validationId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n  return (\n    <Field className={className} data-color={color} data-color-scheme={colorScheme} style={style} fullwidth={fullwidth}>\n      {label && <Label htmlFor={id}>{label}</Label>}\n      {description && <FieldDescription id={descriptionId}>{description}</FieldDescription>}\n      <FieldAffixes>\n        {prefix && <FieldAffix>{prefix}</FieldAffix>}\n        {multiline ? (\n          <Textarea\n            id={id}\n            ref={ref as Ref<HTMLTextAreaElement>}\n            aria-invalid={Boolean(error) || undefined}\n            aria-describedby={ariaDescribedBy}\n            {...(props as TextareaPropsFiltered)}\n          />\n        ) : (\n          <Input\n            id={id}\n            ref={ref as Ref<HTMLInputElement>}\n            aria-invalid={Boolean(error) || undefined}\n            aria-describedby={ariaDescribedBy}\n            {...(props as InputPropsFiltered)}\n          />\n        )}\n        {suffix && <FieldAffix>{suffix}</FieldAffix>}\n      </FieldAffixes>\n      {!!error && <ValidationMessage id={validationId}>{error}</ValidationMessage>}\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;AA+CA,MAAa,aAAa,EACxB,OACA,aACA,OACA,WACA,QACA,QACA,OACA,WACA,WACA,KACA,IAAI,QACJ,cAAc,OACd,qBAAqB,aACrB,oBAAoB,qBACpB,GAAG,YACiB;CACpB,MAAM,cAAc,MAAM;CAC1B,MAAM,gBAAgB,MAAM;CAC5B,MAAM,eAAe,MAAM;CAC3B,MAAM,KAAK,UAAU;CAErB,MAAM,kBACJ;EAAC,cAAc,gBAAgB;EAAI,QAAQ,eAAe;EAAI;CAAmB,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,KAAK,KAAK,KAAA;CACzG,OACE,qBAAC,OAAD;EAAkB;EAAW,cAAY;EAAO,qBAAmB;EAAoB;EAAkB;EAAzG,UAAA;GACG,SAAS,oBAAC,OAAD;IAAO,SAAS;IAAK,UAAA;GAAa,CAAA;GAC3C,eAAe,oBAAC,kBAAD;IAAkB,IAAI;IAAgB,UAAA;GAA8B,CAAA;GACpF,qBAAC,cAAD,EAAA,UAAA;IACG,UAAU,oBAAC,YAAD,EAAA,UAAa,OAAmB,CAAA;IAC1C,YACC,oBAAC,UAAD;KACM;KACC;KACL,gBAAc,QAAQ,KAAK,KAAK,KAAA;KAChC,oBAAkB;KAClB,GAAK;IACN,CAAA,IAED,oBAAC,OAAD;KACM;KACC;KACL,gBAAc,QAAQ,KAAK,KAAK,KAAA;KAChC,oBAAkB;KAClB,GAAK;IACN,CAAA;IAEF,UAAU,oBAAC,YAAD,EAAA,UAAa,OAAmB,CAAA;GAC/B,EAAA,CAAA;GACb,CAAC,CAAC,SAAS,oBAAC,mBAAD;IAAmB,IAAI;IAAe,UAAA;GAAyB,CAAA;EACtE;;AAEX"}

package/dist/components/tooltip/index.d.mts

@@ -1,2 +1,2 @@
-import { c as TooltipProps, s as Tooltip } from "../../alert-footer-B80k5mkX.mjs";
-export { Tooltip, TooltipProps };
+import { c as TooltipProps, s as Tooltip } from "../../alert-footer-BoTu7E1s.mjs";
+export { Tooltip, type TooltipProps };

package/dist/components/tooltip/tooltip.d.mts

@@ -1,2 +1,2 @@
-import { c as TooltipProps, s as Tooltip } from "../../alert-footer-B80k5mkX.mjs";
+import { c as TooltipProps, s as Tooltip } from "../../alert-footer-BoTu7E1s.mjs";
 export { Tooltip, TooltipProps };

package/dist/components/tooltip/tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.mjs","names":[],"sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport '@digdir/designsystemet-web'; // Import ds-tooltip functionality\nimport type { HTMLAttributes, ReactElement, Ref, RefAttributes } from 'react';\nimport type { Placement } from '@floating-ui/dom';\nimport type { MergeRight } from '../../utilities';\nimport '../../vanilla/tooltip';\n\nexport type TooltipProps = MergeRight<\n  HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * The element or string that triggers the tooltip.\n     *\n     * Note: If it is a string, it will be wrapped in a span.\n     * Note: If it is an element, it must be able to receive a ref.\n     */\n    children: (ReactElement & RefAttributes<HTMLSpanElement>) | string;\n    /**\n     * Content of the tooltip\n     **/\n    content: string;\n    /**\n     * Placement of the tooltip on the trigger.\n     * @default 'top'\n     */\n    placement?: Placement;\n    /**\n     * Whether to disable auto placement.\n     * @default false\n     */\n    disableAutoPlacement?: boolean;\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\n/**\n * Tooltip component that displays a small piece of information on hover or focus.\n *\n * @example\n * <Tooltip content='This is the tooltip content'>\n *  <button>Hover me</button>\n * </Tooltip>\n *\n * @example\n * <Tooltip content='This is the tooltip content'>\n *  Hover me\n * </Tooltip>\n */\nexport const Tooltip = ({\n  children,\n  content,\n  placement = 'top',\n  disableAutoPlacement = false,\n  ref,\n  ...props\n}: TooltipProps) => {\n  return (\n    <Slot\n      data-tooltip={content}\n      data-placement={placement}\n      data-autoplacement={!disableAutoPlacement}\n      suppressHydrationWarning // Since data-tooltip adds aria-label/aria-description\n      ref={ref}\n      {...props}\n    >\n      {/* oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n      {typeof children === 'string' ? <span tabIndex={0}>{children}</span> : children}\n    </Slot>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAgDA,MAAa,WAAW,EACtB,UACA,SACA,YAAY,OACZ,uBAAuB,OACvB,KACA,GAAG,YACe;CAClB,OACE,oBAAC,MAAD;EACE,gBAAc;EACd,kBAAgB;EAChB,sBAAoB,CAAC;EACrB,0BAAA;EACK;EACL,GAAI;YAGH,OAAO,aAAa,WAAW,oBAAC,QAAD;GAAM,UAAU;GAAI;GAAgB,CAAA,GAAG;EAClE,CAAA"}
+{"version":3,"file":"tooltip.mjs","names":[],"sources":["../../../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport '@digdir/designsystemet-web'; // Import ds-tooltip functionality\nimport type { HTMLAttributes, ReactElement, Ref, RefAttributes } from 'react';\nimport type { Placement } from '@floating-ui/dom';\nimport type { MergeRight } from '../../utilities';\nimport '../../vanilla/tooltip';\n\nexport type TooltipProps = MergeRight<\n  HTMLAttributes<HTMLSpanElement>,\n  {\n    /**\n     * The element or string that triggers the tooltip.\n     *\n     * Note: If it is a string, it will be wrapped in a span.\n     * Note: If it is an element, it must be able to receive a ref.\n     */\n    children: (ReactElement & RefAttributes<HTMLSpanElement>) | string;\n    /**\n     * Content of the tooltip\n     **/\n    content: string;\n    /**\n     * Placement of the tooltip on the trigger.\n     * @default 'top'\n     */\n    placement?: Placement;\n    /**\n     * Whether to disable auto placement.\n     * @default false\n     */\n    disableAutoPlacement?: boolean;\n    ref?: Ref<HTMLSpanElement>;\n  }\n>;\n\n/**\n * Tooltip component that displays a small piece of information on hover or focus.\n *\n * @example\n * <Tooltip content='This is the tooltip content'>\n *  <button>Hover me</button>\n * </Tooltip>\n *\n * @example\n * <Tooltip content='This is the tooltip content'>\n *  Hover me\n * </Tooltip>\n */\nexport const Tooltip = ({\n  children,\n  content,\n  placement = 'top',\n  disableAutoPlacement = false,\n  ref,\n  ...props\n}: TooltipProps) => {\n  return (\n    <Slot\n      data-tooltip={content}\n      data-placement={placement}\n      data-autoplacement={!disableAutoPlacement}\n      suppressHydrationWarning // Since data-tooltip adds aria-label/aria-description\n      ref={ref}\n      {...props}\n    >\n      {/* oxlint-disable-next-line jsx-a11y/no-noninteractive-tabindex */}\n      {typeof children === 'string' ? <span tabIndex={0}>{children}</span> : children}\n    </Slot>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAgDA,MAAa,WAAW,EACtB,UACA,SACA,YAAY,OACZ,uBAAuB,OACvB,KACA,GAAG,YACe;CAClB,OACE,oBAAC,MAAD;EACE,gBAAc;EACd,kBAAgB;EAChB,sBAAoB,CAAC;EACrB,0BAAA;EACK;EACL,GAAI;EAGH,UAAA,OAAO,aAAa,WAAW,oBAAC,QAAD;GAAM,UAAU;GAAI;EAAe,CAAA,IAAI;CACnE,CAAA;AAEV"}

package/dist/components/validation-message/index.d.mts

@@ -1,2 +1,2 @@
-import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-B80k5mkX.mjs";
-export { ValidationMessage, ValidationMessageProps };
+import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-BoTu7E1s.mjs";
+export { ValidationMessage, type ValidationMessageProps };

package/dist/components/validation-message/validation-message.d.mts

@@ -1,2 +1,2 @@
-import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-B80k5mkX.mjs";
+import { a as ValidationMessage, o as ValidationMessageProps } from "../../alert-footer-BoTu7E1s.mjs";
 export { ValidationMessage, ValidationMessageProps };

package/dist/components/validation-message/validation-message.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"validation-message.mjs","names":[],"sources":["../../../src/components/validation-message/validation-message.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx/lite';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { AsChildProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { ErrorIcon } from '@bi-digital/icons';\n\nexport type ValidationMessageProps = MergeRight<\n  AsChildProps & HTMLAttributes<HTMLParagraphElement>,\n  {\n    /** Override the default warning icon. Must be a BiIcon to work correctly. */\n    icon?: ReactNode;\n    ref?: Ref<HTMLParagraphElement>;\n  }\n>;\n\nexport const ValidationMessage = ({ children, className, icon, asChild, ref, ...props }: ValidationMessageProps) => {\n  const Component = asChild ? Slot : 'p';\n\n  return (\n    <Component className={clsx('bi-validation-message', className)} ref={ref} {...props}>\n      {icon || <ErrorIcon />}\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;AAgBA,MAAa,qBAAqB,EAAE,UAAU,WAAW,MAAM,SAAS,KAAK,GAAG,YAAoC;CAGlH,OACE,qBAHgB,UAAU,OAAO,KAGjC;EAAW,WAAW,KAAK,yBAAyB,UAAU;EAAO;EAAK,GAAI;YAA9E,CACG,QAAQ,oBAAC,WAAD,EAAa,CAAA,EACrB,SACS"}
+{"version":3,"file":"validation-message.mjs","names":[],"sources":["../../../src/components/validation-message/validation-message.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx/lite';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport type { AsChildProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\nimport { ErrorIcon } from '@bi-digital/icons';\n\nexport type ValidationMessageProps = MergeRight<\n  AsChildProps & HTMLAttributes<HTMLParagraphElement>,\n  {\n    /** Override the default warning icon. Must be a BiIcon to work correctly. */\n    icon?: ReactNode;\n    ref?: Ref<HTMLParagraphElement>;\n  }\n>;\n\nexport const ValidationMessage = ({ children, className, icon, asChild, ref, ...props }: ValidationMessageProps) => {\n  const Component = asChild ? Slot : 'p';\n\n  return (\n    <Component className={clsx('bi-validation-message', className)} ref={ref} {...props}>\n      {icon || <ErrorIcon />}\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;AAgBA,MAAa,qBAAqB,EAAE,UAAU,WAAW,MAAM,SAAS,KAAK,GAAG,YAAoC;CAGlH,OACE,qBAHgB,UAAU,OAAO,KAGjC;EAAW,WAAW,KAAK,yBAAyB,SAAS;EAAQ;EAAK,GAAI;EAA9E,UAAA,CACG,QAAQ,oBAAC,WAAD,CAAY,CAAA,GACpB,QACQ;;AAEf"}