koval-ui/dist/src/lib/Number/NumberUnit.js

React components collection with minimalistic design. Supports theming, layout, and input validation.

"use client";
import { jsx as b } from "react/jsx-runtime";
import { forwardRef as D, useMemo as M } from "react";
import S from "classnames";
import { Units as U } from "../../internal/locale/units.js";
import { useBrowserLocale as h } from "../../internal/locale/useBrowserLocale.js";
import w from "./Number.module.css.js";
import { UnitDisplayModes as y, SignDisplayModes as F, CompactDisplayModes as L, Notations as I, Styles as j, LocaleMatchers as B } from "./types.js";
const G = D(
  ({
    value: i,
    className: l,
    locale: t,
    localeMatcher: r = B["best fit"],
    digitsConfig: m = {
      integer: {
        minimum: 1
      },
      significant: {
        minimum: 1,
        maximum: 21
      },
      fraction: {}
    },
    notation: n = I.standard,
    compactDisplay: e = L.short,
    grouping: a,
    signDisplay: s = F.auto,
    unit: o = U.liter,
    unitDisplay: u = y.short,
    ...p
  }, x) => {
    const N = h(), c = t || N, f = M(
      () => i ? new Intl.NumberFormat(c, {
        localeMatcher: r,
        style: j.unit,
        minimumIntegerDigits: m.integer?.minimum,
        minimumFractionDigits: m.fraction?.minimum,
        minimumSignificantDigits: m.significant?.minimum,
        maximumSignificantDigits: m.significant?.maximum,
        maximumFractionDigits: m.fraction?.maximum,
        notation: n,
        compactDisplay: e,
        useGrouping: a,
        signDisplay: s,
        unit: o,
        unitDisplay: u
      }).format(i) : "",
      [
        e,
        m.fraction?.maximum,
        m.fraction?.minimum,
        m.integer?.minimum,
        m.significant?.maximum,
        m.significant?.minimum,
        a,
        c,
        r,
        n,
        s,
        o,
        u,
        i
      ]
    );
    return i && /* @__PURE__ */ b(
      "span",
      {
        ...p,
        title: f,
        className: S(w.number, l),
        ref: x,
        children: f
      }
    );
  }
);
G.displayName = "NumberUnit";
export {
  G as NumberUnit
};
//# sourceMappingURL=NumberUnit.js.map