@frontify/fondue 12.0.0-beta.333 → 12.0.0-beta.334
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListElement.es.js +7 -7
- package/dist/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListElement.es.js.map +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/package.json +9 -1
|
@@ -2,14 +2,14 @@ import { jsxs as w, jsx as c } from "react/jsx-runtime";
|
|
|
2
2
|
import { ReactEditor as f } from "slate-react";
|
|
3
3
|
import { getRootProps as x, setNodes as E } from "@udecode/plate";
|
|
4
4
|
import { merge as i } from "../../../../utilities/merge.es.js";
|
|
5
|
-
import { MarkupElement as
|
|
6
|
-
import { ELEMENT_CHECK_ITEM as
|
|
5
|
+
import { MarkupElement as u } from "../MarkupElement.es.js";
|
|
6
|
+
import { ELEMENT_CHECK_ITEM as C } from "./id.es.js";
|
|
7
7
|
import { justifyClassNames as k } from "../helper.es.js";
|
|
8
8
|
import { useRichTextEditorContext as g } from "../../context/RichTextEditorContext.es.js";
|
|
9
9
|
const N = (t, e) => t[e.children[0].textStyle], S = "tw-flex tw-flex-row tw-pb-2 tw-gap-1.5 tw-items-center", b = "focus:tw-outline-none tw-w-auto tw-min-w-[10px]", y = (t) => {
|
|
10
|
-
const { attributes: e, children: s, nodeProps: m, element: o, editor: n } = t,
|
|
11
|
-
return /* @__PURE__ */ w("div", { ...e, ...
|
|
12
|
-
/* @__PURE__ */ c("div", { contentEditable: !1, className: "tw-select-none", children: /* @__PURE__ */ c(
|
|
10
|
+
const { attributes: e, children: s, nodeProps: m, element: o, editor: n } = t, l = x(t), r = o.checked, a = o.align ?? "left", { styles: d } = g();
|
|
11
|
+
return /* @__PURE__ */ w("div", { ...e, ...l, className: i([S, k[a]]), children: [
|
|
12
|
+
/* @__PURE__ */ c("div", { contentEditable: !1, className: "tw-flex tw-items-center tw-justify-center tw-select-none", children: /* @__PURE__ */ c(
|
|
13
13
|
"input",
|
|
14
14
|
{
|
|
15
15
|
"data-test-id": "checkbox-input",
|
|
@@ -33,8 +33,8 @@ const N = (t, e) => t[e.children[0].textStyle], S = "tw-flex tw-flex-row tw-pb-2
|
|
|
33
33
|
)
|
|
34
34
|
] });
|
|
35
35
|
};
|
|
36
|
-
class R extends
|
|
37
|
-
constructor(e =
|
|
36
|
+
class R extends u {
|
|
37
|
+
constructor(e = C, s = y) {
|
|
38
38
|
super(e, s);
|
|
39
39
|
}
|
|
40
40
|
}
|
package/dist/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListElement.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxListElement.es.js","sources":["../../../../../src/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListElement.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { CSSProperties } from 'react';\nimport { ReactEditor } from 'slate-react';\nimport { PlateRenderElementProps, TElement, TTodoListItemElement, getRootProps, setNodes } from '@udecode/plate';\nimport { merge } from '@utilities/merge';\nimport { MarkupElement } from '../MarkupElement';\nimport { ELEMENT_CHECK_ITEM } from './id';\nimport { justifyClassNames } from '../helper';\nimport { useRichTextEditorContext } from '@components/RichTextEditor/context';\n\nconst getCheckboxListStyles = (styles: Record<string, CSSProperties>, element: TElement): CSSProperties =>\n styles[element.children[0].textStyle as string];\n\nexport const CHECKBOX_DIV_CLASSES = 'tw-flex tw-flex-row tw-pb-2 tw-gap-1.5 tw-items-center';\nexport const CHECKBOX_SPAN_CLASSES = 'focus:tw-outline-none tw-w-auto tw-min-w-[10px]';\n\nexport const CheckboxListElementNode = (props: PlateRenderElementProps) => {\n const { attributes, children, nodeProps, element, editor } = props;\n const rootProps = getRootProps(props);\n const checked = element.checked as boolean;\n const align = (element.align as string) ?? 'left';\n const { styles } = useRichTextEditorContext();\n\n return (\n <div {...attributes} {...rootProps} className={merge([CHECKBOX_DIV_CLASSES, justifyClassNames[align]])}>\n <div contentEditable={false} className=\"tw-select-none\">\n <input\n data-test-id=\"checkbox-input\"\n className=\"tw-w-4 tw-h-4 tw-m-0\"\n type=\"checkbox\"\n checked={!!checked}\n onChange={(e) => {\n const path = ReactEditor.findPath(editor as ReactEditor, element);\n setNodes<TTodoListItemElement>(editor, { checked: e.target.checked }, { at: path });\n }}\n {...nodeProps}\n />\n </div>\n <span\n style={getCheckboxListStyles(styles, element)}\n className={merge([CHECKBOX_SPAN_CLASSES, checked && '!tw-line-through'])}\n >\n {children}\n </span>\n </div>\n );\n};\n\nexport class CheckboxListElement extends MarkupElement {\n constructor(id = ELEMENT_CHECK_ITEM, node = CheckboxListElementNode) {\n super(id, node);\n }\n}\n"],"names":["getCheckboxListStyles","styles","element","CHECKBOX_DIV_CLASSES","CHECKBOX_SPAN_CLASSES","CheckboxListElementNode","props","attributes","children","nodeProps","editor","rootProps","getRootProps","checked","align","useRichTextEditorContext","jsxs","merge","justifyClassNames","jsx","e","path","ReactEditor","setNodes","CheckboxListElement","MarkupElement","id","ELEMENT_CHECK_ITEM","node"],"mappings":";;;;;;;;AAWA,MAAMA,IAAwB,CAACC,GAAuCC,MAClED,EAAOC,EAAQ,SAAS,CAAC,EAAE,SAAmB,GAErCC,IAAuB,0DACvBC,IAAwB,mDAExBC,IAA0B,CAACC,MAAmC;AACvE,QAAM,EAAE,YAAAC,GAAY,UAAAC,GAAU,WAAAC,GAAW,SAAAP,GAAS,QAAAQ,EAAW,IAAAJ,GACvDK,IAAYC,EAAaN,CAAK,GAC9BO,IAAUX,EAAQ,SAClBY,IAASZ,EAAQ,SAAoB,QACrC,EAAE,QAAAD,MAAWc;AAEnB,SACK,gBAAAC,EAAA,OAAA,EAAK,GAAGT,GAAa,GAAGI,GAAW,WAAWM,EAAM,CAACd,GAAsBe,EAAkBJ,CAAK,CAAC,CAAC,GACjG,UAAA;AAAA,IAAA,gBAAAK,EAAC,OAAI,EAAA,iBAAiB,IAAO,WAAU,
|
|
1
|
+
{"version":3,"file":"CheckboxListElement.es.js","sources":["../../../../../src/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListElement.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { CSSProperties } from 'react';\nimport { ReactEditor } from 'slate-react';\nimport { PlateRenderElementProps, TElement, TTodoListItemElement, getRootProps, setNodes } from '@udecode/plate';\nimport { merge } from '@utilities/merge';\nimport { MarkupElement } from '../MarkupElement';\nimport { ELEMENT_CHECK_ITEM } from './id';\nimport { justifyClassNames } from '../helper';\nimport { useRichTextEditorContext } from '@components/RichTextEditor/context';\n\nconst getCheckboxListStyles = (styles: Record<string, CSSProperties>, element: TElement): CSSProperties =>\n styles[element.children[0].textStyle as string];\n\nexport const CHECKBOX_DIV_CLASSES = 'tw-flex tw-flex-row tw-pb-2 tw-gap-1.5 tw-items-center';\nexport const CHECKBOX_SPAN_CLASSES = 'focus:tw-outline-none tw-w-auto tw-min-w-[10px]';\n\nexport const CheckboxListElementNode = (props: PlateRenderElementProps) => {\n const { attributes, children, nodeProps, element, editor } = props;\n const rootProps = getRootProps(props);\n const checked = element.checked as boolean;\n const align = (element.align as string) ?? 'left';\n const { styles } = useRichTextEditorContext();\n\n return (\n <div {...attributes} {...rootProps} className={merge([CHECKBOX_DIV_CLASSES, justifyClassNames[align]])}>\n <div contentEditable={false} className=\"tw-flex tw-items-center tw-justify-center tw-select-none\">\n <input\n data-test-id=\"checkbox-input\"\n className=\"tw-w-4 tw-h-4 tw-m-0\"\n type=\"checkbox\"\n checked={!!checked}\n onChange={(e) => {\n const path = ReactEditor.findPath(editor as ReactEditor, element);\n setNodes<TTodoListItemElement>(editor, { checked: e.target.checked }, { at: path });\n }}\n {...nodeProps}\n />\n </div>\n <span\n style={getCheckboxListStyles(styles, element)}\n className={merge([CHECKBOX_SPAN_CLASSES, checked && '!tw-line-through'])}\n >\n {children}\n </span>\n </div>\n );\n};\n\nexport class CheckboxListElement extends MarkupElement {\n constructor(id = ELEMENT_CHECK_ITEM, node = CheckboxListElementNode) {\n super(id, node);\n }\n}\n"],"names":["getCheckboxListStyles","styles","element","CHECKBOX_DIV_CLASSES","CHECKBOX_SPAN_CLASSES","CheckboxListElementNode","props","attributes","children","nodeProps","editor","rootProps","getRootProps","checked","align","useRichTextEditorContext","jsxs","merge","justifyClassNames","jsx","e","path","ReactEditor","setNodes","CheckboxListElement","MarkupElement","id","ELEMENT_CHECK_ITEM","node"],"mappings":";;;;;;;;AAWA,MAAMA,IAAwB,CAACC,GAAuCC,MAClED,EAAOC,EAAQ,SAAS,CAAC,EAAE,SAAmB,GAErCC,IAAuB,0DACvBC,IAAwB,mDAExBC,IAA0B,CAACC,MAAmC;AACvE,QAAM,EAAE,YAAAC,GAAY,UAAAC,GAAU,WAAAC,GAAW,SAAAP,GAAS,QAAAQ,EAAW,IAAAJ,GACvDK,IAAYC,EAAaN,CAAK,GAC9BO,IAAUX,EAAQ,SAClBY,IAASZ,EAAQ,SAAoB,QACrC,EAAE,QAAAD,MAAWc;AAEnB,SACK,gBAAAC,EAAA,OAAA,EAAK,GAAGT,GAAa,GAAGI,GAAW,WAAWM,EAAM,CAACd,GAAsBe,EAAkBJ,CAAK,CAAC,CAAC,GACjG,UAAA;AAAA,IAAA,gBAAAK,EAAC,OAAI,EAAA,iBAAiB,IAAO,WAAU,4DACnC,UAAA,gBAAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,gBAAa;AAAA,QACb,WAAU;AAAA,QACV,MAAK;AAAA,QACL,SAAS,CAAC,CAACN;AAAA,QACX,UAAU,CAACO,MAAM;AACb,gBAAMC,IAAOC,EAAY,SAASZ,GAAuBR,CAAO;AACjC,UAAAqB,EAAAb,GAAQ,EAAE,SAASU,EAAE,OAAO,WAAW,EAAE,IAAIC,EAAA,CAAM;AAAA,QACtF;AAAA,QACC,GAAGZ;AAAA,MAAA;AAAA,IAAA,GAEZ;AAAA,IACA,gBAAAU;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,OAAOnB,EAAsBC,GAAQC,CAAO;AAAA,QAC5C,WAAWe,EAAM,CAACb,GAAuBS,KAAW,kBAAkB,CAAC;AAAA,QAEtE,UAAAL;AAAA,MAAA;AAAA,IACL;AAAA,EACJ,EAAA,CAAA;AAER;AAEO,MAAMgB,UAA4BC,EAAc;AAAA,EACnD,YAAYC,IAAKC,GAAoBC,IAAOvB,GAAyB;AACjE,UAAMqB,GAAIE,CAAI;AAAA,EAClB;AACJ;"}
|