@dmsi/wedgekit-react 1.0.1 → 2.0.1

package/dist/components/HorizontalDivider.js

@@ -0,0 +1,20 @@
+import { jsx as i } from "react/jsx-runtime";
+import { clsx as a } from "../node_modules/clsx/dist/clsx.js";
+function n({ id: r, testid: o, hideOnMobile: t, className: e, ...d }) {
+  return /* @__PURE__ */ i(
+    "hr",
+    {
+      id: r,
+      "data-testid": o,
+      className: a(
+        "w-full border-t border-border-primary-normal",
+        t && "hidden desktop:block",
+        e
+      ),
+      ...d
+    }
+  );
+}
+export {
+  n as HorizontalDivider
+};

package/dist/components/Icon.d.ts

@@ -1,11 +1,14 @@
 import { IconSize } from '../types';
 import { ComponentProps } from 'react';
+export declare const ICON_COLORS: readonly ["icon-primary-normal", "icon-primary-disabled", "icon-success-normal", "icon-success-disabled", "icon-warning-normal", "icon-warning-disabled", "icon-critical-normal", "icon-critical-disabled", "icon-action-primary-normal", "icon-action-primary-hover", "icon-action-primary-active", "icon-action-primary-disabled", "icon-action-secondary-normal", "icon-action-secondary-hover", "icon-action-secondary-active", "icon-action-secondary-disabled", "icon-on-action-primary-normal", "icon-on-action-primary-hover", "icon-on-action-primary-active", "icon-on-action-primary-disabled", "icon-on-action-secondary-normal", "icon-on-action-secondary-hover", "icon-on-action-secondary-active", "icon-on-action-secondary-disabled", "icon-action-critical-normal", "icon-action-critical-hover", "icon-action-critical-active", "icon-action-critical-disabled", "icon-action-critical-secondary-normal", "icon-action-critical-secondary-hover", "icon-action-critical-secondary-active", "icon-action-critical-secondary-disabled", "icon-brand-primary-normal", "icon-brand-primary-hover", "icon-brand-primary-active", "icon-brand-primary-disabled"];
+export type IconColor = (typeof ICON_COLORS)[number];
 type IconProps = {
     name: string;
     size?: IconSize;
     variant?: "outline" | "filled";
+    color?: IconColor;
     testid?: string;
-} & Omit<ComponentProps<"span">, "name">;
-export declare function Icon({ name, size, variant, testid, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
+} & Omit<ComponentProps<"span">, "name" | "color">;
+export declare function Icon({ name, size, variant, color, testid, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=Icon.d.ts.map

package/dist/components/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/components/Icon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC;AAEzC,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,IAAS,EACT,OAAmB,EACnB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,2CAqBX"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/components/Icon.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,eAAO,MAAM,WAAW,gnCAqCd,CAAC;AAEX,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAErD,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC/B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC,CAAC;AAEnD,wBAAgB,IAAI,CAAC,EACnB,IAAI,EACJ,IAAS,EACT,OAAmB,EACnB,KAAK,EACL,MAAM,EACN,GAAG,KAAK,EACT,EAAE,SAAS,2CAsBX"}

package/dist/components/Icon.js

@@ -0,0 +1,73 @@
+import { jsx as l } from "react/jsx-runtime";
+import { clsx as d } from "../node_modules/clsx/dist/clsx.js";
+const y = [
+  "icon-primary-normal",
+  "icon-primary-disabled",
+  "icon-success-normal",
+  "icon-success-disabled",
+  "icon-warning-normal",
+  "icon-warning-disabled",
+  "icon-critical-normal",
+  "icon-critical-disabled",
+  "icon-action-primary-normal",
+  "icon-action-primary-hover",
+  "icon-action-primary-active",
+  "icon-action-primary-disabled",
+  "icon-action-secondary-normal",
+  "icon-action-secondary-hover",
+  "icon-action-secondary-active",
+  "icon-action-secondary-disabled",
+  "icon-on-action-primary-normal",
+  "icon-on-action-primary-hover",
+  "icon-on-action-primary-active",
+  "icon-on-action-primary-disabled",
+  "icon-on-action-secondary-normal",
+  "icon-on-action-secondary-hover",
+  "icon-on-action-secondary-active",
+  "icon-on-action-secondary-disabled",
+  "icon-action-critical-normal",
+  "icon-action-critical-hover",
+  "icon-action-critical-active",
+  "icon-action-critical-disabled",
+  "icon-action-critical-secondary-normal",
+  "icon-action-critical-secondary-hover",
+  "icon-action-critical-secondary-active",
+  "icon-action-critical-secondary-disabled",
+  "icon-brand-primary-normal",
+  "icon-brand-primary-hover",
+  "icon-brand-primary-active",
+  "icon-brand-primary-disabled"
+];
+function v({
+  name: o,
+  size: c = 24,
+  variant: a = "outline",
+  color: n,
+  testid: r,
+  ...i
+}) {
+  const t = a === "filled" ? '"FILL" 1' : '"FILL" 0', e = c === 16 ? '"wght" 400' : '"wght" 300';
+  return /* @__PURE__ */ l(
+    "span",
+    {
+      ...i,
+      "data-testid": r,
+      className: d(
+        "icon",
+        `icon-${c}`,
+        // size === 16 ? "font-normal" : "font-light", // size 16 font weight is not working as normal from before
+        i.className
+      ),
+      style: {
+        color: n ? `var(--color-${n})` : void 0,
+        fontVariationSettings: t + `, ${e}`,
+        ...i.style
+      },
+      children: o
+    }
+  );
+}
+export {
+  y as ICON_COLORS,
+  v as Icon
+};

package/dist/components/ImagePlaceholder.js

@@ -0,0 +1,22 @@
+import { jsxs as e, jsx as t } from "react/jsx-runtime";
+import { useId as l } from "react";
+function c(i) {
+  const h = l();
+  return /* @__PURE__ */ e(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: 242,
+      height: 243,
+      fill: "none",
+      ...i,
+      children: [
+        /* @__PURE__ */ t("g", { clipPath: `url(#${h})`, children: /* @__PURE__ */ t("rect", { width: i.width, height: i.width, fill: "#F7F7F7", rx: 2 }) }),
+        /* @__PURE__ */ t("defs", { children: /* @__PURE__ */ t("clipPath", { id: h, children: /* @__PURE__ */ t("rect", { width: i.width, height: i.width, fill: "#fff", rx: 2 }) }) })
+      ]
+    }
+  );
+}
+export {
+  c as ImagePlaceholder
+};

package/dist/components/Input.d.ts

@@ -1,10 +1,12 @@
 import { ComponentProps, ReactNode, RefObject } from 'react';
 import { TextAlign } from '../types';
-export type InputVariant = "default" | "search" | "finder" | "currency" | "percentage" | "uom";
+export type InputVariant = 'default' | 'search' | 'finder' | 'currency' | 'percentage' | 'uom';
 export type InputFormatting = {
     variant?: InputVariant;
     decimals?: number;
     uom?: string;
+    currencyFormat?: boolean;
+    formatOnBlur?: boolean;
     removeSearchIcon?: boolean;
 };
 export type InputBaseProps = {
@@ -23,28 +25,28 @@ export type InputBaseProps = {
     removeRoundness?: boolean;
     removeBorder?: boolean;
     wrapperClassName?: string;
-    focus?: boolean;
+    isFocused?: boolean;
     secondaryIconColor?: boolean;
     fullWidth?: boolean;
     autocompletePadding?: boolean;
     wrapperRef?: RefObject<HTMLDivElement | null>;
-} & InputFormatting & Omit<ComponentProps<"input">, "align" | "id">;
-export declare function InputBase({ id, testid, before, after, rightAdornment, type, label, error, className, align, caption, required, selectOnFocus, removeRoundness, inputContainerRef, removeBorder, wrapperClassName, focus, secondaryIconColor, fullWidth, width, wrapperRef, autocompletePadding, ...props }: InputBaseProps): import("react/jsx-runtime").JSX.Element;
-export declare function Input({ variant, decimals, uom, removeSearchIcon, value: propValue, onChange, onBlur, onClear, id, testid, rightAdornment, ...props }: Omit<ComponentProps<"input">, "onChange" | "align" | "children"> & InputBaseProps & {
+} & InputFormatting & Omit<ComponentProps<'input'>, 'align' | 'id'>;
+export declare function InputBase({ id, testid, before, after, rightAdornment, type, label, error, className, align, caption, required, selectOnFocus, removeRoundness, inputContainerRef, removeBorder, wrapperClassName, isFocused, secondaryIconColor, fullWidth, width, wrapperRef, autocompletePadding, ...props }: InputBaseProps): import("react/jsx-runtime").JSX.Element;
+export declare function Input({ variant, decimals, uom, currencyFormat, formatOnBlur, removeSearchIcon, value: propValue, onChange, onBlur, onClear, id, testid, rightAdornment, ...props }: Omit<InputBaseProps, 'onChange' | 'children'> & {
     onChange?: React.ChangeEventHandler<HTMLInputElement>;
     onClear?: () => void;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function Finder(props: Omit<ComponentProps<"input">, "value" | "align" | "children" | "id"> & InputBaseProps & {
+export declare function Finder(props: Omit<ComponentProps<'input'>, 'value' | 'align' | 'children' | 'id'> & InputBaseProps & {
     value?: string | number;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function UOM(props: Omit<ComponentProps<"input">, "value" | "align" | "children" | "id"> & InputBaseProps & {
+export declare function UOM(props: Omit<ComponentProps<'input'>, 'value' | 'align' | 'children' | 'id'> & InputBaseProps & {
     uom: string;
     value?: string | number;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function Currency(props: Omit<ComponentProps<"input">, "onChange" | "align" | "children" | "id"> & InputBaseProps & {
+export declare function Currency(props: Omit<ComponentProps<'input'>, 'onChange' | 'align' | 'children' | 'id'> & InputBaseProps & {
     onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
 }): import("react/jsx-runtime").JSX.Element;
-export declare function Percentage(props: Omit<ComponentProps<"input">, "value" | "align" | "children" | "id"> & InputBaseProps & {
+export declare function Percentage(props: Omit<ComponentProps<'input'>, 'value' | 'align' | 'children' | 'id'> & InputBaseProps & {
     value?: string | number;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Input.d.ts.map

package/dist/components/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/components/Input.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../src/components/Input.tsx"],"names":[],"mappings":"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"}

package/dist/components/Input.js

@@ -0,0 +1,469 @@
+"use client";
+import { jsx as s, jsxs as O } from "react/jsx-runtime";
+import { useState as Z, useRef as Y, useEffect as q } from "react";
+import { clsx as f } from "../node_modules/clsx/dist/clsx.js";
+import { componentGap as Q, baseTransition as F, componentPaddingMinusBorder as C, componentPaddingMinusBorderDesktop as tt, typography as W, componentPaddingXUsingComponentGap as et } from "../classNames.js";
+import { Label as rt } from "./Label.js";
+import { Icon as k } from "./Icon.js";
+import { formatDecimalValue as w, formatCurrencyDisplay as E, getDecimalPlaceholder as nt } from "../utils/formatting.js";
+import { Paragraph as at } from "./Paragraph.js";
+function st(e, i) {
+  if (!e || !i)
+    return !1;
+  const y = Number(e.replace(/,/g, "")), l = Number(i.replace(/,/g, ""));
+  return !Number.isNaN(y) && !Number.isNaN(l) && y === l;
+}
+function ct({
+  id: e,
+  testid: i,
+  before: y,
+  after: l,
+  rightAdornment: h,
+  type: A,
+  label: g,
+  error: r,
+  className: M,
+  align: R = "left",
+  caption: S,
+  required: $,
+  selectOnFocus: U,
+  removeRoundness: d,
+  inputContainerRef: N,
+  removeBorder: H,
+  wrapperClassName: D,
+  isFocused: L,
+  secondaryIconColor: P,
+  fullWidth: j = !0,
+  width: o,
+  wrapperRef: B,
+  autocompletePadding: G = !1,
+  ...m
+}) {
+  const X = {
+    "data-error": r && !L || null,
+    "data-focus": L || null
+  }, I = Y(null), T = e ? `${e}-input` : void 0;
+  q(() => {
+    const n = I.current, x = () => {
+      n?.select();
+    };
+    if (U)
+      return I.current?.addEventListener("focus", x), () => {
+        n?.removeEventListener("focus", x);
+      };
+  }, [U]);
+  const z = f(
+    j ? "w-full" : "w-fit",
+    "flex flex-row items-center",
+    "bg-background-action-secondary-normal caret-icon-on-action-secondary-normal",
+    Q,
+    F,
+    "outline-transparent outline-2 -outline-offset-2",
+    !G && C,
+    G && tt,
+    !d && "rounded-base",
+    !H && "border border-border-primary-normal",
+    "relative"
+  ), J = f(
+    "has-[[data-focus]]:border-transparent has-[[data-focus]]:outline-border-primary-focus focus-within:border-transparent focus-within:outline-border-primary-focus"
+  ), t = f(
+    "has-disabled:bg-background-action-secondary-disabled"
+  ), a = f(
+    "has-[input:not(:disabled):read-only]:outline-none has-[input:not(:disabled):read-only]:bg-transparent has-[input:not(:disabled):read-only]:border-transparent has-[input:not(:disabled):read-only]:pl-0"
+  ), c = f(
+    "has-[[data-error]]:border-transparent has-[[data-error]]:not-focus-within:outline-border-primary-error has-[[data-error]]:not-focus-within:outline-1"
+  );
+  return /* @__PURE__ */ O(
+    "label",
+    {
+      id: e,
+      "data-testid": i,
+      htmlFor: T,
+      ref: N,
+      className: f(
+        "w-full flex flex-col",
+        "block",
+        "text-text-primary-normal has-disabled:text-text-primary-disabled",
+        Q
+      ),
+      style: {
+        ...m.style
+      },
+      children: [
+        g && /* @__PURE__ */ O("div", { className: f("flex items-center", Q), children: [
+          /* @__PURE__ */ s(
+            rt,
+            {
+              id: e ? `${e}-label` : void 0,
+              color: r ? "text-primary-error" : void 0,
+              className: f(
+                m.disabled || m.readOnly ? "cursor-default" : "cursor-pointer"
+              ),
+              children: g
+            }
+          ),
+          $ && /* @__PURE__ */ s(
+            "span",
+            {
+              className: f(W.label, "text-text-critical-normal"),
+              children: "*"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ O(
+          "div",
+          {
+            className: f(
+              z,
+              !m.disabled && c,
+              J,
+              t,
+              a,
+              D
+            ),
+            ref: (n) => {
+              B && (B.current = n);
+            },
+            children: [
+              y,
+              /* @__PURE__ */ s(
+                "input",
+                {
+                  ref: (n) => {
+                    I.current = n;
+                  },
+                  type: A,
+                  required: $,
+                  ...m,
+                  ...X,
+                  id: T,
+                  "data-testid": i ? `${i}-input` : void 0,
+                  className: f(
+                    "flex-1 outline-none w-full max-w-full min-h-6 min-w-0",
+                    "[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none",
+                    "placeholder:text-text-secondary-normal disabled:text-text-secondary-disabled",
+                    R === "right" && "text-right",
+                    R === "center" && "text-center",
+                    et,
+                    W.paragraph,
+                    M,
+                    m.readOnly && !m.disabled && "!px-0"
+                  ),
+                  style: { ...m.style, width: o }
+                }
+              ),
+              P ? /* @__PURE__ */ s("span", { className: "contents text-text-secondary-normal", children: l }) : l,
+              h
+            ]
+          }
+        ),
+        S && /* @__PURE__ */ s(
+          "div",
+          {
+            id: e ? `${e}-caption` : void 0,
+            "data-testid": i ? `${i}-caption` : void 0,
+            className: f(W.caption),
+            children: S
+          }
+        )
+      ]
+    }
+  );
+}
+function _({
+  variant: e = "default",
+  decimals: i,
+  uom: y,
+  currencyFormat: l = !1,
+  formatOnBlur: h = !1,
+  removeSearchIcon: A,
+  value: g,
+  onChange: r,
+  onBlur: M,
+  onClear: R,
+  id: S,
+  testid: $,
+  rightAdornment: U,
+  ...d
+}) {
+  const [N, H] = Z(""), [D, L] = Z(""), P = Y(!1), j = Y(""), o = (t, a) => {
+    j.current = t, H(t), L(a);
+  };
+  q(() => {
+    const t = g?.toString() ?? "", a = e === "currency" || e === "uom" && l;
+    if (!t) {
+      o("", "");
+      return;
+    }
+    if (!a) {
+      o(t, t);
+      return;
+    }
+    if (P.current && st(j.current, t))
+      return;
+    if (h && P.current) {
+      o(t, t);
+      return;
+    }
+    const c = w(t, i ?? 2);
+    o(c, E(c));
+  }, [g, e, l, i, h]);
+  const B = () => {
+    const t = {
+      ...d,
+      id: S,
+      ...nt(i),
+      value: g
+    };
+    switch (e) {
+      case "search":
+        return {
+          ...t,
+          placeholder: d.placeholder ?? "Search",
+          className: "!mr-6",
+          value: D
+        };
+      case "finder":
+        return t;
+      case "currency":
+        return {
+          ...t,
+          align: "right",
+          type: "text",
+          inputMode: "decimal",
+          value: D
+        };
+      case "percentage":
+      case "uom":
+        return {
+          ...t,
+          type: l ? "text" : "number",
+          align: "right",
+          inputMode: l ? "decimal" : void 0,
+          value: l ? D : g
+        };
+      default:
+        return t;
+    }
+  }, G = () => {
+    if (d.before) return d.before;
+    switch (e) {
+      case "search":
+        return A ? null : /* @__PURE__ */ s("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ s(k, { name: "search" }) });
+      case "currency":
+        return /* @__PURE__ */ s("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ s(k, { name: "attach_money" }) });
+      case "uom":
+        return l ? /* @__PURE__ */ s("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ s(k, { name: "attach_money" }) }) : null;
+      default:
+        return null;
+    }
+  }, m = () => {
+    if (d.after) return d.after;
+    switch (e) {
+      case "search":
+        return D.length > 0 && !d.readOnly ? /* @__PURE__ */ s(
+          k,
+          {
+            id: S ? `${S}-clear-button` : void 0,
+            testid: $ ? `${$}-clear-button` : void 0,
+            name: "close",
+            onClick: X,
+            className: "cursor-pointer absolute right-2 bottom-2/4 translate-y-2/4"
+          }
+        ) : null;
+      case "finder":
+        return /* @__PURE__ */ s(k, { name: "search" });
+      case "uom":
+        return y ? /* @__PURE__ */ s(at, { color: "text-secondary-normal", children: y.toUpperCase() }) : null;
+      case "percentage":
+        return /* @__PURE__ */ s("span", { className: "text-icon-primary-normal contents", children: /* @__PURE__ */ s(k, { name: "percent" }) });
+      default:
+        return null;
+    }
+  }, X = () => {
+    o("", ""), r && typeof r == "function" && r({
+      target: { value: "" }
+    }), R?.();
+  }, I = (t) => {
+    const a = t.target.value, c = d.max != null ? Number(String(d.max).replace(/,/g, "")) : void 0;
+    if (e === "currency") {
+      const n = a.replace(/,/g, "");
+      if (n === "") {
+        if (o("", ""), r) {
+          const u = {
+            ...t,
+            target: { ...t.target, value: "" }
+          };
+          r(u);
+        }
+        return;
+      }
+      if (!/^\d*\.?\d*$/.test(n)) return;
+      const b = n.split("."), v = i ?? 2;
+      if (b.length === 2 && b[1].length > v) return;
+      const p = Number(n);
+      if (!isNaN(p) && c != null && p > c) {
+        const u = c, V = w(
+          u.toString(),
+          v
+        );
+        if (o(
+          V,
+          h ? V : E(V)
+        ), r) {
+          const K = {
+            ...t,
+            target: { ...t.target, value: u.toString() }
+          };
+          r(K);
+        }
+        return;
+      }
+      if (o(n, h ? n : E(n)), !isNaN(p) && r) {
+        const u = {
+          ...t,
+          target: { ...t.target, value: p.toString() }
+        };
+        r(u);
+      }
+      return;
+    }
+    if (e === "uom" && l) {
+      const n = a.replace(/,/g, "");
+      if (n === "") {
+        if (o("", ""), r) {
+          const u = {
+            ...t,
+            target: { ...t.target, value: "" }
+          };
+          r(u);
+        }
+        return;
+      }
+      if (!/^\d*\.?\d*$/.test(n)) return;
+      const b = n.split("."), v = i ?? 2;
+      if (b.length === 2 && b[1].length > v) return;
+      const p = Number(n);
+      if (!isNaN(p) && c != null && p > c) {
+        const u = c, V = w(
+          u.toString(),
+          v
+        );
+        if (o(
+          V,
+          E(V)
+        ), r) {
+          const K = {
+            ...t,
+            target: { ...t.target, value: u.toString() }
+          };
+          r(K);
+        }
+        return;
+      }
+      if (o(n, E(n)), !isNaN(p) && r) {
+        const u = {
+          ...t,
+          target: { ...t.target, value: p.toString() }
+        };
+        r(u);
+      }
+      return;
+    }
+    if (e === "uom" && t.target.type === "number") {
+      const n = Number(a);
+      if (!isNaN(n) && c != null && n > c) {
+        const x = c, b = w(
+          x.toString(),
+          i ?? 0
+        );
+        if (o(b, b), typeof r == "function") {
+          const v = {
+            ...t,
+            target: { ...t.target, value: x.toString() }
+          };
+          r(v);
+        }
+        return;
+      }
+      o(a, a), typeof r == "function" && r(t);
+      return;
+    }
+    o(a, a), typeof r == "function" && r(t);
+  }, T = (t) => {
+    if (P.current = !1, !N) {
+      M?.(t);
+      return;
+    }
+    if (e === "currency") {
+      const a = w(N, i ?? 2);
+      o(a, E(a));
+      const c = Number(a);
+      if (!isNaN(c) && r) {
+        const n = {
+          ...t,
+          target: { ...t.target, value: c.toString() }
+        };
+        r(n);
+      }
+    } else if (e === "uom")
+      if (l) {
+        const a = w(N, i ?? 2);
+        o(a, E(a));
+        const c = Number(a);
+        if (!isNaN(c) && r) {
+          const n = {
+            ...t,
+            target: { ...t.target, value: c.toString() }
+          };
+          r(n);
+        }
+      } else {
+        const a = w(t.target.value, i);
+        t.target.value = a;
+      }
+    M?.(t);
+  }, z = (t) => {
+    P.current = !0, h && (e === "currency" || e === "uom" && l) && o(N, N), d.onFocus?.(t);
+  }, J = B();
+  return /* @__PURE__ */ s(
+    ct,
+    {
+      ...J,
+      before: G(),
+      after: m(),
+      onFocus: z,
+      onChange: I,
+      onBlur: T,
+      testid: $,
+      rightAdornment: U
+    }
+  );
+}
+function bt(e) {
+  return /* @__PURE__ */ s(_, { ...e, variant: "finder" });
+}
+function yt(e) {
+  return /* @__PURE__ */ s(_, { ...e, variant: "uom" });
+}
+function ht(e) {
+  return /* @__PURE__ */ s(
+    _,
+    {
+      ...e,
+      variant: "currency",
+      decimals: e.decimals ?? 2
+    }
+  );
+}
+function gt(e) {
+  return /* @__PURE__ */ s(_, { ...e, variant: "percentage" });
+}
+export {
+  ht as Currency,
+  bt as Finder,
+  _ as Input,
+  ct as InputBase,
+  gt as Percentage,
+  yt as UOM
+};