@reacteditor/core 0.0.16 → 0.0.18

package/dist/{Editor-4LPVLYSU.css → Editor-IRCQF4VT.css}

@@ -88,25 +88,19 @@
 }
 
 /* css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Loader/styles.module.css/#css-module-data */
-@keyframes _loader-animation_nacdm_1 {
-  0% {
-    transform: rotate(0deg) scale(1);
+@keyframes _loader-spin_6933g_1 {
+  from {
+    transform: rotate(0deg);
   }
-  50% {
-    transform: rotate(180deg) scale(0.8);
-  }
-  100% {
-    transform: rotate(360deg) scale(1);
+  to {
+    transform: rotate(360deg);
   }
 }
-._Loader_nacdm_13 {
-  background: transparent;
-  border-radius: 100%;
-  border: 2px solid currentColor;
-  border-bottom-color: transparent;
-  display: inline-block;
-  animation: _loader-animation_nacdm_1 1s 0s infinite linear;
-  animation-fill-mode: both;
+._Loader_6933g_10 {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  animation: _loader-spin_6933g_1 1s linear infinite;
 }
 
 /* css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/ActionBar/styles.module.css/#css-module-data */

package/dist/{Editor-J7XDD77B.mjs → Editor-ULH2S4LO.mjs}

@@ -4,19 +4,19 @@ import {
 import {
   EditorInner,
   LoadedRichTextMenu
-} from "./chunk-5QKQ3LQJ.mjs";
-import "./chunk-Q667J2EG.mjs";
-import "./chunk-RQZQMS6E.mjs";
+} from "./chunk-NABX5FH7.mjs";
+import "./chunk-UQHR5LFK.mjs";
+import "./chunk-HR67L662.mjs";
 import "./chunk-6QJ2HF4O.mjs";
-import "./chunk-RGC274VM.mjs";
-import "./chunk-TG2KTWSB.mjs";
+import "./chunk-DGIVBKSJ.mjs";
+import "./chunk-IOAYKTDH.mjs";
 import {
   useAppStore,
   useAppStoreApi
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import "./chunk-M4JDRFYB.mjs";
 import "./chunk-FTVOCMGV.mjs";
-import "./chunk-Y2EFNT5P.mjs";
+import "./chunk-DQU3HIP4.mjs";
 import "./chunk-JIXMPJZA.mjs";
 import {
   __spreadProps,

package/dist/{Render-STFB5CNO.mjs → Render-IDDFFANP.mjs}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-6QJ2HF4O.mjs";
 import {
   get_class_name_factory_default
-} from "./chunk-Y2EFNT5P.mjs";
+} from "./chunk-DQU3HIP4.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-4L7H4JV4.mjs → chunk-AD67LVXW.mjs}

@@ -7,7 +7,7 @@ import {
 } from "./chunk-FTVOCMGV.mjs";
 import {
   get_class_name_factory_default
-} from "./chunk-Y2EFNT5P.mjs";
+} from "./chunk-DQU3HIP4.mjs";
 import {
   generateId,
   getZoneId,
@@ -444,7 +444,7 @@ function useRichtextProps(fields, props) {
   const richtextProps = useMemo2(() => {
     if (!(richtextKeys == null ? void 0 : richtextKeys.length)) return {};
     const RichTextRender = lazy(
-      () => import("./Render-STFB5CNO.mjs").then((m) => ({
+      () => import("./Render-IDDFFANP.mjs").then((m) => ({
         default: m.RichTextRender
       }))
     );

package/dist/{chunk-RGC274VM.mjs → chunk-DGIVBKSJ.mjs}

@@ -3,7 +3,7 @@ import {
   AlignJustify,
   AlignLeft,
   AlignRight
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-Y2EFNT5P.mjs → chunk-DQU3HIP4.mjs}

@@ -70,19 +70,29 @@ var require_classnames = __commonJS({
 // lib/get-class-name-factory.ts
 init_react_import();
 var import_classnames = __toESM(require_classnames());
-var getClassNameFactory = (rootClass, styles, config = { baseClass: "" }) => (options = {}) => {
+var getClassNameFactory = (rootClass, styles, config = { baseClass: "" }) => (options = {}, modifiers) => {
   if (typeof options === "string") {
     const descendant = options;
-    const style = styles[`${rootClass}-${descendant}`];
+    const baseKey = `${rootClass}-${descendant}`;
+    const style = styles[baseKey];
+    if (modifiers) {
+      const prefixedModifiers = {};
+      for (let modifier in modifiers) {
+        prefixedModifiers[styles[`${baseKey}--${modifier}`]] = modifiers[modifier];
+      }
+      return config.baseClass + (0, import_classnames.default)(__spreadValues({
+        [style]: !!style
+      }, prefixedModifiers));
+    }
     if (style) {
-      return config.baseClass + styles[`${rootClass}-${descendant}`] || "";
+      return config.baseClass + style;
     }
     return "";
   } else if (typeof options === "object") {
-    const modifiers = options;
+    const modifiers2 = options;
     const prefixedModifiers = {};
-    for (let modifier in modifiers) {
-      prefixedModifiers[styles[`${rootClass}--${modifier}`]] = modifiers[modifier];
+    for (let modifier in modifiers2) {
+      prefixedModifiers[styles[`${rootClass}--${modifier}`]] = modifiers2[modifier];
     }
     const c = styles[rootClass];
     return config.baseClass + (0, import_classnames.default)(__spreadValues({

package/dist/{chunk-RQZQMS6E.mjs → chunk-HR67L662.mjs}

@@ -1,7 +1,7 @@
 import {
   List,
   ListOrdered
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-TG2KTWSB.mjs → chunk-IOAYKTDH.mjs}

@@ -5,7 +5,7 @@ import {
   Heading4,
   Heading5,
   Heading6
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";

package/dist/{chunk-JHURG5NN.mjs → chunk-LFJGTSUB.mjs}

@@ -11,7 +11,7 @@ import {
 } from "./chunk-FTVOCMGV.mjs";
 import {
   get_class_name_factory_default
-} from "./chunk-Y2EFNT5P.mjs";
+} from "./chunk-DQU3HIP4.mjs";
 import {
   generateId,
   walkAppState
@@ -1143,7 +1143,19 @@ var createAppStore = (initialAppStore) => create2()(
       metadata: {},
       fieldTransforms: {},
       scrollToComponent: () => {
-      }
+      },
+      route: null,
+      isPublishing: false,
+      publish: () => __async(null, null, function* () {
+        const { onPublish, state, route } = get();
+        if (!onPublish) return;
+        set({ isPublishing: true });
+        try {
+          yield onPublish({ data: state.data, route });
+        } finally {
+          set({ isPublishing: false });
+        }
+      })
     }, initialAppStore), {
       fields: createFieldsSlice(set, get),
       history: createHistorySlice(set, get),

package/dist/{chunk-5QKQ3LQJ.mjs → chunk-NABX5FH7.mjs}

@@ -1,16 +1,16 @@
 import {
   LoadedRichTextMenuInner
-} from "./chunk-Q667J2EG.mjs";
+} from "./chunk-UQHR5LFK.mjs";
 import {
   styles_module_default
 } from "./chunk-6QJ2HF4O.mjs";
 import {
   useAppStore,
   useAppStoreApi
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   get_class_name_factory_default
-} from "./chunk-Y2EFNT5P.mjs";
+} from "./chunk-DQU3HIP4.mjs";
 import {
   __spreadValues,
   init_react_import
@@ -100,7 +100,7 @@ init_react_import();
 import { lazy, Suspense } from "react";
 import { jsx as jsx2 } from "react/jsx-runtime";
 var LoadedRichTextMenuFull = lazy(
-  () => import("./full-T5SGODJ2.mjs").then((m) => ({
+  () => import("./full-LIVYWOAF.mjs").then((m) => ({
     default: m.LoadedRichTextMenuFull
   }))
 );

package/dist/{chunk-Q667J2EG.mjs → chunk-UQHR5LFK.mjs}

@@ -1,12 +1,12 @@
 import {
   useListOptions
-} from "./chunk-RQZQMS6E.mjs";
+} from "./chunk-HR67L662.mjs";
 import {
   useAlignOptions
-} from "./chunk-RGC274VM.mjs";
+} from "./chunk-DGIVBKSJ.mjs";
 import {
   useHeadingOptions
-} from "./chunk-TG2KTWSB.mjs";
+} from "./chunk-IOAYKTDH.mjs";
 import {
   AlignCenter,
   AlignJustify,
@@ -26,12 +26,13 @@ import {
   Strikethrough,
   Underline,
   useControlContext
-} from "./chunk-JHURG5NN.mjs";
+} from "./chunk-LFJGTSUB.mjs";
 import {
   get_class_name_factory_default
-} from "./chunk-Y2EFNT5P.mjs";
+} from "./chunk-DQU3HIP4.mjs";
 import {
   __objRest,
+  __spreadProps,
   __spreadValues,
   init_react_import
 } from "./chunk-M6W7YEVX.mjs";
@@ -102,35 +103,135 @@ init_react_import();
 
 // css-module:/Users/rami/Documents/apps/react-editor/packages/core/components/Loader/styles.module.css#css-module
 init_react_import();
-var styles_module_default2 = { "Loader": "_Loader_nacdm_13", "loader-animation": "_loader-animation_nacdm_1" };
+var styles_module_default2 = { "Loader": "_Loader_6933g_10", "loader-spin": "_loader-spin_6933g_1" };
 
 // components/Loader/index.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var getClassName2 = get_class_name_factory_default("Loader", styles_module_default2);
+var LoaderIcon = ({ size = 16 }) => /* @__PURE__ */ jsxs2(
+  "svg",
+  {
+    height: size,
+    strokeLinejoin: "round",
+    style: { color: "currentcolor" },
+    viewBox: "0 0 16 16",
+    width: size,
+    "aria-hidden": "true",
+    children: [
+      /* @__PURE__ */ jsxs2("g", { clipPath: "url(#editor-loader-clip)", children: [
+        /* @__PURE__ */ jsx2("path", { d: "M8 0V4", stroke: "currentColor", strokeWidth: "1.5" }),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M8 16V12",
+            opacity: "0.5",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M3.29773 1.52783L5.64887 4.7639",
+            opacity: "0.9",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M12.7023 1.52783L10.3511 4.7639",
+            opacity: "0.1",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M12.7023 14.472L10.3511 11.236",
+            opacity: "0.4",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M3.29773 14.472L5.64887 11.236",
+            opacity: "0.6",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M15.6085 5.52783L11.8043 6.7639",
+            opacity: "0.2",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M0.391602 10.472L4.19583 9.23598",
+            opacity: "0.7",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M15.6085 10.4722L11.8043 9.2361",
+            opacity: "0.3",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        ),
+        /* @__PURE__ */ jsx2(
+          "path",
+          {
+            d: "M0.391602 5.52783L4.19583 6.7639",
+            opacity: "0.8",
+            stroke: "currentColor",
+            strokeWidth: "1.5"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx2("defs", { children: /* @__PURE__ */ jsx2("clipPath", { id: "editor-loader-clip", children: /* @__PURE__ */ jsx2("rect", { fill: "white", height: "16", width: "16" }) }) })
+    ]
+  }
+);
 var Loader = (_a) => {
   var _b = _a, {
     color,
-    size = 16
+    size = 16,
+    className,
+    style
   } = _b, props = __objRest(_b, [
     "color",
-    "size"
+    "size",
+    "className",
+    "style"
   ]);
   return /* @__PURE__ */ jsx2(
-    "span",
-    __spreadValues({
-      className: getClassName2(),
-      style: {
-        width: size,
-        height: size,
-        color
-      },
+    "div",
+    __spreadProps(__spreadValues({
+      className: [getClassName2(), className].filter(Boolean).join(" "),
+      style: __spreadValues({ color }, style),
       "aria-label": "loading"
-    }, props)
+    }, props), {
+      children: /* @__PURE__ */ jsx2(LoaderIcon, { size })
+    })
   );
 };
 
 // components/IconButton/IconButton.tsx
-import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var getClassName3 = get_class_name_factory_default("IconButton", IconButton_module_default);
 var IconButton = ({
   active = false,
@@ -147,7 +248,7 @@ var IconButton = ({
 }) => {
   const [loading, setLoading] = useState(false);
   const ElementType = href ? "a" : "button";
-  const el = /* @__PURE__ */ jsxs2(
+  const el = /* @__PURE__ */ jsxs3(
     ElementType,
     {
       className: getClassName3({
@@ -173,7 +274,7 @@ var IconButton = ({
       children: [
         /* @__PURE__ */ jsx3("span", { className: getClassName3("title"), children: title }),
         children,
-        loading && /* @__PURE__ */ jsxs2(Fragment, { children: [
+        loading && /* @__PURE__ */ jsxs3(Fragment, { children: [
           "\xA0\xA0",
           /* @__PURE__ */ jsx3(Loader, { size: 14 })
         ] })
@@ -349,7 +450,7 @@ function AlignSelectFallback() {
 // components/RichTextMenu/controls/AlignSelect/index.tsx
 import { jsx as jsx10 } from "react/jsx-runtime";
 var AlignSelectLoaded = lazy(
-  () => import("./loaded-ZQCRSG65.mjs").then((m) => ({
+  () => import("./loaded-FZVSXAM7.mjs").then((m) => ({
     default: m.AlignSelectLoaded
   }))
 );
@@ -580,7 +681,7 @@ function HeadingSelectFallback() {
 // components/RichTextMenu/controls/HeadingSelect/index.tsx
 import { jsx as jsx22 } from "react/jsx-runtime";
 var HeadingSelectLoaded = lazy2(
-  () => import("./loaded-6YKSFCCD.mjs").then((m) => ({
+  () => import("./loaded-PYHJ6TB5.mjs").then((m) => ({
     default: m.HeadingSelectLoaded
   }))
 );
@@ -612,14 +713,14 @@ function ListSelectFallback() {
 // components/RichTextMenu/controls/ListSelect/index.tsx
 import { jsx as jsx24 } from "react/jsx-runtime";
 var ListSelectLoaded = lazy3(
-  () => import("./loaded-DUBT6SP5.mjs").then((m) => ({
+  () => import("./loaded-MSWM6QEM.mjs").then((m) => ({
     default: m.ListSelectLoaded
   }))
 );
 var ListSelect = () => /* @__PURE__ */ jsx24(Suspense3, { fallback: /* @__PURE__ */ jsx24(ListSelectFallback, {}), children: /* @__PURE__ */ jsx24(ListSelectLoaded, {}) });
 
 // components/RichTextMenu/inner.tsx
-import { jsx as jsx25, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs4 } from "react/jsx-runtime";
 var getClassName5 = get_class_name_factory_default("RichTextMenu", styles_module_default3);
 var DefaultMenu = ({ children }) => {
   return /* @__PURE__ */ jsx25(RichTextMenu, { children });
@@ -673,18 +774,18 @@ var LoadedRichTextMenuInner = ({
           editor,
           editorState,
           readOnly,
-          children: /* @__PURE__ */ jsxs3(Group2, { children: [
+          children: /* @__PURE__ */ jsxs4(Group2, { children: [
             /* @__PURE__ */ jsx25(Bold2, {}),
             /* @__PURE__ */ jsx25(Italic2, {}),
             /* @__PURE__ */ jsx25(Underline2, {})
           ] })
         }
-      ) : /* @__PURE__ */ jsxs3(Menu, { editor, editorState, readOnly, children: [
-        /* @__PURE__ */ jsxs3(Group2, { children: [
+      ) : /* @__PURE__ */ jsxs4(Menu, { editor, editorState, readOnly, children: [
+        /* @__PURE__ */ jsxs4(Group2, { children: [
           /* @__PURE__ */ jsx25(HeadingSelect, {}),
           /* @__PURE__ */ jsx25(ListSelect, {})
         ] }),
-        /* @__PURE__ */ jsxs3(Group2, { children: [
+        /* @__PURE__ */ jsxs4(Group2, { children: [
           /* @__PURE__ */ jsx25(Bold2, {}),
           /* @__PURE__ */ jsx25(Italic2, {}),
           /* @__PURE__ */ jsx25(Underline2, {})