@janbox/storefront-builder 2.0.2 → 2.0.4

package/dist/editor/toolbars/anchor-target/anchor-target.d.ts

@@ -1,7 +0,0 @@
-import { HTMLAttributeAnchorTarget } from 'react';
-export type AnchorTargetToolbarProps = {
-    value?: HTMLAttributeAnchorTarget;
-    onChange?: (value: HTMLAttributeAnchorTarget) => void;
-    name?: string;
-};
-export declare const AnchorTargetToolbar: ({ value, onChange, name }: AnchorTargetToolbarProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/editor/toolbars/anchor-target/index.d.ts

@@ -1 +0,0 @@
-export * from './anchor-target';

package/dist/editor/toolbars/font-weight/dataset.d.ts

@@ -1,5 +0,0 @@
-import { StyledCSS } from '@janbox/storefront-ui/types';
-export declare const fontWeightOptions: {
-    label: string;
-    value: StyledCSS['fontWeight'] | 'auto';
-}[];

package/dist/editor/toolbars/font-weight/font-weight.d.ts

@@ -1,9 +0,0 @@
-import { StyledCSS } from '@janbox/storefront-ui/types';
-export type FontWeightToolbarValue = Pick<StyledCSS, 'fontWeight'>;
-export interface FontWeightToolbarProps {
-    responsive?: boolean;
-    name?: string;
-    value?: FontWeightToolbarValue;
-    onChange?: (value: FontWeightToolbarValue) => void;
-}
-export declare const FontWeightToolbar: ({ value, responsive, name, onChange }: FontWeightToolbarProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/editor/toolbars/font-weight/index.d.ts

@@ -1 +0,0 @@
-export * from './font-weight';

package/dist/editor/toolbars/text-align/text-align.d.ts

@@ -1,8 +0,0 @@
-import { StyledCSS } from '@janbox/storefront-ui/types';
-interface TextAlignToolbarProps {
-    value?: StyledCSS['textAlign'];
-    onChange?: (value: StyledCSS['textAlign']) => void;
-    label?: string;
-}
-export declare const TextAlignToolbar: ({ value, onChange, label }: TextAlignToolbarProps) => import("@emotion/react/jsx-runtime").JSX.Element;
-export {};

package/dist/editor/toolbars/width/index.d.ts

@@ -1 +0,0 @@
-export * from './width';

package/dist/editor/toolbars.js

@@ -1,346 +0,0 @@
-import { T as f, C as I, a as A, b as F, c as P, d as B, F as O, e as V } from "../anchor-target-CtXzdkBu.js";
-import { A as ze, f as ke, B as Ie, g as Ae, h as Fe, i as Pe, j as Be, k as Oe, D as Ve, l as Ge, m as Me, G as De, H as Re, J as Ue, n as He, M as je, N as qe, o as Je, O as Ee, p as Le, P as $e, R as Ke, S as Qe, q as Xe, r as Ye, s as Ze, W as _e, t as eo } from "../anchor-target-CtXzdkBu.js";
-import { jsxs as p, jsx as e } from "@emotion/react/jsx-runtime";
-import { isNumber as C, isNil as m, isString as S, isEqual as G } from "lodash-es";
-import { useRef as M, useState as D } from "react";
-import "@janbox/storefront-ui/hooks";
-import "@janbox/storefront-ui/theme";
-import "@janbox/storefront-ui/utils";
-import { A as R, v as w, k as g, W as b, P as N, M as W, q as U, s as H, t as T, r as j, C as q } from "../dialog-header-Bh3Dkw2q.js";
-import "@emotion/react";
-import { c as z, f as J, e as E } from "../dropzone-CF4CWXth.js";
-import "@floating-ui/react";
-import "react-use";
-import "react-colorful";
-import "overlayscrollbars-react";
-import "@tanstack/react-virtual";
-import "react-dropzone";
-import "react-datepicker/dist/react-datepicker.css";
-import "react-datepicker";
-import "../color-picker-popover-XeaVfYS8.js";
-import "@tiptap/extension-text-style";
-import "@tiptap/react";
-import "@tiptap/react/menus";
-import "@tiptap/starter-kit";
-import "react-frame-component";
-import "@craftjs/core";
-import "flat";
-var u = /* @__PURE__ */ ((o) => (o[o.Pixels = 0] = "Pixels", o[o.Unitless = 1] = "Unitless", o))(u || {});
-const L = [
-  {
-    label: "Pixels",
-    value: 0
-    /* Pixels */
-  },
-  {
-    label: "Unitless",
-    value: 1
-    /* Unitless */
-  }
-], Te = ({ name: o, responsive: d = !0, value: t, onChange: c }) => {
-  const r = C(t?.lineHeight) ? u.Unitless : u.Pixels, l = r === u.Unitless ? 0.1 : 1, n = R(t?.lineHeight, "float"), a = ({ unit: s, value: h }) => {
-    if (m(h)) {
-      c?.({
-        lineHeight: s === u.Unitless ? 1 : h
-      });
-      return;
-    }
-    c?.({
-      lineHeight: s === u.Unitless ? Number(h.toFixed(1)) : `${h}px`
-    });
-  }, i = (s) => {
-    a({ unit: Number(s.target.value) });
-  }, x = (s) => {
-    const h = isNaN(s.target.valueAsNumber) ? void 0 : s.target.valueAsNumber;
-    a({ unit: r, value: h });
-  }, v = (s) => {
-    s.stopPropagation(), !m(n) && a({ unit: r, value: Math.max(n + l, 0) });
-  }, k = (s) => {
-    s.stopPropagation(), !m(n) && a({ unit: r, value: Math.max(n - l, 0) });
-  };
-  return /* @__PURE__ */ p("div", { css: { display: "flex", flexDirection: "column", gap: 8 }, children: [
-    /* @__PURE__ */ e(f, { responsive: d, name: o ?? "Line height", children: /* @__PURE__ */ e("div", { css: { display: "flex", alignItems: "center", gap: 4 }, children: L.map((s) => /* @__PURE__ */ e(
-      w,
-      {
-        onChange: i,
-        checked: s.value === r,
-        value: s.value,
-        name: "toolbar-line-height",
-        children: s.label
-      },
-      s.value
-    )) }) }),
-    /* @__PURE__ */ e("div", { css: { display: "flex", justifyContent: "flex-end" }, children: /* @__PURE__ */ e("div", { css: { width: "50%" }, children: /* @__PURE__ */ e(
-      z,
-      {
-        fractionDigits: 1,
-        type: r === u.Unitless ? "decimal" : "integer",
-        value: n ?? "",
-        onChange: x,
-        prefix: /* @__PURE__ */ e(g, { disabled: C(n) && n <= 0, onClick: k, children: /* @__PURE__ */ e(b, { source: W }) }),
-        suffix: /* @__PURE__ */ e(g, { onClick: v, children: /* @__PURE__ */ e(b, { source: N }) }),
-        mode: "onBlur",
-        css: { textAlign: "center" },
-        placeholder: "normal"
-      }
-    ) }) })
-  ] });
-}, ve = ({ name: o, responsive: d = !0, value: t, onChange: c }) => {
-  const r = (a) => {
-    const i = isNaN(a.target.valueAsNumber) ? void 0 : a.target.valueAsNumber;
-    c?.({
-      ...t,
-      fontSize: i
-    });
-  }, l = (a) => {
-    a.stopPropagation();
-    const i = S(t?.fontSize) ? void 0 : t?.fontSize;
-    c?.({
-      ...t,
-      fontSize: m(i) ? 16 : i + 1
-    });
-  }, n = (a) => {
-    a.stopPropagation();
-    const i = S(t?.fontSize) ? void 0 : t?.fontSize;
-    c?.({
-      ...t,
-      fontSize: m(i) ? 16 : Math.max(i - 1, 0)
-    });
-  };
-  return /* @__PURE__ */ e(f, { responsive: d, name: o ?? "Font size", children: /* @__PURE__ */ e("div", { css: { width: "50%" }, children: /* @__PURE__ */ e(
-    z,
-    {
-      onCanPlay: r,
-      mode: "onBlur",
-      css: { textAlign: "center" },
-      placeholder: "inherit",
-      value: t?.fontSize ?? "",
-      prefix: /* @__PURE__ */ e(g, { disabled: C(t?.fontSize) && t.fontSize <= 0, onClick: n, children: /* @__PURE__ */ e(b, { source: W }) }),
-      suffix: /* @__PURE__ */ e(g, { onClick: l, children: /* @__PURE__ */ e(b, { source: N }) })
-    }
-  ) }) });
-}, y = [
-  {
-    label: "Block",
-    value: "block"
-  },
-  {
-    label: "Inline",
-    value: "inline"
-  },
-  {
-    label: "Inline Block",
-    value: "inline-block"
-  },
-  {
-    label: "Flex",
-    value: "flex"
-  },
-  {
-    label: "Inline Flex",
-    value: "flex"
-  },
-  {
-    label: "Grid",
-    value: "grid"
-  },
-  {
-    label: "Inline Grid",
-    value: "inline-grid"
-  }
-], Ce = ({
-  name: o,
-  responsive: d = !1,
-  availableDisplays: t,
-  onChange: c,
-  value: r
-}) => {
-  const l = m(t) ? y : y.filter((a) => t.includes(a.value)), n = (a) => {
-    c?.({ display: a });
-  };
-  return /* @__PURE__ */ e(f, { name: o ?? "Display", responsive: d, children: /* @__PURE__ */ e(
-    J,
-    {
-      css: {
-        width: "50%"
-      },
-      placement: "bottom-end",
-      placeholder: "default",
-      options: l,
-      value: r?.display ?? null,
-      onChange: n
-    }
-  ) });
-}, Se = ({ value: o, onChange: d, name: t, responsive: c = !1 }) => {
-  const r = {
-    flexBasis: o?.flexBasis ?? "auto",
-    flexGrow: o?.flexGrow ?? 0,
-    flexShrink: o?.flexShrink ?? 1
-  }, l = [
-    {
-      label: "Auto fit",
-      value: 0,
-      rawValue: {
-        flexBasis: "auto",
-        flexGrow: 0,
-        flexShrink: 1
-      }
-    },
-    {
-      label: "Auto fill",
-      value: 1,
-      rawValue: {
-        flexBasis: "0%",
-        flexGrow: 1,
-        flexShrink: 1
-      }
-    }
-  ], n = l.find((i) => G(i.rawValue, r))?.value, a = (i) => {
-    const x = l.find((v) => v.value === Number(i.target.value));
-    x && d?.(x.rawValue);
-  };
-  return /* @__PURE__ */ e(f, { name: t ?? "Content", responsive: c, children: /* @__PURE__ */ e("div", { css: { display: "inline-flex", alignItems: "center", gap: 8 }, children: l.map((i) => /* @__PURE__ */ e(
-    w,
-    {
-      checked: i.value === n,
-      value: i.value,
-      onChange: a,
-      children: i.label
-    },
-    i.value
-  )) }) });
-}, ye = ({ name: o, value: d, onChange: t, responsive: c = !0 }) => {
-  const r = M(null), l = (n) => {
-    t?.({
-      minWidth: n
-    });
-  };
-  return /* @__PURE__ */ e(f, { name: o ?? "Min width", responsive: c, children: /* @__PURE__ */ e("div", { css: { position: "relative", width: "50%" }, children: /* @__PURE__ */ e(
-    I,
-    {
-      fullWidth: !0,
-      wrapRef: r,
-      placeholder: "0",
-      value: d?.minWidth,
-      onChange: l,
-      defaultValue: {
-        "%": 100
-      }
-    }
-  ) }) });
-}, we = ({ value: o, onChange: d }) => {
-  const [t, c] = D(!1), r = (n) => {
-    d?.({ ...o, sizeVariant: n });
-  }, l = (n) => {
-    d?.({
-      ...o,
-      css: {
-        ...o?.css,
-        ...n
-      }
-    });
-  };
-  return /* @__PURE__ */ e(f, { name: "Text style", children: /* @__PURE__ */ p(U, { open: t, onOpenChange: c, placement: "right", children: [
-    /* @__PURE__ */ e(H, { children: /* @__PURE__ */ p(
-      "button",
-      {
-        css: [
-          {
-            display: "flex",
-            paddingInline: 8,
-            alignItems: "center",
-            gap: 8,
-            borderRadius: 6,
-            textAlign: "left",
-            width: "50%",
-            height: 32,
-            backgroundColor: T.palette.white["1s"],
-            overflow: "hidden",
-            textOverflow: "ellipsis",
-            whiteSpace: "nowrap",
-            ...T.text.xs
-          },
-          t && { backgroundColor: T.palette.black["7s"] }
-        ],
-        children: [
-          /* @__PURE__ */ e(b, { css: { color: "white" }, source: A }),
-          /* @__PURE__ */ e("span", { children: "Auto" })
-        ]
-      }
-    ) }),
-    /* @__PURE__ */ e(j, { children: /* @__PURE__ */ p("div", { style: { width: 280 }, children: [
-      /* @__PURE__ */ p("div", { css: { display: "flex", justifyContent: "space-between", alignItems: "center", gap: 8 }, children: [
-        /* @__PURE__ */ e("div", { css: { fontWeight: 500 }, children: "Text style" }),
-        /* @__PURE__ */ e(E, { children: /* @__PURE__ */ e(g, { children: /* @__PURE__ */ e(b, { source: q }) }) })
-      ] }),
-      /* @__PURE__ */ e("hr", { css: { marginBlock: 8, borderColor: T.palette.white["1s"] } }),
-      /* @__PURE__ */ p("div", { css: { display: "flex", flexDirection: "column", gap: 12 }, children: [
-        /* @__PURE__ */ e(F, { value: o?.sizeVariant, onChange: r }),
-        /* @__PURE__ */ e(P, { value: { color: o?.css?.color }, onChange: l }),
-        /* @__PURE__ */ e(
-          B,
-          {
-            name: "Style",
-            value: {
-              fontWeight: o?.css?.fontWeight,
-              fontStyle: o?.css?.fontStyle,
-              textDecorationLine: o?.css?.textDecorationLine
-            },
-            onChange: l
-          }
-        ),
-        /* @__PURE__ */ e(O, { value: { fontWeight: o?.css?.fontWeight }, onChange: l }),
-        /* @__PURE__ */ e(
-          V,
-          {
-            value: {
-              textTransform: o?.css?.textTransform
-            },
-            onChange: l
-          }
-        )
-      ] })
-    ] }) })
-  ] }) });
-};
-export {
-  ze as AnchorTargetToolbar,
-  ke as AspectRatioToolbar,
-  Ie as BackgroundToolbar,
-  Ae as BorderRadiusToolbar,
-  Fe as BorderToolbar,
-  Pe as ChildNodesToolbar,
-  P as ColorToolbar,
-  Be as ColorVariantToolbar,
-  Oe as ColumnGapToolbar,
-  Ve as DisplayOnToolbar,
-  Ce as DisplayToolbar,
-  Ge as FlexAlignItemsToolbar,
-  Se as FlexToolbar,
-  Me as FlexWrapToolbar,
-  ve as FontSizeToolbar,
-  O as FontWeightToolbar,
-  De as GridAlignItemsToolbar,
-  Re as HeightToolbar,
-  Ue as JustifyContentToolbar,
-  He as JustifyItemsToolbar,
-  Te as LineHeightToolbar,
-  je as MarginToolbar,
-  ye as MinWidthToolbar,
-  qe as NumberField,
-  Je as NumberFieldMixOptions,
-  Ee as ObjectFitToolbar,
-  Le as OrderToolbar,
-  $e as PaddingToolbar,
-  Ke as RowGapToolbar,
-  Qe as SpacingToolbar,
-  Xe as SvgSourceToolbar,
-  Ye as TagNameToolbar,
-  Ze as TextAlignToolbar,
-  F as TextSizeVariantToolbar,
-  we as TextStyleGroupToolbar,
-  B as TextStyleToolbar,
-  V as TextTransformToolbar,
-  _e as WidthToolbar,
-  eo as textSizeVariantOptions
-};

package/dist/editor/ui.js

@@ -1,120 +0,0 @@
-import { a as i, b as l, t, u as n } from "../dialog-header-Bh3Dkw2q.js";
-import { c as D, d as T, e as F, f as I, g as P, h as w, i as y, j as B, W as L, k as S, l as j, m as M, n as N, o as z, p as E, q as O, r as V, s as G, v as H, w as R, x as _, y as q } from "../dialog-header-Bh3Dkw2q.js";
-import { W as b } from "../dropzone-CF4CWXth.js";
-import { a as X, b as Z, c as J, d as K, e as Q, f as U, g as Y, h as $, i as oo, j as eo, k as ao, l as so } from "../dropzone-CF4CWXth.js";
-import { W as ro } from "../tooltip-CXOlTkGg.js";
-import { jsx as e, jsxs as r } from "@emotion/react/jsx-runtime";
-import { FLOATING_Z_INDEX as W } from "@janbox/storefront-ui/theme";
-import { isValidElement as d } from "react";
-import { W as lo } from "../date-picker-D9K6HWl-.js";
-const x = ({ width: a = 600, children: o, ...s }) => /* @__PURE__ */ e(
-  i,
-  {
-    dismissProps: {
-      enabled: !0
-    },
-    ...s,
-    children: /* @__PURE__ */ r(
-      l,
-      {
-        floatingOverlayProps: {
-          disabled: !1,
-          className: "grid place-items-center p-4 sm:p-5 md:p-6",
-          lockScroll: !0,
-          style: {
-            zIndex: W
-          }
-        },
-        css: { display: "flex", overflow: "hidden", flexDirection: "column", maxWidth: "100%", maxHeight: "100%" },
-        children: [
-          /* @__PURE__ */ e(
-            "div",
-            {
-              css: {
-                backdropFilter: "blur(2px)",
-                position: "fixed",
-                inset: 0,
-                pointerEvents: "none",
-                backgroundColor: "rgba(0, 0, 0, 0.4)"
-              }
-            }
-          ),
-          /* @__PURE__ */ e(
-            "div",
-            {
-              css: {
-                width: a,
-                display: "flex",
-                position: "relative",
-                paddingBlock: 8,
-                flexDirection: "column",
-                overflow: "hidden",
-                borderRadius: 8,
-                backgroundColor: t.palette.ink["6s"],
-                maxWidth: "100%",
-                color: "white"
-              },
-              children: o
-            }
-          )
-        ]
-      }
-    )
-  }
-), f = () => n(), v = ({ ref: a, ...o }) => /* @__PURE__ */ e(
-  b,
-  {
-    css: { paddingBlock: 12, paddingInline: 20, flex: 1, overflow: "auto", ...t.text.xs },
-    ...o,
-    ref: a
-  }
-), h = ({ required: a, children: o, ...s }) => /* @__PURE__ */ r("div", { css: { marginBottom: 6, display: "flex", width: "fit-content" }, ...s, children: [
-  d(o) ? o : /* @__PURE__ */ e("label", { children: o }),
-  a && /* @__PURE__ */ e("span", { css: { color: t.palette.red["6s"] }, children: " *" })
-] });
-export {
-  D as WbButton,
-  X as WbButtonGroup,
-  T as WbCollapse,
-  F as WbColorPicker,
-  lo as WbDatePicker,
-  x as WbDialog,
-  v as WbDialogBody,
-  I as WbDialogClose,
-  P as WbDialogFooter,
-  w as WbDialogHeader,
-  Z as WbDropzone,
-  i as WbFloating,
-  y as WbFloatingClose,
-  l as WbFloatingContent,
-  B as WbFloatingContext,
-  h as WbFormLabel,
-  L as WbIcon,
-  S as WbIconButton,
-  j as WbInput,
-  J as WbInputNumber,
-  M as WbLoadingOverlay,
-  K as WbMenu,
-  N as WbMenuItem,
-  z as WbMenuList,
-  E as WbMenuTrigger,
-  O as WbPopover,
-  Q as WbPopoverClose,
-  V as WbPopoverContent,
-  G as WbPopoverTrigger,
-  H as WbRadioButton,
-  b as WbScrollView,
-  U as WbSelect,
-  R as WbSvgLoader,
-  _ as WbSwitch,
-  Y as WbTab,
-  $ as WbTabContent,
-  oo as WbTabList,
-  eo as WbTabPanel,
-  ao as WbTabs,
-  q as WbTextarea,
-  ro as WbTooltip,
-  so as WbVirtualizedList,
-  f as useDialogContext,
-  n as useWbFloatingContext
-};

package/dist/index-800HnUOi.js

@@ -1,4 +0,0 @@
-import { W as p } from "./tooltip-CXOlTkGg.js";
-export {
-  p as WbTooltip
-};