@blockbite/ui 2.0.1 → 2.0.4

package/dist/AutocompleteDropdown.js

@@ -1,43 +1,43 @@
-import { j as e } from "./node_modules/react/jsx-runtime.js";
-import v from "./node_modules/@blockbite/icons/dist/ChevronDown.js";
-import { ButtonToggle as f } from "./ButtonToggle.js";
-import { Wrap as p } from "./Wrap.js";
-import { Dropdown as j, TextControl as h, Button as w } from "@wordpress/components";
-import { useState as c, useEffect as x } from "@wordpress/element";
-import a from "classnames";
+import { j as e } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import v from "./packages/icons/jsx/ChevronDown.js";
+import { Dropdown as f, TextControl as j, Button as h } from "@wordpress/components";
+import { useState as p, useEffect as c } from "@wordpress/element";
+import n from "classnames";
+import { ButtonToggle as w } from "./ButtonToggle.js";
+import { Wrap as x } from "./Wrap.js";
 function T({
   defaultValue: t,
   options: s,
   swatch: l,
   onPressedChange: u
 }) {
-  const [o, i] = c(""), [d, m] = c([]);
-  return x(() => {
+  const [o, i] = p(""), [d, m] = p([]);
+  return c(() => {
     m(
       s.filter(
         (r) => r.label.toLowerCase().includes(o.toLowerCase())
       )
     );
-  }, [o, s]), x(() => {
+  }, [o, s]), c(() => {
     i(""), m(s);
   }, [t, s]), /* @__PURE__ */ e.jsx(
-    j,
+    f,
     {
       className: "option-panel-dropdown",
       contentClassName: "option-panel-dropdown-content",
       popoverProps: { placement: "bottom-start" },
-      renderToggle: ({ isOpen: r, onToggle: n }) => /* @__PURE__ */ e.jsx(p, { important: !0, children: /* @__PURE__ */ e.jsx(
-        w,
+      renderToggle: ({ isOpen: r, onToggle: a }) => /* @__PURE__ */ e.jsx(x, { important: !0, children: /* @__PURE__ */ e.jsx(
+        h,
         {
           variant: "secondary",
           size: "small",
-          onClick: n,
+          onClick: a,
           "aria-expanded": r,
           children: /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1 !bg-transparent !p-0 !text-[11px] !text-current", children: [
             l && /* @__PURE__ */ e.jsx(
               "div",
               {
-                className: a(
+                className: n(
                   `h-3 w-3 rounded-full bg-${t}`
                 )
               }
@@ -47,9 +47,9 @@ function T({
           ] })
         }
       ) }),
-      renderContent: () => /* @__PURE__ */ e.jsx(p, { important: !0, children: /* @__PURE__ */ e.jsxs("div", { className: "w-52", children: [
+      renderContent: () => /* @__PURE__ */ e.jsx(x, { important: !0, children: /* @__PURE__ */ e.jsxs("div", { className: "w-52", children: [
         /* @__PURE__ */ e.jsx(
-          h,
+          j,
           {
             label: "Search options",
             value: o,
@@ -59,10 +59,10 @@ function T({
         ),
         /* @__PURE__ */ e.jsxs("div", { className: "grid grid-cols-2 gap-1 !bg-transparent !p-0 !pt-2", children: [
           d.length === 0 && /* @__PURE__ */ e.jsx("div", { className: "!text-gray-medium col-span-2 pb-2 text-center !text-[11px]", children: "No options found." }),
-          d.map((r, n) => /* @__PURE__ */ e.jsxs(
-            f,
+          d.map((r, a) => /* @__PURE__ */ e.jsxs(
+            w,
             {
-              className: a({
+              className: n({
                 "bg-primary": r.value
               }),
               size: "small",
@@ -75,7 +75,7 @@ function T({
                 l && /* @__PURE__ */ e.jsx(
                   "div",
                   {
-                    className: a(
+                    className: n(
                       `mr-3 h-3 w-3 rounded-full bg-${r.value}`
                     )
                   }
@@ -83,7 +83,7 @@ function T({
                 r.label
               ]
             },
-            `ButtonToggle__${r.value}___${n}`
+            `ButtonToggle__${r.value}___${a}`
           ))
         ] })
       ] }) })

package/dist/Badge.js

@@ -1,4 +1,4 @@
-import { j as m } from "./node_modules/react/jsx-runtime.js";
+import { j as m } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import r from "classnames";
 const i = ({ children: e, className: t, onClick: s }) => /* @__PURE__ */ m.jsx(
   "div",

package/dist/BitePreview.js

@@ -1,4 +1,4 @@
-import { j as r } from "./node_modules/react/jsx-runtime.js";
+import { j as r } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import { useRef as h, useState as y, useEffect as E, createPortal as w } from "@wordpress/element";
 const j = ({ htmlContent: i, cssContent: s, frontendAssets: a }) => {
   const l = h(null), [o, p] = y(null);

package/dist/Button.d.ts

@@ -2,11 +2,11 @@ type ButtonProps = {
     children?: React.ReactNode;
     asChild?: boolean;
     className?: string;
-    display?: "icon" | "icon-lg" | "label" | "auto" | "" | null;
+    display?: 'icon' | 'icon-lg' | 'label' | 'auto' | '' | null;
     onClick?: () => void;
     label?: string;
-    size?: "small" | "default" | "compact";
-    variant?: "primary" | "secondary" | "link" | "primary" | "tertiary";
+    size?: 'small' | 'default' | 'compact';
+    variant?: 'primary' | 'secondary' | 'link' | 'primary' | 'tertiary';
     icon?: any;
     disabled?: boolean;
 };

package/dist/Button.js

@@ -1,7 +1,7 @@
-import { j as r } from "./node_modules/react/jsx-runtime.js";
-import { Icon as a } from "./Icon.js";
-import { Button as f } from "@wordpress/components";
+import { j as r } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { Button as a } from "@wordpress/components";
 import c from "classnames";
+import { Icon as f } from "./Icon.js";
 const h = ({
   children: i,
   size: m = "default",
@@ -15,7 +15,7 @@ const h = ({
 }) => {
   const e = s === "icon" || s === "icon-lg";
   return /* @__PURE__ */ r.jsxs(
-    f,
+    a,
     {
       size: m,
       variant: o,
@@ -35,7 +35,7 @@ const h = ({
       onClick: l,
       children: [
         n && /* @__PURE__ */ r.jsx(
-          a,
+          f,
           {
             icon: n,
             className: c({ "h-4 w-4": s === "icon-lg" })

package/dist/ButtonToggle.d.ts

@@ -3,10 +3,10 @@ type ButtonToggleProps = {
     className?: string;
     value: string;
     defaultPressed: string;
-    variant?: "primary" | "secondary";
-    size?: "small" | "default" | "compact";
+    variant?: 'primary' | 'secondary';
+    size?: 'small' | 'default' | 'compact';
     icon?: any;
-    display?: "icon" | "label" | "" | null;
+    display?: 'icon' | 'label' | '' | null;
     onPressedChange: (value: string) => void;
     label?: string;
 };
@@ -22,10 +22,10 @@ type ButtonToggleGroupProps = {
     options: ButtonToggleGroupOptionProp[];
     defaultPressed?: string;
     toggle?: boolean;
-    size?: "small" | "default" | "compact";
+    size?: 'small' | 'default' | 'compact';
     tabs?: boolean;
-    display?: "icon" | "label" | "" | null;
-    variant?: "primary" | "secondary";
+    display?: 'icon' | 'label' | '' | null;
+    variant?: 'primary' | 'secondary';
     stretch?: boolean;
     icon?: any;
     onPressedChange?: (value: string) => void;

package/dist/ButtonToggle.js

@@ -1,9 +1,9 @@
-import { j as s } from "./node_modules/react/jsx-runtime.js";
-import { Icon as d } from "./Icon.js";
-import { Wrap as N } from "./Wrap.js";
+import { j as s } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import { Button as k } from "@wordpress/components";
 import { memo as p, useState as g, useEffect as w, useCallback as B } from "@wordpress/element";
-import h from "classnames";
+import d from "classnames";
+import { Icon as h } from "./Icon.js";
+import { Wrap as N } from "./Wrap.js";
 const E = p(
   ({
     children: u,
@@ -28,7 +28,7 @@ const E = p(
       k,
       {
         "aria-label": l,
-        className: h(c, "blockbite-ui__button--default"),
+        className: d(c, "blockbite-ui__button--default"),
         value: t,
         size: x,
         label: l,
@@ -37,7 +37,7 @@ const E = p(
         isPressed: r,
         onClick: j,
         children: [
-          b && /* @__PURE__ */ s.jsx(d, { icon: b }),
+          b && /* @__PURE__ */ s.jsx(h, { icon: b }),
           a !== "icon" ? u : null,
           l && !u && a !== "icon" ? /* @__PURE__ */ s.jsx("span", { children: l }) : null
         ]
@@ -67,14 +67,14 @@ const E = p(
         n(f), l?.(f);
       },
       [r, l, t]
-    ), _ = (e) => o === "icon" && e?.icon ? /* @__PURE__ */ s.jsx(d, { icon: e.icon }) : o === "label" ? /* @__PURE__ */ s.jsx("span", { children: e.label }) : /* @__PURE__ */ s.jsxs("span", { className: "flex items-center justify-center gap-1", children: [
-      e.icon && /* @__PURE__ */ s.jsx(d, { icon: e.icon }),
+    ), _ = (e) => o === "icon" && e?.icon ? /* @__PURE__ */ s.jsx(h, { icon: e.icon }) : o === "label" ? /* @__PURE__ */ s.jsx("span", { children: e.label }) : /* @__PURE__ */ s.jsxs("span", { className: "flex items-center justify-center gap-1", children: [
+      e.icon && /* @__PURE__ */ s.jsx(h, { icon: e.icon }),
       /* @__PURE__ */ s.jsx("span", { children: e.label })
     ] });
     return /* @__PURE__ */ s.jsx(
       N,
       {
-        className: h(
+        className: d(
           "blockbite-ui__button-group flex flex-wrap gap-1",
           u,
           b ? "blockbite-ui__button-group--tabs" : ""
@@ -82,7 +82,7 @@ const E = p(
         children: i.map((e, f) => /* @__PURE__ */ s.jsxs(
           k,
           {
-            className: h("blockbite-ui__button--default", {
+            className: d("blockbite-ui__button--default", {
               grow: a,
               "justify-center": a
             }),

package/dist/Chapter.js

@@ -1,15 +1,15 @@
-import { j as e } from "./node_modules/react/jsx-runtime.js";
-import { Wrap as r } from "./Wrap.js";
-import s from "classnames";
+import { j as e } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import r from "classnames";
+import { Wrap as s } from "./Wrap.js";
 const p = ({ children: t, title: m }) => /* @__PURE__ */ e.jsxs(
-  r,
+  s,
   {
-    className: s(
+    className: r(
       "text-gray-medium my-2 flex items-center gap-1 text-[12px] font-medium",
-      s
+      r
     ),
     children: [
-      m && /* @__PURE__ */ e.jsx(r, { className: "font-medium", children: m }),
+      m && /* @__PURE__ */ e.jsx(s, { className: "font-medium", children: m }),
       t
     ]
   }

package/dist/ChapterDivider.js

@@ -1,4 +1,4 @@
-import { j as s } from "./node_modules/react/jsx-runtime.js";
+import { j as s } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import m from "classnames";
 const i = ({
   id: l = "",

package/dist/Checkbox.js

@@ -1,13 +1,13 @@
-import { j as r } from "./node_modules/react/jsx-runtime.js";
-import { Wrap as m } from "./Wrap.js";
-import { CheckboxControl as i } from "@wordpress/components";
-import { useState as x, useEffect as n } from "@wordpress/element";
+import { j as r } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { CheckboxControl as m } from "@wordpress/components";
+import { useState as i, useEffect as x } from "@wordpress/element";
+import { Wrap as n } from "./Wrap.js";
 const f = ({ label: t, help: s, defaultChecked: e }) => {
-  const [c, o] = x(e);
-  return n(() => {
+  const [c, o] = i(e);
+  return x(() => {
     o(e);
-  }, [e]), /* @__PURE__ */ r.jsx(m, { className: "blockbite-ui__checkbox mx-1 flex items-center gap-2", children: /* @__PURE__ */ r.jsx(
-    i,
+  }, [e]), /* @__PURE__ */ r.jsx(n, { className: "blockbite-ui__checkbox mx-1 flex items-center gap-2", children: /* @__PURE__ */ r.jsx(
+    m,
     {
       label: t,
       help: s,

package/dist/DisappearingMessage.js

@@ -1,4 +1,4 @@
-import { j as n } from "./node_modules/react/jsx-runtime.js";
+import { j as n } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import { useState as l, useRef as i, useEffect as o } from "@wordpress/element";
 const p = ({
   duration: t,

package/dist/DropdownPicker.js

@@ -1,9 +1,9 @@
-import { j as o } from "./node_modules/react/jsx-runtime.js";
-import p from "./node_modules/@blockbite/icons/dist/ChevronDown.js";
-import { Icon as n } from "./Icon.js";
+import { j as o } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import p from "./packages/icons/jsx/ChevronDown.js";
 import { DropdownMenu as b } from "@wordpress/components";
 import { useState as f, useEffect as v } from "@wordpress/element";
 import x from "classnames";
+import { Icon as n } from "./Icon.js";
 const O = ({
   label: s,
   className: m,

package/dist/EmptyState.js

@@ -1,4 +1,4 @@
-import { j as s } from "./node_modules/react/jsx-runtime.js";
+import { j as s } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 function n({
   icon: t,
   title: a,

package/dist/FloatingPanel.js

@@ -1,4 +1,4 @@
-import { j as s } from "./node_modules/react/jsx-runtime.js";
+import { j as s } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import { useRef as x, useState as o, useEffect as g } from "@wordpress/element";
 function w({
   children: d

package/dist/FocalPointControl.js

@@ -1,13 +1,13 @@
-import { j as i } from "./node_modules/react/jsx-runtime.js";
-import { Wrap as p } from "./Wrap.js";
-import { FocalPointPicker as x } from "@wordpress/components";
-import { useState as m, useEffect as s } from "@wordpress/element";
+import { j as i } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { FocalPointPicker as p } from "@wordpress/components";
+import { useState as x, useEffect as s } from "@wordpress/element";
+import { Wrap as m } from "./Wrap.js";
 const d = ({
   defaultValue: e,
   onValueChange: a,
   url: c
 }) => {
-  const [t, r] = m({
+  const [t, r] = x({
     x: 0.5,
     y: 0.5
   });
@@ -25,8 +25,8 @@ const d = ({
         y: n
       });
     }
-  }, [e]), /* @__PURE__ */ i.jsx(p, { className: "relative flex flex-col", children: /* @__PURE__ */ i.jsx(
-    x,
+  }, [e]), /* @__PURE__ */ i.jsx(m, { className: "relative flex flex-col", children: /* @__PURE__ */ i.jsx(
+    p,
     {
       url: c,
       value: t,

package/dist/Icon.js

@@ -1,4 +1,4 @@
-import { j as s } from "./node_modules/react/jsx-runtime.js";
+import { j as s } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
 import { Wrap as o } from "./Wrap.js";
 const e = ({ icon: r, className: i = "" }) => r ? /* @__PURE__ */ s.jsxs(o, { className: "blockbite--icon", children: [
   /* @__PURE__ */ s.jsx(r, { className: i }),

package/dist/LinkPicker.js

@@ -1,18 +1,16 @@
-import { j as e } from "./node_modules/react/jsx-runtime.js";
-import { Wrap as k } from "./Wrap.js";
-import u from "./node_modules/@wordpress/api-fetch/build-module/index.js";
-import { TextControl as b } from "@wordpress/components";
+import { j as e } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import b from "@wordpress/api-fetch";
+import { TextControl as h } from "@wordpress/components";
 import { useState as c, useEffect as a } from "@wordpress/element";
-import "./node_modules/@wordpress/i18n/build-module/sprintf.js";
-import "./node_modules/tannin/index.js";
-import { __ as p } from "./node_modules/@wordpress/i18n/build-module/default-i18n.js";
-function w(r) {
-  const [t, s] = c(""), [i, n] = c([]), [o, m] = c({
+import { __ as p } from "@wordpress/i18n";
+import { Wrap as k } from "./Wrap.js";
+function g(s) {
+  const [t, r] = c(""), [i, n] = c([]), [o, u] = c({
     url: "",
     title: ""
   });
   return a(() => {
-    t !== "" && (n(null), u({
+    t !== "" && (n(null), b({
       path: `/blockbite/v1/block-helpers/get-links/${t}`
     }).then(
       (l) => {
@@ -20,34 +18,34 @@ function w(r) {
       }
     ));
   }, [t]), a(() => {
-    o.url !== "" && r.parentCallback(o);
+    o.url !== "" && s.parentCallback(o);
   }, [o]), /* @__PURE__ */ e.jsxs(k, { className: "blockbite--editor-linkwrap", children: [
     /* @__PURE__ */ e.jsx(
-      b,
+      h,
       {
         label: p("Search link", "blockbitelinks"),
         value: t,
         placeholder: "Example: About",
-        onChange: (l) => s(l),
+        onChange: (l) => r(l),
         help: p("Type a post, page, title", "blockbitelinks")
       }
     ),
     t ? /* @__PURE__ */ e.jsx("div", { className: "blockbite--editor-linklist", children: /* @__PURE__ */ e.jsx(
-      h,
+      m,
       {
         links: i,
         onActiveLink: (l) => [
-          m({ ...l }),
-          s("")
+          u({ ...l }),
+          r("")
         ]
       }
     ) }) : null
   ] });
 }
-function h({ links: r, onActiveLink: t }) {
-  const s = [];
-  return r === null ? /* @__PURE__ */ e.jsx("p", { children: "Loading..." }) : r.length === 0 ? /* @__PURE__ */ e.jsx("p", { children: "No Results" }) : (r.forEach((i) => {
-    s.push(
+function m({ links: s, onActiveLink: t }) {
+  const r = [];
+  return s === null ? /* @__PURE__ */ e.jsx("p", { children: "Loading..." }) : s.length === 0 ? /* @__PURE__ */ e.jsx("p", { children: "No Results" }) : (s.forEach((i) => {
+    r.push(
       // add key
       /* @__PURE__ */ e.jsx(k, { children: /* @__PURE__ */ e.jsxs(
         "span",
@@ -62,8 +60,8 @@ function h({ links: r, onActiveLink: t }) {
         }
       ) }, i.id)
     );
-  }), s);
+  }), r);
 }
 export {
-  w as default
+  g as default
 };

package/dist/MediaPicker.js

@@ -1,14 +1,9 @@
-import { j as l } from "./node_modules/react/jsx-runtime.js";
-import "./node_modules/@wordpress/block-editor/build-module/hooks/index.js";
-import "./node_modules/@wordpress/block-editor/build-module/store/index.js";
-import { PanelRow as b, Button as a } from "@wordpress/components";
+import { j as l } from "./node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js";
+import { MediaUploadCheck as a, MediaUpload as m } from "@wordpress/block-editor";
+import { PanelRow as b, Button as n } from "@wordpress/components";
 import { useState as j, useEffect as x } from "@wordpress/element";
-import "./node_modules/@wordpress/i18n/build-module/sprintf.js";
-import "./node_modules/tannin/index.js";
-import { __ as r } from "./node_modules/@wordpress/i18n/build-module/default-i18n.js";
-import { MediaUploadCheck as n } from "./node_modules/@wordpress/block-editor/build-module/components/media-upload/check.js";
-import m from "./node_modules/@wordpress/block-editor/build-module/components/media-upload/index.js";
-function C({ mediaProps: d, mediaCallback: u }) {
+import { __ as r } from "@wordpress/i18n";
+function S({ mediaProps: d, mediaCallback: u }) {
   const c = [
     "image",
     "video",
@@ -16,7 +11,7 @@ function C({ mediaProps: d, mediaCallback: u }) {
     "svg",
     "text/plain",
     "application/json"
-  ], [t, p] = j({
+  ], [t, g] = j({
     id: null,
     url: "",
     sizes: [],
@@ -26,9 +21,9 @@ function C({ mediaProps: d, mediaCallback: u }) {
     height: 0
   });
   x(() => {
-    d && p({ ...d });
+    d && g({ ...d });
   }, [d]);
-  const g = () => {
+  const p = () => {
     u({ ...{
       mediaId: 0,
       mediaUrl: ""
@@ -55,14 +50,14 @@ function C({ mediaProps: d, mediaCallback: u }) {
     u({ ...f });
   };
   return /* @__PURE__ */ l.jsxs(b, { children: [
-    t.id !== null && /* @__PURE__ */ l.jsx(n, { children: /* @__PURE__ */ l.jsx(
+    t.id !== null && /* @__PURE__ */ l.jsx(a, { children: /* @__PURE__ */ l.jsx(
       m,
       {
         onSelect: h,
         value: t.id,
         allowedTypes: c,
         render: ({ open: e }) => /* @__PURE__ */ l.jsxs(
-          a,
+          n,
           {
             className: t.id === 0 ? "editor-post-featured-image__toggle" : "editor-post-featured-image__preview",
             onClick: e,
@@ -80,19 +75,19 @@ function C({ mediaProps: d, mediaCallback: u }) {
         )
       }
     ) }),
-    t.id !== 0 && /* @__PURE__ */ l.jsx(n, { children: /* @__PURE__ */ l.jsx(
+    t.id !== 0 && /* @__PURE__ */ l.jsx(a, { children: /* @__PURE__ */ l.jsx(
       m,
       {
         title: r("Replace media", "blockbite"),
         value: t.id,
         onSelect: h,
         allowedTypes: c,
-        render: ({ open: e }) => /* @__PURE__ */ l.jsx(a, { onClick: e, children: r("Replace media", "blockbite") })
+        render: ({ open: e }) => /* @__PURE__ */ l.jsx(n, { onClick: e, children: r("Replace media", "blockbite") })
       }
     ) }),
-    t.id !== 0 && /* @__PURE__ */ l.jsx(n, { children: /* @__PURE__ */ l.jsx(a, { onClick: () => g(), isDestructive: !0, children: r("Remove media", "blockbite") }) })
+    t.id !== 0 && /* @__PURE__ */ l.jsx(a, { children: /* @__PURE__ */ l.jsx(n, { onClick: () => p(), isDestructive: !0, children: r("Remove media", "blockbite") }) })
   ] });
 }
 export {
-  C as default
+  S as default
 };

package/dist/MetricsControl.d.ts

@@ -1,7 +1,7 @@
 type MetricsControlProps = {
     defaultUnit: string;
     defaultValue: string;
-    units?: string[] | "native" | "percent" | "grid" | "arbitrary" | "fluid" | "screen" | "all";
+    units?: string[] | 'native' | 'percent' | 'grid' | 'arbitrary' | 'fluid' | 'screen' | 'all';
     inputClassName?: string;
     onValueChange: (value: string) => void;
     onUnitChange: (unit: string) => void;