mainstack-design-system 1.3.6 → 1.3.9

package/dist/mainstack-design-system593.js

@@ -1,389 +1,126 @@
 'use client';
-import { jsxs as Y, jsx as it } from "react/jsx-runtime";
-import w, { useRef as ut, useState as b, useCallback as q, useEffect as P, forwardRef as lt } from "react";
-import { InputRoot as st } from "./mainstack-design-system431.js";
-import { InputField as ft } from "./mainstack-design-system432.js";
-import "./mainstack-design-system430.js";
-import { d as S, v as ct, e as F, A as z, p as L, r as yt, m as pt, P as p, I as dt, f as mt, h as G, j as Ct } from "./index-8BR3dtTN.js";
-import { cn as gt, getPhoneNumberDigitMetadataValueObject as ht } from "./mainstack-design-system589.js";
-import { usePhoneNumberContext as Nt } from "./mainstack-design-system565.js";
-function A(t, n) {
-  return Ot(t) || At(t, n) || bt(t, n) || vt();
-}
-function vt() {
-  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 bt(t, n) {
-  if (t) {
-    if (typeof t == "string") return B(t, n);
-    var e = Object.prototype.toString.call(t).slice(8, -1);
-    if (e === "Object" && t.constructor && (e = t.constructor.name), e === "Map" || e === "Set") return Array.from(t);
-    if (e === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e)) return B(t, n);
-  }
-}
-function B(t, n) {
-  (n == null || n > t.length) && (n = t.length);
-  for (var e = 0, r = new Array(n); e < n; e++) r[e] = t[e];
-  return r;
-}
-function At(t, n) {
-  var e = t == null ? null : typeof Symbol < "u" && t[Symbol.iterator] || t["@@iterator"];
-  if (e != null) {
-    var r, a, o, l, f = [], s = !0, i = !1;
-    try {
-      if (o = (e = e.call(t)).next, n !== 0) for (; !(s = (r = o.call(e)).done) && (f.push(r.value), f.length !== n); s = !0) ;
-    } catch (y) {
-      i = !0, a = y;
-    } finally {
-      try {
-        if (!s && e.return != null && (l = e.return(), Object(l) !== l)) return;
-      } finally {
-        if (i) throw a;
-      }
-    }
-    return f;
-  }
-}
-function Ot(t) {
-  if (Array.isArray(t)) return t;
-}
-function It(t) {
-  var n = this, e = t.value, r = t.onChange, a = t.country, o = t.defaultCountry, l = t.international, f = t.withCountryCallingCode, s = t.useNationalFormatForDefaultCountryValue, i = t.metadata;
-  typeof f == "boolean" && !(a && l) && console.error("[react-phone-number-input] `withCountryCallingCode` property can only be used together with `country` and `international` properties"), a && o && console.error("[react-phone-number-input] When `country` property is passed, `defaultCountry` property has no effect and therefore shouldn't be passed"), typeof l == "boolean" && !a && console.error("[react-phone-number-input] `international` property can only be used together with `country` property");
-  var y = Pt({
-    international: l,
-    country: a,
-    defaultCountry: o,
-    withCountryCallingCode: f
-  }), m = ut(), h = function(c, d, v) {
-    console.error("[react-phone-number-input] Expected phone number ".concat(c, " to correspond to country ").concat(d, " but ").concat(v ? "in reality it corresponds to country " + v : "it doesn't", ".")), m.current = !0;
-  }, C = function(c) {
-    return e && ct(e), Tt(e, a, o, y, s, i, function() {
-      c && c.onCountryMismatch && c.onCountryMismatch();
-      for (var d = arguments.length, v = new Array(d), T = 0; T < d; T++)
-        v[T] = arguments[T];
-      h.apply(n, v);
-    });
-  }, j = b(a), O = A(j, 2), E = O[0], Q = O[1], X = b(o), $ = A(X, 2), Z = $[0], tt = $[1], et = b(C()), V = A(et, 2), nt = V[0], g = V[1], rt = b(e), D = A(rt, 2), I = D[0], N = D[1], at = b(), M = A(at, 2);
-  M[0];
-  var W = M[1], k = q(function() {
-    return W({});
-  }, [W]);
-  function U(u) {
-    if (u) {
-      y === "NATIONAL_PART_OF_INTERNATIONAL" && (u = "+".concat(F(a, i)).concat(u));
-      var c = new z(a || o, i);
-      return c.input(u), c.getNumberValue();
-    }
-  }
-  P(function() {
-    e !== I && (N(e), g(C()));
-  }, [e]), P(function() {
-    if (a !== E) {
-      Q(a);
-      var u, c = C({
-        onCountryMismatch: function() {
-          u = !0;
-        }
-      });
-      g(c), u && N(U(c));
-    }
-  }, [a]), P(function() {
-    o !== Z && (tt(o), g(C()));
-  }, [o]), P(function() {
-    I !== e && r(I);
-  }, [I]);
-  var ot = q(function(u) {
-    var c;
-    if (a)
-      if (y === "INTERNATIONAL") {
-        var d = S(a, i);
-        if (u.indexOf(d) !== 0) {
-          if (u && u[0] !== "+")
-            u = d + u;
-          else if (!m.current) return g(d), N(void 0), k();
-        }
-      } else
-        u && u[0] === "+" && (u = u.slice(1));
-    else o || u && u[0] !== "+" && (u = "+" + u);
-    u && (c = U(u)), g(u), N(c);
-  }, [a, y, o, i, g, N, k, m]);
-  return {
-    phoneDigits: nt,
-    setPhoneDigits: ot,
-    inputFormat: y
-  };
-}
-function Tt(t, n, e, r, a, o, l) {
-  if (n && r === "INTERNATIONAL") {
-    var f = S(n, o);
-    return t ? (t.indexOf(f) !== 0 && l(t, n), t) : f;
-  }
-  if (!t)
-    return "";
-  if (!n && !e)
-    return t;
-  var s = new z(void 0, o);
-  s.input(t);
-  var i = s.getNumber();
-  if (i)
-    if (n)
-      switch (i.country && i.country !== n ? l(t, n, i.country) : i.countryCallingCode !== F(n, o) && l(t, n), r) {
-        case "NATIONAL":
-          return L(i.formatNational());
-        case "NATIONAL_PART_OF_INTERNATIONAL":
-          return L(yt(i.formatInternational(), S(n, o)));
-        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(r));
-      }
-    else
-      return i.countryCallingCode && i.countryCallingCode === F(e, o) && a ? L(i.formatNational()) : t;
-  else
-    return "";
-}
-function Pt(t) {
-  var n = t.international, e = t.country, r = t.defaultCountry, a = t.withCountryCallingCode;
-  return e ? n ? a ? "INTERNATIONAL" : "NATIONAL_PART_OF_INTERNATIONAL" : "NATIONAL" : r ? "INTERNATIONAL_OR_NATIONAL" : "INTERNATIONAL";
-}
-var wt = ["Component", "country", "defaultCountry", "useNationalFormatForDefaultCountryValue", "value", "onChange", "metadata", "international", "withCountryCallingCode"];
-function _() {
-  return _ = Object.assign ? Object.assign.bind() : function(t) {
-    for (var n = 1; n < arguments.length; n++) {
-      var e = arguments[n];
-      for (var r in e)
-        Object.prototype.hasOwnProperty.call(e, r) && (t[r] = e[r]);
-    }
-    return t;
-  }, _.apply(this, arguments);
-}
-function Ft(t, n) {
-  if (t == null) return {};
-  var e = Rt(t, n), r, a;
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(t);
-    for (a = 0; a < o.length; a++)
-      r = o[a], !(n.indexOf(r) >= 0) && Object.prototype.propertyIsEnumerable.call(t, r) && (e[r] = t[r]);
-  }
-  return e;
-}
-function Rt(t, n) {
-  if (t == null) return {};
-  var e = {}, r = Object.keys(t), a, o;
-  for (o = 0; o < r.length; o++)
-    a = r[o], !(n.indexOf(a) >= 0) && (e[a] = t[a]);
-  return e;
-}
-function R(t, n) {
-  var e = t.Component, r = t.country, a = t.defaultCountry, o = t.useNationalFormatForDefaultCountryValue, l = o === void 0 ? !0 : o, f = t.value, s = t.onChange, i = t.metadata, y = t.international, m = t.withCountryCallingCode, h = Ft(t, wt), C = It({
-    value: f,
-    onChange: s,
-    country: r,
-    defaultCountry: a,
-    international: y,
-    withCountryCallingCode: m,
-    useNationalFormatForDefaultCountryValue: l,
-    metadata: i
-  }), j = C.phoneDigits, O = C.setPhoneDigits, E = C.inputFormat;
-  return /* @__PURE__ */ w.createElement(e, _({}, h, {
-    ref: n,
-    metadata: i,
-    inputFormat: E,
-    international: y,
-    withCountryCallingCode: m,
-    country: r || a,
-    value: j,
-    onChange: O
-  }));
-}
-R = /* @__PURE__ */ w.forwardRef(R);
-R.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: pt
-};
-var jt = ["type", "autoComplete", "smartCaret", "metadata"];
-function x() {
-  return x = Object.assign ? Object.assign.bind() : function(t) {
-    for (var n = 1; n < arguments.length; n++) {
-      var e = arguments[n];
-      for (var r in e)
-        Object.prototype.hasOwnProperty.call(e, r) && (t[r] = e[r]);
-    }
-    return t;
-  }, x.apply(this, arguments);
-}
-function Et(t, n) {
-  if (t == null) return {};
-  var e = Lt(t, n), r, a;
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(t);
-    for (a = 0; a < o.length; a++)
-      r = o[a], !(n.indexOf(r) >= 0) && Object.prototype.propertyIsEnumerable.call(t, r) && (e[r] = t[r]);
-  }
-  return e;
-}
-function Lt(t, n) {
-  if (t == null) return {};
-  var e = {}, r = Object.keys(t), a, o;
-  for (o = 0; o < r.length; o++)
-    a = r[o], !(n.indexOf(a) >= 0) && (e[a] = t[a]);
-  return e;
-}
-function J(t) {
-  function n(e, r) {
-    var a = e.type, o = a === void 0 ? "tel" : a, l = e.autoComplete, f = l === void 0 ? "tel" : l, s = e.smartCaret, i = s === void 0 ? !0 : s, y = e.metadata, m = y === void 0 ? t : y, h = Et(e, jt);
-    return /* @__PURE__ */ w.createElement(R, x({}, h, {
-      type: o,
-      autoComplete: f,
-      metadata: m,
-      ref: r,
-      Component: i ? dt : mt
-    }));
-  }
-  return n = /* @__PURE__ */ w.forwardRef(n), n.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
-  }, n;
-}
-J();
-function K(t, n) {
-  var e = Array.prototype.slice.call(n);
-  return e.push(G), t.apply(this, e);
-}
-J(G);
-function H() {
-  return K(F, arguments);
-}
-function St() {
-  return K(Ct, arguments);
-}
-const _t = lt(
-  ({ placeholder: t = "000 - 000 - 000", ...n }, e) => {
-    const { activeCountry: r, isDisabled: a, value: o, onValueChange: l } = Nt(), f = (s) => {
-      if (!s) return "";
-      let i = "";
-      return r && St(r) && (i = H(r)), s.replace(`+${i}`, "");
-    };
-    return /* @__PURE__ */ Y(
-      st,
+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 { t as h, c as b } from "./utils-CFdAYIby.js";
+import { useTimePickerContext as N } from "./mainstack-design-system581.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-system582.js";
+function g(s, n) {
+  return h(s, n?.in).getHours();
+}
+function z(s, n) {
+  return h(s, n?.in).getMinutes();
+}
+function w(s, n, u) {
+  const r = h(s, u?.in);
+  return r.setHours(n), r;
+}
+function O(s, n, u) {
+  const r = h(s, u?.in);
+  return r.setMinutes(n), r;
+}
+const D = P(
+  ({ className: s, ...n }, u) => {
+    const {
+      value: r,
+      onValueChange: p,
+      isDisabled: x
+    } = N(), f = 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 = f.current.Hours[l.Hours], a = f.current.Minutes[l.Minutes], o = f.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__ */ Y("p", { className: gt("body-extrasmall-book"), children: [
-            "(+",
-            H(r || "US"),
-            ")"
-          ] }),
-          /* @__PURE__ */ it(
-            ft,
+        "data-slot": "date-picker-calendar",
+        className: b(
+          "@container grid grid-cols-3 justify-items-center gap-16 p-16 pb-0 ",
+          s
+        ),
+        ref: u,
+        ...n,
+        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: a,
-              placeholder: t,
-              value: f(o),
-              onChange: (s) => {
-                const i = ht({
-                  value: s.target.value,
-                  activeCountry: r
-                });
-                l && (s.target.value = i.digit, l(i));
+              style: {
+                "--scrollbar-size": "8px"
               },
-              ref: e
+              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 m = 0;
+                      if (d === "AM/PM") {
+                        m = o === "PM" ? 12 : 0;
+                        let c = +l.Hours;
+                        c === 12 && (c = 0), t = w(t, c + m), p(t);
+                      }
+                      if (d === "Hours") {
+                        m = l["AM/PM"] === "PM" ? 12 : 0;
+                        let c = +o;
+                        c === 12 && (c = 0), t = w(t, c + m), p(t);
+                      }
+                      d === "Minutes" && (t = O(t, +o), p(t));
+                    },
+                    ref: (t) => {
+                      const d = e;
+                      t && (f.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))
       }
     );
   }
 );
-_t.displayName = "PhoneNumberDigitField";
+D.displayName = "TimePickerCalendar";
 export {
-  _t as PhoneNumberDigitField
+  D as TimePickerCalendar
 };