@simplybusiness/mobius 10.4.2 → 10.4.4

package/dist/esm/chunk-26KZYRE6.js

@@ -0,0 +1,108 @@
+// src/components/Popover/useFloatingPosition.ts
+import { useCallback, useLayoutEffect } from "react";
+var ABSOLUTE_FLOATING_STYLES = {
+  position: "absolute",
+  top: 0,
+  left: 0,
+  width: "max-content"
+};
+var FIXED_FLOATING_STYLES = {
+  position: "fixed",
+  top: 0,
+  left: 0,
+  width: "max-content"
+};
+var INITIAL_ARROW_STYLES = {
+  position: "absolute"
+};
+var VIEWPORT_PADDING = 0;
+var createsFixedContainingBlock = (el) => {
+  const style = window.getComputedStyle(el);
+  return style.transform !== "none" || style.filter !== "none" || style.backdropFilter !== "none" || style.perspective !== "none" || /\b(transform|filter|perspective)\b/.test(style.willChange);
+};
+var useFloatingPosition = ({
+  referenceRef,
+  floatingRef,
+  arrowRef,
+  isOpen,
+  offsetPx,
+  arrowWidth,
+  useFixedStrategy
+}) => {
+  const update = useCallback(() => {
+    const reference = referenceRef.current;
+    const floating = floatingRef.current;
+    if (!reference || !floating) return;
+    const refRect = reference.getBoundingClientRect();
+    const floatingWidth = floating.offsetWidth;
+    const floatingHeight = floating.offsetHeight;
+    const scrollX = useFixedStrategy ? 0 : window.scrollX;
+    const scrollY = useFixedStrategy ? 0 : window.scrollY;
+    const parent = floating.parentElement;
+    const parentIsCb = useFixedStrategy && !!parent && createsFixedContainingBlock(parent);
+    const boundsRect = parentIsCb ? parent.getBoundingClientRect() : {
+      left: 0,
+      top: 0,
+      right: window.innerWidth,
+      bottom: window.innerHeight
+    };
+    const bottomTopViewport = refRect.bottom + offsetPx;
+    const topTopViewport = refRect.top - floatingHeight - offsetPx;
+    const overflowsBottom = bottomTopViewport + floatingHeight > boundsRect.bottom;
+    const fitsTop = topTopViewport >= boundsRect.top;
+    const nextPlacement = overflowsBottom && fitsTop ? "top" : "bottom";
+    const topViewport = nextPlacement === "bottom" ? bottomTopViewport : topTopViewport;
+    const rawLeftViewport = refRect.left + refRect.width / 2 - floatingWidth / 2;
+    const minLeftViewport = boundsRect.left + VIEWPORT_PADDING;
+    const maxLeftViewport = Math.max(
+      minLeftViewport,
+      boundsRect.right - floatingWidth - VIEWPORT_PADDING
+    );
+    const leftViewport = Math.min(
+      Math.max(minLeftViewport, rawLeftViewport),
+      maxLeftViewport
+    );
+    const cbOffsetLeft = parentIsCb ? boundsRect.left : 0;
+    const cbOffsetTop = parentIsCb ? boundsRect.top : 0;
+    floating.style.top = `${topViewport + scrollY - cbOffsetTop}px`;
+    floating.style.left = `${leftViewport + scrollX - cbOffsetLeft}px`;
+    const arrow = arrowRef.current;
+    if (!arrow) return;
+    const arrowHalf = arrowWidth / 2;
+    const refCenterX = refRect.left + refRect.width / 2;
+    const rawArrowLeft = refCenterX - leftViewport - arrowHalf;
+    const maxArrowLeft = Math.max(0, floatingWidth - arrowWidth);
+    const arrowLeft = Math.min(Math.max(0, rawArrowLeft), maxArrowLeft);
+    arrow.style.left = `${arrowLeft}px`;
+    if (nextPlacement === "bottom") {
+      arrow.style.bottom = "100%";
+      arrow.style.top = "";
+      arrow.style.transform = "rotate(180deg)";
+    } else {
+      arrow.style.top = "100%";
+      arrow.style.bottom = "";
+      arrow.style.transform = "";
+    }
+  }, [
+    referenceRef,
+    floatingRef,
+    arrowRef,
+    offsetPx,
+    arrowWidth,
+    useFixedStrategy
+  ]);
+  useLayoutEffect(() => {
+    if (!isOpen) return;
+    update();
+  }, [isOpen, update]);
+  return {
+    initialFloatingStyles: useFixedStrategy ? FIXED_FLOATING_STYLES : ABSOLUTE_FLOATING_STYLES,
+    initialArrowStyles: INITIAL_ARROW_STYLES,
+    update
+  };
+};
+
+export {
+  useFloatingPosition
+};
+//# sourceMappingURL=chunk-26KZYRE6.js.map

package/dist/esm/chunk-26KZYRE6.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/Popover/useFloatingPosition.ts"],
+  "sourcesContent": ["import type { CSSProperties, RefObject } from \"react\";\nimport { useCallback, useLayoutEffect } from \"react\";\n\ntype Placement = \"bottom\" | \"top\";\n\ninterface UseFloatingPositionArgs {\n  referenceRef: RefObject<HTMLElement | null>;\n  floatingRef: RefObject<HTMLDivElement | null>;\n  arrowRef: RefObject<SVGSVGElement | null>;\n  isOpen: boolean;\n  offsetPx: number;\n  arrowWidth: number;\n  useFixedStrategy: boolean;\n}\n\ninterface UseFloatingPositionResult {\n  initialFloatingStyles: CSSProperties;\n  initialArrowStyles: CSSProperties;\n  update: () => void;\n}\n\n// Two positioning strategies:\n// - `absolute` + document-relative coords (viewport rect + window.scrollY/X)\n//   when portalled to document.body. The initial containing block is the\n//   document, so absolute coords pin to the trigger and scroll natively.\n// - `fixed` + viewport coords when portalled inside a <dialog> (top-layer).\n//   The dialog's own box would otherwise become the containing block for an\n//   `absolute` child, throwing off coordinates and triggering `overflow: hidden`\n//   clipping. `fixed` keeps the containing block as the viewport.\nconst ABSOLUTE_FLOATING_STYLES: CSSProperties = {\n  position: \"absolute\",\n  top: 0,\n  left: 0,\n  width: \"max-content\",\n};\n\nconst FIXED_FLOATING_STYLES: CSSProperties = {\n  position: \"fixed\",\n  top: 0,\n  left: 0,\n  width: \"max-content\",\n};\n\nconst INITIAL_ARROW_STYLES: CSSProperties = {\n  position: \"absolute\",\n};\n\nconst VIEWPORT_PADDING = 0;\n\n// Properties that make an ancestor the containing block for a `position: fixed`\n// descendant, overriding the initial viewport containing block. When the portal\n// target (dialog) has any of these, `position: fixed` coords are interpreted\n// relative to the dialog's box, not the viewport \u2014 we compensate by subtracting\n// the dialog's viewport offset.\nconst createsFixedContainingBlock = (el: HTMLElement): boolean => {\n  const style = window.getComputedStyle(el);\n  return (\n    style.transform !== \"none\" ||\n    style.filter !== \"none\" ||\n    style.backdropFilter !== \"none\" ||\n    style.perspective !== \"none\" ||\n    /\\b(transform|filter|perspective)\\b/.test(style.willChange)\n  );\n};\n\nexport const useFloatingPosition = ({\n  referenceRef,\n  floatingRef,\n  arrowRef,\n  isOpen,\n  offsetPx,\n  arrowWidth,\n  useFixedStrategy,\n}: UseFloatingPositionArgs): UseFloatingPositionResult => {\n  // Writes styles directly to the DOM (bypassing React state) so scroll/resize\n  // handlers can update position in the same event-frame the browser uses to\n  // paint the scroll, eliminating the re-render lag that shows up as a\n  // trigger-vs-popover parallax on fast scroll.\n  const update = useCallback(() => {\n    const reference = referenceRef.current;\n    const floating = floatingRef.current;\n    if (!reference || !floating) return;\n\n    const refRect = reference.getBoundingClientRect();\n    const floatingWidth = floating.offsetWidth;\n    const floatingHeight = floating.offsetHeight;\n    const scrollX = useFixedStrategy ? 0 : window.scrollX;\n    const scrollY = useFixedStrategy ? 0 : window.scrollY;\n\n    // Clamp to the portal target's bounds when the dialog is a containing\n    // block (its own `overflow: hidden` would clip the popover). Otherwise\n    // clamp to the viewport.\n    const parent = floating.parentElement;\n    const parentIsCb =\n      useFixedStrategy && !!parent && createsFixedContainingBlock(parent);\n    const boundsRect = parentIsCb\n      ? parent.getBoundingClientRect()\n      : {\n          left: 0,\n          top: 0,\n          right: window.innerWidth,\n          bottom: window.innerHeight,\n        };\n\n    const bottomTopViewport = refRect.bottom + offsetPx;\n    const topTopViewport = refRect.top - floatingHeight - offsetPx;\n    const overflowsBottom =\n      bottomTopViewport + floatingHeight > boundsRect.bottom;\n    const fitsTop = topTopViewport >= boundsRect.top;\n    const nextPlacement: Placement =\n      overflowsBottom && fitsTop ? \"top\" : \"bottom\";\n\n    const topViewport =\n      nextPlacement === \"bottom\" ? bottomTopViewport : topTopViewport;\n\n    const rawLeftViewport =\n      refRect.left + refRect.width / 2 - floatingWidth / 2;\n    const minLeftViewport = boundsRect.left + VIEWPORT_PADDING;\n    const maxLeftViewport = Math.max(\n      minLeftViewport,\n      boundsRect.right - floatingWidth - VIEWPORT_PADDING,\n    );\n    const leftViewport = Math.min(\n      Math.max(minLeftViewport, rawLeftViewport),\n      maxLeftViewport,\n    );\n\n    // Subtract containing-block offset when the dialog is the CB, so\n    // `position: fixed` coords land at the intended viewport position.\n    const cbOffsetLeft = parentIsCb ? boundsRect.left : 0;\n    const cbOffsetTop = parentIsCb ? boundsRect.top : 0;\n\n    floating.style.top = `${topViewport + scrollY - cbOffsetTop}px`;\n    floating.style.left = `${leftViewport + scrollX - cbOffsetLeft}px`;\n\n    const arrow = arrowRef.current;\n    if (!arrow) return;\n\n    // Arrow coords are relative to the floating element, so scroll cancels out.\n    const arrowHalf = arrowWidth / 2;\n    const refCenterX = refRect.left + refRect.width / 2;\n    const rawArrowLeft = refCenterX - leftViewport - arrowHalf;\n    const maxArrowLeft = Math.max(0, floatingWidth - arrowWidth);\n    const arrowLeft = Math.min(Math.max(0, rawArrowLeft), maxArrowLeft);\n\n    arrow.style.left = `${arrowLeft}px`;\n    if (nextPlacement === \"bottom\") {\n      arrow.style.bottom = \"100%\";\n      arrow.style.top = \"\";\n      arrow.style.transform = \"rotate(180deg)\";\n    } else {\n      arrow.style.top = \"100%\";\n      arrow.style.bottom = \"\";\n      arrow.style.transform = \"\";\n    }\n  }, [\n    referenceRef,\n    floatingRef,\n    arrowRef,\n    offsetPx,\n    arrowWidth,\n    useFixedStrategy,\n  ]);\n\n  useLayoutEffect(() => {\n    if (!isOpen) return;\n    update();\n  }, [isOpen, update]);\n\n  return {\n    initialFloatingStyles: useFixedStrategy\n      ? FIXED_FLOATING_STYLES\n      : ABSOLUTE_FLOATING_STYLES,\n    initialArrowStyles: INITIAL_ARROW_STYLES,\n    update,\n  };\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/{chunk-XNEQHHNV.js → chunk-5QMKPWB4.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk-CI5GCPUG.js";
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-6RDK3FM2.js";
 import {
   mergeRefs
 } from "./chunk-QGGILW3D.js";
@@ -97,4 +97,4 @@ export {
   MIN_MAX_ERROR,
   DateField
 };
-//# sourceMappingURL=chunk-XNEQHHNV.js.map
+//# sourceMappingURL=chunk-5QMKPWB4.js.map

package/dist/esm/{chunk-IQKS662C.js → chunk-6RDK3FM2.js}

@@ -1,6 +1,6 @@
 import {
   adornmentWithClassName
-} from "./chunk-IM3I5CZL.js";
+} from "./chunk-I6CFRGID.js";
 import {
   ErrorMessage
 } from "./chunk-MZJT3USG.js";
@@ -19,9 +19,10 @@ import {
 
 // src/components/TextField/TextField.tsx
 import classNames from "classnames/dedupe";
+import { memo } from "react";
 import "@simplybusiness/mobius/src/components/TextField/TextField.css";
 import { jsx, jsxs } from "react/jsx-runtime";
-var TextField = ({ ref, ...props }) => {
+var TextFieldInner = ({ ref, ...props }) => {
   const {
     isDisabled,
     type = "text",
@@ -115,9 +116,10 @@ var TextField = ({ ref, ...props }) => {
     /* @__PURE__ */ jsx(ErrorMessage, { ...errorMessageProps, errorMessage })
   ] });
 };
+var TextField = memo(TextFieldInner);
 TextField.displayName = "TextField";
 
 export {
   TextField
 };
-//# sourceMappingURL=chunk-IQKS662C.js.map
+//# sourceMappingURL=chunk-6RDK3FM2.js.map

package/dist/esm/chunk-6RDK3FM2.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/TextField/TextField.tsx"],
+  "sourcesContent": ["\"use client\";\n\nimport classNames from \"classnames/dedupe\";\nimport { memo } from \"react\";\nimport type {\n  HTMLInputTypeAttribute,\n  ReactElement,\n  ReactNode,\n  Ref,\n  RefAttributes,\n} from \"react\";\nimport type { UseTextFieldProps } from \"../../hooks\";\nimport { useTextField, useValidationClasses } from \"../../hooks\";\nimport type { DOMProps, FocusEvents } from \"../../types\";\nimport { ErrorMessage } from \"../ErrorMessage\";\nimport { Label } from \"../Label\";\nimport { Stack } from \"../Stack\";\nimport { adornmentWithClassName } from \"./adornmentWithClassName\";\nimport \"./TextField.css\";\n\nexport type TextFieldElementType = HTMLInputElement;\nexport interface TextFieldProps\n  extends\n    DOMProps,\n    FocusEvents,\n    UseTextFieldProps,\n    RefAttributes<TextFieldElementType> {\n  className?: string;\n  errorMessage?: string;\n  children?: ReactNode;\n  label?: string;\n  type?: Exclude<\n    HTMLInputTypeAttribute,\n    | \"button\"\n    | \"checkbox\"\n    | \"color\"\n    | \"date\"\n    | \"datetime-local\"\n    | \"file\"\n    | \"image\"\n    | \"month\"\n    | \"radio\"\n    | \"range\"\n    | \"reset\"\n    | \"submit\"\n    | \"week\"\n  >;\n  prefixInside?: ReactElement;\n  prefixOutside?: ReactElement;\n  suffixInside?: ReactElement;\n  suffixOutside?: ReactElement;\n}\n\nexport type TextFieldRef = Ref<TextFieldElementType>;\n\nconst TextFieldInner = ({ ref, ...props }: TextFieldProps) => {\n  const {\n    isDisabled,\n    type = \"text\",\n    isInvalid,\n    className,\n    label,\n    errorMessage,\n    children,\n    isRequired,\n    prefixInside,\n    prefixOutside,\n    suffixInside,\n    suffixOutside,\n    autoComplete,\n    isReadOnly,\n    ...otherProps\n  } = props;\n\n  const resolvedAutoComplete =\n    autoComplete ??\n    (type === \"email\" ? \"email\" : type === \"tel\" ? \"tel\" : undefined);\n\n  const { inputProps, labelProps, errorMessageProps } = useTextField({\n    ...props,\n    autoComplete: resolvedAutoComplete,\n    \"aria-errormessage\": errorMessage,\n  });\n\n  const hidden = type === \"hidden\";\n\n  const validationClasses = useValidationClasses({ isInvalid });\n\n  const textfieldClasses = {\n    \"--is-disabled\": isDisabled,\n    \"--is-required\": typeof isRequired === \"boolean\" && isRequired,\n    \"--is-optional\": typeof isRequired === \"boolean\" && !isRequired,\n    \"--is-hidden\": hidden,\n    [className || \"\"]: true,\n  };\n\n  const sharedClasses = classNames(validationClasses, textfieldClasses);\n\n  const labelClasses = classNames(\n    {\n      \"--is-disabled\": isDisabled,\n    },\n    validationClasses,\n  );\n\n  const containerClasses = classNames(\n    \"mobius\",\n    \"mobius-text-field\",\n    sharedClasses,\n  );\n\n  const inputClasses = classNames(\n    \"mobius\",\n    \"mobius-text-field__input\",\n    sharedClasses,\n  );\n\n  const inputWrapperClasses = classNames(\n    \"mobius-text-field__input-wrapper\",\n    sharedClasses,\n  );\n\n  return (\n    <Stack gap=\"xs\" className={containerClasses}>\n      {label && !hidden && (\n        <Label {...labelProps} className={labelClasses}>\n          {label}\n        </Label>\n      )}\n      <div className=\"mobius-text-field__inner-container\">\n        {adornmentWithClassName(\n          prefixOutside,\n          labelClasses,\n          \"mobius-text-field__prefix-outside\",\n        )}\n        <div className={inputWrapperClasses}>\n          {adornmentWithClassName(\n            prefixInside,\n            labelClasses,\n            \"mobius-text-field__prefix-inside\",\n          )}\n          <input\n            {...otherProps}\n            {...inputProps}\n            ref={ref}\n            type={type}\n            className={inputClasses}\n          />\n          {adornmentWithClassName(\n            suffixInside,\n            labelClasses,\n            \"mobius-text-field__suffix-inside\",\n          )}\n        </div>\n        {adornmentWithClassName(\n          suffixOutside,\n          labelClasses,\n          \"mobius-text-field__suffix-outside\",\n        )}\n      </div>\n      {children && (\n        <div className=\"mobius-text-field__children\">{children}</div>\n      )}\n\n      <ErrorMessage {...errorMessageProps} errorMessage={errorMessage} />\n    </Stack>\n  );\n};\n\nconst TextField = memo(TextFieldInner);\nTextField.displayName = \"TextField\";\nexport { TextField };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;AAEA,OAAO,gBAAgB;AACvB,SAAS,YAAY;AAerB,OAAO;AA2GC,cAUA,YAVA;AAtER,IAAM,iBAAiB,CAAC,EAAE,KAAK,GAAG,MAAM,MAAsB;AAC5D,QAAM;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,QAAM,uBACJ,iBACC,SAAS,UAAU,UAAU,SAAS,QAAQ,QAAQ;AAEzD,QAAM,EAAE,YAAY,YAAY,kBAAkB,IAAI,aAAa;AAAA,IACjE,GAAG;AAAA,IACH,cAAc;AAAA,IACd,qBAAqB;AAAA,EACvB,CAAC;AAED,QAAM,SAAS,SAAS;AAExB,QAAM,oBAAoB,qBAAqB,EAAE,UAAU,CAAC;AAE5D,QAAM,mBAAmB;AAAA,IACvB,iBAAiB;AAAA,IACjB,iBAAiB,OAAO,eAAe,aAAa;AAAA,IACpD,iBAAiB,OAAO,eAAe,aAAa,CAAC;AAAA,IACrD,eAAe;AAAA,IACf,CAAC,aAAa,EAAE,GAAG;AAAA,EACrB;AAEA,QAAM,gBAAgB,WAAW,mBAAmB,gBAAgB;AAEpE,QAAM,eAAe;AAAA,IACnB;AAAA,MACE,iBAAiB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AAEA,QAAM,mBAAmB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,QAAM,sBAAsB;AAAA,IAC1B;AAAA,IACA;AAAA,EACF;AAEA,SACE,qBAAC,SAAM,KAAI,MAAK,WAAW,kBACxB;AAAA,aAAS,CAAC,UACT,oBAAC,SAAO,GAAG,YAAY,WAAW,cAC/B,iBACH;AAAA,IAEF,qBAAC,SAAI,WAAU,sCACZ;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,MACA,qBAAC,SAAI,WAAW,qBACb;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACE,GAAG;AAAA,YACH,GAAG;AAAA,YACJ;AAAA,YACA;AAAA,YACA,WAAW;AAAA;AAAA,QACb;AAAA,QACC;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,QACF;AAAA,SACF;AAAA,MACC;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,OACF;AAAA,IACC,YACC,oBAAC,SAAI,WAAU,+BAA+B,UAAS;AAAA,IAGzD,oBAAC,gBAAc,GAAG,mBAAmB,cAA4B;AAAA,KACnE;AAEJ;AAEA,IAAM,YAAY,KAAK,cAAc;AACrC,UAAU,cAAc;",
+  "names": []
+}

package/dist/esm/{chunk-4HI2AOBC.js → chunk-6TSYA7CJ.js}

@@ -22,12 +22,9 @@ var Item = ({ ref, ...props }) => {
         child.props.className,
         classes
       );
-      return cloneElement(
-        child,
-        {
-          className: childClasses
-        }
-      );
+      return cloneElement(child, {
+        className: childClasses
+      });
     }
     return /* @__PURE__ */ jsx("span", { className: classes, children: child });
   }) });
@@ -37,4 +34,4 @@ Item.displayName = "DropdownMenu.Item";
 export {
   Item
 };
-//# sourceMappingURL=chunk-4HI2AOBC.js.map
+//# sourceMappingURL=chunk-6TSYA7CJ.js.map

package/dist/esm/{chunk-4HI2AOBC.js.map → chunk-6TSYA7CJ.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/DropdownMenu/Item.tsx"],
-  "sourcesContent": ["import type { Ref, RefAttributes, ReactNode, ReactElement } from \"react\";\nimport { cloneElement, isValidElement, Children } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport type { DOMProps } from \"../../types/dom\";\n\nexport type ItemElementType = HTMLLIElement;\n\nexport interface ItemProps extends DOMProps, RefAttributes<ItemElementType> {\n  elementType?: React.ElementType;\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  active?: boolean;\n  children?: ReactNode;\n  onClick?: () => void;\n}\n\nexport type ItemRef = Ref<ItemElementType>;\n\nconst Item = ({ ref, ...props }: ItemProps) => {\n  const {\n    elementType: Element = \"li\",\n    active,\n    onClick,\n    children,\n    ...otherProps\n  } = props;\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-dropdown-menu__item\",\n    { \"--is-active\": active },\n    otherProps.className,\n  );\n\n  return (\n    <Element ref={ref} onClick={onClick} {...otherProps}>\n      {Children.map(children, child => {\n        if (isValidElement(child)) {\n          const childClasses = classNames(\n            (child.props as { className?: string }).className,\n            classes,\n          );\n          return cloneElement(\n            child as ReactElement,\n            {\n              className: childClasses,\n            } as { className: string },\n          );\n        }\n\n        return <span className={classes}>{child}</span>;\n      })}\n    </Element>\n  );\n};\n\nItem.displayName = \"DropdownMenu.Item\";\nexport { Item };\n"],
-  "mappings": ";AACA,SAAS,cAAc,gBAAgB,gBAAgB;AACvD,OAAO,gBAAgB;AA+CR;AA/Bf,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AAC7C,QAAM;AAAA,IACJ,aAAa,UAAU;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,EAAE,eAAe,OAAO;AAAA,IACxB,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,WAAQ,KAAU,SAAmB,GAAG,YACtC,mBAAS,IAAI,UAAU,WAAS;AAC/B,QAAI,eAAe,KAAK,GAAG;AACzB,YAAM,eAAe;AAAA,QAClB,MAAM,MAAiC;AAAA,QACxC;AAAA,MACF;AACA,aAAO;AAAA,QACL;AAAA,QACA;AAAA,UACE,WAAW;AAAA,QACb;AAAA,MACF;AAAA,IACF;AAEA,WAAO,oBAAC,UAAK,WAAW,SAAU,iBAAM;AAAA,EAC1C,CAAC,GACH;AAEJ;AAEA,KAAK,cAAc;",
+  "sourcesContent": ["import type { Ref, RefAttributes, ReactNode, ReactElement } from \"react\";\nimport { cloneElement, isValidElement, Children } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport type { DOMProps } from \"../../types/dom\";\n\nexport type ItemElementType = HTMLLIElement;\n\nexport interface ItemProps extends DOMProps, RefAttributes<ItemElementType> {\n  elementType?: React.ElementType;\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  active?: boolean;\n  children?: ReactNode;\n  onClick?: () => void;\n}\n\nexport type ItemRef = Ref<ItemElementType>;\n\nconst Item = ({ ref, ...props }: ItemProps) => {\n  const {\n    elementType: Element = \"li\",\n    active,\n    onClick,\n    children,\n    ...otherProps\n  } = props;\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-dropdown-menu__item\",\n    { \"--is-active\": active },\n    otherProps.className,\n  );\n\n  return (\n    <Element ref={ref} onClick={onClick} {...otherProps}>\n      {Children.map(children, child => {\n        if (isValidElement(child)) {\n          const childClasses = classNames(\n            (child.props as { className?: string }).className,\n            classes,\n          );\n          return cloneElement(child as ReactElement<{ className?: string }>, {\n            className: childClasses,\n          });\n        }\n\n        return <span className={classes}>{child}</span>;\n      })}\n    </Element>\n  );\n};\n\nItem.displayName = \"DropdownMenu.Item\";\nexport { Item };\n"],
+  "mappings": ";AACA,SAAS,cAAc,gBAAgB,gBAAgB;AACvD,OAAO,gBAAgB;AA4CR;AA5Bf,IAAM,OAAO,CAAC,EAAE,KAAK,GAAG,MAAM,MAAiB;AAC7C,QAAM;AAAA,IACJ,aAAa,UAAU;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,EAAE,eAAe,OAAO;AAAA,IACxB,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,WAAQ,KAAU,SAAmB,GAAG,YACtC,mBAAS,IAAI,UAAU,WAAS;AAC/B,QAAI,eAAe,KAAK,GAAG;AACzB,YAAM,eAAe;AAAA,QAClB,MAAM,MAAiC;AAAA,QACxC;AAAA,MACF;AACA,aAAO,aAAa,OAA+C;AAAA,QACjE,WAAW;AAAA,MACb,CAAC;AAAA,IACH;AAEA,WAAO,oBAAC,UAAK,WAAW,SAAU,iBAAM;AAAA,EAC1C,CAAC,GACH;AAEJ;AAEA,KAAK,cAAc;",
   "names": []
 }

package/dist/esm/chunk-CAL44W47.js

@@ -0,0 +1,23 @@
+// src/components/Popover/Arrow.tsx
+import { jsx } from "react/jsx-runtime";
+var Arrow = ({ ref, width = 20, className, style }) => {
+  const height = width / 2;
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      ref,
+      className,
+      "aria-hidden": "true",
+      width,
+      height,
+      viewBox: `0 0 ${width} ${height}`,
+      style,
+      children: /* @__PURE__ */ jsx("path", { d: `M0,0 H${width} L${width / 2},${height} Z` })
+    }
+  );
+};
+
+export {
+  Arrow
+};
+//# sourceMappingURL=chunk-CAL44W47.js.map

package/dist/esm/chunk-CAL44W47.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/Popover/Arrow.tsx"],
+  "sourcesContent": ["import type { CSSProperties, Ref } from \"react\";\n\ninterface ArrowProps {\n  ref?: Ref<SVGSVGElement>;\n  width?: number;\n  className?: string;\n  style?: CSSProperties;\n}\n\nexport const Arrow = ({ ref, width = 20, className, style }: ArrowProps) => {\n  const height = width / 2;\n  return (\n    <svg\n      ref={ref}\n      className={className}\n      aria-hidden=\"true\"\n      width={width}\n      height={height}\n      viewBox={`0 0 ${width} ${height}`}\n      style={style}\n    >\n      <path d={`M0,0 H${width} L${width / 2},${height} Z`} />\n    </svg>\n  );\n};\n"],
+  "mappings": ";AAqBM;AAZC,IAAM,QAAQ,CAAC,EAAE,KAAK,QAAQ,IAAI,WAAW,MAAM,MAAkB;AAC1E,QAAM,SAAS,QAAQ;AACvB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,eAAY;AAAA,MACZ;AAAA,MACA;AAAA,MACA,SAAS,OAAO,KAAK,IAAI,MAAM;AAAA,MAC/B;AAAA,MAEA,8BAAC,UAAK,GAAG,SAAS,KAAK,KAAK,QAAQ,CAAC,IAAI,MAAM,MAAM;AAAA;AAAA,EACvD;AAEJ;",
+  "names": []
+}

package/dist/esm/{chunk-PEEQNAIN.js → chunk-DMYDWKKA.js}

@@ -1,12 +1,12 @@
+import {
+  Content
+} from "./chunk-55NPJOV3.js";
 import {
   Header
 } from "./chunk-MPB5F6QL.js";
 import {
   Modal
 } from "./chunk-JJUTS5ET.js";
-import {
-  Content
-} from "./chunk-55NPJOV3.js";
 
 // src/components/Modal/index.tsx
 var Modal2 = Object.assign(Modal, {
@@ -18,4 +18,4 @@ Modal2.displayName = "Modal";
 export {
   Modal2 as Modal
 };
-//# sourceMappingURL=chunk-PEEQNAIN.js.map
+//# sourceMappingURL=chunk-DMYDWKKA.js.map

package/dist/esm/{chunk-IM3I5CZL.js → chunk-I6CFRGID.js}

@@ -3,9 +3,10 @@ import classNames from "classnames/dedupe";
 import { cloneElement } from "react";
 var adornmentWithClassName = (component, validationClasses, className) => {
   if (!component) return null;
-  return cloneElement(component, {
+  const typedComponent = component;
+  return cloneElement(typedComponent, {
     className: classNames(
-      component.props.className,
+      typedComponent.props.className,
       validationClasses,
       className
     )
@@ -15,4 +16,4 @@ var adornmentWithClassName = (component, validationClasses, className) => {
 export {
   adornmentWithClassName
 };
-//# sourceMappingURL=chunk-IM3I5CZL.js.map
+//# sourceMappingURL=chunk-I6CFRGID.js.map

package/dist/esm/{chunk-IM3I5CZL.js.map → chunk-I6CFRGID.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/TextField/adornmentWithClassName.ts"],
-  "sourcesContent": ["import classNames from \"classnames/dedupe\";\nimport type { ReactElement } from \"react\";\nimport { cloneElement } from \"react\";\n\nexport const adornmentWithClassName = (\n  component?: ReactElement,\n  validationClasses?: string,\n  className?: string,\n) => {\n  if (!component) return null;\n\n  return cloneElement(component, {\n    className: classNames(\n      (component.props as { className?: string }).className,\n      validationClasses,\n      className,\n    ),\n  } as { className: string });\n};\n"],
-  "mappings": ";AAAA,OAAO,gBAAgB;AAEvB,SAAS,oBAAoB;AAEtB,IAAM,yBAAyB,CACpC,WACA,mBACA,cACG;AACH,MAAI,CAAC,UAAW,QAAO;AAEvB,SAAO,aAAa,WAAW;AAAA,IAC7B,WAAW;AAAA,MACR,UAAU,MAAiC;AAAA,MAC5C;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAA0B;AAC5B;",
+  "sourcesContent": ["import classNames from \"classnames/dedupe\";\nimport type { ReactElement } from \"react\";\nimport { cloneElement } from \"react\";\n\nexport const adornmentWithClassName = (\n  component?: ReactElement,\n  validationClasses?: string,\n  className?: string,\n) => {\n  if (!component) return null;\n\n  const typedComponent = component as ReactElement<{ className?: string }>;\n  return cloneElement(typedComponent, {\n    className: classNames(\n      typedComponent.props.className,\n      validationClasses,\n      className,\n    ),\n  });\n};\n"],
+  "mappings": ";AAAA,OAAO,gBAAgB;AAEvB,SAAS,oBAAoB;AAEtB,IAAM,yBAAyB,CACpC,WACA,mBACA,cACG;AACH,MAAI,CAAC,UAAW,QAAO;AAEvB,QAAM,iBAAiB;AACvB,SAAO,aAAa,gBAAgB;AAAA,IAClC,WAAW;AAAA,MACT,eAAe,MAAM;AAAA,MACrB;AAAA,MACA;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
   "names": []
 }

package/dist/esm/chunk-K3ECDAUR.js

@@ -0,0 +1,33 @@
+// src/components/Popover/useAutoUpdate.ts
+import { useEffect } from "react";
+var useAutoUpdate = ({
+  referenceRef,
+  floatingRef,
+  onUpdate,
+  enabled
+}) => {
+  useEffect(() => {
+    if (!enabled) return;
+    const reference = referenceRef.current;
+    const floating = floatingRef.current;
+    const scrollOpts = {
+      capture: true,
+      passive: true
+    };
+    window.addEventListener("scroll", onUpdate, scrollOpts);
+    window.addEventListener("resize", onUpdate, { passive: true });
+    const observer = typeof ResizeObserver === "function" ? new ResizeObserver(onUpdate) : null;
+    if (observer && reference) observer.observe(reference);
+    if (observer && floating) observer.observe(floating);
+    return () => {
+      window.removeEventListener("scroll", onUpdate, scrollOpts);
+      window.removeEventListener("resize", onUpdate);
+      observer?.disconnect();
+    };
+  }, [enabled, onUpdate, referenceRef, floatingRef]);
+};
+
+export {
+  useAutoUpdate
+};
+//# sourceMappingURL=chunk-K3ECDAUR.js.map

package/dist/esm/chunk-K3ECDAUR.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/components/Popover/useAutoUpdate.ts"],
+  "sourcesContent": ["import type { RefObject } from \"react\";\nimport { useEffect } from \"react\";\n\ninterface UseAutoUpdateArgs {\n  referenceRef: RefObject<HTMLElement | null>;\n  floatingRef: RefObject<HTMLDivElement | null>;\n  onUpdate: () => void;\n  enabled: boolean;\n}\n\nexport const useAutoUpdate = ({\n  referenceRef,\n  floatingRef,\n  onUpdate,\n  enabled,\n}: UseAutoUpdateArgs): void => {\n  useEffect(() => {\n    if (!enabled) return;\n\n    const reference = referenceRef.current;\n    const floating = floatingRef.current;\n\n    const scrollOpts: AddEventListenerOptions = {\n      capture: true,\n      passive: true,\n    };\n    window.addEventListener(\"scroll\", onUpdate, scrollOpts);\n    window.addEventListener(\"resize\", onUpdate, { passive: true });\n\n    const observer =\n      typeof ResizeObserver === \"function\"\n        ? new ResizeObserver(onUpdate)\n        : null;\n    if (observer && reference) observer.observe(reference);\n    if (observer && floating) observer.observe(floating);\n\n    return () => {\n      window.removeEventListener(\"scroll\", onUpdate, scrollOpts);\n      window.removeEventListener(\"resize\", onUpdate);\n      observer?.disconnect();\n    };\n  }, [enabled, onUpdate, referenceRef, floatingRef]);\n};\n"],
+  "mappings": ";AACA,SAAS,iBAAiB;AASnB,IAAM,gBAAgB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA+B;AAC7B,YAAU,MAAM;AACd,QAAI,CAAC,QAAS;AAEd,UAAM,YAAY,aAAa;AAC/B,UAAM,WAAW,YAAY;AAE7B,UAAM,aAAsC;AAAA,MAC1C,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AACA,WAAO,iBAAiB,UAAU,UAAU,UAAU;AACtD,WAAO,iBAAiB,UAAU,UAAU,EAAE,SAAS,KAAK,CAAC;AAE7D,UAAM,WACJ,OAAO,mBAAmB,aACtB,IAAI,eAAe,QAAQ,IAC3B;AACN,QAAI,YAAY,UAAW,UAAS,QAAQ,SAAS;AACrD,QAAI,YAAY,SAAU,UAAS,QAAQ,QAAQ;AAEnD,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,UAAU,UAAU;AACzD,aAAO,oBAAoB,UAAU,QAAQ;AAC7C,gBAAU,WAAW;AAAA,IACvB;AAAA,EACF,GAAG,CAAC,SAAS,UAAU,cAAc,WAAW,CAAC;AACnD;",
+  "names": []
+}

package/dist/esm/{chunk-GJBH37DH.js → chunk-KFHPI67N.js}

@@ -1,12 +1,12 @@
+import {
+  Header
+} from "./chunk-UZV5PZ7R.js";
 import {
   Content
 } from "./chunk-WHRUNWJI.js";
 import {
   Drawer
 } from "./chunk-VYQRTISC.js";
-import {
-  Header
-} from "./chunk-UZV5PZ7R.js";
 
 // src/components/Drawer/index.tsx
 var Drawer2 = Object.assign(Drawer, {
@@ -18,4 +18,4 @@ Drawer2.displayName = "Drawer";
 export {
   Drawer2 as Drawer
 };
-//# sourceMappingURL=chunk-GJBH37DH.js.map
+//# sourceMappingURL=chunk-KFHPI67N.js.map

package/dist/esm/{chunk-OEDU5ZEA.js → chunk-KUH5AB5T.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-YGME6T3L.js";
 import {
   Item
-} from "./chunk-4HI2AOBC.js";
+} from "./chunk-6TSYA7CJ.js";
 
 // src/components/DropdownMenu/index.tsx
 var DropdownMenu2 = Object.assign(
@@ -17,4 +17,4 @@ DropdownMenu2.displayName = "DropdownMenu";
 export {
   DropdownMenu2 as DropdownMenu
 };
-//# sourceMappingURL=chunk-OEDU5ZEA.js.map
+//# sourceMappingURL=chunk-KUH5AB5T.js.map

package/dist/esm/{chunk-JFDDW3IV.js → chunk-P7TPNRU4.js}

@@ -14,13 +14,9 @@ var Breadcrumbs = ({ ref, ...props }) => {
     otherProps.className
   );
   return /* @__PURE__ */ jsx("nav", { ref, ...otherProps, ...navProps, className: classes, children: /* @__PURE__ */ jsx("ul", { children: childArray.map(
-    (child, i) => cloneElement(
-      child,
-      {
-        key: i,
-        isCurrent: i === childArray.length - 1
-      }
-    )
+    (child, i) => cloneElement(child, {
+      isCurrent: i === childArray.length - 1
+    })
   ) }) });
 };
 Breadcrumbs.displayName = "Breadcrumbs";
@@ -28,4 +24,4 @@ Breadcrumbs.displayName = "Breadcrumbs";
 export {
   Breadcrumbs
 };
-//# sourceMappingURL=chunk-JFDDW3IV.js.map
+//# sourceMappingURL=chunk-P7TPNRU4.js.map

package/dist/esm/{chunk-JFDDW3IV.js.map → chunk-P7TPNRU4.js.map}

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/components/Breadcrumbs/Breadcrumbs.tsx"],
-  "sourcesContent": ["\"use client\";\n\nimport type { ReactElement, RefAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./Breadcrumbs.css\";\n\nexport type BreadcrumbsElementType = HTMLElement;\n\nexport interface BreadcrumbsProps extends RefAttributes<BreadcrumbsElementType> {\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  children?: ReactNode;\n  \"aria-label\"?: string;\n}\n\nconst Breadcrumbs = ({ ref, ...props }: BreadcrumbsProps) => {\n  const { \"aria-label\": ariaLabel = \"Breadcrumbs\" } = props;\n  const { navProps } = { navProps: { \"aria-label\": ariaLabel } };\n  const { children, ...otherProps } = props;\n  const childArray = Children.toArray(children);\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb\",\n    otherProps.className,\n  );\n\n  return (\n    <nav ref={ref} {...otherProps} {...navProps} className={classes}>\n      <ul>\n        {childArray.map((child, i) =>\n          cloneElement(\n            child as ReactElement,\n            {\n              key: i,\n              isCurrent: i === childArray.length - 1,\n            } as { key: number; isCurrent: boolean },\n          ),\n        )}\n      </ul>\n    </nav>\n  );\n};\n\nBreadcrumbs.displayName = \"Breadcrumbs\";\nexport { Breadcrumbs };\n"],
-  "mappings": ";AAGA,SAAS,UAAU,oBAAoB;AACvC,OAAO,gBAAgB;AACvB,OAAO;AA0BD;AAfN,IAAM,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,MAAwB;AAC3D,QAAM,EAAE,cAAc,YAAY,cAAc,IAAI;AACpD,QAAM,EAAE,SAAS,IAAI,EAAE,UAAU,EAAE,cAAc,UAAU,EAAE;AAC7D,QAAM,EAAE,UAAU,GAAG,WAAW,IAAI;AACpC,QAAM,aAAa,SAAS,QAAQ,QAAQ;AAG5C,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,SAAI,KAAW,GAAG,YAAa,GAAG,UAAU,WAAW,SACtD,8BAAC,QACE,qBAAW;AAAA,IAAI,CAAC,OAAO,MACtB;AAAA,MACE;AAAA,MACA;AAAA,QACE,KAAK;AAAA,QACL,WAAW,MAAM,WAAW,SAAS;AAAA,MACvC;AAAA,IACF;AAAA,EACF,GACF,GACF;AAEJ;AAEA,YAAY,cAAc;",
+  "sourcesContent": ["\"use client\";\n\nimport type { ReactElement, RefAttributes, ReactNode } from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport classNames from \"classnames/dedupe\";\nimport \"./Breadcrumbs.css\";\n\nexport type BreadcrumbsElementType = HTMLElement;\n\nexport interface BreadcrumbsProps extends RefAttributes<BreadcrumbsElementType> {\n  /** Custom class name for setting specific CSS */\n  className?: string;\n  children?: ReactNode;\n  \"aria-label\"?: string;\n}\n\nconst Breadcrumbs = ({ ref, ...props }: BreadcrumbsProps) => {\n  const { \"aria-label\": ariaLabel = \"Breadcrumbs\" } = props;\n  const { navProps } = { navProps: { \"aria-label\": ariaLabel } };\n  const { children, ...otherProps } = props;\n  const childArray = Children.toArray(children);\n\n  // Reshape class name and apply to outer element\n  const classes = classNames(\n    \"mobius\",\n    \"mobius-breadcrumb\",\n    otherProps.className,\n  );\n\n  return (\n    <nav ref={ref} {...otherProps} {...navProps} className={classes}>\n      <ul>\n        {childArray.map((child, i) =>\n          cloneElement(child as ReactElement<{ isCurrent?: boolean }>, {\n            isCurrent: i === childArray.length - 1,\n          }),\n        )}\n      </ul>\n    </nav>\n  );\n};\n\nBreadcrumbs.displayName = \"Breadcrumbs\";\nexport { Breadcrumbs };\n"],
+  "mappings": ";AAGA,SAAS,UAAU,oBAAoB;AACvC,OAAO,gBAAgB;AACvB,OAAO;AA0BD;AAfN,IAAM,cAAc,CAAC,EAAE,KAAK,GAAG,MAAM,MAAwB;AAC3D,QAAM,EAAE,cAAc,YAAY,cAAc,IAAI;AACpD,QAAM,EAAE,SAAS,IAAI,EAAE,UAAU,EAAE,cAAc,UAAU,EAAE;AAC7D,QAAM,EAAE,UAAU,GAAG,WAAW,IAAI;AACpC,QAAM,aAAa,SAAS,QAAQ,QAAQ;AAG5C,QAAM,UAAU;AAAA,IACd;AAAA,IACA;AAAA,IACA,WAAW;AAAA,EACb;AAEA,SACE,oBAAC,SAAI,KAAW,GAAG,YAAa,GAAG,UAAU,WAAW,SACtD,8BAAC,QACE,qBAAW;AAAA,IAAI,CAAC,OAAO,MACtB,aAAa,OAAgD;AAAA,MAC3D,WAAW,MAAM,WAAW,SAAS;AAAA,IACvC,CAAC;AAAA,EACH,GACF,GACF;AAEJ;AAEA,YAAY,cAAc;",
   "names": []
 }

package/dist/esm/{chunk-F5ELD54X.js → chunk-QNOBB5HT.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-66ARYOY7.js";
 import {
   Combobox
-} from "./chunk-OAG5T7NC.js";
+} from "./chunk-XEP6X7JU.js";
 import {
   Icon
 } from "./chunk-TKIP5Q5H.js";
@@ -93,4 +93,4 @@ AddressLookup.displayName = "AddressLookup";
 export {
   AddressLookup
 };
-//# sourceMappingURL=chunk-F5ELD54X.js.map
+//# sourceMappingURL=chunk-QNOBB5HT.js.map

package/dist/esm/{chunk-GV36OVX7.js → chunk-R67C5QTH.js}

@@ -1,6 +1,6 @@
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-6RDK3FM2.js";
 
 // src/components/MaskedField/index.tsx
 import loadable from "@loadable/component";
@@ -38,4 +38,4 @@ MaskedField.displayName = "MaskedField";
 export {
   MaskedField
 };
-//# sourceMappingURL=chunk-GV36OVX7.js.map
+//# sourceMappingURL=chunk-R67C5QTH.js.map

package/dist/esm/{chunk-S4CU4XRB.js → chunk-VGFVSRWH.js}

@@ -1,6 +1,6 @@
 import {
   TextField
-} from "./chunk-IQKS662C.js";
+} from "./chunk-6RDK3FM2.js";
 
 // src/components/NumberField/NumberField.tsx
 import classNames from "classnames/dedupe";
@@ -94,4 +94,4 @@ NumberField.displayName = "NumberField";
 export {
   NumberField
 };
-//# sourceMappingURL=chunk-S4CU4XRB.js.map
+//# sourceMappingURL=chunk-VGFVSRWH.js.map