@bi-digital/react 0.2.18 → 0.2.20

package/dist/utilities/hooks/useScrollDirection/useScrollDirection.d.ts

@@ -0,0 +1,11 @@
+//#region src/utilities/hooks/useScrollDirection/useScrollDirection.d.ts
+/**
+ * A custom React hook that detects the vertical scroll direction of the page.
+ *
+ * @returns {'up' | 'down' | null} The current scroll direction. Returns `null` on the initial render.
+ * The direction is only updated if the scroll distance exceeds a 5px threshold to prevent sensitivity to minor scroll jitter.
+ */
+declare const useScrollDirection: () => "up" | "down" | null;
+//#endregion
+export { useScrollDirection };
+//# sourceMappingURL=useScrollDirection.d.ts.map

package/dist/utilities/hooks/useScrollDirection/useScrollDirection.js

@@ -0,0 +1,3 @@
+import { useScrollDirection } from "../../../useScrollDirection-BLgp51hx.js";
+
+export { useScrollDirection };

package/dist/utilities/index.d.ts

@@ -1,14 +1,17 @@
-import { useIsomorphicLayoutEffect } from "../useIsomorphicLayoutEffect-D3y6bHpX.js";
-import "../useMergeRefs-BTgz9pcs.js";
-import "../types-BTJlwWCQ.js";
-import { UsePaginationProps, usePagination } from "../alert-footer-BS8bENJI.js";
-import "../dialog-trigger-context-BP03jmAI.js";
-import "../drawer-trigger-context-BDcc94cu.js";
-import "../popover-trigger-context-DQy9nKB2.js";
-import "../dropdown-item-bMZ3-43Z.js";
-import "../dropdown-list-DenWbmcv.js";
-import "../dropdown-trigger-context-BabMM_7k.js";
-import "../footer-links-sRD7teEv.js";
-import "../pagination-item-hMN-34PX.js";
-import { MergeRight } from "../types-CAwE6h3H.js";
-export { MergeRight, UsePaginationProps, useIsomorphicLayoutEffect, usePagination };
+import { UseCheckboxGroupOptions, useCheckboxGroup } from "../useCheckboxGroup-DRhqch1m.js";
+import { useIsomorphicLayoutEffect } from "../useIsomorphicLayoutEffect-BMdz-mee.js";
+import "../useMergeRefs-iCenhgmf.js";
+import "../types-Mj1poXVf.js";
+import { UsePaginationProps, usePagination } from "../alert-footer-F_v71IcX.js";
+import "../dialog-trigger-context-CpvFZdAf.js";
+import "../drawer-trigger-context-_6XODjjT.js";
+import "../popover-trigger-context-B_lI5ACl.js";
+import "../dropdown-item-DF22Z5Fn.js";
+import "../dropdown-list-C3lptEFd.js";
+import "../dropdown-trigger-context-CZCfmNC-.js";
+import "../footer-links-XPnAoNyU.js";
+import "../pagination-item-B5s_Fpjt.js";
+import "../sticky-header-BhzeZPgJ.js";
+import "../index-CTw2zfCM.js";
+import { MergeRight } from "../types-DC-FPmDA.js";
+export { MergeRight, UseCheckboxGroupOptions, UsePaginationProps, useCheckboxGroup, useIsomorphicLayoutEffect, usePagination };

package/dist/utilities/index.js

@@ -1,7 +1,8 @@
-import { useIsomorphicLayoutEffect } from "../useIsomorphicLayoutEffect-DCaf_yI4.js";
-import "../useMergeRefs-Cz-t7gpp.js";
-import { usePagination } from "../usePagination-afWMXp7h.js";
-import "../hooks-CQ4fud3K.js";
-import "../utilities-DO_q6EB3.js";
+import { useCheckboxGroup } from "../useCheckboxGroup-rTVawmvi.js";
+import { useIsomorphicLayoutEffect } from "../useIsomorphicLayoutEffect-B5btmYlF.js";
+import "../useMergeRefs-CcJMoo46.js";
+import { usePagination } from "../usePagination-DNqO-ob2.js";
+import "../hooks-BmaG9QJW.js";
+import "../utilities-JoKvbhOy.js";
 
-export { useIsomorphicLayoutEffect, usePagination };
+export { useCheckboxGroup, useIsomorphicLayoutEffect, usePagination };

package/dist/utilities/types.d.ts

@@ -1,2 +1,2 @@
-import { MergeRight } from "../types-CAwE6h3H.js";
+import { MergeRight } from "../types-DC-FPmDA.js";
 export { MergeRight };

package/dist/{validation-message-DjATM7g-.js → validation-message-6AQTIup_.js}

@@ -16,4 +16,4 @@ const ValidationMessage = ({ children, className, icon, asChild, ref,...props })
 
 //#endregion
 export { ValidationMessage };
-//# sourceMappingURL=validation-message-DjATM7g-.js.map
+//# sourceMappingURL=validation-message-6AQTIup_.js.map

package/dist/{validation-message-DjATM7g-.js.map → validation-message-6AQTIup_.js.map}

@@ -1 +1 @@
-{"version":3,"file":"validation-message-DjATM7g-.js","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 { BiIconError } from '@bi-digital/icons-react';\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 || <BiIconError />}\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;AAgBA,MAAa,oBAAoB,CAAC,EAAE,UAAU,WAAW,MAAM,SAAS,IAAK,GAAG,OAA+B,KAAK;CAClH,MAAM,YAAY,UAAU,OAAO;AAEnC,wBACE,KAAC;EAAU,WAAW,KAAK,yBAAyB,UAAU;EAAO;EAAK,GAAI;aAC3E,wBAAQ,IAAC,gBAAc,EACvB;GACS;AAEf"}
+{"version":3,"file":"validation-message-6AQTIup_.js","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 { BiIconError } from '@bi-digital/icons-react';\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 || <BiIconError />}\n      {children}\n    </Component>\n  );\n};\n"],"mappings":";;;;;;AAgBA,MAAa,oBAAoB,CAAC,EAAE,UAAU,WAAW,MAAM,SAAS,IAAK,GAAG,OAA+B,KAAK;CAClH,MAAM,YAAY,UAAU,OAAO;AAEnC,wBACE,KAAC;EAAU,WAAW,KAAK,yBAAyB,UAAU;EAAO;EAAK,GAAI;aAC3E,wBAAQ,IAAC,gBAAc,EACvB;GACS;AAEf"}

package/dist/vanilla/dropdown/index.d.ts

@@ -1,2 +1,2 @@
-import { InitDropdownOptions, initDropdown } from "../../index-qXXUizvD.js";
+import { InitDropdownOptions, initDropdown } from "../../index-B-0iSMVN.js";
 export { InitDropdownOptions, initDropdown };

package/dist/vanilla/dropdown/index.js

@@ -1,4 +1,4 @@
-import "../../popover-CGNoywPj.js";
-import { initDropdown } from "../../dropdown-C1hpsZcN.js";
+import "../../popover-COi7S9pJ.js";
+import { initDropdown } from "../../dropdown-D-dX5PAl.js";
 
 export { initDropdown };

package/dist/vanilla/index.d.ts

@@ -1,3 +1,3 @@
-import { InitDropdownOptions, initDropdown } from "../index-qXXUizvD.js";
-import { InitPopoverOptions, initPopover } from "../index-CRy7A5Iq.js";
+import { InitDropdownOptions, initDropdown } from "../index-B-0iSMVN.js";
+import { InitPopoverOptions, initPopover } from "../index-CXV3nvLQ.js";
 export { InitDropdownOptions, InitPopoverOptions, initDropdown, initPopover };

package/dist/vanilla/index.js

@@ -1,4 +1,4 @@
-import { initPopover } from "../popover-CGNoywPj.js";
-import { initDropdown } from "../dropdown-C1hpsZcN.js";
+import { initPopover } from "../popover-COi7S9pJ.js";
+import { initDropdown } from "../dropdown-D-dX5PAl.js";
 
 export { initDropdown, initPopover };

package/dist/vanilla/popover/index.d.ts

@@ -1,2 +1,2 @@
-import { InitPopoverOptions, initPopover } from "../../index-CRy7A5Iq.js";
+import { InitPopoverOptions, initPopover } from "../../index-CXV3nvLQ.js";
 export { InitPopoverOptions, initPopover };

package/dist/vanilla/popover/index.js

@@ -1,3 +1,3 @@
-import { initPopover } from "../../popover-CGNoywPj.js";
+import { initPopover } from "../../popover-COi7S9pJ.js";
 
 export { initPopover };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bi-digital/react",
-  "version": "0.2.18",
+  "version": "0.2.20",
   "type": "module",
   "description": "React components from BI Digital",
   "author": "BI Digital",
@@ -47,13 +47,13 @@
     "tsdown": "^0.12.7",
     "typescript": "^5.7.2",
     "vitest": "^3.2.1",
-    "@bi-digital/icons-react": "0.2.18"
+    "@bi-digital/icons-react": "0.2.20"
   },
   "peerDependencies": {
     "react": "^19",
     "react-dom": "^19",
-    "@bi-digital/css": "0.2.18",
-    "@bi-digital/icons-react": "0.2.18"
+    "@bi-digital/css": "0.2.20",
+    "@bi-digital/icons-react": "0.2.20"
   },
   "scripts": {
     "build": "tsdown",

package/dist/checkbox-Bx9n-4ar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"checkbox-Bx9n-4ar.js","names":["input: HTMLInputElement | null"],"sources":["../src/components/checkbox/checkbox.tsx"],"sourcesContent":["import { useEffect, useId, useRef, 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';\nimport { useMergeRefs } from '../../utilities/hooks';\n\nexport type CheckboxProps = 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 checkbox. */\n    error?: boolean;\n    /** Specify whether the Checkbox is indeterminate */\n    indeterminate?: boolean;\n    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Checkbox = ({\n  dark,\n  label,\n  description,\n  error,\n  style,\n  className,\n  indeterminate,\n  ref,\n  id,\n  'aria-describedby': ariaDescribedByProp,\n  ...props\n}: CheckboxProps) => {\n  const checkRef = useRef<HTMLInputElement>(null);\n  const refs = useMergeRefs([checkRef, ref]);\n  const descriptionId = useId();\n\n  useEffect(() => {\n    let input: HTMLInputElement | null;\n    if (ref && typeof ref !== 'function') {\n      input = ref.current;\n    } else {\n      input = checkRef.current;\n    }\n\n    if (input) {\n      input.indeterminate = indeterminate || false;\n    }\n  }, [indeterminate, checkRef, ref]);\n\n  const ariaDescribedBy = [description ? descriptionId : '', ariaDescribedByProp].join(' ').trim() || undefined;\n\n  return (\n    <Field className={className} data-dark={dark} style={style} asChild>\n      <label>\n        <Input\n          type='checkbox'\n          id={id}\n          ref={refs}\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":";;;;;;;;;AAwBA,MAAa,WAAW,CAAC,EACvB,MACA,OACA,aACA,OACA,OACA,WACA,eACA,KACA,IACA,oBAAoB,oBACpB,GAAG,OACW,KAAK;CACnB,MAAM,WAAW,OAAyB,KAAK;CAC/C,MAAM,OAAO,aAAa,CAAC,UAAU,GAAI,EAAC;CAC1C,MAAM,gBAAgB,OAAO;AAE7B,WAAU,MAAM;EACd,IAAIA;AACJ,MAAI,cAAc,QAAQ,WACxB,SAAQ,IAAI;MAEZ,SAAQ,SAAS;AAGnB,MAAI,MACF,OAAM,gBAAgB,iBAAiB;CAE1C,GAAE;EAAC;EAAe;EAAU;CAAI,EAAC;CAElC,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,mBAAoB,EAAC,KAAK,IAAI,CAAC,MAAM;AAEhG,wBACE,IAAC;EAAiB;EAAW,aAAW;EAAa;EAAO;4BAC1D,KAAC;mBACC,IAAC;IACC,MAAK;IACD;IACJ,KAAK;IACL,gBAAc;IACd,oBAAkB;IAClB,GAAI;KACJ;GACD,yBACC,IAAC;IAAM,QAAO;IAAS,SAAS;IAAI;8BAClC,IAAC,oBAAM,QAAa;KACd;GAET,+BAGC,IAAC;IAAiB,eAAY;IAAO,IAAI;cACtC;KACgB;MAEf;GACF;AAEX"}

package/dist/field-U2SN9jkp.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"field-U2SN9jkp.js","names":[],"sources":["../src/components/field/field.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx/lite';\nimport type { HTMLAttributes, Ref } from 'react';\nimport type { DefaultProps, AsChildProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type FieldProps = MergeRight<\n  DefaultProps & AsChildProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Position of toggle-type inputs (radio, checkbox) in the field\n     * @default start\n     */\n    position?: 'start' | 'end';\n    ref?: Ref<HTMLDivElement>;\n  }\n>;\n\n/**\n * The Field component is used to wrap a form field.\n *\n * @example\n * <Field>\n *   <Label>Kort beskrivelse</Label>\n *   <FieldDescription>Beskrivelse</FieldDescription>\n *   <Input />\n *   <ValidationMessage>Feilmelding</ValidationMessage>\n * </Field>\n */\nexport const Field = ({ className, dark, position, asChild, ref, ...props }: FieldProps) => {\n  const Component = asChild ? Slot : 'div';\n\n  return (\n    <Component className={clsx('bi-field', className)} data-dark={dark} data-position={position} ref={ref} {...props} />\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AA6BA,MAAa,QAAQ,CAAC,EAAE,WAAW,MAAM,UAAU,SAAS,IAAK,GAAG,OAAmB,KAAK;CAC1F,MAAM,YAAY,UAAU,OAAO;AAEnC,wBACE,IAAC;EAAU,WAAW,KAAK,YAAY,UAAU;EAAE,aAAW;EAAM,iBAAe;EAAe;EAAK,GAAI;GAAS;AAEvH"}

package/dist/link-lNn9wvQf.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"link-lNn9wvQf.js","names":[],"sources":["../src/components/link/link.tsx"],"sourcesContent":["import { Slot } from '@radix-ui/react-slot';\nimport clsx from 'clsx';\nimport type { AnchorHTMLAttributes, ReactNode, Ref } from 'react';\nimport type { DefaultProps } from '../../types';\nimport type { MergeRight } from '../../utilities';\n\nexport type LinkProps = MergeRight<\n  DefaultProps & AnchorHTMLAttributes<HTMLAnchorElement>,\n  {\n    /**\n     * Set the color of the link.\n     * @default 'primary'\n     */\n    color?: 'primary' | 'neutral';\n    children: ReactNode;\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<HTMLAnchorElement>;\n  }\n>;\n\nexport const Link = ({ asChild, className, color, dark, ref, ...rest }: LinkProps) => {\n  const Component = asChild ? Slot : 'a';\n\n  return <Component className={clsx('bi-link', className)} data-color={color} data-dark={dark} ref={ref} {...rest} />;\n};\n"],"mappings":";;;;;AAwBA,MAAa,OAAO,CAAC,EAAE,SAAS,WAAW,OAAO,MAAM,IAAK,GAAG,MAAiB,KAAK;CACpF,MAAM,YAAY,UAAU,OAAO;AAEnC,wBAAO,IAAC;EAAU,WAAW,KAAK,WAAW,UAAU;EAAE,cAAY;EAAO,aAAW;EAAW;EAAK,GAAI;GAAQ;AACpH"}

package/dist/navbar-Dm9lM6Xr.js

@@ -1,31 +0,0 @@
-import { Logo } from "./logo-QKrYvRFP.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-import clsx from "clsx";
-
-//#region src/components/navbar/navbar.tsx
-const Navbar = ({ dark = false, fixed = false, menuAreaLabel, homeAriaLabel, skipLink, homeHref, logo, children, className, ref,...props }) => {
-	return /* @__PURE__ */ jsxs("nav", {
-		...props,
-		className: clsx("bi-navbar", className),
-		"data-fixed": fixed,
-		"data-dark": dark,
-		ref,
-		children: [skipLink && /* @__PURE__ */ jsx("a", {
-			className: "bi-navbar__skip-link",
-			href: skipLink.href,
-			children: skipLink.label
-		}), /* @__PURE__ */ jsxs("header", {
-			className: "bi-navbar__header",
-			"aria-label": menuAreaLabel,
-			children: [/* @__PURE__ */ jsx("a", {
-				"aria-label": homeAriaLabel,
-				href: homeHref,
-				children: logo || /* @__PURE__ */ jsx(Logo, { dark })
-			}), children]
-		})]
-	});
-};
-
-//#endregion
-export { Navbar };
-//# sourceMappingURL=navbar-Dm9lM6Xr.js.map

package/dist/navbar-Dm9lM6Xr.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"navbar-Dm9lM6Xr.js","names":[],"sources":["../src/components/navbar/navbar.tsx"],"sourcesContent":["import clsx from 'clsx';\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { Logo } from '../logo';\nimport type { MergeRight } from '../../utilities';\nimport type { DefaultProps } from '../../types';\n\nexport type NavbarProps = MergeRight<\n  DefaultProps & HTMLAttributes<HTMLDivElement>,\n  {\n    /**\n     * Skip link.\n     */\n    skipLink?: { label: string; href: string };\n    /**\n     * Text for menu area label.\n     */\n    menuAreaLabel: string;\n    /**\n     * Determines if the navbar should be fixed.\n     * @default false\n     */\n    fixed?: boolean;\n    /**\n     * Aria label for the home link.\n     */\n    homeAriaLabel: string;\n    /**\n     * Href for the home link.\n     */\n    homeHref: string;\n    /**\n     * Override the default logo\n     */\n    logo?: ReactNode;\n    ref?: Ref<HTMLElement>;\n  }\n>;\n\nexport const Navbar = ({\n  dark = false,\n  fixed = false,\n  menuAreaLabel,\n  homeAriaLabel,\n  skipLink,\n  homeHref,\n  logo,\n  children,\n  className,\n  ref,\n  ...props\n}: NavbarProps) => {\n  return (\n    <nav {...props} className={clsx('bi-navbar', className)} data-fixed={fixed} data-dark={dark} ref={ref}>\n      {skipLink && (\n        <a className='bi-navbar__skip-link' href={skipLink.href}>\n          {skipLink.label}\n        </a>\n      )}\n      <header className='bi-navbar__header' aria-label={menuAreaLabel}>\n        <a aria-label={homeAriaLabel} href={homeHref}>\n          {logo || <Logo dark={dark} />}\n        </a>\n        {children}\n      </header>\n    </nav>\n  );\n};\n"],"mappings":";;;;;AAsCA,MAAa,SAAS,CAAC,EACrB,OAAO,OACP,QAAQ,OACR,eACA,eACA,UACA,UACA,MACA,UACA,WACA,IACA,GAAG,OACS,KAAK;AACjB,wBACE,KAAC;EAAI,GAAI;EAAO,WAAW,KAAK,aAAa,UAAU;EAAE,cAAY;EAAO,aAAW;EAAW;aAC/F,4BACC,IAAC;GAAE,WAAU;GAAuB,MAAM,SAAS;aAChD,SAAS;IACR,kBAEN,KAAC;GAAO,WAAU;GAAoB,cAAY;8BAChD,IAAC;IAAE,cAAY;IAAe,MAAM;cACjC,wBAAQ,IAAC,QAAW,OAAQ;KAC3B,EACH;IACM;GACL;AAET"}

package/dist/radio-C_Zbb4CF.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"radio-C_Zbb4CF.js","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    ref?: Ref<HTMLInputElement>;\n  }\n>;\n\nexport const Radio = ({\n  dark,\n  label,\n  description,\n  error,\n  style,\n  className,\n  ref,\n  id,\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 className={className} data-dark={dark} style={style} asChild>\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":";;;;;;;;AAqBA,MAAa,QAAQ,CAAC,EACpB,MACA,OACA,aACA,OACA,OACA,WACA,KACA,IACA,oBAAoB,oBACpB,GAAG,OACQ,KAAK;CAChB,MAAM,gBAAgB,OAAO;CAE7B,MAAM,kBAAkB,CAAC,cAAc,gBAAgB,IAAI,mBAAoB,EAAC,KAAK,IAAI,CAAC,MAAM;AAEhG,wBACE,IAAC;EAAiB;EAAW,aAAW;EAAa;EAAO;4BAC1D,KAAC;mBACC,IAAC;IACC,MAAK;IACD;IACC;IACL,gBAAc;IACd,oBAAkB;IAClB,GAAI;KACJ;GACD,yBACC,IAAC;IAAM,QAAO;IAAS,SAAS;IAAI;8BAClC,IAAC,oBAAM,QAAa;KACd;GAET,+BAGC,IAAC;IAAiB,eAAY;IAAO,IAAI;cACtC;KACgB;MAEf;GACF;AAEX"}

package/dist/search-Dg6xvCDB.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"search-Dg6xvCDB.js","names":["e: React.FormEvent<HTMLFormElement>"],"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 { BiIconCrossSmall, BiIconMagnefyingGlass } from '@bi-digital/icons-react';\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    /**\n     * Aria-label for the clear button.\n     * @defaultValue 'Clear'\n     */\n    clearAriaLabel?: string;\n  }\n>;\n\nexport const Search = ({\n  className,\n  onSubmit,\n  clearAriaLabel = 'Clear',\n  size = 'medium',\n  ref,\n  dark,\n  style,\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  return (\n    <Field className={clsx('bi-search', className)} data-dark={dark} style={style} asChild>\n      <form onSubmit={handleSubmit}>\n        <FieldAffixes>\n          <FieldAffix>\n            <BiIconMagnefyingGlass 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} dark={dark} variant='text' type='reset'>\n              <BiIconCrossSmall size={size} aria-hidden='true' />\n            </Button>\n          </FieldAffix>\n        </FieldAffixes>\n      </form>\n    </Field>\n  );\n};\n"],"mappings":";;;;;;;;;AAyBA,MAAa,SAAS,CAAC,EACrB,WACA,UACA,iBAAiB,SACjB,OAAO,UACP,KACA,MACA,MACA,GAAG,OACS,KAAK;CACjB,MAAM,eAAe,CAACA,MAAwC;AAC5D,IAAE,gBAAgB;AAClB,MAAI,UAAU;GACZ,MAAM,QAAQ,EAAE,cAAc,cAAc,QAAQ;AACpD,YAAS,OAAO,SAAS,GAAG;EAC7B;CACF;AACD,wBACE,IAAC;EAAM,WAAW,KAAK,aAAa,UAAU;EAAE,aAAW;EAAa;EAAO;4BAC7E,IAAC;GAAK,UAAU;6BACd,KAAC;oBACC,IAAC,wCACC,IAAC,yBAA4B,OAAQ,GAC1B;oBACb,IAAC;KAAM,MAAK;KAAY;KAAW;KAAM,GAAI;MAAS;oBACtD,IAAC;KAAW,eAAY;+BACtB,IAAC;MAAO,cAAY;MAAgB;MAAW;MAAY;MAAM,SAAQ;MAAO,MAAK;gCACnF,IAAC;OAAuB;OAAM,eAAY;QAAS;OAC5C;MACE;OACA;IACV;GACD;AAEX"}