mainstack-design-system 1.2.1 → 1.3.0

package/dist/mainstack-design-system591.js

@@ -1,463 +1,127 @@
 'use client';
-import { jsxs as B, jsx as ct } from "react/jsx-runtime";
-import F, { useRef as ft, useState as O, useCallback as K, useEffect as j, forwardRef as yt } from "react";
-import { InputRoot as pt } from "./mainstack-design-system429.js";
-import { InputField as mt } from "./mainstack-design-system430.js";
-import "./mainstack-design-system428.js";
-import { n as dt, p as bt, g as x, v as gt, a as S, A as X, b as R, r as Ct, m as ht, I as vt, c as Nt, d as Z, i as Ot } from "./getInternationalPhoneNumberPrefix-2_e9S-q4.js";
-import { P as p } from "./index-CeH95e4J.js";
-import { c as At } from "./en.json-x2mHjhnP.js";
-import { cn as Pt, sanitizeNumberInputValue as It } from "./mainstack-design-system586.js";
-import { usePhoneNumberContext as wt } from "./mainstack-design-system560.js";
-function P(t) {
-  "@babel/helpers - typeof";
-  return P = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(e) {
-    return typeof e;
-  } : function(e) {
-    return e && typeof Symbol == "function" && e.constructor === Symbol && e !== Symbol.prototype ? "symbol" : typeof e;
-  }, P(t);
-}
-function H(t, e) {
-  var r = Object.keys(t);
-  if (Object.getOwnPropertySymbols) {
-    var n = Object.getOwnPropertySymbols(t);
-    e && (n = n.filter(function(o) {
-      return Object.getOwnPropertyDescriptor(t, o).enumerable;
-    })), r.push.apply(r, n);
-  }
-  return r;
-}
-function G(t) {
-  for (var e = 1; e < arguments.length; e++) {
-    var r = arguments[e] != null ? arguments[e] : {};
-    e % 2 ? H(Object(r), !0).forEach(function(n) {
-      Tt(t, n, r[n]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(t, Object.getOwnPropertyDescriptors(r)) : H(Object(r)).forEach(function(n) {
-      Object.defineProperty(t, n, Object.getOwnPropertyDescriptor(r, n));
-    });
-  }
-  return t;
-}
-function Tt(t, e, r) {
-  return (e = jt(e)) in t ? Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }) : t[e] = r, t;
-}
-function jt(t) {
-  var e = Ft(t, "string");
-  return P(e) == "symbol" ? e : e + "";
-}
-function Ft(t, e) {
-  if (P(t) != "object" || !t) return t;
-  var r = t[Symbol.toPrimitive];
-  if (r !== void 0) {
-    var n = r.call(t, e);
-    if (P(n) != "object") return n;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (e === "string" ? String : Number)(t);
-}
-function St() {
-  var t = dt(arguments), e = t.text, r = t.options, n = t.metadata;
-  r = G(G({}, r), {}, {
-    extract: !1
-  });
-  var o = bt(e, r, n);
-  return o && o.isPossible() || !1;
-}
-function A(t, e) {
-  return Lt(t) || Rt(t, e) || Et(t, e) || _t();
-}
-function _t() {
-  throw new TypeError(`Invalid attempt to destructure non-iterable instance.
-In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
-}
-function Et(t, e) {
-  if (t) {
-    if (typeof t == "string") return J(t, e);
-    var r = Object.prototype.toString.call(t).slice(8, -1);
-    if (r === "Object" && t.constructor && (r = t.constructor.name), r === "Map" || r === "Set") return Array.from(t);
-    if (r === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)) return J(t, e);
-  }
-}
-function J(t, e) {
-  (e == null || e > t.length) && (e = t.length);
-  for (var r = 0, n = new Array(e); r < e; r++) n[r] = t[r];
-  return n;
-}
-function Rt(t, e) {
-  var r = t == null ? null : typeof Symbol < "u" && t[Symbol.iterator] || t["@@iterator"];
-  if (r != null) {
-    var n, o, a, s, f = [], l = !0, i = !1;
-    try {
-      if (a = (r = r.call(t)).next, e !== 0) for (; !(l = (n = a.call(r)).done) && (f.push(n.value), f.length !== e); l = !0) ;
-    } catch (c) {
-      i = !0, o = c;
-    } finally {
-      try {
-        if (!l && r.return != null && (s = r.return(), Object(s) !== s)) return;
-      } finally {
-        if (i) throw o;
-      }
-    }
-    return f;
-  }
-}
-function Lt(t) {
-  if (Array.isArray(t)) return t;
-}
-function xt(t) {
-  var e = this, r = t.value, n = t.onChange, o = t.country, a = t.defaultCountry, s = t.international, f = t.withCountryCallingCode, l = t.useNationalFormatForDefaultCountryValue, i = t.metadata;
-  typeof f == "boolean" && !(o && s) && console.error("[react-phone-number-input] `withCountryCallingCode` property can only be used together with `country` and `international` properties"), o && a && console.error("[react-phone-number-input] When `country` property is passed, `defaultCountry` property has no effect and therefore shouldn't be passed"), typeof s == "boolean" && !o && console.error("[react-phone-number-input] `international` property can only be used together with `country` property");
-  var c = Dt({
-    international: s,
-    country: o,
-    defaultCountry: a,
-    withCountryCallingCode: f
-  }), m = ft(), b = function(y, g, N) {
-    console.error("[react-phone-number-input] Expected phone number ".concat(y, " to correspond to country ").concat(g, " but ").concat(N ? "in reality it corresponds to country " + N : "it doesn't", ".")), m.current = !0;
-  }, d = function(y) {
-    return r && gt(r), $t(r, o, a, c, l, i, function() {
-      y && y.onCountryMismatch && y.onCountryMismatch();
-      for (var g = arguments.length, N = new Array(g), T = 0; T < g; T++)
-        N[T] = arguments[T];
-      b.apply(e, N);
-    });
-  }, h = O(o), I = A(h, 2), E = I[0], et = I[1], rt = O(a), W = A(rt, 2), nt = W[0], ot = W[1], at = O(d()), M = A(at, 2), it = M[0], C = M[1], ut = O(r), k = A(ut, 2), w = k[0], v = k[1], lt = O(), z = A(lt, 2);
-  z[0];
-  var U = z[1], Y = K(function() {
-    return U({});
-  }, [U]);
-  function q(u) {
-    if (u) {
-      c === "NATIONAL_PART_OF_INTERNATIONAL" && (u = "+".concat(S(o, i)).concat(u));
-      var y = new X(o || a, i);
-      return y.input(u), y.getNumberValue();
-    }
-  }
-  j(function() {
-    r !== w && (v(r), C(d()));
-  }, [r]), j(function() {
-    if (o !== E) {
-      et(o);
-      var u, y = d({
-        onCountryMismatch: function() {
-          u = !0;
-        }
-      });
-      C(y), u && v(q(y));
-    }
-  }, [o]), j(function() {
-    a !== nt && (ot(a), C(d()));
-  }, [a]), j(function() {
-    w !== r && n(w);
-  }, [w]);
-  var st = K(function(u) {
-    var y;
-    if (o)
-      if (c === "INTERNATIONAL") {
-        var g = x(o, i);
-        if (u.indexOf(g) !== 0) {
-          if (u && u[0] !== "+")
-            u = g + u;
-          else if (!m.current) return C(g), v(void 0), Y();
-        }
-      } else
-        u && u[0] === "+" && (u = u.slice(1));
-    else a || u && u[0] !== "+" && (u = "+" + u);
-    u && (y = q(u)), C(u), v(y);
-  }, [o, c, a, i, C, v, Y, m]);
-  return {
-    phoneDigits: it,
-    setPhoneDigits: st,
-    inputFormat: c
-  };
-}
-function $t(t, e, r, n, o, a, s) {
-  if (e && n === "INTERNATIONAL") {
-    var f = x(e, a);
-    return t ? (t.indexOf(f) !== 0 && s(t, e), t) : f;
-  }
-  if (!t)
-    return "";
-  if (!e && !r)
-    return t;
-  var l = new X(void 0, a);
-  l.input(t);
-  var i = l.getNumber();
-  if (i)
-    if (e)
-      switch (i.country && i.country !== e ? s(t, e, i.country) : i.countryCallingCode !== S(e, a) && s(t, e), n) {
-        case "NATIONAL":
-          return R(i.formatNational());
-        case "NATIONAL_PART_OF_INTERNATIONAL":
-          return R(Ct(i.formatInternational(), x(e, a)));
-        case "INTERNATIONAL":
-          throw new Error('`inputFormat: "INTERNATIONAL"` case should\'ve already been handled earlier in the code');
-        case "INTERNATIONAL_OR_NATIONAL":
-          throw new Error('`inputFormat: "INTERNATIONAL_OR_NATIONAL"` is not possible when `country` is fixed');
-        default:
-          throw new Error("Unknown `inputFormat`: ".concat(n));
-      }
-    else
-      return i.countryCallingCode && i.countryCallingCode === S(r, a) && o ? R(i.formatNational()) : t;
-  else
-    return "";
-}
-function Dt(t) {
-  var e = t.international, r = t.country, n = t.defaultCountry, o = t.withCountryCallingCode;
-  return r ? e ? o ? "INTERNATIONAL" : "NATIONAL_PART_OF_INTERNATIONAL" : "NATIONAL" : n ? "INTERNATIONAL_OR_NATIONAL" : "INTERNATIONAL";
-}
-var Vt = ["Component", "country", "defaultCountry", "useNationalFormatForDefaultCountryValue", "value", "onChange", "metadata", "international", "withCountryCallingCode"];
-function $() {
-  return $ = Object.assign ? Object.assign.bind() : function(t) {
-    for (var e = 1; e < arguments.length; e++) {
-      var r = arguments[e];
-      for (var n in r)
-        Object.prototype.hasOwnProperty.call(r, n) && (t[n] = r[n]);
-    }
-    return t;
-  }, $.apply(this, arguments);
-}
-function Wt(t, e) {
-  if (t == null) return {};
-  var r = Mt(t, e), n, o;
-  if (Object.getOwnPropertySymbols) {
-    var a = Object.getOwnPropertySymbols(t);
-    for (o = 0; o < a.length; o++)
-      n = a[o], !(e.indexOf(n) >= 0) && Object.prototype.propertyIsEnumerable.call(t, n) && (r[n] = t[n]);
-  }
-  return r;
-}
-function Mt(t, e) {
-  if (t == null) return {};
-  var r = {}, n = Object.keys(t), o, a;
-  for (a = 0; a < n.length; a++)
-    o = n[a], !(e.indexOf(o) >= 0) && (r[o] = t[o]);
-  return r;
-}
-function _(t, e) {
-  var r = t.Component, n = t.country, o = t.defaultCountry, a = t.useNationalFormatForDefaultCountryValue, s = a === void 0 ? !0 : a, f = t.value, l = t.onChange, i = t.metadata, c = t.international, m = t.withCountryCallingCode, b = Wt(t, Vt), d = xt({
-    value: f,
-    onChange: l,
-    country: n,
-    defaultCountry: o,
-    international: c,
-    withCountryCallingCode: m,
-    useNationalFormatForDefaultCountryValue: s,
-    metadata: i
-  }), h = d.phoneDigits, I = d.setPhoneDigits, E = d.inputFormat;
-  return /* @__PURE__ */ F.createElement(r, $({}, b, {
-    ref: e,
-    metadata: i,
-    inputFormat: E,
-    international: c,
-    withCountryCallingCode: m,
-    country: n || o,
-    value: h,
-    onChange: I
-  }));
-}
-_ = /* @__PURE__ */ F.forwardRef(_);
-_.propTypes = {
-  /**
-   * The phone number (in E.164 format).
-   * Examples: `"+12"`, `"+12133734253"`.
-   * An "empty" `value` could be represented by any "falsy" value like `undefined`, `null` or an empty string `""`.
-   */
-  value: p.string,
-  /**
-   * A function of `value: string?`.
-   * Updates the `value` property (to `undefined` in case it's empty).
-   */
-  onChange: p.func.isRequired,
-  /**
-   * A two-letter country code for formatting `value`
-   * as a national phone number (example: `(213) 373-4253`),
-   * or as an international phone number without "country calling code"
-   * if `international` property is passed (example: `213 373 4253`).
-   * Example: "US".
-   * If no `country` is passed then `value`
-   * is formatted as an international phone number.
-   * (example: `+1 213 373 4253`)
-   */
-  country: p.string,
-  /**
-   * A two-letter country code for formatting `value`
-   * when a user inputs a national phone number (example: `(213) 373-4253`).
-   * The user can still input a phone number in international format.
-   * Example: "US".
-   * `country` and `defaultCountry` properties are mutually exclusive.
-   */
-  defaultCountry: p.string,
-  /**
-   * If `country` property is passed along with `international={true}` property
-   * then the phone number will be input in "international" format for that `country`
-   * (without "country calling code").
-   * For example, if `country="US"` property is passed to "without country select" input
-   * then the phone number will be input in the "national" format for `US` (`(213) 373-4253`).
-   * But if both `country="US"` and `international={true}` properties are passed then
-   * the phone number will be input in the "international" format for `US` (`213 373 4253`)
-   * (without "country calling code" `+1`).
-   */
-  international: p.bool,
-  /**
-   * If `country` and `international` properties are set,
-   * then by default it won't include "country calling code" in the input field.
-   * To change that, pass `withCountryCallingCode` property,
-   * and it will include "country calling code" in the input field.
-   */
-  withCountryCallingCode: p.bool,
-  /**
-   * A component that renders the `<input/>` itself and also
-   * parses and formats its `value` as the user inputs it.
-   * See `InputBasic.js` and `InputSmart.js` for an example.
-   */
-  Component: p.elementType.isRequired,
-  /**
-   * When `defaultCountry` is defined and the initial `value` corresponds to `defaultCountry`,
-   * then the `value` will be formatted as a national phone number by default.
-   * To format the initial `value` of `defaultCountry` as an international number instead
-   * set `useNationalFormatForDefaultCountryValue` property to `true`.
-   */
-  useNationalFormatForDefaultCountryValue: p.bool,
-  /**
-   * `libphonenumber-js` metadata.
-   */
-  metadata: ht
-};
-var kt = ["type", "autoComplete", "smartCaret", "metadata"];
-function D() {
-  return D = Object.assign ? Object.assign.bind() : function(t) {
-    for (var e = 1; e < arguments.length; e++) {
-      var r = arguments[e];
-      for (var n in r)
-        Object.prototype.hasOwnProperty.call(r, n) && (t[n] = r[n]);
-    }
-    return t;
-  }, D.apply(this, arguments);
-}
-function zt(t, e) {
-  if (t == null) return {};
-  var r = Ut(t, e), n, o;
-  if (Object.getOwnPropertySymbols) {
-    var a = Object.getOwnPropertySymbols(t);
-    for (o = 0; o < a.length; o++)
-      n = a[o], !(e.indexOf(n) >= 0) && Object.prototype.propertyIsEnumerable.call(t, n) && (r[n] = t[n]);
-  }
-  return r;
-}
-function Ut(t, e) {
-  if (t == null) return {};
-  var r = {}, n = Object.keys(t), o, a;
-  for (a = 0; a < n.length; a++)
-    o = n[a], !(e.indexOf(o) >= 0) && (r[o] = t[o]);
-  return r;
-}
-function tt(t) {
-  function e(r, n) {
-    var o = r.type, a = o === void 0 ? "tel" : o, s = r.autoComplete, f = s === void 0 ? "tel" : s, l = r.smartCaret, i = l === void 0 ? !0 : l, c = r.metadata, m = c === void 0 ? t : c, b = zt(r, kt);
-    return /* @__PURE__ */ F.createElement(_, D({}, b, {
-      type: a,
-      autoComplete: f,
-      metadata: m,
-      ref: n,
-      Component: i ? vt : Nt
-    }));
-  }
-  return e = /* @__PURE__ */ F.forwardRef(e), e.propTypes = {
-    /**
-     * HTML `<input/>` `type` attribute.
-     */
-    type: p.string,
-    /**
-     * HTML `<input/>` `autocomplete` attribute.
-     */
-    autoComplete: p.string,
-    /**
-     * By default, the caret position is being "intelligently" managed
-     * while a user inputs a phone number.
-     * This "smart" caret behavior can be turned off
-     * by passing `smartCaret={false}` property.
-     * This is just an "escape hatch" for any possible caret position issues.
-     */
-    // Is `true` by default.
-    smartCaret: p.bool,
-    /**
-     * `libphonenumber-js` metadata.
-     */
-    metadata: p.object
-  }, e;
-}
-tt();
-function V(t, e) {
-  var r = Array.prototype.slice.call(e);
-  return r.push(Z), t.apply(this, r);
-}
-tt(Z);
-function Yt() {
-  return V(St, arguments);
-}
-function L() {
-  return V(S, arguments);
-}
-function Q() {
-  return V(Ot, arguments);
-}
-const qt = yt(
-  ({
-    value: t,
-    placeholder: e = "000 - 000 - 000",
-    onChange: r,
-    ...n
-  }, o) => {
-    const { activeCountry: a, isDisabled: s } = wt(), f = (l) => {
-      if (!l) return "";
-      let i = "";
-      return a && Q(a) && (i = L(a)), l.replace(`+${i}`, "");
-    };
-    return /* @__PURE__ */ B(
-      pt,
+import { jsx as i, jsxs as M } from "react/jsx-runtime";
+import { forwardRef as P, useRef as v, useMemo as A, useEffect as H } from "react";
+import { cn as b } from "./mainstack-design-system587.js";
+import { useTimePickerContext as N } from "./mainstack-design-system578.js";
+import { S, a as k, b as V, c as y, d as C } from "./index-CLUgda6x.js";
+import { timeOptionBreakdown as j } from "./mainstack-design-system579.js";
+import { t as h } from "./toDate-BtoX9SXv.js";
+function g(n, s) {
+  return h(n, s?.in).getHours();
+}
+function z(n, s) {
+  return h(n, s?.in).getMinutes();
+}
+function w(n, s, u) {
+  const r = h(n, u?.in);
+  return r.setHours(s), r;
+}
+function O(n, s, u) {
+  const r = h(n, u?.in);
+  return r.setMinutes(s), r;
+}
+const D = P(
+  ({ className: n, ...s }, u) => {
+    const {
+      value: r,
+      onValueChange: p,
+      isDisabled: x
+    } = N(), m = v({
+      Hours: {},
+      Minutes: {},
+      "AM/PM": {}
+    }), l = A(() => {
+      const e = {
+        Hours: "",
+        Minutes: "",
+        "AM/PM": ""
+      };
+      if (!r) return e;
+      let a = g(r) % 12;
+      return a = a === 0 ? 12 : a, e.Hours = a.toString().padStart(2, "0"), e.Minutes = z(r).toString().padStart(2, "0"), e["AM/PM"] = g(r) >= 12 ? "PM" : "AM", e;
+    }, [r]);
+    return H(() => {
+      const e = m.current.Hours[l.Hours], a = m.current.Minutes[l.Minutes], o = m.current["AM/PM"][l["AM/PM"]];
+      (e || a || o) && (e?.scrollIntoView({ block: "center", behavior: "smooth" }), a?.scrollIntoView({ block: "center", behavior: "smooth" }), o?.scrollIntoView({ block: "center", behavior: "smooth" }));
+    }, [l]), /* @__PURE__ */ i(
+      "div",
       {
-        "data-slot": "phone-number-digit-field",
-        className: " has-disabled:opacity-50",
-        children: [
-          /* @__PURE__ */ B("p", { className: Pt("body-extrasmall-book"), children: [
-            "(+",
-            L(a || "US"),
-            ")"
-          ] }),
-          /* @__PURE__ */ ct(
-            mt,
+        "data-slot": "date-picker-calendar",
+        className: b(
+          "@container grid grid-cols-3 justify-items-center gap-16 p-16 pb-0 ",
+          n
+        ),
+        ref: u,
+        ...s,
+        children: Object.entries(j).map(([e, a]) => /* @__PURE__ */ M("div", { className: "flex flex-col gap-16", children: [
+          /* @__PURE__ */ i("h6", { className: b("body-extrasmall-regular", "text-secondary"), children: e }),
+          /* @__PURE__ */ M(
+            S,
             {
-              ...n,
-              disabled: s,
-              placeholder: e,
-              value: f(t),
-              onChange: (l) => {
-                const i = l.target.value;
-                let c = "", m = "";
-                a && Q(a) && i.length > 1 && (c = L(a), m = "+");
-                const b = `${m}${c}${It(i)}`;
-                if (r) {
-                  l.target.value = b;
-                  const d = Yt(b), h = {
-                    digit: b,
-                    isValid: d,
-                    countryIso2: a,
-                    countryName: a ? At[a] : null,
-                    isError: !!b && (!a || !d)
-                  };
-                  r(h, l);
-                }
+              style: {
+                "--scrollbar-size": "8px"
               },
-              ref: o
+              className: "h-210 overflow-hidden rounded-4",
+              children: [
+                /* @__PURE__ */ i(k, { className: "h-full w-full pr-10 rounded-4", children: /* @__PURE__ */ i("div", { className: "flex flex-col gap-16", children: a.map((o) => /* @__PURE__ */ i(
+                  "button",
+                  {
+                    "data-selected": l[e] === o,
+                    className: b(
+                      "body-extrasmall-book",
+                      "size-36 basis-36 shrink-0 grow-0 text-primary rounded-full cursor-pointer hover:bg-interactive-secondary data-[selected=true]:bg-interactive-primary data-[selected=true]:text-neutral-50 disabled:cursor-not-allowed disabled:opacity-50"
+                    ),
+                    disabled: x,
+                    onClick: () => {
+                      let t = r || /* @__PURE__ */ new Date();
+                      const d = e;
+                      let f = 0;
+                      if (d === "AM/PM") {
+                        f = o === "PM" ? 12 : 0;
+                        let c = +l.Hours;
+                        c === 12 && (c = 0), t = w(t, c + f), p(t);
+                      }
+                      if (d === "Hours") {
+                        f = l["AM/PM"] === "PM" ? 12 : 0;
+                        let c = +o;
+                        c === 12 && (c = 0), t = w(t, c + f), p(t);
+                      }
+                      d === "Minutes" && (t = O(t, +o), p(t));
+                    },
+                    ref: (t) => {
+                      const d = e;
+                      t && (m.current[d][o] = t);
+                    },
+                    children: o
+                  },
+                  o
+                )) }) }),
+                /* @__PURE__ */ i(
+                  V,
+                  {
+                    orientation: "vertical",
+                    className: "flex select-none touch-none p-2 w-(--scrollbar-size) flex-col transition-all duration-200 ease-out bg-surface-neutral-l1",
+                    children: /* @__PURE__ */ i(
+                      y,
+                      {
+                        className: b(
+                          " rounded-(--scrollbar-size) bg-border-interactive-neutral-inverse-hover relative",
+                          "before:content-[''] before:absolute before:top-1/2 before:left-1/2  before:-translate-1/2 before:size-full before:min-w-44 before:min-h-44"
+                        )
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ i(C, { className: "bg-border-interactive-neutral-inverse-hover" })
+              ]
             }
           )
-        ]
+        ] }, e))
       }
     );
   }
 );
-qt.displayName = "PhoneNumberDigitField";
+D.displayName = "TimePickerCalendar";
 export {
-  qt as PhoneNumberDigitField
+  D as TimePickerCalendar
 };