@janbox/storefront-builder 2.0.0 → 2.0.2

package/dist/date-picker-D9K6HWl-.js

@@ -0,0 +1,157 @@
+import { jsxs as u, jsx as t } from "@emotion/react/jsx-runtime";
+import { Fragment as T } from "react";
+import "react-datepicker/dist/react-datepicker.css";
+import { useFloating as $, autoUpdate as A, flip as B, offset as U, size as Z, useClick as _, useDismiss as G, useRole as L, useInteractions as X, FloatingPortal as q } from "@floating-ui/react";
+import { FLOATING_Z_INDEX as p } from "@janbox/storefront-ui/theme";
+import { isUndefined as J } from "lodash-es";
+import { DatePicker as K } from "react-datepicker";
+import { t as r, W as Q } from "./dialog-header-Bh3Dkw2q.js";
+import { useControllableState as h } from "@janbox/storefront-ui/hooks";
+const Y = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16 2V6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8 2V6" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M3 9H21" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19 4H5C3.895 4 3 4.895 3 6V19C3 20.105 3.895 21 5 21H19C20.105 21 21 20.105 21 19V6C21 4.895 20.105 4 19 4Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.01304 12.729C6.87504 12.729 6.76304 12.841 6.76404 12.979C6.76404 13.117 6.87604 13.229 7.01404 13.229C7.15204 13.229 7.26404 13.117 7.26404 12.979C7.26404 12.841 7.15204 12.729 7.01304 12.729" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.013 12.729C11.875 12.729 11.763 12.841 11.764 12.979C11.764 13.117 11.876 13.229 12.014 13.229C12.152 13.229 12.264 13.117 12.264 12.979C12.264 12.841 12.152 12.729 12.013 12.729" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M17.013 12.729C16.875 12.729 16.763 12.841 16.764 12.979C16.764 13.117 16.876 13.229 17.014 13.229C17.152 13.229 17.264 13.117 17.264 12.979C17.264 12.841 17.152 12.729 17.013 12.729" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M7.01304 16.729C6.87504 16.729 6.76304 16.841 6.76404 16.979C6.76404 17.117 6.87604 17.229 7.01404 17.229C7.15204 17.229 7.26404 17.117 7.26404 16.979C7.26404 16.841 7.15204 16.729 7.01304 16.729" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.013 16.729C11.875 16.729 11.763 16.841 11.764 16.979C11.764 17.117 11.876 17.229 12.014 17.229C12.152 17.229 12.264 17.117 12.264 16.979C12.264 16.841 12.152 16.729 12.013 16.729" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
+`, ae = (C) => {
+  const {
+    placement: f = "bottom",
+    contentWidth: d,
+    open: k,
+    onOpenChange: m,
+    dissmiss: g,
+    value: w,
+    defaultValue: b,
+    onChange: v,
+    placeholder: x,
+    referenceProps: a,
+    prefix: y,
+    suffix: j,
+    size: I = "32",
+    showTimeInput: M = !0,
+    ...W
+  } = C, [s, O] = h({
+    defaultValue: b,
+    value: w
+  }), [i, R] = h({
+    defaultValue: !1,
+    value: k
+  }), S = (e, n, o) => {
+    !e && !o || (R(e), m?.(e, n, o));
+  }, { refs: c, floatingStyles: V, context: l } = $({
+    open: i,
+    onOpenChange: S,
+    placement: f,
+    middleware: [
+      B(),
+      U(4),
+      Z({
+        apply({ elements: e }) {
+          const { width: n } = e.reference.getBoundingClientRect(), o = d === "fit-parent" ? n : d, H = {
+            minWidth: `${o ?? n}px`,
+            width: J(o) ? o : `${o}px`,
+            zIndex: p
+          };
+          Object.assign(e.floating.style, H);
+        }
+      })
+    ],
+    whileElementsMounted: A
+  }), F = _(l), z = G(l, g), D = L(l), { getReferenceProps: P, getFloatingProps: N } = X([F, z, D]), E = (e) => {
+    e && (O(e), v?.(e));
+  };
+  return /* @__PURE__ */ u(T, { children: [
+    /* @__PURE__ */ u(
+      "button",
+      {
+        css: [
+          {
+            height: Number(I),
+            display: "inline-flex",
+            position: "relative",
+            paddingInline: 8,
+            borderRadius: 8,
+            overflow: "hidden",
+            alignItems: "center",
+            gap: 8
+          },
+          {
+            backgroundColor: r.palette.white["1s"],
+            color: r.palette.white["6s"],
+            ...r.text.xs,
+            "&::after": {
+              content: '""',
+              position: "absolute",
+              inset: 0,
+              pointerEvents: "none",
+              borderRadius: 8,
+              borderWidth: 1,
+              borderStyle: "solid",
+              borderColor: "transparent"
+            }
+          },
+          i && {
+            backgroundColor: r.palette.black["7s"],
+            "&::after": {
+              content: '""',
+              position: "absolute",
+              inset: 0,
+              pointerEvents: "none",
+              borderRadius: 8,
+              borderWidth: 1,
+              borderStyle: "solid",
+              borderColor: r.palette.white["1s"]
+            }
+          }
+        ],
+        ...W,
+        ...P({
+          ...a,
+          className: a?.className
+        }),
+        ref: c.setReference,
+        children: [
+          y,
+          /* @__PURE__ */ t("div", { css: { flex: 1, textAlign: "left", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: s ? /* @__PURE__ */ t("span", { children: new Intl.DateTimeFormat(void 0, {
+            dateStyle: "short",
+            timeStyle: "short",
+            hour12: !1
+          }).format(s) }) : /* @__PURE__ */ t("span", { children: x }) }),
+          j ?? /* @__PURE__ */ t(Q, { source: Y, size: 16 })
+        ]
+      }
+    ),
+    i && /* @__PURE__ */ t(q, { root: document.body, children: /* @__PURE__ */ t(
+      "div",
+      {
+        ref: c.setFloating,
+        style: {
+          ...V,
+          zIndex: p
+        },
+        ...N(),
+        children: /* @__PURE__ */ t(
+          "div",
+          {
+            css: {
+              ":focus-visible": {
+                outlineStyle: "none"
+              },
+              borderRadius: 8,
+              ...r.text.xs
+            },
+            children: /* @__PURE__ */ t(K, { showTimeInput: M, selected: s, onChange: E, inline: !0 })
+          }
+        )
+      }
+    ) })
+  ] });
+};
+export {
+  ae as W
+};