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

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

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