@simpli-route/apollo-ds 0.1.83 → 0.1.84

package/dist/index.es24.js

@@ -1,41 +1,80 @@
-import { j as n } from "./index.es49.js";
-import { DateSegment as a } from "react-aria-components";
-import { cn as i } from "./index.es50.js";
-function c({ segment: t, className: o }) {
-  const l = () => t.maxValue != null ? String(t.maxValue).length + "ch" : "fit-content";
-  return /* @__PURE__ */ n.jsx(
-    a,
+import { j as e } from "./index.es52.js";
+import { CrossCircleIcon as C, DownChevronIcon as V } from "./index.es53.js";
+import { Button as x, SelectValue as F } from "react-aria-components";
+import { cn as l } from "./index.es54.js";
+import { invisibleSelectButtonVariants as I, invisibleSelectBadgeVariants as P } from "./index.es70.js";
+const k = ({
+  ref: f,
+  isOpen: a,
+  setIsOpen: d,
+  size: s,
+  isDisabled: t,
+  buttonClassName: h,
+  selectionMode: j,
+  maxLengthTextOption: m,
+  handleDeleteOptionSelected: p,
+  placeholder: v,
+  validationState: N
+}) => {
+  const g = (r, n) => t ? "disabled" : N === "invalid" ? "error" : n || a ? "active" : r ? "hover" : "default";
+  return /* @__PURE__ */ e.jsx(
+    x,
     {
-      segment: t,
-      className: ({ isPlaceholder: r, isFocusVisible: e }) => i(
-        "group box-content rounded-sm text-right tabular-nums text-neutral-900 outline-none",
-        "focus:bg-primary-500 focus:text-white",
-        "px-0.5",
-        r && "text-neutral-700",
-        e && "bg-primary-500 text-white",
-        o
+      ref: f,
+      className: ({ isHovered: r, isFocusVisible: n }) => l(
+        I({
+          size: s,
+          state: g(r, n)
+        }),
+        h
       ),
-      style: {
-        minWidth: l()
-      },
-      children: ({ text: r, isPlaceholder: e }) => /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
-        /* @__PURE__ */ n.jsx(
+      onPress: () => d(!a),
+      children: ({ isHovered: r, isFocusVisible: n }) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        /* @__PURE__ */ e.jsx(F, { className: "flex flex-1 items-center gap-1 overflow-hidden", children: ({ selectedItems: c, selectedText: S, isPlaceholder: w }) => /* @__PURE__ */ e.jsx(e.Fragment, { children: j === "multiple" && c && c.length > 0 ? /* @__PURE__ */ e.jsx("div", { className: "flex flex-wrap gap-1", children: c.filter((o) => o != null).map((o) => {
+          const i = o.label, B = i.length > m ? `${i.slice(0, m)}...` : i, u = o.value;
+          return /* @__PURE__ */ e.jsxs("div", { className: l(P({ size: s, isDisabled: t })), children: [
+            /* @__PURE__ */ e.jsx("span", { children: B }),
+            /* @__PURE__ */ e.jsx(
+              x,
+              {
+                className: l("outline-none", t ? "cursor-not-allowed" : ""),
+                isDisabled: t,
+                slot: null,
+                onPress: () => p(u),
+                children: /* @__PURE__ */ e.jsx(
+                  C,
+                  {
+                    className: l(
+                      "text-primary-800",
+                      t ? "text-neutral-600" : "",
+                      s === "xs" || s === "sm" ? "size-3" : "size-4"
+                    )
+                  }
+                )
+              }
+            )
+          ] }, u);
+        }) }) : /* @__PURE__ */ e.jsx(
           "span",
           {
-            "aria-hidden": "true",
-            className: i(
-              "pointer-events-none block w-full text-center text-neutral-700",
-              "group-focus:text-white",
-              e ? "visible" : "invisible h-0"
+            className: l(
+              "flex-1 truncate text-left",
+              w ? "text-neutral-600" : "",
+              t ? "text-neutral-700" : ""
             ),
-            children: t.placeholder
+            children: S || v
           }
-        ),
-        e ? "" : r
+        ) }) }),
+        r || n || a ? /* @__PURE__ */ e.jsx(
+          V,
+          {
+            className: `${a ? "rotate-180" : ""} size-4 text-blue-900 transition-transform duration-100`
+          }
+        ) : null
       ] })
     }
   );
-}
+};
 export {
-  c as TimeSegment
+  k as InvisibleSelectContent
 };

package/dist/index.es25.js

@@ -1,52 +1,142 @@
-import { j as e } from "./index.es49.js";
-import { useVisuallyHidden as a } from "react-aria";
-import { cn as l } from "./index.es50.js";
-const d = ({ className: s, label: r, size: t = "sm" }) => {
-  const i = (() => {
-    switch (t) {
-      case "xs":
-        return "h-4 w-4 ";
-      case "sm":
-        return "h-8 w-8";
-      case "md":
-        return "h-12 w-12";
-      case "lg":
-        return "h-16 w-16";
-      default:
-        return "h-8 w-8";
-    }
-  })(), { visuallyHiddenProps: n } = a();
-  return /* @__PURE__ */ e.jsxs("div", { role: "status", className: "flex flex-col items-center justify-center gap-1", children: [
-    /* @__PURE__ */ e.jsxs(
-      "svg",
+import { j as e } from "./index.es52.js";
+import { ClockIcon as D } from "./index.es53.js";
+import { forwardRef as H } from "react";
+import { TimeField as J, Group as K, DateInput as M, Button as Q, FieldError as U } from "react-aria-components";
+import { cn as r } from "./index.es54.js";
+import "./index.es20.js";
+import { Label as W } from "./index.es21.js";
+import { invisibleInputLabelVariants as X, invisibleInputCaptionVariants as Y } from "./index.es75.js";
+import { useTimeField as Z } from "./index.es47.js";
+import { TimePickerPopover as $ } from "./index.es26.js";
+import { TimeSegment as q } from "./index.es27.js";
+import { invisibleTimeFieldContainerVariants as z, invisibleTimeFieldGroupVariants as E, invisibleTimeFieldInputVariants as S, timeFieldButtonVariants as ee } from "./index.es71.js";
+const ie = H(
+  ({
+    size: s = "bodyDefault",
+    orientation: a = "vertical",
+    label: t,
+    captionError: n,
+    validationState: l,
+    className: x,
+    dateInputClassName: b,
+    dateSegmentClassName: j,
+    labelClassName: N,
+    captionErrorClassName: T,
+    isDisabled: m = !1,
+    isRequired: f = !1,
+    tooltipText: C,
+    tooltipSupportText: F,
+    tooltipProps: I,
+    granularity: g = "minute",
+    hourCycle: c,
+    hideTimeZone: V,
+    shouldForceLeadingZeros: k,
+    placeholderValue: P,
+    minValue: O,
+    maxValue: y,
+    value: G,
+    defaultValue: L,
+    onChange: w,
+    confirmButtonLabel: B = "Ok",
+    ...R
+  }, _) => {
+    const { currentValue: d, isPickerOpen: p, setIsPickerOpen: u, handleChange: v, containerRef: h } = Z({
+      value: G,
+      defaultValue: L,
+      onChange: w
+    }), A = (i, o) => m ? "disabled" : l === "invalid" ? "error" : i ? "active" : o ? "hover" : "default";
+    return /* @__PURE__ */ e.jsxs(
+      J,
       {
-        "aria-hidden": "true",
-        className: l(i, "mr-2 animate-spin fill-primary-500 text-neutral-500", s),
-        viewBox: "0 0 100 101",
-        fill: "none",
-        xmlns: "http://www.w3.org/2000/svg",
+        ref: _,
+        value: d,
+        className: r(z({ size: s, orientation: a }), x),
+        isDisabled: m,
+        isInvalid: l === "invalid",
+        isRequired: f,
+        granularity: g,
+        hourCycle: c,
+        hideTimeZone: V,
+        shouldForceLeadingZeros: k,
+        placeholderValue: P,
+        minValue: O,
+        maxValue: y,
+        onChange: v,
+        ...R,
         children: [
-          /* @__PURE__ */ e.jsx(
-            "path",
+          t && /* @__PURE__ */ e.jsx(
+            W,
             {
-              d: "M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z",
-              fill: "currentColor"
+              labelClassName: r(
+                X({ size: s }),
+                N,
+                a === "horizontal" && l !== "invalid" ? "self-center" : "self-start"
+              ),
+              isRequired: f,
+              tooltipText: C,
+              tooltipSupportText: F,
+              tooltipProps: I,
+              children: t
             }
           ),
+          /* @__PURE__ */ e.jsxs("div", { className: r("flex flex-col", a === "horizontal" ? "flex-1" : "w-full"), children: [
+            /* @__PURE__ */ e.jsxs(
+              K,
+              {
+                ref: h,
+                className: ({ isFocusWithin: i, isHovered: o }) => r(
+                  E({
+                    size: s,
+                    state: A(i || p, o)
+                  })
+                ),
+                children: [
+                  /* @__PURE__ */ e.jsx(M, { className: r(S({ size: s }), "font-semibold", b), children: (i) => /* @__PURE__ */ e.jsx(q, { segment: i, className: j }) }),
+                  /* @__PURE__ */ e.jsx(
+                    Q,
+                    {
+                      className: r(ee({ size: s })),
+                      "aria-label": "Time Picker",
+                      isDisabled: m,
+                      onPress: () => u((i) => !i),
+                      children: /* @__PURE__ */ e.jsx(D, { className: s === "bodySm" ? "size-3.5" : "size-4" })
+                    }
+                  )
+                ]
+              }
+            ),
+            n && l === "invalid" && /* @__PURE__ */ e.jsx(
+              "div",
+              {
+                className: r(
+                  Y({
+                    state: "error"
+                  }),
+                  T
+                ),
+                children: n
+              }
+            )
+          ] }),
+          l === "invalid" && n && /* @__PURE__ */ e.jsx(U, { className: "sr-only", children: n }),
           /* @__PURE__ */ e.jsx(
-            "path",
+            $,
             {
-              d: "M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z",
-              fill: "currentFill"
+              isOpen: p,
+              value: d,
+              hourCycle: c,
+              containerRef: h,
+              confirmButtonLabel: B,
+              onOpenChange: u,
+              onChange: v
             }
           )
         ]
       }
-    ),
-    r && /* @__PURE__ */ e.jsx("span", { className: "text-base leading-6 text-primary-900", children: r }),
-    /* @__PURE__ */ e.jsx("span", { ...n, children: "..." })
-  ] });
-};
+    );
+  }
+);
+ie.displayName = "InvisibleTimeField";
 export {
-  d as Loader
+  ie as InvisibleTimeField
 };

package/dist/index.es26.js

@@ -1,40 +1,160 @@
-import { j as e } from "./index.es49.js";
-import { forwardRef as x } from "react";
-import { cn as y } from "./index.es50.js";
-import { Loader as f } from "./index.es25.js";
-import { Overlay as u } from "./index.es85.js";
-const v = (s, a) => {
-  const {
-    className: l,
-    visible: t,
-    loaderProps: i = { size: "lg" },
-    overlayProps: n = { opacity: "2xl" },
-    zIndex: r = 1e3,
-    loader: o,
-    keepMounted: d,
-    blur: m = 4,
-    ...c
-  } = s, p = `calc(${r} + 1)`;
-  return !d && !t ? null : /* @__PURE__ */ e.jsxs(
-    "div",
+import { j as n } from "./index.es52.js";
+import { Time as O } from "@internationalized/date";
+import { useRef as M, useState as P, useCallback as d, useEffect as j } from "react";
+import { Popover as $, ListBox as k, ListBoxItem as N } from "react-aria-components";
+import { cn as x } from "./index.es54.js";
+import { Button as H } from "./index.es9.js";
+import { timePickerListItemVariants as A } from "./index.es71.js";
+function U(C) {
+  const { isOpen: i, onOpenChange: a, value: r, onChange: h, hourCycle: l = 12, containerRef: K, confirmButtonLabel: R } = C, y = M(null), g = M(null), S = M(null), [s, b] = P((r == null ? void 0 : r.hour) ?? 0), [m, v] = P((r == null ? void 0 : r.minute) ?? 0), V = Array.from({ length: l === 12 ? 12 : 24 }, (e, t) => l === 12 ? t + 1 : t), E = Array.from({ length: 60 }, (e, t) => t), f = l === 12 ? s === 0 ? 12 : s > 12 ? s - 12 : s : s, T = s >= 12 ? "PM" : "AM", [u, L] = P(T), w = d(() => {
+    const e = new O(s, m, 0);
+    h == null || h(e), a == null || a(!1);
+  }, [s, m, h, a]), p = d(() => {
+    a == null || a(!1);
+  }, [a]);
+  j(() => {
+    if (i) {
+      b((r == null ? void 0 : r.hour) ?? 0), v((r == null ? void 0 : r.minute) ?? 0);
+      const e = ((r == null ? void 0 : r.hour) ?? 0) >= 12 ? "PM" : "AM";
+      L(e);
+    }
+  }, [i, r]), j(() => {
+    i && setTimeout(() => {
+      if (y.current && g.current) {
+        const e = y.current.querySelector(`[data-key="${f}"]`), t = g.current.querySelector(`[data-key="${m}"]`);
+        e == null || e.scrollIntoView({ block: "center", behavior: "smooth" }), t == null || t.scrollIntoView({ block: "center", behavior: "smooth" });
+      }
+      if (S.current && l === 12) {
+        const e = S.current.querySelector(`[data-key="${u}"]`);
+        e == null || e.scrollIntoView({ block: "center", behavior: "smooth" });
+      }
+    }, 50);
+  }, [i, f, m, u, l]), j(() => {
+    const e = (t) => {
+      i && t.key === "Enter" && (t.preventDefault(), w()), i && t.key === "Escape" && (t.preventDefault(), p());
+    };
+    return i && document.addEventListener("keydown", e), () => {
+      document.removeEventListener("keydown", e);
+    };
+  }, [i, w, p]);
+  const B = d(
+    (e) => {
+      let t = e;
+      if (l === 12) {
+        const o = u === "PM";
+        e === 12 ? t = o ? 12 : 0 : t = o ? e + 12 : e;
+      }
+      b(t);
+    },
+    [l, u]
+  ), q = d((e) => {
+    v(e);
+  }, []), D = d(
+    (e) => {
+      L(e);
+      let t = s;
+      const o = e === "PM", c = f;
+      c === 12 ? t = o ? 12 : 0 : t = o ? c + 12 : c, b(t);
+    },
+    [s, f]
+  ), I = d(
+    (e) => {
+      e || p();
+    },
+    [p]
+  );
+  return /* @__PURE__ */ n.jsx(
+    $,
     {
-      ref: a,
-      className: y(
-        "absolute inset-0 z-50 flex items-center justify-center rounded-sm",
-        `backdrop-blur-[${m}px]`,
-        "bg-white/50",
-        l
-      ),
-      style: { zIndex: r },
-      ...c,
-      children: [
-        /* @__PURE__ */ e.jsx("div", { style: { zIndex: p }, children: o || /* @__PURE__ */ e.jsx(f, { ...i }) }),
-        /* @__PURE__ */ e.jsx(u, { zIndex: r, ...n })
-      ]
+      isOpen: i,
+      triggerRef: K,
+      placement: "bottom start",
+      className: "overflow-hidden rounded bg-white ring-1 ring-black/10",
+      style: {
+        boxShadow: "0px 1px 2px 0px #22242A0F, 0px 1px 3px 0px #22242A1A"
+      },
+      shouldCloseOnInteractOutside: () => !0,
+      onOpenChange: I,
+      children: /* @__PURE__ */ n.jsxs("div", { className: x("flex flex-col", l === 12 ? "w-[180px]" : "w-[140px]"), children: [
+        /* @__PURE__ */ n.jsxs("div", { className: "flex h-[180px] divide-x divide-neutral-200", children: [
+          /* @__PURE__ */ n.jsx("div", { className: "flex-1", children: /* @__PURE__ */ n.jsx(
+            k,
+            {
+              ref: y,
+              "aria-label": "Hours",
+              selectionMode: "single",
+              selectedKeys: /* @__PURE__ */ new Set([String(f)]),
+              className: "custom-scrollbar h-full overflow-y-auto p-1 outline-none",
+              onSelectionChange: (e) => {
+                const t = Array.from(e)[0];
+                t && B(Number(t));
+              },
+              children: V.map((e) => /* @__PURE__ */ n.jsx(
+                N,
+                {
+                  id: String(e),
+                  textValue: String(e).padStart(2, "0"),
+                  className: ({ isSelected: t, isFocused: o, isHovered: c }) => x(A({ isSelected: t, isFocused: o, isHovered: c, padding: "default" })),
+                  children: String(e).padStart(2, "0")
+                },
+                e
+              ))
+            }
+          ) }),
+          /* @__PURE__ */ n.jsx("div", { className: "flex-1", children: /* @__PURE__ */ n.jsx(
+            k,
+            {
+              ref: g,
+              "aria-label": "Minutes",
+              selectionMode: "single",
+              selectedKeys: /* @__PURE__ */ new Set([String(m)]),
+              className: "custom-scrollbar h-full overflow-y-auto p-1 outline-none",
+              onSelectionChange: (e) => {
+                const t = Array.from(e)[0];
+                t && q(Number(t));
+              },
+              children: E.map((e) => /* @__PURE__ */ n.jsx(
+                N,
+                {
+                  id: String(e),
+                  textValue: String(e).padStart(2, "0"),
+                  className: ({ isSelected: t, isFocused: o, isHovered: c }) => x(A({ isSelected: t, isFocused: o, isHovered: c, padding: "default" })),
+                  children: String(e).padStart(2, "0")
+                },
+                e
+              ))
+            }
+          ) }),
+          l === 12 && /* @__PURE__ */ n.jsx("div", { className: "w-14", children: /* @__PURE__ */ n.jsx(
+            k,
+            {
+              ref: S,
+              "aria-label": "Period",
+              selectionMode: "single",
+              selectedKeys: /* @__PURE__ */ new Set([u]),
+              className: "custom-scrollbar h-full overflow-y-auto p-1 outline-none",
+              onSelectionChange: (e) => {
+                const t = Array.from(e)[0];
+                t && D(t);
+              },
+              children: ["AM", "PM"].map((e) => /* @__PURE__ */ n.jsx(
+                N,
+                {
+                  id: e,
+                  textValue: e,
+                  className: ({ isSelected: t, isFocused: o, isHovered: c }) => x(A({ isSelected: t, isFocused: o, isHovered: c, padding: "compact" })),
+                  children: e
+                },
+                e
+              ))
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ n.jsx("div", { className: "border-t border-neutral-200 p-2", children: /* @__PURE__ */ n.jsx(H, { fullWidth: !0, intent: "tertiary", size: "sm", onPress: w, children: R }) })
+      ] })
     }
   );
-}, j = x(v);
-j.displayName = "LoadingOverlay";
+}
 export {
-  j as LoadingOverlay
+  U as TimePickerPopover
 };

package/dist/index.es27.js

@@ -1,107 +1,41 @@
-import { j as e } from "./index.es49.js";
-import { UpChevronIcon as B, DownChevronIcon as R } from "./index.es51.js";
-import { forwardRef as U } from "react";
-import { NumberField as _, Group as k, Input as A, Button as d, FieldError as H } from "react-aria-components";
-import { cn as r } from "./index.es50.js";
-import "./index.es17.js";
-import { Label as J } from "./index.es18.js";
-import { invisibleInputContainerVariants as K, invisibleInputLabelVariants as M, invisibleInputCaptionVariants as O } from "./index.es60.js";
-import { invisibleNumberFieldGroupVariants as P, invisibleNumberFieldVariants as Q, invisibleNumberFieldStepperVariants as t } from "./index.es74.js";
-const T = U(
-  ({
-    size: l = "bodyDefault",
-    orientation: a = "vertical",
-    label: f,
-    placeholder: p,
-    captionError: n,
-    validationState: i,
-    className: x,
-    inputClassName: N,
-    labelClassName: v,
-    captionErrorClassName: b,
-    isDisabled: s = !1,
-    isRequired: u = !1,
-    tooltipText: h,
-    tooltipSupportText: j,
-    tooltipProps: I,
-    minValue: F = 0,
-    maxValue: y,
-    step: V,
-    formatOptions: C,
-    showStepper: w = !0,
-    ...L
-  }, g) => {
-    const G = (m, o, c) => s ? "disabled" : i === "invalid" ? "error" : o || c ? "active" : m ? "hover" : "default";
-    return /* @__PURE__ */ e.jsxs(
-      _,
-      {
-        className: r(K({ size: l, orientation: a }), x),
-        isDisabled: s,
-        isInvalid: i === "invalid",
-        isRequired: u,
-        minValue: F,
-        maxValue: y,
-        step: V,
-        formatOptions: C,
-        ...L,
-        children: [
-          f && /* @__PURE__ */ e.jsx(
-            J,
-            {
-              labelClassName: r(
-                M({ size: l }),
-                v,
-                a === "horizontal" && i !== "invalid" ? "self-center" : "self-start"
-              ),
-              isRequired: u,
-              tooltipText: h,
-              tooltipSupportText: j,
-              tooltipProps: I,
-              children: f
-            }
-          ),
-          /* @__PURE__ */ e.jsxs("div", { className: r("flex flex-col", a === "horizontal" ? "flex-1" : "w-full"), children: [
-            /* @__PURE__ */ e.jsxs(k, { className: r(P({ size: l })), children: [
-              /* @__PURE__ */ e.jsx(
-                A,
-                {
-                  ref: g,
-                  placeholder: p,
-                  className: ({ isHovered: m, isFocusVisible: o, isFocused: c }) => r(
-                    Q({
-                      size: l,
-                      state: G(m, o, c)
-                    }),
-                    "font-semibold",
-                    N
-                  )
-                }
-              ),
-              w && /* @__PURE__ */ e.jsxs("div", { className: "absolute inset-y-0 right-0 flex flex-col items-center justify-center space-y-0.5 pr-2", children: [
-                /* @__PURE__ */ e.jsx(d, { slot: "increment", className: r(t({ size: l, isDisabled: s })), children: /* @__PURE__ */ e.jsx(B, { className: r(t({ size: l, isDisabled: s })) }) }),
-                /* @__PURE__ */ e.jsx(d, { slot: "decrement", className: r(t({ size: l, isDisabled: s })), children: /* @__PURE__ */ e.jsx(R, { className: r(t({ size: l, isDisabled: s })) }) })
-              ] })
-            ] }),
-            n && i === "invalid" && /* @__PURE__ */ e.jsx(
-              "div",
-              {
-                className: r(
-                  O({
-                    state: "error"
-                  }),
-                  b
-                ),
-                children: n
-              }
-            )
-          ] }),
-          i === "invalid" && n && /* @__PURE__ */ e.jsx(H, { className: "sr-only", children: n })
-        ]
-      }
-    );
-  }
-);
-T.displayName = "InvisibleNumberField";
+import { j as n } from "./index.es52.js";
+import { DateSegment as a } from "react-aria-components";
+import { cn as i } from "./index.es54.js";
+function c({ segment: t, className: o }) {
+  const l = () => t.maxValue != null ? String(t.maxValue).length + "ch" : "fit-content";
+  return /* @__PURE__ */ n.jsx(
+    a,
+    {
+      segment: t,
+      className: ({ isPlaceholder: r, isFocusVisible: e }) => i(
+        "group box-content rounded-sm text-right tabular-nums text-neutral-900 outline-none",
+        "focus:bg-primary-500 focus:text-white",
+        "px-0.5",
+        r && "text-neutral-700",
+        e && "bg-primary-500 text-white",
+        o
+      ),
+      style: {
+        minWidth: l()
+      },
+      children: ({ text: r, isPlaceholder: e }) => /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+        /* @__PURE__ */ n.jsx(
+          "span",
+          {
+            "aria-hidden": "true",
+            className: i(
+              "pointer-events-none block w-full text-center text-neutral-700",
+              "group-focus:text-white",
+              e ? "visible" : "invisible h-0"
+            ),
+            children: t.placeholder
+          }
+        ),
+        e ? "" : r
+      ] })
+    }
+  );
+}
 export {
-  T as InvisibleNumberField
+  c as TimeSegment
 };