@blockbite/ui 1.0.4 → 2.0.0

package/dist/node_modules/@wordpress/block-editor/build-module/components/alignment-control/ui.js

@@ -0,0 +1,67 @@
+import "../../../../i18n/build-module/sprintf.js";
+import "../../../../../tannin/index.js";
+import { __ as n, isRTL as d } from "../../../../i18n/build-module/default-i18n.js";
+import { ToolbarGroup as P, ToolbarDropdownMenu as O } from "@wordpress/components";
+import { j as R } from "../../../../../react/jsx-runtime.js";
+import l from "../../../../icons/build-module/library/align-left.js";
+import L from "../../../../icons/build-module/library/align-center.js";
+import p from "../../../../icons/build-module/library/align-right.js";
+const T = [{
+  icon: l,
+  title: n("Align text left"),
+  align: "left"
+}, {
+  icon: L,
+  title: n("Align text center"),
+  align: "center"
+}, {
+  icon: p,
+  title: n("Align text right"),
+  align: "right"
+}], _ = {
+  placement: "bottom-start"
+};
+function D({
+  value: i,
+  onChange: g,
+  alignmentControls: o = T,
+  label: s = n("Align text"),
+  description: a = n("Change text alignment"),
+  isCollapsed: e = !0,
+  isToolbar: r
+}) {
+  function f(t) {
+    return () => g(i === t ? void 0 : t);
+  }
+  const c = o.find((t) => t.align === i);
+  function u() {
+    return c ? c.icon : d() ? p : l;
+  }
+  const x = r ? P : O, A = r ? {
+    isCollapsed: e
+  } : {
+    toggleProps: {
+      description: a
+    },
+    popoverProps: _
+  };
+  return /* @__PURE__ */ R.jsx(x, {
+    icon: u(),
+    label: s,
+    controls: o.map((t) => {
+      const {
+        align: m
+      } = t;
+      return {
+        ...t,
+        isActive: i === m,
+        role: e ? "menuitemradio" : void 0,
+        onClick: f(m)
+      };
+    }),
+    ...A
+  });
+}
+export {
+  D as default
+};

package/dist/node_modules/@wordpress/block-editor/build-module/components/background-image-control/index.js

@@ -0,0 +1,416 @@
+import { clsx as T } from "../../../../../clsx/dist/clsx.js";
+import { __experimentalVStack as V, Dropdown as $, __experimentalDropdownContentWrapper as W, MenuItem as Y, Button as F, DropZone as Z, FocalPointPicker as q, ToggleControl as v, __experimentalToggleGroupControl as J, __experimentalToggleGroupControlOption as z, __experimentalHStack as O, __experimentalUnitControl as Q, Placeholder as X, Spinner as ee, FlexItem as oe, __experimentalTruncate as ne, VisuallyHidden as ae } from "@wordpress/components";
+import { sprintf as re } from "../../../../i18n/build-module/sprintf.js";
+import "../../../../../tannin/index.js";
+import { __ as c, _x as B } from "../../../../i18n/build-module/default-i18n.js";
+import { store as te } from "../../../../notices/build-module/store/index.js";
+import { useMemo as ce, useState as A, useRef as se, useEffect as ie } from "@wordpress/element";
+import { focus as le } from "../../../../dom/build-module/index.js";
+import { isBlobURL as de } from "../../../../blob/build-module/index.js";
+import { getResolvedValue as ue } from "../global-styles/utils.js";
+import { hasBackgroundImageValue as y } from "../global-styles/background-panel.js";
+import { setImmutably as I } from "../../utils/object.js";
+import ge from "../media-replace-flow/index.js";
+import { store as E } from "../../store/index.js";
+import { globalStylesLinksDataKey as pe, globalStylesDataKey as be } from "../../store/private-keys.js";
+import { j as n } from "../../../../../react/jsx-runtime.js";
+import M from "../../../../data/build-module/components/use-select/index.js";
+import { getFilename as U } from "../../../node_modules/@wordpress/url/build-module/get-filename.js";
+import me from "../../../../data/build-module/components/use-dispatch/use-dispatch.js";
+const P = "image", ke = {
+  placement: "left-start",
+  offset: 36,
+  shift: !0,
+  className: "block-editor-global-styles-background-panel__popover"
+}, R = () => {
+};
+function fe(o) {
+  return o === "cover" || o === void 0 ? c("Image covers the space evenly.") : o === "contain" ? c("Image is contained without distortion.") : c("Image has a fixed width.");
+}
+const xe = (o) => {
+  if (!o || isNaN(o.x) && isNaN(o.y))
+    return;
+  const e = isNaN(o.x) ? 0.5 : o.x, a = isNaN(o.y) ? 0.5 : o.y;
+  return `${e * 100}% ${a * 100}%`;
+}, _e = (o) => {
+  if (!o)
+    return {
+      x: void 0,
+      y: void 0
+    };
+  let [e, a] = o.split(" ").map((l) => parseFloat(l) / 100);
+  return e = isNaN(e) ? void 0 : e, a = isNaN(a) ? e : a, {
+    x: e,
+    y: a
+  };
+};
+function H({
+  as: o = "span",
+  imgUrl: e,
+  toggleProps: a = {},
+  filename: l,
+  label: s,
+  className: g,
+  onToggleCallback: b = R
+}) {
+  const {
+    isOpen: t,
+    ...i
+  } = a;
+  ie(() => {
+    typeof t < "u" && b(t);
+  }, [t, b]);
+  const p = () => /* @__PURE__ */ n.jsxs(O, {
+    justify: "flex-start",
+    as: "span",
+    className: "block-editor-global-styles-background-panel__inspector-preview-inner",
+    children: [e && /* @__PURE__ */ n.jsx("span", {
+      className: "block-editor-global-styles-background-panel__inspector-image-indicator-wrapper",
+      "aria-hidden": !0,
+      children: /* @__PURE__ */ n.jsx("span", {
+        className: "block-editor-global-styles-background-panel__inspector-image-indicator",
+        style: {
+          backgroundImage: `url(${e})`
+        }
+      })
+    }), /* @__PURE__ */ n.jsxs(oe, {
+      as: "span",
+      style: e ? {} : {
+        flexGrow: 1
+      },
+      children: [/* @__PURE__ */ n.jsx(ne, {
+        numberOfLines: 1,
+        className: "block-editor-global-styles-background-panel__inspector-media-replace-title",
+        children: s
+      }), /* @__PURE__ */ n.jsx(ae, {
+        as: "span",
+        children: e ? re(
+          /* translators: %s: file name */
+          c("Background image: %s"),
+          l || s
+        ) : c("No background image selected")
+      })]
+    })]
+  });
+  return o === "button" ? /* @__PURE__ */ n.jsx(F, {
+    __next40pxDefaultSize: !0,
+    className: g,
+    ...i,
+    "aria-expanded": t,
+    children: p()
+  }) : p();
+}
+function Ie({
+  label: o,
+  filename: e,
+  url: a,
+  children: l,
+  onToggle: s = R,
+  hasImageValue: g
+}) {
+  if (!g)
+    return;
+  const b = o || U(a) || c("Add background image");
+  return /* @__PURE__ */ n.jsx($, {
+    popoverProps: ke,
+    renderToggle: ({
+      onToggle: t,
+      isOpen: i
+    }) => {
+      const p = {
+        onClick: t,
+        className: "block-editor-global-styles-background-panel__dropdown-toggle",
+        "aria-expanded": i,
+        "aria-label": c("Background size, position and repeat options."),
+        isOpen: i
+      };
+      return /* @__PURE__ */ n.jsx(H, {
+        imgUrl: a,
+        filename: e,
+        label: b,
+        toggleProps: p,
+        as: "button",
+        onToggleCallback: s
+      });
+    },
+    renderContent: () => /* @__PURE__ */ n.jsx(W, {
+      className: "block-editor-global-styles-background-panel__dropdown-content-wrapper",
+      paddingSize: "medium",
+      children: l
+    })
+  });
+}
+function he() {
+  return /* @__PURE__ */ n.jsx(X, {
+    className: "block-editor-global-styles-background-panel__loading",
+    children: /* @__PURE__ */ n.jsx(ee, {})
+  });
+}
+function D({
+  onChange: o,
+  style: e,
+  inheritedValue: a,
+  onRemoveImage: l = R,
+  onResetImage: s = R,
+  displayInPanel: g,
+  defaultValues: b
+}) {
+  const [t, i] = A(!1), {
+    getSettings: p
+  } = M(E), {
+    id: d,
+    title: f,
+    url: x
+  } = e?.background?.backgroundImage || {
+    ...a?.background?.backgroundImage
+  }, h = se(), {
+    createErrorNotice: S
+  } = me(te), m = (r) => {
+    S(r, {
+      type: "snackbar"
+    }), i(!1);
+  }, _ = () => o(I(e, ["background", "backgroundImage"], void 0)), u = (r) => {
+    if (!r || !r.url) {
+      _(), i(!1);
+      return;
+    }
+    if (de(r.url)) {
+      i(!0);
+      return;
+    }
+    if (r.media_type && r.media_type !== P || !r.media_type && r.type && r.type !== P) {
+      m(c("Only images can be used as a background image."));
+      return;
+    }
+    const N = e?.background?.backgroundSize || b?.backgroundSize, w = e?.background?.backgroundPosition;
+    o(I(e, ["background"], {
+      ...e?.background,
+      backgroundImage: {
+        url: r.url,
+        id: r.id,
+        source: "file",
+        title: r.title || void 0
+      },
+      backgroundPosition: (
+        /*
+         * A background image uploaded and set in the editor receives a default background position of '50% 0',
+         * when the background image size is the equivalent of "Tile".
+         * This is to increase the chance that the image's focus point is visible.
+         * This is in-editor only to assist with the user experience.
+         */
+        !w && (N === "auto" || !N) ? "50% 0" : w
+      ),
+      backgroundSize: N
+    })), i(!1);
+  }, k = (r) => {
+    p().mediaUpload({
+      allowedTypes: [P],
+      filesList: r,
+      onFileChange([N]) {
+        u(N);
+      },
+      onError: m,
+      multiple: !1
+    });
+  }, j = y(e), C = () => {
+    const [r] = le.tabbable.find(h.current);
+    r?.focus(), r?.click();
+  }, L = () => o(I(e, ["background"], {
+    backgroundImage: "none"
+  })), G = !j && y(a), K = f || U(x) || c("Add background image");
+  return /* @__PURE__ */ n.jsxs("div", {
+    ref: h,
+    className: "block-editor-global-styles-background-panel__image-tools-panel-item",
+    children: [t && /* @__PURE__ */ n.jsx(he, {}), /* @__PURE__ */ n.jsx(ge, {
+      mediaId: d,
+      mediaURL: x,
+      allowedTypes: [P],
+      accept: "image/*",
+      onSelect: u,
+      popoverProps: {
+        className: T({
+          "block-editor-global-styles-background-panel__media-replace-popover": g
+        })
+      },
+      name: /* @__PURE__ */ n.jsx(H, {
+        className: "block-editor-global-styles-background-panel__image-preview",
+        imgUrl: x,
+        filename: f,
+        label: K
+      }),
+      renderToggle: (r) => /* @__PURE__ */ n.jsx(F, {
+        ...r,
+        __next40pxDefaultSize: !0
+      }),
+      onError: m,
+      onReset: () => {
+        C(), s();
+      },
+      children: G && /* @__PURE__ */ n.jsx(Y, {
+        onClick: () => {
+          C(), L(), l();
+        },
+        children: c("Remove")
+      })
+    }), /* @__PURE__ */ n.jsx(Z, {
+      onFilesDrop: k,
+      label: c("Drop to upload")
+    })]
+  });
+}
+function je({
+  onChange: o,
+  style: e,
+  inheritedValue: a,
+  defaultValues: l
+}) {
+  const s = e?.background?.backgroundSize || a?.background?.backgroundSize, g = e?.background?.backgroundRepeat || a?.background?.backgroundRepeat, b = e?.background?.backgroundImage?.url || a?.background?.backgroundImage?.url, t = e?.background?.backgroundImage?.id, i = e?.background?.backgroundPosition || a?.background?.backgroundPosition, p = e?.background?.backgroundAttachment || a?.background?.backgroundAttachment;
+  let d = !s && t ? l?.backgroundSize : s || "auto";
+  d = ["cover", "contain", "auto"].includes(d) ? d : "auto";
+  const f = !(g === "no-repeat" || d === "cover" && g === void 0), x = (u) => {
+    let k = g, j = i;
+    u === "contain" && (k = "no-repeat", j = void 0), u === "cover" && (k = void 0, j = void 0), (d === "cover" || d === "contain") && u === "auto" && (k = void 0, e?.background?.backgroundImage?.id && (j = "50% 0")), !u && d === "auto" && (u = "auto"), o(I(e, ["background"], {
+      ...e?.background,
+      backgroundPosition: j,
+      backgroundRepeat: k,
+      backgroundSize: u
+    }));
+  }, h = (u) => {
+    o(I(e, ["background", "backgroundPosition"], xe(u)));
+  }, S = () => o(I(e, ["background", "backgroundRepeat"], f === !0 ? "no-repeat" : "repeat")), m = () => o(I(e, ["background", "backgroundAttachment"], p === "fixed" ? "scroll" : "fixed")), _ = !i && t && s === "contain" ? l?.backgroundPosition : i;
+  return /* @__PURE__ */ n.jsxs(V, {
+    spacing: 3,
+    className: "single-column",
+    children: [/* @__PURE__ */ n.jsx(q, {
+      __nextHasNoMarginBottom: !0,
+      label: c("Focal point"),
+      url: b,
+      value: _e(_),
+      onChange: h
+    }), /* @__PURE__ */ n.jsx(v, {
+      __nextHasNoMarginBottom: !0,
+      label: c("Fixed background"),
+      checked: p === "fixed",
+      onChange: m
+    }), /* @__PURE__ */ n.jsxs(J, {
+      __nextHasNoMarginBottom: !0,
+      size: "__unstable-large",
+      label: c("Size"),
+      value: d,
+      onChange: x,
+      isBlock: !0,
+      help: fe(s || l?.backgroundSize),
+      children: [/* @__PURE__ */ n.jsx(z, {
+        value: "cover",
+        label: B("Cover", "Size option for background image control")
+      }, "cover"), /* @__PURE__ */ n.jsx(z, {
+        value: "contain",
+        label: B("Contain", "Size option for background image control")
+      }, "contain"), /* @__PURE__ */ n.jsx(z, {
+        value: "auto",
+        label: B("Tile", "Size option for background image control")
+      }, "tile")]
+    }), /* @__PURE__ */ n.jsxs(O, {
+      justify: "flex-start",
+      spacing: 2,
+      as: "span",
+      children: [/* @__PURE__ */ n.jsx(Q, {
+        "aria-label": c("Background image width"),
+        onChange: x,
+        value: s,
+        size: "__unstable-large",
+        __unstableInputWidth: "100px",
+        min: 0,
+        placeholder: c("Auto"),
+        disabled: d !== "auto" || d === void 0
+      }), /* @__PURE__ */ n.jsx(v, {
+        __nextHasNoMarginBottom: !0,
+        label: c("Repeat"),
+        checked: f,
+        onChange: S,
+        disabled: d === "cover"
+      })]
+    })]
+  });
+}
+function He({
+  value: o,
+  onChange: e,
+  inheritedValue: a = o,
+  settings: l,
+  defaultValues: s = {}
+}) {
+  const {
+    globalStyles: g,
+    _links: b
+  } = M((_) => {
+    const {
+      getSettings: u
+    } = _(E), k = u();
+    return {
+      globalStyles: k[be],
+      _links: k[pe]
+    };
+  }, []), t = ce(() => {
+    const _ = {
+      background: {}
+    };
+    return a?.background ? (Object.entries(a?.background).forEach(([u, k]) => {
+      _.background[u] = ue(k, {
+        styles: g,
+        _links: b
+      });
+    }), _) : a;
+  }, [g, b, a]), i = () => e(I(o, ["background"], {})), {
+    title: p,
+    url: d
+  } = o?.background?.backgroundImage || {
+    ...t?.background?.backgroundImage
+  }, f = y(o) || y(t), x = o?.background?.backgroundImage || a?.background?.backgroundImage, h = f && x !== "none" && (l?.background?.backgroundSize || l?.background?.backgroundPosition || l?.background?.backgroundRepeat), [S, m] = A(!1);
+  return /* @__PURE__ */ n.jsx("div", {
+    className: T("block-editor-global-styles-background-panel__inspector-media-replace-container", {
+      "is-open": S
+    }),
+    children: h ? /* @__PURE__ */ n.jsx(Ie, {
+      label: p,
+      filename: p,
+      url: d,
+      onToggle: m,
+      hasImageValue: f,
+      children: /* @__PURE__ */ n.jsxs(V, {
+        spacing: 3,
+        className: "single-column",
+        children: [/* @__PURE__ */ n.jsx(D, {
+          onChange: e,
+          style: o,
+          inheritedValue: t,
+          displayInPanel: !0,
+          onResetImage: () => {
+            m(!1), i();
+          },
+          onRemoveImage: () => m(!1),
+          defaultValues: s
+        }), /* @__PURE__ */ n.jsx(je, {
+          onChange: e,
+          style: o,
+          defaultValues: s,
+          inheritedValue: t
+        })]
+      })
+    }) : /* @__PURE__ */ n.jsx(D, {
+      onChange: e,
+      style: o,
+      inheritedValue: t,
+      defaultValues: s,
+      onResetImage: () => {
+        m(!1), i();
+      },
+      onRemoveImage: () => m(!1)
+    })
+  });
+}
+export {
+  _e as backgroundPositionToCoords,
+  xe as coordsToBackgroundPosition,
+  He as default
+};

package/dist/node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/constants.js

@@ -0,0 +1,39 @@
+import "../../../../i18n/build-module/sprintf.js";
+import "../../../../../tannin/index.js";
+import { __ as t, _x as i } from "../../../../i18n/build-module/default-i18n.js";
+import o from "../../../../icons/build-module/library/stretch-full-width.js";
+import n from "../../../../icons/build-module/library/stretch-wide.js";
+import e from "../../../../icons/build-module/library/position-right.js";
+import r from "../../../../icons/build-module/library/position-center.js";
+import l from "../../../../icons/build-module/library/position-left.js";
+import m from "../../../../icons/build-module/library/align-none.js";
+const N = {
+  none: {
+    icon: m,
+    title: i("None", "Alignment option")
+  },
+  left: {
+    icon: l,
+    title: t("Align left")
+  },
+  center: {
+    icon: r,
+    title: t("Align center")
+  },
+  right: {
+    icon: e,
+    title: t("Align right")
+  },
+  wide: {
+    icon: n,
+    title: t("Wide width")
+  },
+  full: {
+    icon: o,
+    title: t("Full width")
+  }
+}, _ = "none";
+export {
+  N as BLOCK_ALIGNMENTS_CONTROLS,
+  _ as DEFAULT_CONTROL
+};

package/dist/node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/index.js

@@ -0,0 +1,9 @@
+import r from "./ui.js";
+import { j as t } from "../../../../../react/jsx-runtime.js";
+const m = (o) => /* @__PURE__ */ t.jsx(r, {
+  ...o,
+  isToolbar: !1
+});
+export {
+  m as BlockAlignmentControl
+};

package/dist/node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/ui.js

@@ -0,0 +1,77 @@
+import { clsx as b } from "../../../../../clsx/dist/clsx.js";
+import "../../../../i18n/build-module/sprintf.js";
+import "../../../../../tannin/index.js";
+import { __ as p } from "../../../../i18n/build-module/default-i18n.js";
+import { ToolbarGroup as j, ToolbarDropdownMenu as k, MenuGroup as E, MenuItem as L } from "@wordpress/components";
+import O from "./use-available-alignments.js";
+import { BLOCK_ALIGNMENTS_CONTROLS as i, DEFAULT_CONTROL as T } from "./constants.js";
+import { j as t } from "../../../../../react/jsx-runtime.js";
+function D({
+  value: o,
+  onChange: u,
+  controls: a,
+  isToolbar: s,
+  isCollapsed: m = !0
+}) {
+  const r = O(a);
+  if (!!!r.length)
+    return null;
+  function c(n) {
+    u([o, "none"].includes(n) ? void 0 : n);
+  }
+  const l = i[o], f = i[T], g = s ? j : k, C = {
+    icon: l ? l.icon : f.icon,
+    label: p("Align")
+  }, A = s ? {
+    isCollapsed: m,
+    controls: r.map(({
+      name: n
+    }) => ({
+      ...i[n],
+      isActive: o === n || !o && n === "none",
+      role: m ? "menuitemradio" : void 0,
+      onClick: () => c(n)
+    }))
+  } : {
+    toggleProps: {
+      description: p("Change alignment")
+    },
+    children: ({
+      onClose: n
+    }) => /* @__PURE__ */ t.jsx(t.Fragment, {
+      children: /* @__PURE__ */ t.jsx(E, {
+        className: "block-editor-block-alignment-control__menu-group",
+        children: r.map(({
+          name: e,
+          info: h
+        }) => {
+          const {
+            icon: x,
+            title: _
+          } = i[e], d = e === o || !o && e === "none";
+          return /* @__PURE__ */ t.jsx(L, {
+            icon: x,
+            iconPosition: "left",
+            className: b("components-dropdown-menu__menu-item", {
+              "is-active": d
+            }),
+            isSelected: d,
+            onClick: () => {
+              c(e), n();
+            },
+            role: "menuitemradio",
+            info: h,
+            children: _
+          }, e);
+        })
+      })
+    })
+  };
+  return /* @__PURE__ */ t.jsx(g, {
+    ...C,
+    ...A
+  });
+}
+export {
+  D as default
+};

package/dist/node_modules/@wordpress/block-editor/build-module/components/block-alignment-control/use-available-alignments.js

@@ -0,0 +1,31 @@
+import { useLayout as d } from "../block-list/layout.js";
+import { store as c } from "../../store/index.js";
+import { getLayoutType as p } from "../../layouts/index.js";
+import y from "../../../../data/build-module/components/use-select/index.js";
+const l = [], o = ["none", "left", "center", "right", "wide", "full"], A = ["wide", "full"];
+function O(n = o) {
+  n.includes("none") || (n = ["none", ...n]);
+  const a = n.length === 1 && n[0] === "none", [f, m, g] = y((e) => {
+    var t;
+    if (a)
+      return [!1, !1, !1];
+    const i = e(c).getSettings();
+    return [(t = i.alignWide) !== null && t !== void 0 ? t : !1, i.supportsLayout, i.__unstableIsBlockBasedTheme];
+  }, [a]), s = d();
+  if (a)
+    return l;
+  const u = p(s?.type);
+  if (m) {
+    const t = u.getAlignments(s, g).filter((i) => n.includes(i.name));
+    return t.length === 1 && t[0].name === "none" ? l : t;
+  }
+  if (u.name !== "default" && u.name !== "constrained")
+    return l;
+  const r = n.filter((e) => s.alignments ? s.alignments.includes(e) : !f && A.includes(e) ? !1 : o.includes(e)).map((e) => ({
+    name: e
+  }));
+  return r.length === 1 && r[0].name === "none" ? l : r;
+}
+export {
+  O as default
+};