@frontify/guideline-blocks-settings 0.28.6 → 0.29.1

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.
Files changed (102) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/dist/components/BlockItemWrapper/BlockItemWrapper.es.js.map +1 -1
  3. package/dist/components/RichTextEditor/SerializedText.es.js +2 -2
  4. package/dist/components/RichTextEditor/SerializedText.es.js.map +1 -1
  5. package/dist/components/RichTextEditor/plugins/ButtonPlugin/components/FloatingButton/useFloatingButtonEdit.es.js +5 -5
  6. package/dist/components/RichTextEditor/plugins/ButtonPlugin/utils/triggerFloatingButton.es.js +6 -6
  7. package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom1Plugin.es.js +15 -14
  8. package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom1Plugin.es.js.map +1 -1
  9. package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom2Plugin.es.js +15 -14
  10. package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom2Plugin.es.js.map +1 -1
  11. package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom3Plugin.es.js +15 -14
  12. package/dist/components/RichTextEditor/plugins/TextStylePlugins/custom3Plugin.es.js.map +1 -1
  13. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading1Plugin.es.js +10 -9
  14. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading1Plugin.es.js.map +1 -1
  15. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading2Plugin.es.js +15 -7
  16. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading2Plugin.es.js.map +1 -1
  17. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading3Plugin.es.js +15 -7
  18. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading3Plugin.es.js.map +1 -1
  19. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading4Plugin.es.js +15 -7
  20. package/dist/components/RichTextEditor/plugins/TextStylePlugins/heading4Plugin.es.js.map +1 -1
  21. package/dist/components/RichTextEditor/plugins/TextStylePlugins/imageCaptionPlugin.es.js +15 -14
  22. package/dist/components/RichTextEditor/plugins/TextStylePlugins/imageCaptionPlugin.es.js.map +1 -1
  23. package/dist/components/RichTextEditor/plugins/TextStylePlugins/imageTitlePlugin.es.js +18 -17
  24. package/dist/components/RichTextEditor/plugins/TextStylePlugins/imageTitlePlugin.es.js.map +1 -1
  25. package/dist/components/RichTextEditor/plugins/TextStylePlugins/quotePlugin.es.js +13 -12
  26. package/dist/components/RichTextEditor/plugins/TextStylePlugins/quotePlugin.es.js.map +1 -1
  27. package/dist/components/RichTextEditor/plugins/styles.es.js +0 -1
  28. package/dist/components/RichTextEditor/plugins/styles.es.js.map +1 -1
  29. package/dist/index.cjs.js +3 -20
  30. package/dist/index.cjs.js.map +1 -1
  31. package/dist/index.d.ts +3 -3
  32. package/dist/index.umd.js +3 -20
  33. package/dist/index.umd.js.map +1 -1
  34. package/dist/styles.css +1 -1
  35. package/dist/utilities/color/getReadableColor.es.js +8 -8
  36. package/dist/utilities/color/getReadableColor.es.js.map +1 -1
  37. package/dist/utilities/color/isDark.es.js +2 -2
  38. package/dist/utilities/color/isDark.es.js.map +1 -1
  39. package/dist/utilities/color/setAlpha.es.js +2 -2
  40. package/dist/utilities/color/setAlpha.es.js.map +1 -1
  41. package/dist/utilities/color/toColorObject.es.js +5 -5
  42. package/dist/utilities/color/toColorObject.es.js.map +1 -1
  43. package/dist/utilities/color/toHex8String.es.js +3 -3
  44. package/dist/utilities/color/toHex8String.es.js.map +1 -1
  45. package/dist/utilities/color/toHexString.es.js +3 -3
  46. package/dist/utilities/color/toHexString.es.js.map +1 -1
  47. package/dist/utilities/color/toRgbaString.es.js +3 -3
  48. package/dist/utilities/color/toRgbaString.es.js.map +1 -1
  49. package/package.json +24 -26
  50. package/src/components/Attachments/Attachments.spec.ct.tsx +1 -1
  51. package/src/components/BlockItemWrapper/BlockItemWrapper.tsx +2 -2
  52. package/src/components/BlockItemWrapper/types.ts +2 -0
  53. package/src/components/Link/LinkSelector/LinkSelector.spec.ct.tsx +1 -1
  54. package/src/components/RichTextEditor/RichTextEditor.spec.ct.tsx +1 -1
  55. package/src/components/RichTextEditor/SerializedText.tsx +2 -2
  56. package/src/components/RichTextEditor/plugins/TextStylePlugins/custom1Plugin.tsx +3 -2
  57. package/src/components/RichTextEditor/plugins/TextStylePlugins/custom2Plugin.tsx +3 -2
  58. package/src/components/RichTextEditor/plugins/TextStylePlugins/custom3Plugin.tsx +3 -2
  59. package/src/components/RichTextEditor/plugins/TextStylePlugins/heading1Plugin.tsx +3 -2
  60. package/src/components/RichTextEditor/plugins/TextStylePlugins/heading2Plugin.tsx +6 -2
  61. package/src/components/RichTextEditor/plugins/TextStylePlugins/heading3Plugin.tsx +6 -2
  62. package/src/components/RichTextEditor/plugins/TextStylePlugins/heading4Plugin.tsx +6 -2
  63. package/src/components/RichTextEditor/plugins/TextStylePlugins/imageCaptionPlugin.tsx +3 -2
  64. package/src/components/RichTextEditor/plugins/TextStylePlugins/imageTitlePlugin.tsx +3 -2
  65. package/src/components/RichTextEditor/plugins/TextStylePlugins/quotePlugin.tsx +3 -2
  66. package/src/components/RichTextEditor/plugins/styles.ts +1 -2
  67. package/src/utilities/color/getReadableColor.ts +3 -3
  68. package/src/utilities/color/isDark.ts +2 -2
  69. package/src/utilities/color/setAlpha.ts +2 -2
  70. package/src/utilities/color/toColorObject.ts +2 -2
  71. package/src/utilities/color/toHex8String.ts +2 -2
  72. package/src/utilities/color/toHexString.ts +2 -2
  73. package/src/utilities/color/toRgbaString.ts +2 -2
  74. package/tsconfig.json +1 -1
  75. package/dist/components/RichTextEditor/serializer/nodes/button.es.js +0 -17
  76. package/dist/components/RichTextEditor/serializer/nodes/button.es.js.map +0 -1
  77. package/dist/components/RichTextEditor/serializer/nodes/checkItemNode.es.js +0 -19
  78. package/dist/components/RichTextEditor/serializer/nodes/checkItemNode.es.js.map +0 -1
  79. package/dist/components/RichTextEditor/serializer/nodes/default.es.js +0 -32
  80. package/dist/components/RichTextEditor/serializer/nodes/default.es.js.map +0 -1
  81. package/dist/components/RichTextEditor/serializer/nodes/link.es.js +0 -15
  82. package/dist/components/RichTextEditor/serializer/nodes/link.es.js.map +0 -1
  83. package/dist/components/RichTextEditor/serializer/nodes/mentionHtmlNode.es.js +0 -12
  84. package/dist/components/RichTextEditor/serializer/nodes/mentionHtmlNode.es.js.map +0 -1
  85. package/dist/components/RichTextEditor/serializer/serializeNodesToHtmlRecursive.es.js +0 -61
  86. package/dist/components/RichTextEditor/serializer/serializeNodesToHtmlRecursive.es.js.map +0 -1
  87. package/dist/components/RichTextEditor/serializer/serializeToHtml.es.js +0 -25
  88. package/dist/components/RichTextEditor/serializer/serializeToHtml.es.js.map +0 -1
  89. package/dist/components/RichTextEditor/serializer/utlis/reactCssPropsToCss.es.js +0 -8
  90. package/dist/components/RichTextEditor/serializer/utlis/reactCssPropsToCss.es.js.map +0 -1
  91. package/dist/components/RichTextEditor/serializer/utlis/serializeLeafToHtml.es.js +0 -13
  92. package/dist/components/RichTextEditor/serializer/utlis/serializeLeafToHtml.es.js.map +0 -1
  93. package/src/components/RichTextEditor/serializer/index.ts +0 -3
  94. package/src/components/RichTextEditor/serializer/nodes/button.ts +0 -27
  95. package/src/components/RichTextEditor/serializer/nodes/checkItemNode.ts +0 -30
  96. package/src/components/RichTextEditor/serializer/nodes/default.ts +0 -68
  97. package/src/components/RichTextEditor/serializer/nodes/link.ts +0 -26
  98. package/src/components/RichTextEditor/serializer/nodes/mentionHtmlNode.ts +0 -17
  99. package/src/components/RichTextEditor/serializer/serializeNodesToHtmlRecursive.ts +0 -134
  100. package/src/components/RichTextEditor/serializer/serializeToHtml.ts +0 -49
  101. package/src/components/RichTextEditor/serializer/utlis/reactCssPropsToCss.ts +0 -21
  102. package/src/components/RichTextEditor/serializer/utlis/serializeLeafToHtml.ts +0 -32
@@ -1,7 +1,7 @@
1
1
  /* (c) Copyright Frontify Ltd., all rights reserved. */
2
2
 
3
3
  import { Color } from '@frontify/fondue';
4
- import tinycolor from '@ctrl/tinycolor';
4
+ import { TinyColor } from '@ctrl/tinycolor';
5
5
 
6
6
  /**
7
7
  * Maps color strings to color objects.
@@ -11,6 +11,6 @@ import tinycolor from '@ctrl/tinycolor';
11
11
  */
12
12
 
13
13
  export const toColorObject = (colorString: string): Color => {
14
- const { r, g, b, a } = tinycolor(colorString);
14
+ const { r, g, b, a } = new TinyColor(colorString);
15
15
  return { red: r, green: g, blue: b, alpha: a };
16
16
  };
@@ -1,7 +1,7 @@
1
1
  /* (c) Copyright Frontify Ltd., all rights reserved. */
2
2
 
3
3
  import { Color } from '@frontify/fondue';
4
- import tinycolor from '@ctrl/tinycolor';
4
+ import { TinyColor } from '@ctrl/tinycolor';
5
5
  import { toShortRgba } from './toShortRgba';
6
6
 
7
7
  /**
@@ -11,4 +11,4 @@ import { toShortRgba } from './toShortRgba';
11
11
  * @returns {String} To be used as css value.
12
12
  */
13
13
 
14
- export const toHex8String = (color: Color): string => tinycolor(toShortRgba(color)).toHex8String();
14
+ export const toHex8String = (color: Color): string => new TinyColor(toShortRgba(color)).toHex8String();
@@ -1,10 +1,10 @@
1
1
  /* (c) Copyright Frontify Ltd., all rights reserved. */
2
2
 
3
3
  import { Color } from '@frontify/fondue';
4
- import tinycolor from '@ctrl/tinycolor';
4
+ import { TinyColor } from '@ctrl/tinycolor';
5
5
  import { toShortRgba } from './toShortRgba';
6
6
 
7
7
  /**
8
8
  * Maps color object of rgba values to hex alpha string.
9
9
  */
10
- export const toHexString = (color: Color): string => tinycolor(toShortRgba(color)).toHexString();
10
+ export const toHexString = (color: Color): string => new TinyColor(toShortRgba(color)).toHexString();
@@ -1,7 +1,7 @@
1
1
  /* (c) Copyright Frontify Ltd., all rights reserved. */
2
2
 
3
3
  import { Color } from '@frontify/fondue';
4
- import tinycolor from '@ctrl/tinycolor';
4
+ import { TinyColor } from '@ctrl/tinycolor';
5
5
  import { toShortRgba } from './toShortRgba';
6
6
 
7
7
  /**
@@ -11,4 +11,4 @@ import { toShortRgba } from './toShortRgba';
11
11
  * @returns {String} To be used as css value.
12
12
  */
13
13
 
14
- export const toRgbaString = (color: Color): string => tinycolor(toShortRgba(color)).toRgbString();
14
+ export const toRgbaString = (color: Color): string => new TinyColor(toShortRgba(color)).toRgbString();
package/tsconfig.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "alwaysStrict": true,
7
7
  "isolatedModules": true,
8
8
  "module": "ESNext",
9
- "moduleResolution": "node",
9
+ "moduleResolution": "bundler",
10
10
  "noImplicitAny": true,
11
11
  "noImplicitReturns": true,
12
12
  "noImplicitThis": true,
@@ -1,17 +0,0 @@
1
- import { reactCssPropsToCss as s } from "../utlis/reactCssPropsToCss.es.js";
2
- import { BUTTON_PLUGIN as i } from "../../plugins/ButtonPlugin/createButtonPlugin.es.js";
3
- const b = (e, n, a, u) => {
4
- const l = u[i], o = e.buttonStyle ?? "primary", c = `button${o.charAt(0).toUpperCase()}${o.slice(1)}`, t = l[c], r = s(t);
5
- return `<a href="${e.url}"
6
- target="${e.target ?? "_blank"}"
7
- dir="auto"
8
- style="${r}"
9
- class="${a}"
10
- onmouseenter="this.setAttribute('style', '${r} ${s(t == null ? void 0 : t.hover)}');"
11
- onmouseleave="this.setAttribute('style', '${s(t)}');"
12
- >${n}</a>`;
13
- };
14
- export {
15
- b as buttonNode
16
- };
17
- //# sourceMappingURL=button.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"button.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/button.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport { TElement } from '@udecode/plate';\n\nimport { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';\nimport { BUTTON_PLUGIN } from '../../plugins';\n\nexport type ButtonStylesType = Record<string, Record<string, CSSProperties & { hover?: CSSProperties }>>;\n\nexport const buttonNode = (node: TElement, children: string, defaultClassNames: string, styles: ButtonStylesType) => {\n const buttonStyles = styles[BUTTON_PLUGIN];\n const buttonTypeString = (node.buttonStyle as string) ?? 'primary';\n const buttonType = `button${buttonTypeString.charAt(0).toUpperCase()}${buttonTypeString.slice(1)}`;\n const buttonStyle = buttonStyles[buttonType];\n\n const defaultStyles = reactCssPropsToCss(buttonStyle);\n\n return `<a href=\"${node.url}\"\n target=\"${node.target ?? '_blank'}\"\n dir=\"auto\"\n style=\"${defaultStyles}\"\n class=\"${defaultClassNames}\"\n onmouseenter=\"this.setAttribute('style', '${defaultStyles} ${reactCssPropsToCss(buttonStyle?.hover)}');\"\n onmouseleave=\"this.setAttribute('style', '${reactCssPropsToCss(buttonStyle)}');\"\n >${children}</a>`;\n};\n"],"names":["buttonNode","node","children","defaultClassNames","styles","buttonStyles","BUTTON_PLUGIN","buttonTypeString","buttonType","buttonStyle","defaultStyles","reactCssPropsToCss"],"mappings":";;AAUO,MAAMA,IAAa,CAACC,GAAgBC,GAAkBC,GAA2BC,MAA6B;AAC3G,QAAAC,IAAeD,EAAOE,CAAa,GACnCC,IAAoBN,EAAK,eAA0B,WACnDO,IAAa,SAASD,EAAiB,OAAO,CAAC,EAAE,YAAY,CAAC,GAAGA,EAAiB,MAAM,CAAC,CAAC,IAC1FE,IAAcJ,EAAaG,CAAU,GAErCE,IAAgBC,EAAmBF,CAAW;AAE7C,SAAA,YAAYR,EAAK,GAAG;AAAA,0BACLA,EAAK,UAAU,QAAQ;AAAA;AAAA,yBAExBS,CAAa;AAAA,yBACbP,CAAiB;AAAA,4DACkBO,CAAa,IAAIC,EAAmBF,KAAA,gBAAAA,EAAa,KAAK,CAAC;AAAA,4DACvDE,EAAmBF,CAAW,CAAC;AAAA,mBACxEP,CAAQ;AAC3B;"}
@@ -1,19 +0,0 @@
1
- import { merge as r } from "@frontify/fondue";
2
- import { reactCssPropsToCss as i } from "../utlis/reactCssPropsToCss.es.js";
3
- const w = (t, e, s, c) => `<div dir="auto" disabled class="tw-flex tw-flex-row tw-pb-2 first-of-type:tw-ml-0 ${s}" style="margin-left:${(t.indent ?? 0) * 24}px;">
4
- <div dir="auto" class="tw-flex tw-items-center tw-justify-center tw-select-none tw-mr-1.5">
5
- <input
6
- class="tw-w-4 tw-h-4 tw-m-0"
7
- type="checkbox"
8
- ${t.checked ? "checked" : ""}
9
- onclick="return false;" />
10
- </div>
11
- <span dir="auto" class="${r([
12
- "tw-flex-1 tw-focus:outline-none",
13
- t.checked ? "!tw-line-through" : ""
14
- ])}" style="${i(c[t.children[0].textStyle])}">${e}</span>
15
- </div>`;
16
- export {
17
- w as checkItemNode
18
- };
19
- //# sourceMappingURL=checkItemNode.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"checkItemNode.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/checkItemNode.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport { merge } from '@frontify/fondue';\nimport { TElement } from '@udecode/plate';\n\nimport { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';\n\nexport const checkItemNode = (\n node: TElement,\n children: string,\n defaultClassNames: string,\n styles: Record<string, CSSProperties & { hover?: CSSProperties }>,\n) => {\n return `<div dir=\"auto\" disabled class=\"tw-flex tw-flex-row tw-pb-2 first-of-type:tw-ml-0 ${defaultClassNames}\" style=\"margin-left:${\n ((node.indent as number) ?? 0) * 24\n }px;\">\n <div dir=\"auto\" class=\"tw-flex tw-items-center tw-justify-center tw-select-none tw-mr-1.5\">\n <input\n class=\"tw-w-4 tw-h-4 tw-m-0\"\n type=\"checkbox\"\n ${node.checked ? 'checked' : ''}\n onclick=\"return false;\" />\n </div>\n <span dir=\"auto\" class=\"${merge([\n 'tw-flex-1 tw-focus:outline-none',\n node.checked ? '!tw-line-through' : '',\n ])}\" style=\"${reactCssPropsToCss(styles[node.children[0].textStyle as string])}\">${children}</span>\n</div>`;\n};\n"],"names":["checkItemNode","node","children","defaultClassNames","styles","merge","reactCssPropsToCss"],"mappings":";;AAQO,MAAMA,IAAgB,CACzBC,GACAC,GACAC,GACAC,MAEO,qFAAqFD,CAAiB,yBACvGF,EAAK,UAAqB,KAAK,EACrC;AAAA;AAAA;AAAA;AAAA;AAAA,cAKUA,EAAK,UAAU,YAAY,EAAE;AAAA;AAAA;AAAA,8BAGbI,EAAM;AAAA,EAC5B;AAAA,EACAJ,EAAK,UAAU,qBAAqB;AACvC,CAAA,CAAC,YAAYK,EAAmBF,EAAOH,EAAK,SAAS,CAAC,EAAE,SAAmB,CAAC,CAAC,KAAKC,CAAQ;AAAA;"}
@@ -1,32 +0,0 @@
1
- import { merge as u } from "@frontify/fondue";
2
- import { reactCssPropsToCss as y } from "../utlis/reactCssPropsToCss.es.js";
3
- import { TextStyles as $ } from "../../plugins/styles.es.js";
4
- const e = (r, t, a, p) => {
5
- const i = y(a);
6
- return r.type === $.heading1 ? `<h1 dir="auto" class="${u([p, "a-h1"])}">${o(
7
- t,
8
- i
9
- )}</h1>` : r.type === $.heading2 ? `<h2 dir="auto" class="${p}">${o(t, i)}</h2>` : r.type === $.heading3 ? `<h3 dir="auto" class="${p}">${o(t, i)}</h3>` : r.type === $.heading4 ? `<h4 dir="auto" class="${p}">${o(t, i)}</h4>` : r.type === $.custom1 ? `<p dir="auto" class="${u([p, "a-custom1"])}">${o(
10
- t,
11
- i
12
- )}</p>` : r.type === $.custom2 ? `<p dir="auto" class="${u([p, "a-custom2"])}">${o(
13
- t,
14
- i
15
- )}</p>` : r.type === $.custom3 ? `<p dir="auto" class="${u([p, "a-custom3"])}">${o(
16
- t,
17
- i
18
- )}</p>` : r.type === $.quote ? `<p dir="auto" class="${u([p, "a-quote"])}">${o(
19
- t,
20
- i
21
- )}</p>` : r.type === $.imageTitle ? `<p dir="auto" class="${u([p, "a-image-title"])}">${o(
22
- t,
23
- i
24
- )}</p>` : r.type === $.imageCaption ? `<p dir="auto" class="${u([p, "a-image-caption"])}">${o(
25
- t,
26
- i
27
- )}</p>` : `<p dir="auto" class="${p}">${o(t, i)}</p>`;
28
- }, o = (r, t) => `<span dir="auto" style="${t}">${r}</span>`;
29
- export {
30
- e as defaultNode
31
- };
32
- //# sourceMappingURL=default.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"default.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/default.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport { merge } from '@frontify/fondue';\nimport { TElement } from '@udecode/plate';\n\nimport { TextStyles } from '../../plugins';\nimport { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';\n\nexport const defaultNode = (node: TElement, children: string, styles: CSSProperties, defaultClassNames: string) => {\n const defaultStyles = reactCssPropsToCss(styles);\n\n if (node.type === TextStyles.heading1) {\n return `<h1 dir=\"auto\" class=\"${merge([defaultClassNames, 'a-h1'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</h1>`;\n }\n if (node.type === TextStyles.heading2) {\n return `<h2 dir=\"auto\" class=\"${defaultClassNames}\">${getStyledChild(children, defaultStyles)}</h2>`;\n }\n if (node.type === TextStyles.heading3) {\n return `<h3 dir=\"auto\" class=\"${defaultClassNames}\">${getStyledChild(children, defaultStyles)}</h3>`;\n }\n if (node.type === TextStyles.heading4) {\n return `<h4 dir=\"auto\" class=\"${defaultClassNames}\">${getStyledChild(children, defaultStyles)}</h4>`;\n }\n if (node.type === TextStyles.custom1) {\n return `<p dir=\"auto\" class=\"${merge([defaultClassNames, 'a-custom1'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</p>`;\n }\n if (node.type === TextStyles.custom2) {\n return `<p dir=\"auto\" class=\"${merge([defaultClassNames, 'a-custom2'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</p>`;\n }\n if (node.type === TextStyles.custom3) {\n return `<p dir=\"auto\" class=\"${merge([defaultClassNames, 'a-custom3'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</p>`;\n }\n if (node.type === TextStyles.quote) {\n return `<p dir=\"auto\" class=\"${merge([defaultClassNames, 'a-quote'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</p>`;\n }\n if (node.type === TextStyles.imageTitle) {\n return `<p dir=\"auto\" class=\"${merge([defaultClassNames, 'a-image-title'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</p>`;\n }\n if (node.type === TextStyles.imageCaption) {\n return `<p dir=\"auto\" class=\"${merge([defaultClassNames, 'a-image-caption'])}\">${getStyledChild(\n children,\n defaultStyles,\n )}</p>`;\n }\n\n return `<p dir=\"auto\" class=\"${defaultClassNames}\">${getStyledChild(children, defaultStyles)}</p>`;\n};\n\nconst getStyledChild = (children: string, styles: string) => `<span dir=\"auto\" style=\"${styles}\">${children}</span>`;\n"],"names":["defaultNode","node","children","styles","defaultClassNames","defaultStyles","reactCssPropsToCss","TextStyles","merge","getStyledChild"],"mappings":";;;AASO,MAAMA,IAAc,CAACC,GAAgBC,GAAkBC,GAAuBC,MAA8B;AACzG,QAAAC,IAAgBC,EAAmBH,CAAM;AAE3C,SAAAF,EAAK,SAASM,EAAW,WAClB,yBAAyBC,EAAM,CAACJ,GAAmB,MAAM,CAAC,CAAC,KAAKK;AAAA,IACnEP;AAAA,IACAG;AAAA,EACH,CAAA,UAEDJ,EAAK,SAASM,EAAW,WAClB,yBAAyBH,CAAiB,KAAKK,EAAeP,GAAUG,CAAa,CAAC,UAE7FJ,EAAK,SAASM,EAAW,WAClB,yBAAyBH,CAAiB,KAAKK,EAAeP,GAAUG,CAAa,CAAC,UAE7FJ,EAAK,SAASM,EAAW,WAClB,yBAAyBH,CAAiB,KAAKK,EAAeP,GAAUG,CAAa,CAAC,UAE7FJ,EAAK,SAASM,EAAW,UAClB,wBAAwBC,EAAM,CAACJ,GAAmB,WAAW,CAAC,CAAC,KAAKK;AAAA,IACvEP;AAAA,IACAG;AAAA,EACH,CAAA,SAEDJ,EAAK,SAASM,EAAW,UAClB,wBAAwBC,EAAM,CAACJ,GAAmB,WAAW,CAAC,CAAC,KAAKK;AAAA,IACvEP;AAAA,IACAG;AAAA,EACH,CAAA,SAEDJ,EAAK,SAASM,EAAW,UAClB,wBAAwBC,EAAM,CAACJ,GAAmB,WAAW,CAAC,CAAC,KAAKK;AAAA,IACvEP;AAAA,IACAG;AAAA,EACH,CAAA,SAEDJ,EAAK,SAASM,EAAW,QAClB,wBAAwBC,EAAM,CAACJ,GAAmB,SAAS,CAAC,CAAC,KAAKK;AAAA,IACrEP;AAAA,IACAG;AAAA,EACH,CAAA,SAEDJ,EAAK,SAASM,EAAW,aAClB,wBAAwBC,EAAM,CAACJ,GAAmB,eAAe,CAAC,CAAC,KAAKK;AAAA,IAC3EP;AAAA,IACAG;AAAA,EACH,CAAA,SAEDJ,EAAK,SAASM,EAAW,eAClB,wBAAwBC,EAAM,CAACJ,GAAmB,iBAAiB,CAAC,CAAC,KAAKK;AAAA,IAC7EP;AAAA,IACAG;AAAA,EACH,CAAA,SAGE,wBAAwBD,CAAiB,KAAKK,EAAeP,GAAUG,CAAa,CAAC;AAChG,GAEMI,IAAiB,CAACP,GAAkBC,MAAmB,2BAA2BA,CAAM,KAAKD,CAAQ;"}
@@ -1,15 +0,0 @@
1
- import p from "escape-html";
2
- import { LINK_PLUGIN as e } from "../../plugins/LinkPlugin/id.es.js";
3
- import { reactCssPropsToCss as f } from "../utlis/reactCssPropsToCss.es.js";
4
- const u = (r, a, s, $) => {
5
- var l;
6
- if (r.chosenLink) {
7
- const { chosenLink: t } = r;
8
- return `<a dir="auto" class="${s}" style="${f($[e])}" target=${t != null && t.openInNewTab ? "_blank" : "_self"} href="${p((l = t == null ? void 0 : t.searchResult) == null ? void 0 : l.link)}">${a}</a>`;
9
- }
10
- return `<a dir="auto" class="${s}" style="${f($[e])}" target="${(r == null ? void 0 : r.target) ?? "_blank"}" href="${p(r.url)}">${a}</a>`;
11
- };
12
- export {
13
- u as linkNode
14
- };
15
- //# sourceMappingURL=link.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"link.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/link.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\nimport escapeHtml from 'escape-html';\nimport { TElement } from '@udecode/plate';\n\nimport { LINK_PLUGIN } from '../../plugins/LinkPlugin/id';\nimport { TLinkElement } from '../../plugins/LinkPlugin/types';\nimport { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';\n\nexport const linkNode = (\n node: TElement,\n children: string,\n defaultClassNames: string,\n styles: Record<string, CSSProperties & { hover?: CSSProperties }>,\n) => {\n if (node.chosenLink) {\n const { chosenLink } = node as TLinkElement;\n return `<a dir=\"auto\" class=\"${defaultClassNames}\" style=\"${reactCssPropsToCss(styles[LINK_PLUGIN])}\" target=${\n chosenLink?.openInNewTab ? '_blank' : '_self'\n } href=\"${escapeHtml(chosenLink?.searchResult?.link)}\">${children}</a>`;\n }\n return `<a dir=\"auto\" class=\"${defaultClassNames}\" style=\"${reactCssPropsToCss(styles[LINK_PLUGIN])}\" target=\"${\n node?.target ?? '_blank'\n }\" href=\"${escapeHtml(node.url as string)}\">${children}</a>`;\n};\n"],"names":["linkNode","node","children","defaultClassNames","styles","chosenLink","reactCssPropsToCss","LINK_PLUGIN","escapeHtml","_a"],"mappings":";;;AAUO,MAAMA,IAAW,CACpBC,GACAC,GACAC,GACAC,MACC;;AACD,MAAIH,EAAK,YAAY;AACX,UAAA,EAAE,YAAAI,EAAe,IAAAJ;AAChB,WAAA,wBAAwBE,CAAiB,YAAYG,EAAmBF,EAAOG,CAAW,CAAC,CAAC,YAC/FF,KAAA,QAAAA,EAAY,eAAe,WAAW,OAC1C,UAAUG,GAAWC,IAAAJ,KAAA,gBAAAA,EAAY,iBAAZ,gBAAAI,EAA0B,IAAI,CAAC,KAAKP,CAAQ;AAAA,EACrE;AACA,SAAO,wBAAwBC,CAAiB,YAAYG,EAAmBF,EAAOG,CAAW,CAAC,CAAC,cAC/FN,KAAA,gBAAAA,EAAM,WAAU,QACpB,WAAWO,EAAWP,EAAK,GAAa,CAAC,KAAKC,CAAQ;AAC1D;"}
@@ -1,12 +0,0 @@
1
- import n from "react-dom";
2
- import { MentionMarkupElementNode as o } from "@frontify/fondue";
3
- const d = (r, { mentionable: e } = {}) => {
4
- if (!e)
5
- return "";
6
- const t = document.createElement("div");
7
- return n.render(o(e)({ element: r }), t), t.innerHTML;
8
- };
9
- export {
10
- d as mentionHtmlNode
11
- };
12
- //# sourceMappingURL=mentionHtmlNode.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"mentionHtmlNode.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/nodes/mentionHtmlNode.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport ReactDOM from 'react-dom';\nimport { TElement, TMentionElement } from '@udecode/plate';\nimport { MappedMentionableItems, MentionMarkupElementNode } from '@frontify/fondue';\n\ntype MentionHtmlNodeProps = { mentionable?: MappedMentionableItems };\n\nexport const mentionHtmlNode = (node: TElement, { mentionable }: MentionHtmlNodeProps = {}) => {\n if (!mentionable) {\n return '';\n }\n\n const div = document.createElement('div');\n ReactDOM.render(MentionMarkupElementNode(mentionable)({ element: node as TMentionElement }), div);\n return div.innerHTML;\n};\n"],"names":["mentionHtmlNode","node","mentionable","div","ReactDOM","MentionMarkupElementNode"],"mappings":";;AAQO,MAAMA,IAAkB,CAACC,GAAgB,EAAE,aAAAC,EAAY,IAA0B,CAAA,MAAO;AAC3F,MAAI,CAACA;AACM,WAAA;AAGL,QAAAC,IAAM,SAAS,cAAc,KAAK;AAC/B,SAAAC,EAAA,OAAOC,EAAyBH,CAAW,EAAE,EAAE,SAASD,EAAA,CAAyB,GAAGE,CAAG,GACzFA,EAAI;AACf;"}
@@ -1,61 +0,0 @@
1
- import { UL_CLASSES as u, getOrderedListClasses as N, LI_CLASSNAMES as p, getLiStyles as f, getLicElementClassNames as L, ELEMENT_CHECK_ITEM as T, alignmentClassnames as C, merge as $, OL_STYLES as M } from "@frontify/fondue";
2
- import { isText as _, ELEMENT_UL as d, ELEMENT_OL as n, ELEMENT_LI as g, ELEMENT_LIC as k, ELEMENT_LINK as y, ELEMENT_MENTION as S } from "@udecode/plate";
3
- import { serializeLeafToHtml as h } from "./utlis/serializeLeafToHtml.es.js";
4
- import { reactCssPropsToCss as E } from "./utlis/reactCssPropsToCss.es.js";
5
- import { buttonNode as b } from "./nodes/button.es.js";
6
- import { linkNode as I } from "./nodes/link.es.js";
7
- import { defaultNode as O } from "./nodes/default.es.js";
8
- import { checkItemNode as A } from "./nodes/checkItemNode.es.js";
9
- import { mentionHtmlNode as H } from "./nodes/mentionHtmlNode.es.js";
10
- import { ELEMENT_BUTTON as v } from "../plugins/ButtonPlugin/createButtonPlugin.es.js";
11
- const i = (t, e) => t.reduce((r, s) => (s.type === e && r++, s.children ? r + i(s.children, e) : r), 0), w = (t, e, { mappedMentionable: r, nestingCount: s = {} }) => {
12
- if (_(t))
13
- return h(t);
14
- const o = s[t.type] || i([t], t.type);
15
- let l = "";
16
- for (const m of t.children)
17
- l += w(m, e, {
18
- nestingCount: {
19
- ...s,
20
- [m.type]: o
21
- },
22
- mappedMentionable: r
23
- });
24
- const a = x[t.type];
25
- return typeof a < "u" ? a({
26
- classNames: c(t.breakAfterColumn, t.align),
27
- children: l,
28
- rootNestingCount: o,
29
- node: t,
30
- mappedMentionable: r,
31
- styles: e
32
- }) : O(
33
- t,
34
- l,
35
- e[t.type],
36
- c(t.breakAfterColumn, t.align)
37
- );
38
- }, x = {
39
- [d]: (t) => `<ul dir="auto" class="${u} ${t.classNames}">${t.children}</ul>`,
40
- [n]: ({ classNames: t, children: e, node: r, rootNestingCount: s }) => {
41
- const o = Math.max(s - i([r], n), 0);
42
- return `<ol dir="auto" class="${N(o)} ${t}" style="${E(
43
- M
44
- )}">${e}</ol>`;
45
- },
46
- [g]: ({ classNames: t, children: e, node: r, styles: s }) => `<li dir="auto" class="${t} ${p}" style="${E(
47
- f(r, s)
48
- )}">${e}</li>`,
49
- [k]: ({ classNames: t, children: e, node: r }) => `<p dir="auto" class="${t} ${L(r)}"><span>${e}</span></p>`,
50
- [y]: ({ node: t, children: e, classNames: r, styles: s }) => I(t, e, r, s),
51
- [v]: ({ node: t, children: e, classNames: r, styles: s }) => b(t, e, r, s),
52
- [T]: ({ node: t, children: e, classNames: r, styles: s }) => A(t, e, r, s),
53
- [S]: ({ node: t, mappedMentionable: e }) => H(t, { mentionable: e })
54
- }, c = (t, e) => {
55
- const r = "tw-break-words", s = t === "active" ? "tw-break-after-column tw-break-inside-avoid-column" : "", o = e ? C[e] : "";
56
- return $([o, r, s]);
57
- };
58
- export {
59
- w as serializeNodeToHtmlRecursive
60
- };
61
- //# sourceMappingURL=serializeNodesToHtmlRecursive.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"serializeNodesToHtmlRecursive.es.js","sources":["../../../../src/components/RichTextEditor/serializer/serializeNodesToHtmlRecursive.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n ELEMENT_CHECK_ITEM,\n LI_CLASSNAMES,\n MappedMentionableItems,\n OL_STYLES,\n UL_CLASSES,\n alignmentClassnames,\n getLiStyles,\n getLicElementClassNames,\n getOrderedListClasses,\n merge,\n} from '@frontify/fondue';\nimport {\n ELEMENT_LI,\n ELEMENT_LIC,\n ELEMENT_LINK,\n ELEMENT_MENTION,\n ELEMENT_OL,\n ELEMENT_UL,\n TDescendant,\n TElement,\n isText,\n} from '@udecode/plate';\nimport { serializeLeafToHtml } from './utlis/serializeLeafToHtml';\nimport { reactCssPropsToCss } from './utlis/reactCssPropsToCss';\nimport type { CSSProperties } from 'react';\nimport { ButtonStylesType, buttonNode } from './nodes/button';\nimport { linkNode } from './nodes/link';\nimport { defaultNode } from './nodes/default';\nimport { checkItemNode } from './nodes/checkItemNode';\nimport { mentionHtmlNode } from './nodes/mentionHtmlNode';\nimport { ELEMENT_BUTTON } from '../plugins';\n\nconst countNodesOfType = (nodes: TDescendant[], type: string): number => {\n return nodes.reduce((acc, node) => {\n if (node.type === type) {\n acc++;\n }\n if (node.children) {\n return acc + countNodesOfType(node.children as TDescendant[], type);\n }\n return acc;\n }, 0);\n};\n\ntype NestingCount = {\n [type: string]: number;\n};\n\ntype SerializeNodeToHtmlRecursiveOptions = {\n mappedMentionable?: MappedMentionableItems;\n nestingCount?: NestingCount;\n};\n\nexport const serializeNodeToHtmlRecursive = (\n node: TDescendant,\n styles: Record<string, CSSProperties & { hover?: CSSProperties }> | ButtonStylesType,\n { mappedMentionable, nestingCount = {} }: SerializeNodeToHtmlRecursiveOptions,\n): string => {\n if (isText(node)) {\n return serializeLeafToHtml(node);\n }\n\n const rootNestingCount = nestingCount[node.type] || countNodesOfType([node], node.type);\n let children = '';\n for (const element of node.children) {\n children += serializeNodeToHtmlRecursive(element, styles, {\n nestingCount: {\n ...nestingCount,\n [element.type as string]: rootNestingCount,\n },\n mappedMentionable,\n });\n }\n\n const htmlMapper = MapNodeTypesToHtml[node.type];\n if (typeof htmlMapper !== 'undefined') {\n return htmlMapper({\n classNames: getClassNames(node.breakAfterColumn as string | undefined, node.align as string | undefined),\n children,\n rootNestingCount,\n node,\n mappedMentionable,\n styles,\n });\n } else {\n return defaultNode(\n node,\n children,\n styles[node.type],\n getClassNames(node.breakAfterColumn as string | undefined, node.align as string | undefined),\n );\n }\n};\n\ntype Arguments = {\n classNames: string;\n children: string;\n rootNestingCount: number;\n node: TElement;\n mappedMentionable?: MappedMentionableItems;\n styles: Record<string, CSSProperties & { hover?: CSSProperties }> | ButtonStylesType;\n};\n\nconst MapNodeTypesToHtml: { [key: string]: ({ ...args }: Arguments) => string } = {\n [ELEMENT_UL]: (args) => `<ul dir=\"auto\" class=\"${UL_CLASSES} ${args.classNames}\">${args.children}</ul>`,\n [ELEMENT_OL]: ({ classNames, children, node, rootNestingCount }) => {\n const nestingLevel = Math.max(rootNestingCount - countNodesOfType([node], ELEMENT_OL), 0);\n return `<ol dir=\"auto\" class=\"${getOrderedListClasses(nestingLevel)} ${classNames}\" style=\"${reactCssPropsToCss(\n OL_STYLES,\n )}\">${children}</ol>`;\n },\n [ELEMENT_LI]: ({ classNames, children, node, styles }) =>\n `<li dir=\"auto\" class=\"${classNames} ${LI_CLASSNAMES}\" style=\"${reactCssPropsToCss(\n getLiStyles(node, styles),\n )}\">${children}</li>`,\n [ELEMENT_LIC]: ({ classNames, children, node }) =>\n `<p dir=\"auto\" class=\"${classNames} ${getLicElementClassNames(node)}\"><span>${children}</span></p>`,\n [ELEMENT_LINK]: ({ node, children, classNames, styles }) => linkNode(node, children, classNames, styles),\n [ELEMENT_BUTTON]: ({ node, children, classNames, styles }) =>\n buttonNode(node, children, classNames, styles as ButtonStylesType),\n [ELEMENT_CHECK_ITEM]: ({ node, children, classNames, styles }) => checkItemNode(node, children, classNames, styles),\n [ELEMENT_MENTION]: ({ node, mappedMentionable }) => mentionHtmlNode(node, { mentionable: mappedMentionable }),\n};\n\nconst getClassNames = (breakAfterColumn?: string, align?: string) => {\n const breakWordsClass = 'tw-break-words';\n const columnBreakClasses =\n breakAfterColumn === 'active' ? 'tw-break-after-column tw-break-inside-avoid-column' : '';\n const alignClass = align ? alignmentClassnames[align] : '';\n return merge([alignClass, breakWordsClass, columnBreakClasses]);\n};\n"],"names":["countNodesOfType","nodes","type","acc","node","serializeNodeToHtmlRecursive","styles","mappedMentionable","nestingCount","isText","serializeLeafToHtml","rootNestingCount","children","element","htmlMapper","MapNodeTypesToHtml","getClassNames","defaultNode","ELEMENT_UL","args","UL_CLASSES","ELEMENT_OL","classNames","nestingLevel","getOrderedListClasses","reactCssPropsToCss","OL_STYLES","ELEMENT_LI","LI_CLASSNAMES","getLiStyles","ELEMENT_LIC","getLicElementClassNames","ELEMENT_LINK","linkNode","ELEMENT_BUTTON","buttonNode","ELEMENT_CHECK_ITEM","checkItemNode","ELEMENT_MENTION","mentionHtmlNode","breakAfterColumn","align","breakWordsClass","columnBreakClasses","alignClass","alignmentClassnames","merge"],"mappings":"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"}
@@ -1,25 +0,0 @@
1
- import { parseRawValue as c, PluginComposer as p, mapMentionable as y } from "@frontify/fondue";
2
- import { serializeNodeToHtmlRecursive as f } from "./serializeNodesToHtmlRecursive.es.js";
3
- import { BlockStyles as u } from "../plugins/styles.es.js";
4
- const A = async (e, r = 1, t = "normal", l = new p()) => {
5
- const i = c({ raw: e, plugins: l }), o = l.getStyles;
6
- return Promise.resolve(v(i, { columns: r, columnGap: t, styles: o }));
7
- }, v = (e, { mentionable: r, columns: t = 1, columnGap: l = "normal", styles: i = u } = {}) => {
8
- const o = r ? y(r) : /* @__PURE__ */ new Map();
9
- let s = "";
10
- for (let a = 0, n = e.length; a < n; a++) {
11
- const m = e[a];
12
- h(m) ? s += "<br />" : s += f(m, i, {
13
- mappedMentionable: o
14
- });
15
- }
16
- return t > 1 ? `<div style="columns:${t}; column-gap:${l};">${s}</div>` : s;
17
- }, h = (e) => {
18
- var r;
19
- return Array.isArray(e == null ? void 0 : e.children) ? (r = e == null ? void 0 : e.children) == null ? void 0 : r.every((t) => t.text === "") : !1;
20
- };
21
- export {
22
- v as serializeNodesToHtml,
23
- A as serializeRawToHtmlAsync
24
- };
25
- //# sourceMappingURL=serializeToHtml.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"serializeToHtml.es.js","sources":["../../../../src/components/RichTextEditor/serializer/serializeToHtml.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TDescendant } from '@udecode/plate';\nimport { PluginComposer, SerializeNodesToHtmlOptions, mapMentionable, parseRawValue } from '@frontify/fondue';\nimport { BlockStyles } from '../plugins';\nimport { serializeNodeToHtmlRecursive } from './serializeNodesToHtmlRecursive';\n\nexport const serializeRawToHtmlAsync = async (\n raw: string,\n columns: SerializeNodesToHtmlOptions['columns'] = 1,\n columnGap: SerializeNodesToHtmlOptions['columnGap'] = 'normal',\n plugins: PluginComposer = new PluginComposer(),\n): Promise<string> => {\n const nodes = parseRawValue({ raw, plugins });\n const styles = plugins.getStyles;\n return Promise.resolve(serializeNodesToHtml(nodes, { columns, columnGap, styles }));\n};\n\nexport const serializeNodesToHtml = (\n nodes: TDescendant[],\n { mentionable, columns = 1, columnGap = 'normal', styles = BlockStyles }: SerializeNodesToHtmlOptions = {},\n): string => {\n const mappedMentionable = mentionable ? mapMentionable(mentionable) : new Map();\n\n let html = '';\n for (let i = 0, len = nodes.length; i < len; i++) {\n const node = nodes[i];\n if (isEmptyNode(node)) {\n html += '<br />';\n } else {\n html += serializeNodeToHtmlRecursive(node, styles, {\n mappedMentionable,\n });\n }\n }\n\n if (columns > 1) {\n return `<div style=\"columns:${columns}; column-gap:${columnGap};\">${html}</div>`;\n }\n\n return html;\n};\n\nconst isEmptyNode = (node: TDescendant): boolean => {\n if (!Array.isArray(node?.children)) {\n return false;\n }\n return node?.children?.every((child) => child.text === '');\n};\n"],"names":["serializeRawToHtmlAsync","raw","columns","columnGap","plugins","PluginComposer","nodes","parseRawValue","styles","serializeNodesToHtml","mentionable","BlockStyles","mappedMentionable","mapMentionable","html","i","len","node","isEmptyNode","serializeNodeToHtmlRecursive","_a","child"],"mappings":";;;AAOa,MAAAA,IAA0B,OACnCC,GACAC,IAAkD,GAClDC,IAAsD,UACtDC,IAA0B,IAAIC,QACZ;AAClB,QAAMC,IAAQC,EAAc,EAAE,KAAAN,GAAK,SAAAG,EAAS,CAAA,GACtCI,IAASJ,EAAQ;AAChB,SAAA,QAAQ,QAAQK,EAAqBH,GAAO,EAAE,SAAAJ,GAAS,WAAAC,GAAW,QAAAK,EAAQ,CAAA,CAAC;AACtF,GAEaC,IAAuB,CAChCH,GACA,EAAE,aAAAI,GAAa,SAAAR,IAAU,GAAG,WAAAC,IAAY,UAAU,QAAAK,IAASG,EAAY,IAAiC,CAAA,MAC/F;AACT,QAAMC,IAAoBF,IAAcG,EAAeH,CAAW,wBAAQ;AAE1E,MAAII,IAAO;AACX,WAASC,IAAI,GAAGC,IAAMV,EAAM,QAAQS,IAAIC,GAAKD,KAAK;AACxC,UAAAE,IAAOX,EAAMS,CAAC;AAChB,IAAAG,EAAYD,CAAI,IACRH,KAAA,WAEAA,KAAAK,EAA6BF,GAAMT,GAAQ;AAAA,MAC/C,mBAAAI;AAAA,IAAA,CACH;AAAA,EAET;AAEA,SAAIV,IAAU,IACH,uBAAuBA,CAAO,gBAAgBC,CAAS,MAAMW,CAAI,WAGrEA;AACX,GAEMI,IAAc,CAACD,MAA+B;;AAChD,SAAK,MAAM,QAAQA,KAAA,gBAAAA,EAAM,QAAQ,KAG1BG,IAAAH,KAAA,gBAAAA,EAAM,aAAN,gBAAAG,EAAgB,MAAM,CAACC,MAAUA,EAAM,SAAS,MAF5C;AAGf;"}
@@ -1,8 +0,0 @@
1
- const l = (e) => e ? Object.keys(e).reduce((r, t) => {
2
- const s = e[t];
3
- return s ? `${r}${a(t)}: ${s}; ` : r;
4
- }, "").trim().replaceAll('"', "'") : "", a = (e) => e.replaceAll(/([A-Z])/g, "-$1").toLowerCase();
5
- export {
6
- l as reactCssPropsToCss
7
- };
8
- //# sourceMappingURL=reactCssPropsToCss.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"reactCssPropsToCss.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/utlis/reactCssPropsToCss.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { CSSProperties } from 'react';\n\nexport const reactCssPropsToCss = (props?: CSSProperties): string => {\n if (!props) {\n return '';\n }\n\n return Object.keys(props)\n .reduce<string>((acc, key) => {\n const value = props[key as keyof CSSProperties];\n return value ? `${acc}${convertCamelCaseToKebabCase(key)}: ${value}; ` : acc;\n }, '')\n .trim()\n .replaceAll('\"', \"'\");\n};\n\nconst convertCamelCaseToKebabCase = (str: string): string => {\n return str.replaceAll(/([A-Z])/g, '-$1').toLowerCase();\n};\n"],"names":["reactCssPropsToCss","props","acc","key","value","convertCamelCaseToKebabCase","str"],"mappings":"AAIa,MAAAA,IAAqB,CAACC,MAC1BA,IAIE,OAAO,KAAKA,CAAK,EACnB,OAAe,CAACC,GAAKC,MAAQ;AACpB,QAAAC,IAAQH,EAAME,CAA0B;AACvC,SAAAC,IAAQ,GAAGF,CAAG,GAAGG,EAA4BF,CAAG,CAAC,KAAKC,CAAK,OAAOF;AAAA,GAC1E,EAAE,EACJ,OACA,WAAW,KAAK,GAAG,IATb,IAYTG,IAA8B,CAACC,MAC1BA,EAAI,WAAW,YAAY,KAAK,EAAE,YAAY;"}
@@ -1,13 +0,0 @@
1
- import { BOLD_CLASSES as S, ITALIC_CLASSES as c, UNDERLINE_CLASSES as $, STRIKETHROUGH_CLASSES as f, CODE_CLASSES as o } from "@frontify/fondue";
2
- import u from "escape-html";
3
- const A = (a) => {
4
- let s = u(a.text);
5
- s = s.replaceAll(`
6
- `, "<br />");
7
- const { bold: p, italic: i, underline: e, strikethrough: r, code: t, subscript: l, superscript: n } = a;
8
- return p && (s = `<span class="${S}">${s}</span>`), i && (s = `<span class="${c}">${s}</span>`), e && (s = `<span class="${$}">${s}</span>`), r && (s = `<span class="${f}">${s}</span>`), t && (s = `<span class="${o}">${s}</span>`), l ? s = `<sub>${s}</sub>` : n && (s = `<sup>${s}</sup>`), s;
9
- };
10
- export {
11
- A as serializeLeafToHtml
12
- };
13
- //# sourceMappingURL=serializeLeafToHtml.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"serializeLeafToHtml.es.js","sources":["../../../../../src/components/RichTextEditor/serializer/utlis/serializeLeafToHtml.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { BOLD_CLASSES, CODE_CLASSES, ITALIC_CLASSES, STRIKETHROUGH_CLASSES, UNDERLINE_CLASSES } from '@frontify/fondue';\nimport { TText } from '@udecode/plate';\nimport escapeHtml from 'escape-html';\n\nexport const serializeLeafToHtml = (node: TText): string => {\n let string = escapeHtml(node.text);\n string = string.replaceAll('\\n', '<br />');\n const { bold, italic, underline, strikethrough, code, subscript, superscript } = node;\n if (bold) {\n string = `<span class=\"${BOLD_CLASSES}\">${string}</span>`;\n }\n if (italic) {\n string = `<span class=\"${ITALIC_CLASSES}\">${string}</span>`;\n }\n if (underline) {\n string = `<span class=\"${UNDERLINE_CLASSES}\">${string}</span>`;\n }\n if (strikethrough) {\n string = `<span class=\"${STRIKETHROUGH_CLASSES}\">${string}</span>`;\n }\n if (code) {\n string = `<span class=\"${CODE_CLASSES}\">${string}</span>`;\n }\n if (subscript) {\n string = `<sub>${string}</sub>`;\n } else if (superscript) {\n string = `<sup>${string}</sup>`;\n }\n return string;\n};\n"],"names":["serializeLeafToHtml","node","string","escapeHtml","bold","italic","underline","strikethrough","code","subscript","superscript","BOLD_CLASSES","ITALIC_CLASSES","UNDERLINE_CLASSES","STRIKETHROUGH_CLASSES","CODE_CLASSES"],"mappings":";;AAMa,MAAAA,IAAsB,CAACC,MAAwB;AACpD,MAAAC,IAASC,EAAWF,EAAK,IAAI;AACxB,EAAAC,IAAAA,EAAO,WAAW;AAAA,GAAM,QAAQ;AACnC,QAAA,EAAE,MAAAE,GAAM,QAAAC,GAAQ,WAAAC,GAAW,eAAAC,GAAe,MAAAC,GAAM,WAAAC,GAAW,aAAAC,EAAgB,IAAAT;AACjF,SAAIG,MACSF,IAAA,gBAAgBS,CAAY,KAAKT,CAAM,YAEhDG,MACSH,IAAA,gBAAgBU,CAAc,KAAKV,CAAM,YAElDI,MACSJ,IAAA,gBAAgBW,CAAiB,KAAKX,CAAM,YAErDK,MACSL,IAAA,gBAAgBY,CAAqB,KAAKZ,CAAM,YAEzDM,MACSN,IAAA,gBAAgBa,CAAY,KAAKb,CAAM,YAEhDO,IACAP,IAAS,QAAQA,CAAM,WAChBQ,MACPR,IAAS,QAAQA,CAAM,WAEpBA;AACX;"}
@@ -1,3 +0,0 @@
1
- /* (c) Copyright Frontify Ltd., all rights reserved. */
2
-
3
- export * from './serializeToHtml';
@@ -1,27 +0,0 @@
1
- /* (c) Copyright Frontify Ltd., all rights reserved. */
2
-
3
- import type { CSSProperties } from 'react';
4
- import { TElement } from '@udecode/plate';
5
-
6
- import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
7
- import { BUTTON_PLUGIN } from '../../plugins';
8
-
9
- export type ButtonStylesType = Record<string, Record<string, CSSProperties & { hover?: CSSProperties }>>;
10
-
11
- export const buttonNode = (node: TElement, children: string, defaultClassNames: string, styles: ButtonStylesType) => {
12
- const buttonStyles = styles[BUTTON_PLUGIN];
13
- const buttonTypeString = (node.buttonStyle as string) ?? 'primary';
14
- const buttonType = `button${buttonTypeString.charAt(0).toUpperCase()}${buttonTypeString.slice(1)}`;
15
- const buttonStyle = buttonStyles[buttonType];
16
-
17
- const defaultStyles = reactCssPropsToCss(buttonStyle);
18
-
19
- return `<a href="${node.url}"
20
- target="${node.target ?? '_blank'}"
21
- dir="auto"
22
- style="${defaultStyles}"
23
- class="${defaultClassNames}"
24
- onmouseenter="this.setAttribute('style', '${defaultStyles} ${reactCssPropsToCss(buttonStyle?.hover)}');"
25
- onmouseleave="this.setAttribute('style', '${reactCssPropsToCss(buttonStyle)}');"
26
- >${children}</a>`;
27
- };
@@ -1,30 +0,0 @@
1
- /* (c) Copyright Frontify Ltd., all rights reserved. */
2
-
3
- import type { CSSProperties } from 'react';
4
- import { merge } from '@frontify/fondue';
5
- import { TElement } from '@udecode/plate';
6
-
7
- import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
8
-
9
- export const checkItemNode = (
10
- node: TElement,
11
- children: string,
12
- defaultClassNames: string,
13
- styles: Record<string, CSSProperties & { hover?: CSSProperties }>,
14
- ) => {
15
- return `<div dir="auto" disabled class="tw-flex tw-flex-row tw-pb-2 first-of-type:tw-ml-0 ${defaultClassNames}" style="margin-left:${
16
- ((node.indent as number) ?? 0) * 24
17
- }px;">
18
- <div dir="auto" class="tw-flex tw-items-center tw-justify-center tw-select-none tw-mr-1.5">
19
- <input
20
- class="tw-w-4 tw-h-4 tw-m-0"
21
- type="checkbox"
22
- ${node.checked ? 'checked' : ''}
23
- onclick="return false;" />
24
- </div>
25
- <span dir="auto" class="${merge([
26
- 'tw-flex-1 tw-focus:outline-none',
27
- node.checked ? '!tw-line-through' : '',
28
- ])}" style="${reactCssPropsToCss(styles[node.children[0].textStyle as string])}">${children}</span>
29
- </div>`;
30
- };
@@ -1,68 +0,0 @@
1
- /* (c) Copyright Frontify Ltd., all rights reserved. */
2
-
3
- import type { CSSProperties } from 'react';
4
- import { merge } from '@frontify/fondue';
5
- import { TElement } from '@udecode/plate';
6
-
7
- import { TextStyles } from '../../plugins';
8
- import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
9
-
10
- export const defaultNode = (node: TElement, children: string, styles: CSSProperties, defaultClassNames: string) => {
11
- const defaultStyles = reactCssPropsToCss(styles);
12
-
13
- if (node.type === TextStyles.heading1) {
14
- return `<h1 dir="auto" class="${merge([defaultClassNames, 'a-h1'])}">${getStyledChild(
15
- children,
16
- defaultStyles,
17
- )}</h1>`;
18
- }
19
- if (node.type === TextStyles.heading2) {
20
- return `<h2 dir="auto" class="${defaultClassNames}">${getStyledChild(children, defaultStyles)}</h2>`;
21
- }
22
- if (node.type === TextStyles.heading3) {
23
- return `<h3 dir="auto" class="${defaultClassNames}">${getStyledChild(children, defaultStyles)}</h3>`;
24
- }
25
- if (node.type === TextStyles.heading4) {
26
- return `<h4 dir="auto" class="${defaultClassNames}">${getStyledChild(children, defaultStyles)}</h4>`;
27
- }
28
- if (node.type === TextStyles.custom1) {
29
- return `<p dir="auto" class="${merge([defaultClassNames, 'a-custom1'])}">${getStyledChild(
30
- children,
31
- defaultStyles,
32
- )}</p>`;
33
- }
34
- if (node.type === TextStyles.custom2) {
35
- return `<p dir="auto" class="${merge([defaultClassNames, 'a-custom2'])}">${getStyledChild(
36
- children,
37
- defaultStyles,
38
- )}</p>`;
39
- }
40
- if (node.type === TextStyles.custom3) {
41
- return `<p dir="auto" class="${merge([defaultClassNames, 'a-custom3'])}">${getStyledChild(
42
- children,
43
- defaultStyles,
44
- )}</p>`;
45
- }
46
- if (node.type === TextStyles.quote) {
47
- return `<p dir="auto" class="${merge([defaultClassNames, 'a-quote'])}">${getStyledChild(
48
- children,
49
- defaultStyles,
50
- )}</p>`;
51
- }
52
- if (node.type === TextStyles.imageTitle) {
53
- return `<p dir="auto" class="${merge([defaultClassNames, 'a-image-title'])}">${getStyledChild(
54
- children,
55
- defaultStyles,
56
- )}</p>`;
57
- }
58
- if (node.type === TextStyles.imageCaption) {
59
- return `<p dir="auto" class="${merge([defaultClassNames, 'a-image-caption'])}">${getStyledChild(
60
- children,
61
- defaultStyles,
62
- )}</p>`;
63
- }
64
-
65
- return `<p dir="auto" class="${defaultClassNames}">${getStyledChild(children, defaultStyles)}</p>`;
66
- };
67
-
68
- const getStyledChild = (children: string, styles: string) => `<span dir="auto" style="${styles}">${children}</span>`;
@@ -1,26 +0,0 @@
1
- /* (c) Copyright Frontify Ltd., all rights reserved. */
2
-
3
- import type { CSSProperties } from 'react';
4
- import escapeHtml from 'escape-html';
5
- import { TElement } from '@udecode/plate';
6
-
7
- import { LINK_PLUGIN } from '../../plugins/LinkPlugin/id';
8
- import { TLinkElement } from '../../plugins/LinkPlugin/types';
9
- import { reactCssPropsToCss } from '../utlis/reactCssPropsToCss';
10
-
11
- export const linkNode = (
12
- node: TElement,
13
- children: string,
14
- defaultClassNames: string,
15
- styles: Record<string, CSSProperties & { hover?: CSSProperties }>,
16
- ) => {
17
- if (node.chosenLink) {
18
- const { chosenLink } = node as TLinkElement;
19
- return `<a dir="auto" class="${defaultClassNames}" style="${reactCssPropsToCss(styles[LINK_PLUGIN])}" target=${
20
- chosenLink?.openInNewTab ? '_blank' : '_self'
21
- } href="${escapeHtml(chosenLink?.searchResult?.link)}">${children}</a>`;
22
- }
23
- return `<a dir="auto" class="${defaultClassNames}" style="${reactCssPropsToCss(styles[LINK_PLUGIN])}" target="${
24
- node?.target ?? '_blank'
25
- }" href="${escapeHtml(node.url as string)}">${children}</a>`;
26
- };
@@ -1,17 +0,0 @@
1
- /* (c) Copyright Frontify Ltd., all rights reserved. */
2
-
3
- import ReactDOM from 'react-dom';
4
- import { TElement, TMentionElement } from '@udecode/plate';
5
- import { MappedMentionableItems, MentionMarkupElementNode } from '@frontify/fondue';
6
-
7
- type MentionHtmlNodeProps = { mentionable?: MappedMentionableItems };
8
-
9
- export const mentionHtmlNode = (node: TElement, { mentionable }: MentionHtmlNodeProps = {}) => {
10
- if (!mentionable) {
11
- return '';
12
- }
13
-
14
- const div = document.createElement('div');
15
- ReactDOM.render(MentionMarkupElementNode(mentionable)({ element: node as TMentionElement }), div);
16
- return div.innerHTML;
17
- };