@frontify/guideline-blocks-settings 0.35.1 → 0.36.0

package/dist/components/RichTextEditor/RichTextEditor.es.js

@@ -1,59 +1,69 @@
 import { jsx as l } from "react/jsx-runtime";
-import { RichTextEditor as x } from "@frontify/fondue";
-import { memo as R, useState as h, useCallback as a, useEffect as p, useRef as v } from "react";
-import { useIsInViewport as P } from "../../hooks/useIsInViewport.es.js";
+import { RichTextEditor as V } from "@frontify/fondue";
+import { memo as v, useState as h, useCallback as a, useEffect as p, useRef as P } from "react";
+import { useIsInViewport as C } from "../../hooks/useIsInViewport.es.js";
 import { SerializedText as I } from "./SerializedText.es.js";
-import { floatingButtonSelectors as L, floatingButtonActions as S } from "./plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.es.js";
-const E = R(
+import { getResponsiveColumnClasses as L } from "./plugins/ColumnBreakPlugin/helpers.es.js";
+import { floatingButtonSelectors as S, floatingButtonActions as H } from "./plugins/ButtonPlugin/components/FloatingButton/floatingButtonStore.es.js";
+const E = v(
   ({
     id: d = "rte",
     isEnabled: i,
     value: t,
     columns: n,
-    gap: r,
-    placeholder: f,
+    gap: o,
+    placeholder: c,
     plugins: s,
-    onTextChange: o,
+    onTextChange: r,
     showSerializedText: w
   }) => {
-    const [c, u] = h(!1), b = a(
+    const g = L(n), [f, u] = h(!1), b = a(
       (e) => {
-        e !== t && (o == null || o(e)), u(!1);
+        e !== t && (r == null || r(e)), u(!1);
       },
-      [o, t]
-    ), g = a(() => u(!0), []), V = a((e) => {
-      L.isOpen(e) && S.reset();
+      [r, t]
+    ), x = a(() => u(!0), []), R = a((e) => {
+      S.isOpen(e) && H.reset();
     }, []);
     return p(() => {
       const e = (m) => {
         m.preventDefault(), m.returnValue = "Unprocessed changes";
       };
-      return c && window.addEventListener("beforeunload", e), () => window.removeEventListener("beforeunload", e);
-    }, [c]), i ? /* @__PURE__ */ l(
-      x,
+      return f && window.addEventListener("beforeunload", e), () => window.removeEventListener("beforeunload", e);
+    }, [f]), i ? /* @__PURE__ */ l(
+      V,
       {
         id: d,
         value: t,
         border: !1,
-        placeholder: f,
+        placeholder: c,
         plugins: s,
-        onValueChanged: g,
+        onValueChanged: x,
         onTextChange: b,
-        hideExternalFloatingModals: V
+        hideExternalFloatingModals: R
       }
-    ) : /* @__PURE__ */ l(I, { value: t, columns: n, gap: r, show: w, plugins: s });
+    ) : /* @__PURE__ */ l(
+      I,
+      {
+        value: t,
+        gap: o,
+        customClass: g,
+        show: w,
+        plugins: s
+      }
+    );
   }
 );
 E.displayName = "InternalRichTextEditor";
-const M = (d) => {
-  const i = v(null), [t, n] = h(!1), { isEditing: r, ...f } = d, s = a((o) => {
-    o && n(!0);
+const j = (d) => {
+  const i = P(null), [t, n] = h(!1), { isEditing: o, ...c } = d, s = a((r) => {
+    r && n(!0);
   }, []);
-  return P({ ref: i, disabled: !r, onChange: s }), p(() => {
-    r || n(!1);
-  }, [r]), /* @__PURE__ */ l("div", { className: "tw-block tw-w-full", ref: i, children: /* @__PURE__ */ l(E, { ...f, isEnabled: r && t }) });
+  return C({ ref: i, disabled: !o, onChange: s }), p(() => {
+    o || n(!1);
+  }, [o]), /* @__PURE__ */ l("div", { "data-test-id": "rich-text-editor-container", className: "tw-block tw-w-full tw-@container", ref: i, children: /* @__PURE__ */ l(E, { ...c, isEnabled: o && t }) });
 };
 export {
-  M as RichTextEditor
+  j as RichTextEditor
 };
 //# sourceMappingURL=RichTextEditor.es.js.map

package/dist/components/RichTextEditor/RichTextEditor.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"RichTextEditor.es.js","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { RichTextEditor as FondueRichTextEditor } from '@frontify/fondue';\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useIsInViewport } from '../../hooks/useIsInViewport';\n\nimport { SerializedText } from './SerializedText';\nimport { floatingButtonActions, floatingButtonSelectors } from './plugins/ButtonPlugin/components';\nimport { type RichTextEditorProps } from './types';\n\nconst InternalRichTextEditor = memo(\n    ({\n        id = 'rte',\n        isEnabled,\n        value,\n        columns,\n        gap,\n        placeholder,\n        plugins,\n        onTextChange,\n        showSerializedText,\n    }: Omit<RichTextEditorProps, 'isEditing'> & { isEnabled: boolean }) => {\n        const [shouldPreventPageLeave, setShouldPreventPageLeave] = useState(false);\n\n        const handleTextChange = useCallback(\n            (newContent: string) => {\n                if (newContent !== value) {\n                    onTextChange?.(newContent);\n                }\n                setShouldPreventPageLeave(false);\n            },\n            [onTextChange, value],\n        );\n\n        const handleValueChange = useCallback(() => setShouldPreventPageLeave(true), []);\n\n        const handleHideExternalFloatingModals = useCallback((editorId: string) => {\n            if (floatingButtonSelectors.isOpen(editorId)) {\n                floatingButtonActions.reset();\n            }\n        }, []);\n\n        useEffect(() => {\n            const unloadHandler = (event: BeforeUnloadEvent) => {\n                event.preventDefault();\n                event.returnValue = 'Unprocessed changes';\n            };\n\n            if (shouldPreventPageLeave) {\n                window.addEventListener('beforeunload', unloadHandler);\n            }\n\n            return () => window.removeEventListener('beforeunload', unloadHandler);\n        }, [shouldPreventPageLeave]);\n\n        if (isEnabled) {\n            return (\n                <FondueRichTextEditor\n                    id={id}\n                    value={value}\n                    border={false}\n                    placeholder={placeholder}\n                    plugins={plugins}\n                    onValueChanged={handleValueChange}\n                    onTextChange={handleTextChange}\n                    hideExternalFloatingModals={handleHideExternalFloatingModals}\n                />\n            );\n        }\n        return <SerializedText value={value} columns={columns} gap={gap} show={showSerializedText} plugins={plugins} />;\n    },\n);\nInternalRichTextEditor.displayName = 'InternalRichTextEditor';\n\nexport const RichTextEditor = (props: RichTextEditorProps) => {\n    const ref = useRef<HTMLDivElement>(null);\n    const [hasEnteredViewport, setHasEnteredViewport] = useState(false);\n\n    const { isEditing, ...internalRteProps } = props;\n\n    const onViewportVisibilityChange = useCallback((isInViewport: boolean) => {\n        if (isInViewport) {\n            setHasEnteredViewport(true);\n        }\n    }, []);\n\n    useIsInViewport({ ref, disabled: !isEditing, onChange: onViewportVisibilityChange });\n\n    useEffect(() => {\n        if (!isEditing) {\n            setHasEnteredViewport(false);\n        }\n    }, [isEditing]);\n\n    return (\n        <div className=\"tw-block tw-w-full\" ref={ref}>\n            <InternalRichTextEditor {...internalRteProps} isEnabled={isEditing && hasEnteredViewport} />\n        </div>\n    );\n};\n"],"names":["InternalRichTextEditor","memo","id","isEnabled","value","columns","gap","placeholder","plugins","onTextChange","showSerializedText","shouldPreventPageLeave","setShouldPreventPageLeave","useState","handleTextChange","useCallback","newContent","handleValueChange","handleHideExternalFloatingModals","editorId","floatingButtonSelectors","floatingButtonActions","useEffect","unloadHandler","event","jsx","FondueRichTextEditor","SerializedText","RichTextEditor","props","ref","useRef","hasEnteredViewport","setHasEnteredViewport","isEditing","internalRteProps","onViewportVisibilityChange","isInViewport","useIsInViewport"],"mappings":";;;;;;AAWA,MAAMA,IAAyBC;AAAA,EAC3B,CAAC;AAAA,IACG,IAAAC,IAAK;AAAA,IACL,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,KAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,MACmE;AACnE,UAAM,CAACC,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GAEpEC,IAAmBC;AAAA,MACrB,CAACC,MAAuB;AACpB,QAAIA,MAAeZ,MACfK,KAAA,QAAAA,EAAeO,KAEnBJ,EAA0B,EAAK;AAAA,MACnC;AAAA,MACA,CAACH,GAAcL,CAAK;AAAA,IAAA,GAGlBa,IAAoBF,EAAY,MAAMH,EAA0B,EAAI,GAAG,CAAA,CAAE,GAEzEM,IAAmCH,EAAY,CAACI,MAAqB;AACnE,MAAAC,EAAwB,OAAOD,CAAQ,KACvCE,EAAsB,MAAM;AAAA,IAEpC,GAAG,CAAE,CAAA;AAeL,WAbAC,EAAU,MAAM;AACN,YAAAC,IAAgB,CAACC,MAA6B;AAChD,QAAAA,EAAM,eAAe,GACrBA,EAAM,cAAc;AAAA,MAAA;AAGxB,aAAIb,KACO,OAAA,iBAAiB,gBAAgBY,CAAa,GAGlD,MAAM,OAAO,oBAAoB,gBAAgBA,CAAa;AAAA,IAAA,GACtE,CAACZ,CAAsB,CAAC,GAEvBR,IAEI,gBAAAsB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACG,IAAAxB;AAAA,QACA,OAAAE;AAAA,QACA,QAAQ;AAAA,QACR,aAAAG;AAAA,QACA,SAAAC;AAAA,QACA,gBAAgBS;AAAA,QAChB,cAAcH;AAAA,QACd,4BAA4BI;AAAA,MAAA;AAAA,IAAA,sBAIhCS,GAAe,EAAA,OAAAvB,GAAc,SAAAC,GAAkB,KAAAC,GAAU,MAAMI,GAAoB,SAAAF,EAAkB,CAAA;AAAA,EACjH;AACJ;AACAR,EAAuB,cAAc;AAExB,MAAA4B,IAAiB,CAACC,MAA+B;AACpD,QAAAC,IAAMC,EAAuB,IAAI,GACjC,CAACC,GAAoBC,CAAqB,IAAIpB,EAAS,EAAK,GAE5D,EAAE,WAAAqB,GAAW,GAAGC,EAAA,IAAqBN,GAErCO,IAA6BrB,EAAY,CAACsB,MAA0B;AACtE,IAAIA,KACAJ,EAAsB,EAAI;AAAA,EAElC,GAAG,CAAE,CAAA;AAEL,SAAAK,EAAgB,EAAE,KAAAR,GAAK,UAAU,CAACI,GAAW,UAAUE,GAA4B,GAEnFd,EAAU,MAAM;AACZ,IAAKY,KACDD,EAAsB,EAAK;AAAA,EAC/B,GACD,CAACC,CAAS,CAAC,GAGT,gBAAAT,EAAA,OAAA,EAAI,WAAU,sBAAqB,KAAAK,GAChC,UAAA,gBAAAL,EAACzB,GAAwB,EAAA,GAAGmC,GAAkB,WAAWD,KAAaF,EAAA,CAAoB,EAC9F,CAAA;AAER;"}
+{"version":3,"file":"RichTextEditor.es.js","sources":["../../../src/components/RichTextEditor/RichTextEditor.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { RichTextEditor as FondueRichTextEditor } from '@frontify/fondue';\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useIsInViewport } from '../../hooks/useIsInViewport';\n\nimport { SerializedText } from './SerializedText';\nimport { floatingButtonActions, floatingButtonSelectors } from './plugins/ButtonPlugin/components';\nimport { getResponsiveColumnClasses } from './plugins/ColumnBreakPlugin/helpers';\nimport { type RichTextEditorProps } from './types';\n\nconst InternalRichTextEditor = memo(\n    ({\n        id = 'rte',\n        isEnabled,\n        value,\n        columns,\n        gap,\n        placeholder,\n        plugins,\n        onTextChange,\n        showSerializedText,\n    }: Omit<RichTextEditorProps, 'isEditing'> & { isEnabled: boolean }) => {\n        const customClass = getResponsiveColumnClasses(columns);\n        const [shouldPreventPageLeave, setShouldPreventPageLeave] = useState(false);\n\n        const handleTextChange = useCallback(\n            (newContent: string) => {\n                if (newContent !== value) {\n                    onTextChange?.(newContent);\n                }\n                setShouldPreventPageLeave(false);\n            },\n            [onTextChange, value],\n        );\n\n        const handleValueChange = useCallback(() => setShouldPreventPageLeave(true), []);\n\n        const handleHideExternalFloatingModals = useCallback((editorId: string) => {\n            if (floatingButtonSelectors.isOpen(editorId)) {\n                floatingButtonActions.reset();\n            }\n        }, []);\n\n        useEffect(() => {\n            const unloadHandler = (event: BeforeUnloadEvent) => {\n                event.preventDefault();\n                event.returnValue = 'Unprocessed changes';\n            };\n\n            if (shouldPreventPageLeave) {\n                window.addEventListener('beforeunload', unloadHandler);\n            }\n\n            return () => window.removeEventListener('beforeunload', unloadHandler);\n        }, [shouldPreventPageLeave]);\n\n        if (isEnabled) {\n            return (\n                <FondueRichTextEditor\n                    id={id}\n                    value={value}\n                    border={false}\n                    placeholder={placeholder}\n                    plugins={plugins}\n                    onValueChanged={handleValueChange}\n                    onTextChange={handleTextChange}\n                    hideExternalFloatingModals={handleHideExternalFloatingModals}\n                />\n            );\n        }\n        return (\n            <SerializedText\n                value={value}\n                gap={gap}\n                customClass={customClass}\n                show={showSerializedText}\n                plugins={plugins}\n            />\n        );\n    },\n);\nInternalRichTextEditor.displayName = 'InternalRichTextEditor';\n\nexport const RichTextEditor = (props: RichTextEditorProps) => {\n    const ref = useRef<HTMLDivElement>(null);\n    const [hasEnteredViewport, setHasEnteredViewport] = useState(false);\n\n    const { isEditing, ...internalRteProps } = props;\n\n    const onViewportVisibilityChange = useCallback((isInViewport: boolean) => {\n        if (isInViewport) {\n            setHasEnteredViewport(true);\n        }\n    }, []);\n\n    useIsInViewport({ ref, disabled: !isEditing, onChange: onViewportVisibilityChange });\n\n    useEffect(() => {\n        if (!isEditing) {\n            setHasEnteredViewport(false);\n        }\n    }, [isEditing]);\n\n    return (\n        <div data-test-id=\"rich-text-editor-container\" className=\"tw-block tw-w-full tw-@container\" ref={ref}>\n            <InternalRichTextEditor {...internalRteProps} isEnabled={isEditing && hasEnteredViewport} />\n        </div>\n    );\n};\n"],"names":["InternalRichTextEditor","memo","id","isEnabled","value","columns","gap","placeholder","plugins","onTextChange","showSerializedText","customClass","getResponsiveColumnClasses","shouldPreventPageLeave","setShouldPreventPageLeave","useState","handleTextChange","useCallback","newContent","handleValueChange","handleHideExternalFloatingModals","editorId","floatingButtonSelectors","floatingButtonActions","useEffect","unloadHandler","event","jsx","FondueRichTextEditor","SerializedText","RichTextEditor","props","ref","useRef","hasEnteredViewport","setHasEnteredViewport","isEditing","internalRteProps","onViewportVisibilityChange","isInViewport","useIsInViewport"],"mappings":";;;;;;;AAYA,MAAMA,IAAyBC;AAAA,EAC3B,CAAC;AAAA,IACG,IAAAC,IAAK;AAAA,IACL,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,KAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,MACmE;AAC7D,UAAAC,IAAcC,EAA2BP,CAAO,GAChD,CAACQ,GAAwBC,CAAyB,IAAIC,EAAS,EAAK,GAEpEC,IAAmBC;AAAA,MACrB,CAACC,MAAuB;AACpB,QAAIA,MAAed,MACfK,KAAA,QAAAA,EAAeS,KAEnBJ,EAA0B,EAAK;AAAA,MACnC;AAAA,MACA,CAACL,GAAcL,CAAK;AAAA,IAAA,GAGlBe,IAAoBF,EAAY,MAAMH,EAA0B,EAAI,GAAG,CAAA,CAAE,GAEzEM,IAAmCH,EAAY,CAACI,MAAqB;AACnE,MAAAC,EAAwB,OAAOD,CAAQ,KACvCE,EAAsB,MAAM;AAAA,IAEpC,GAAG,CAAE,CAAA;AAeL,WAbAC,EAAU,MAAM;AACN,YAAAC,IAAgB,CAACC,MAA6B;AAChD,QAAAA,EAAM,eAAe,GACrBA,EAAM,cAAc;AAAA,MAAA;AAGxB,aAAIb,KACO,OAAA,iBAAiB,gBAAgBY,CAAa,GAGlD,MAAM,OAAO,oBAAoB,gBAAgBA,CAAa;AAAA,IAAA,GACtE,CAACZ,CAAsB,CAAC,GAEvBV,IAEI,gBAAAwB;AAAA,MAACC;AAAAA,MAAA;AAAA,QACG,IAAA1B;AAAA,QACA,OAAAE;AAAA,QACA,QAAQ;AAAA,QACR,aAAAG;AAAA,QACA,SAAAC;AAAA,QACA,gBAAgBW;AAAA,QAChB,cAAcH;AAAA,QACd,4BAA4BI;AAAA,MAAA;AAAA,IAAA,IAKpC,gBAAAO;AAAA,MAACE;AAAA,MAAA;AAAA,QACG,OAAAzB;AAAA,QACA,KAAAE;AAAA,QACA,aAAAK;AAAA,QACA,MAAMD;AAAA,QACN,SAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGZ;AACJ;AACAR,EAAuB,cAAc;AAExB,MAAA8B,IAAiB,CAACC,MAA+B;AACpD,QAAAC,IAAMC,EAAuB,IAAI,GACjC,CAACC,GAAoBC,CAAqB,IAAIpB,EAAS,EAAK,GAE5D,EAAE,WAAAqB,GAAW,GAAGC,EAAA,IAAqBN,GAErCO,IAA6BrB,EAAY,CAACsB,MAA0B;AACtE,IAAIA,KACAJ,EAAsB,EAAI;AAAA,EAElC,GAAG,CAAE,CAAA;AAEL,SAAAK,EAAgB,EAAE,KAAAR,GAAK,UAAU,CAACI,GAAW,UAAUE,GAA4B,GAEnFd,EAAU,MAAM;AACZ,IAAKY,KACDD,EAAsB,EAAK;AAAA,EAC/B,GACD,CAACC,CAAS,CAAC,GAGT,gBAAAT,EAAA,OAAA,EAAI,gBAAa,8BAA6B,WAAU,oCAAmC,KAAAK,GACxF,UAAC,gBAAAL,EAAA3B,GAAA,EAAwB,GAAGqC,GAAkB,WAAWD,KAAaF,GAAoB,EAC9F,CAAA;AAER;"}

package/dist/components/RichTextEditor/SerializedText.es.js

@@ -1,20 +1,20 @@
-import { jsx as s } from "react/jsx-runtime";
-import { serializeRawToHtmlAsync as i } from "@frontify/fondue";
+import { jsx as n } from "react/jsx-runtime";
+import { serializeRawToHtmlAsync as s } from "@frontify/fondue";
 import { useState as w, useEffect as o } from "react";
-const d = ({ value: e = "", gap: l, columns: r, show: m = !0, plugins: a }) => {
-  const [t, n] = w(null);
+const c = ({ value: e = "", gap: l, customClass: r, show: i = !0, plugins: a }) => {
+  const [t, m] = w(null);
   return o(() => {
-    (async () => n(await i(e, a, r, l)))();
-  }, [e, r, l, a]), !m || t === "<br />" ? null : t !== null ? /* @__PURE__ */ s(
+    (async () => m(await s(e, a, void 0, l, r)))();
+  }, [e, l, a, r]), !i || t === "<br />" ? null : t !== null ? /* @__PURE__ */ n(
     "div",
     {
       className: "tw-w-full tw-whitespace-pre-wrap",
       "data-test-id": "rte-content-html",
       dangerouslySetInnerHTML: { __html: t }
     }
-  ) : /* @__PURE__ */ s("div", { className: "tw-rounded-sm tw-bg-base-alt tw-animate-pulse tw-h-full tw-min-h-[10px] tw-w-full" });
+  ) : /* @__PURE__ */ n("div", { className: "tw-rounded-sm tw-bg-base-alt tw-animate-pulse tw-h-full tw-min-h-[10px] tw-w-full" });
 };
 export {
-  d as SerializedText
+  c as SerializedText
 };
 //# sourceMappingURL=SerializedText.es.js.map

package/dist/components/RichTextEditor/SerializedText.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SerializedText.es.js","sources":["../../../src/components/RichTextEditor/SerializedText.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { serializeRawToHtmlAsync } from '@frontify/fondue';\nimport { useEffect, useState } from 'react';\n\nimport { type SerializedTextProps } from './types';\n\nexport const SerializedText = ({ value = '', gap, columns, show = true, plugins }: SerializedTextProps) => {\n    const [html, setHtml] = useState<string | null>(null);\n\n    useEffect(() => {\n        (async () => {\n            setHtml(await serializeRawToHtmlAsync(value, plugins, columns, gap));\n        })();\n    }, [value, columns, gap, plugins]);\n\n    if (!show || html === '<br />') {\n        return null;\n    }\n\n    return html !== null ? (\n        <div\n            className=\"tw-w-full tw-whitespace-pre-wrap\"\n            data-test-id=\"rte-content-html\"\n            dangerouslySetInnerHTML={{ __html: html }}\n        />\n    ) : (\n        <div className=\"tw-rounded-sm tw-bg-base-alt tw-animate-pulse tw-h-full tw-min-h-[10px] tw-w-full\" />\n    );\n};\n"],"names":["SerializedText","value","gap","columns","show","plugins","html","setHtml","useState","useEffect","serializeRawToHtmlAsync","jsx"],"mappings":";;;AAOa,MAAAA,IAAiB,CAAC,EAAE,OAAAC,IAAQ,IAAI,KAAAC,GAAK,SAAAC,GAAS,MAAAC,IAAO,IAAM,SAAAC,QAAmC;AACvG,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAwB,IAAI;AAQhD,SANJC,EAAU,MAAM;AACZ,KAAC,YACGF,EAAQ,MAAMG,EAAwBT,GAAOI,GAASF,GAASD,CAAG,CAAC;AAAA,KAExE,CAACD,GAAOE,GAASD,GAAKG,CAAO,CAAC,GAE7B,CAACD,KAAQE,MAAS,WACX,OAGJA,MAAS,OACZ,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAU;AAAA,MACV,gBAAa;AAAA,MACb,yBAAyB,EAAE,QAAQL,EAAK;AAAA,IAAA;AAAA,EAG5C,IAAA,gBAAAK,EAAC,OAAI,EAAA,WAAU,oFAAoF,CAAA;AAE3G;"}
+{"version":3,"file":"SerializedText.es.js","sources":["../../../src/components/RichTextEditor/SerializedText.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { serializeRawToHtmlAsync } from '@frontify/fondue';\nimport { useEffect, useState } from 'react';\n\nimport { type SerializedTextProps } from './types';\n\nexport const SerializedText = ({ value = '', gap, customClass, show = true, plugins }: SerializedTextProps) => {\n    const [html, setHtml] = useState<string | null>(null);\n\n    useEffect(() => {\n        (async () => {\n            setHtml(await serializeRawToHtmlAsync(value, plugins, undefined, gap, customClass));\n        })();\n    }, [value, gap, plugins, customClass]);\n\n    if (!show || html === '<br />') {\n        return null;\n    }\n\n    return html !== null ? (\n        <div\n            className=\"tw-w-full tw-whitespace-pre-wrap\"\n            data-test-id=\"rte-content-html\"\n            dangerouslySetInnerHTML={{ __html: html }}\n        />\n    ) : (\n        <div className=\"tw-rounded-sm tw-bg-base-alt tw-animate-pulse tw-h-full tw-min-h-[10px] tw-w-full\" />\n    );\n};\n"],"names":["SerializedText","value","gap","customClass","show","plugins","html","setHtml","useState","useEffect","serializeRawToHtmlAsync","jsx"],"mappings":";;;AAOa,MAAAA,IAAiB,CAAC,EAAE,OAAAC,IAAQ,IAAI,KAAAC,GAAK,aAAAC,GAAa,MAAAC,IAAO,IAAM,SAAAC,QAAmC;AAC3G,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAwB,IAAI;AAQhD,SANJC,EAAU,MAAM;AACZ,KAAC,YACGF,EAAQ,MAAMG,EAAwBT,GAAOI,GAAS,QAAWH,GAAKC,CAAW,CAAC;AAAA,KAEvF,CAACF,GAAOC,GAAKG,GAASF,CAAW,CAAC,GAEjC,CAACC,KAAQE,MAAS,WACX,OAGJA,MAAS,OACZ,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAU;AAAA,MACV,gBAAa;AAAA,MACb,yBAAyB,EAAE,QAAQL,EAAK;AAAA,IAAA;AAAA,EAG5C,IAAA,gBAAAK,EAAC,OAAI,EAAA,WAAU,oFAAoF,CAAA;AAE3G;"}

package/dist/components/RichTextEditor/plugins/ButtonPlugin/createButtonPlugin.es.js

@@ -1,6 +1,6 @@
 var n = Object.defineProperty;
-var u = (i, t, r) => t in i ? n(i, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : i[t] = r;
-var e = (i, t, r) => (u(i, typeof t != "symbol" ? t + "" : t, r), r);
+var u = (r, t, i) => t in r ? n(r, t, { enumerable: !0, configurable: !0, writable: !0, value: i }) : r[t] = i;
+var e = (r, t, i) => u(r, typeof t != "symbol" ? t + "" : t, i);
 import { createPluginFactory as a, Plugin as s } from "@frontify/fondue";
 import { isValidUrl as g } from "../../../Link/utils/url.es.js";
 import { ButtonMarkupElement as l } from "./ButtonMarkupElement/index.es.js";
@@ -8,7 +8,7 @@ import { ButtonButton as d } from "./components/ButtonButton.es.js";
 import { CustomFloatingButton as p } from "./components/FloatingButton/CustomFloatingButton.es.js";
 import { withButton as B } from "./withButton.es.js";
 import { BlockButtonStyles as m } from "./utils/styles.es.js";
-const c = "button", f = "button-plugin", h = (i) => a({
+const c = "button", f = "button-plugin", h = (r) => a({
   key: c,
   isElement: !0,
   isInline: !0,
@@ -25,9 +25,9 @@ const c = "button", f = "button-plugin", h = (i) => a({
       afterMatch: !0
     },
     triggerFloatingButtonHotkeys: "command+shift+k, ctrl+shift+k",
-    appBridge: i
+    appBridge: r
   },
-  then: (t, { type: r }) => ({
+  then: (t, { type: i }) => ({
     deserializeHtml: {
       rules: [
         {
@@ -36,7 +36,7 @@ const c = "button", f = "button-plugin", h = (i) => a({
         }
       ],
       getNode: (o) => ({
-        type: r,
+        type: i,
         url: o.getAttribute("href"),
         target: o.getAttribute("target") || "_blank"
       })
@@ -44,7 +44,7 @@ const c = "button", f = "button-plugin", h = (i) => a({
   })
 })();
 class v extends s {
-  constructor({ styles: r = m, ...o }) {
+  constructor({ styles: i = m, ...o }) {
     super(f, {
       button: d,
       markupElement: new l(),
@@ -52,7 +52,7 @@ class v extends s {
     });
     e(this, "styles", {});
     e(this, "appBridge");
-    this.styles = r, this.appBridge = o == null ? void 0 : o.appBridge;
+    this.styles = i, this.appBridge = o == null ? void 0 : o.appBridge;
   }
   plugins() {
     return [h(this.appBridge)];

package/dist/components/RichTextEditor/plugins/ColumnBreakPlugin/ColumnBreakPlugin.es.js

@@ -0,0 +1,27 @@
+var l = Object.defineProperty;
+var e = (n, s, t) => s in n ? l(n, s, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[s] = t;
+var u = (n, s, t) => e(n, typeof s != "symbol" ? s + "" : s, t);
+import { Plugin as a, ColumnBreakButton as m, createColumnBreakPlugin as i } from "@frontify/fondue";
+import { getResponsiveColumnClasses as o } from "./helpers.es.js";
+const h = "breakAfterColumn", c = "normal";
+class E extends a {
+  constructor(t) {
+    super("break-after-plugin", {
+      button: m,
+      ...t
+    });
+    u(this, "columns");
+    u(this, "gap");
+    u(this, "customClass");
+    this.columns = (t == null ? void 0 : t.columns) ?? 1, this.gap = (t == null ? void 0 : t.gap) ?? c, this.customClass = o(this.columns);
+  }
+  plugins() {
+    return [i(this.columns, this.gap, this.customClass)];
+  }
+}
+export {
+  E as BreakAfterPlugin,
+  c as GAP_DEFAULT,
+  h as KEY_ELEMENT_BREAK_AFTER_COLUMN
+};
+//# sourceMappingURL=ColumnBreakPlugin.es.js.map

package/dist/components/RichTextEditor/plugins/ColumnBreakPlugin/ColumnBreakPlugin.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnBreakPlugin.es.js","sources":["../../../../../src/components/RichTextEditor/plugins/ColumnBreakPlugin/ColumnBreakPlugin.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type PlatePlugin, Plugin, createColumnBreakPlugin, ColumnBreakButton } from '@frontify/fondue';\nimport { type CSSProperties } from 'react';\n\nimport { getResponsiveColumnClasses } from './helpers';\n\nexport const KEY_ELEMENT_BREAK_AFTER_COLUMN = 'breakAfterColumn';\nexport const GAP_DEFAULT = 'normal';\n\nexport class BreakAfterPlugin extends Plugin {\n    private columns: number;\n    private gap: CSSProperties['gap'];\n    private customClass: string | undefined;\n    constructor(props?: { columns?: number; gap?: string | number }) {\n        super('break-after-plugin', {\n            button: ColumnBreakButton,\n            ...props,\n        });\n        this.columns = props?.columns ?? 1;\n        this.gap = props?.gap ?? GAP_DEFAULT;\n        this.customClass = getResponsiveColumnClasses(this.columns);\n    }\n\n    plugins(): PlatePlugin[] {\n        return [createColumnBreakPlugin(this.columns, this.gap, this.customClass)];\n    }\n}\n"],"names":["KEY_ELEMENT_BREAK_AFTER_COLUMN","GAP_DEFAULT","BreakAfterPlugin","Plugin","props","ColumnBreakButton","__publicField","getResponsiveColumnClasses","createColumnBreakPlugin"],"mappings":";;;;;AAOO,MAAMA,IAAiC,oBACjCC,IAAc;AAEpB,MAAMC,UAAyBC,EAAO;AAAA,EAIzC,YAAYC,GAAqD;AAC7D,UAAM,sBAAsB;AAAA,MACxB,QAAQC;AAAA,MACR,GAAGD;AAAA,IAAA,CACN;AAPG,IAAAE,EAAA;AACA,IAAAA,EAAA;AACA,IAAAA,EAAA;AAMC,SAAA,WAAUF,KAAA,gBAAAA,EAAO,YAAW,GAC5B,KAAA,OAAMA,KAAA,gBAAAA,EAAO,QAAOH,GACpB,KAAA,cAAcM,EAA2B,KAAK,OAAO;AAAA,EAC9D;AAAA,EAEA,UAAyB;AACd,WAAA,CAACC,EAAwB,KAAK,SAAS,KAAK,KAAK,KAAK,WAAW,CAAC;AAAA,EAC7E;AACJ;"}

package/dist/components/RichTextEditor/plugins/ColumnBreakPlugin/helpers.es.js

@@ -0,0 +1,12 @@
+const m = {
+  1: "tw-columns-1",
+  2: "tw-columns-1 @sm:!tw-columns-2",
+  3: "tw-columns-1 @sm:!tw-columns-2 @md:!tw-columns-3",
+  4: "tw-columns-1 @sm:!tw-columns-2 @md:!tw-columns-4",
+  5: "tw-columns-1 @sm:!tw-columns-2 @md:!tw-columns-5"
+}, n = (s) => s ? m[s] || m[1] : "";
+export {
+  m as columnClassMap,
+  n as getResponsiveColumnClasses
+};
+//# sourceMappingURL=helpers.es.js.map

package/dist/components/RichTextEditor/plugins/ColumnBreakPlugin/helpers.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.es.js","sources":["../../../../../src/components/RichTextEditor/plugins/ColumnBreakPlugin/helpers.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nexport const columnClassMap = {\n    1: 'tw-columns-1',\n    2: 'tw-columns-1 @sm:!tw-columns-2',\n    3: 'tw-columns-1 @sm:!tw-columns-2 @md:!tw-columns-3',\n    4: 'tw-columns-1 @sm:!tw-columns-2 @md:!tw-columns-4',\n    5: 'tw-columns-1 @sm:!tw-columns-2 @md:!tw-columns-5',\n};\n\nexport const getResponsiveColumnClasses = (columnCount?: number) => {\n    if (!columnCount) {\n        return '';\n    }\n\n    return columnClassMap[columnCount as keyof typeof columnClassMap] || columnClassMap[1];\n};\n"],"names":["columnClassMap","getResponsiveColumnClasses","columnCount"],"mappings":"AAEO,MAAMA,IAAiB;AAAA,EAC1B,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACP,GAEaC,IAA6B,CAACC,MAClCA,IAIEF,EAAeE,CAA0C,KAAKF,EAAe,CAAC,IAH1E;"}

package/dist/components/RichTextEditor/plugins/LinkPlugin/index.es.js

@@ -1,6 +1,6 @@
 var a = Object.defineProperty;
 var l = (t, e, r) => e in t ? a(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r;
-var i = (t, e, r) => (l(t, typeof e != "symbol" ? e + "" : e, r), r);
+var i = (t, e, r) => l(t, typeof e != "symbol" ? e + "" : e, r);
 import { createPluginFactory as s, createLinkPlugin as p, Plugin as m } from "@frontify/fondue";
 import { BlockStyles as u } from "../styles.es.js";
 import { CustomFloatingLink as g } from "./FloatingLink/CustomFloatingLink.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom1Plugin.es.js

@@ -1,6 +1,6 @@
 var a = Object.defineProperty;
 var c = (t, s, e) => s in t ? a(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var n = (t, s, e) => (c(t, typeof s != "symbol" ? s + "" : s, e), e);
+var n = (t, s, e) => c(t, typeof s != "symbol" ? s + "" : s, e);
 import { jsx as r } from "react/jsx-runtime";
 import { Plugin as i, MarkupElement as p, merge as g, alignmentClassnames as y, getColumnBreakClasses as C, createPluginFactory as k } from "@frontify/fondue";
 import { TextStyles as o, BlockStyles as x } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom2Plugin.es.js

@@ -1,6 +1,6 @@
 var a = Object.defineProperty;
 var c = (t, s, e) => s in t ? a(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var n = (t, s, e) => (c(t, typeof s != "symbol" ? s + "" : s, e), e);
+var n = (t, s, e) => c(t, typeof s != "symbol" ? s + "" : s, e);
 import { jsx as r } from "react/jsx-runtime";
 import { Plugin as i, MarkupElement as p, merge as g, alignmentClassnames as y, getColumnBreakClasses as C, createPluginFactory as k } from "@frontify/fondue";
 import { TextStyles as o, BlockStyles as x } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom3Plugin.es.js

@@ -1,6 +1,6 @@
 var a = Object.defineProperty;
 var c = (t, s, e) => s in t ? a(t, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : t[s] = e;
-var n = (t, s, e) => (c(t, typeof s != "symbol" ? s + "" : s, e), e);
+var n = (t, s, e) => c(t, typeof s != "symbol" ? s + "" : s, e);
 import { jsx as r } from "react/jsx-runtime";
 import { Plugin as i, TextStyles as o, MarkupElement as p, merge as g, alignmentClassnames as y, getColumnBreakClasses as C, createPluginFactory as k } from "@frontify/fondue";
 import { BlockStyles as x } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading1Plugin.es.js

@@ -1,6 +1,6 @@
 var g = Object.defineProperty;
 var m = (t, e, n) => e in t ? g(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var r = (t, e, n) => (m(t, typeof e != "symbol" ? e + "" : e, n), n);
+var r = (t, e, n) => m(t, typeof e != "symbol" ? e + "" : e, n);
 import { jsx as i } from "react/jsx-runtime";
 import { Plugin as u, MarkupElement as c, merge as d, alignmentClassnames as p, getColumnBreakClasses as y, createPluginFactory as h } from "@frontify/fondue";
 import { TextStyles as o, BlockStyles as k } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading2Plugin.es.js

@@ -1,6 +1,6 @@
 var g = Object.defineProperty;
 var m = (t, e, n) => e in t ? g(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var r = (t, e, n) => (m(t, typeof e != "symbol" ? e + "" : e, n), n);
+var r = (t, e, n) => m(t, typeof e != "symbol" ? e + "" : e, n);
 import { jsx as i } from "react/jsx-runtime";
 import { Plugin as u, MarkupElement as c, merge as d, alignmentClassnames as p, getColumnBreakClasses as y, createPluginFactory as h } from "@frontify/fondue";
 import { TextStyles as o, BlockStyles as k } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading3Plugin.es.js

@@ -1,6 +1,6 @@
 var g = Object.defineProperty;
 var m = (t, e, n) => e in t ? g(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var r = (t, e, n) => (m(t, typeof e != "symbol" ? e + "" : e, n), n);
+var r = (t, e, n) => m(t, typeof e != "symbol" ? e + "" : e, n);
 import { jsx as i } from "react/jsx-runtime";
 import { Plugin as u, MarkupElement as c, merge as d, alignmentClassnames as p, getColumnBreakClasses as y, createPluginFactory as h } from "@frontify/fondue";
 import { TextStyles as o, BlockStyles as k } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading4Plugin.es.js

@@ -1,6 +1,6 @@
 var g = Object.defineProperty;
 var m = (t, e, n) => e in t ? g(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var r = (t, e, n) => (m(t, typeof e != "symbol" ? e + "" : e, n), n);
+var r = (t, e, n) => m(t, typeof e != "symbol" ? e + "" : e, n);
 import { jsx as i } from "react/jsx-runtime";
 import { Plugin as u, MarkupElement as c, merge as d, alignmentClassnames as p, getColumnBreakClasses as y, createPluginFactory as h } from "@frontify/fondue";
 import { TextStyles as o, BlockStyles as k } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/imageCaptionPlugin.es.js

@@ -1,6 +1,6 @@
 var r = Object.defineProperty;
 var p = (t, e, a) => e in t ? r(t, e, { enumerable: !0, configurable: !0, writable: !0, value: a }) : t[e] = a;
-var o = (t, e, a) => (p(t, typeof e != "symbol" ? e + "" : e, a), a);
+var o = (t, e, a) => p(t, typeof e != "symbol" ? e + "" : e, a);
 import { jsx as m } from "react/jsx-runtime";
 import { Plugin as g, MarkupElement as u, merge as c, alignmentClassnames as C, getColumnBreakClasses as y, createPluginFactory as k } from "@frontify/fondue";
 import { TextStyles as s, BlockStyles as x } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/imageTitlePlugin.es.js

@@ -1,6 +1,6 @@
 var o = Object.defineProperty;
 var g = (t, e, l) => e in t ? o(t, e, { enumerable: !0, configurable: !0, writable: !0, value: l }) : t[e] = l;
-var m = (t, e, l) => (g(t, typeof e != "symbol" ? e + "" : e, l), l);
+var m = (t, e, l) => g(t, typeof e != "symbol" ? e + "" : e, l);
 import { jsx as r } from "react/jsx-runtime";
 import { Plugin as u, MarkupElement as c, merge as p, alignmentClassnames as T, getColumnBreakClasses as y, createPluginFactory as k } from "@frontify/fondue";
 import { TextStyles as a, BlockStyles as x } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/paragraphPlugin.es.js

@@ -1,6 +1,6 @@
 var m = Object.defineProperty;
 var u = (t, e, r) => e in t ? m(t, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[e] = r;
-var p = (t, e, r) => (u(t, typeof e != "symbol" ? e + "" : e, r), r);
+var p = (t, e, r) => u(t, typeof e != "symbol" ? e + "" : e, r);
 import { jsx as o } from "react/jsx-runtime";
 import { Plugin as g, merge as i, alignmentClassnames as P, getColumnBreakClasses as y, MarkupElement as h, createPluginFactory as k, createParagraphPlugin as x } from "@frontify/fondue";
 import { TextStyles as n, BlockStyles as E } from "../styles.es.js";

package/dist/components/RichTextEditor/plugins/TextStylePlugins/quotePlugin.es.js

@@ -1,6 +1,6 @@
 var m = Object.defineProperty;
 var c = (t, e, s) => e in t ? m(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
-var u = (t, e, s) => (c(t, typeof e != "symbol" ? e + "" : e, s), s);
+var u = (t, e, s) => c(t, typeof e != "symbol" ? e + "" : e, s);
 import { jsx as r } from "react/jsx-runtime";
 import { Plugin as i, MarkupElement as p, merge as g, alignmentClassnames as k, getColumnBreakClasses as y, createPluginFactory as d } from "@frontify/fondue";
 import { TextStyles as a, BlockStyles as q } from "../styles.es.js";