@frontify/fondue 12.0.0-beta.0 → 12.0.0-beta.2
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/Breadcrumbs/BreadcrumbItem.d.ts +0 -1
- package/dist/components/Breadcrumbs/BreadcrumbItem.es.js +23 -23
- package/dist/components/Breadcrumbs/BreadcrumbItem.es.js.map +1 -1
- package/dist/components/Breadcrumbs/CurrentBreadcrumbItem.es.js +1 -1
- package/dist/components/Breadcrumbs/CurrentBreadcrumbItem.es.js.map +1 -1
- package/dist/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/FloatingLink/EditLinkModal/EditModal.es.js +13 -12
- package/dist/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/FloatingLink/EditLinkModal/EditModal.es.js.map +1 -1
- package/dist/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/LinkMarkupElement/LinkMarkupElementNode.d.ts +0 -1
- package/dist/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/LinkMarkupElement/LinkMarkupElementNode.es.js +12 -12
- package/dist/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/LinkMarkupElement/LinkMarkupElementNode.es.js.map +1 -1
- package/dist/components/RichTextEditor/TextStyleDropdown/DropdownTrigger.es.js +20 -20
- package/dist/components/RichTextEditor/TextStyleDropdown/DropdownTrigger.es.js.map +1 -1
- package/dist/components/RichTextEditor/TextStyleDropdown/TextStyleDropdown.es.js +34 -27
- package/dist/components/RichTextEditor/TextStyleDropdown/TextStyleDropdown.es.js.map +1 -1
- package/dist/components/RichTextEditor/components/quote.d.ts +3 -0
- package/dist/components/RichTextEditor/components/quote.es.js +16 -0
- package/dist/components/RichTextEditor/components/quote.es.js.map +1 -0
- package/dist/components/RichTextEditor/serializer/utils/serializeNodeToHtmlRecursive.es.js +38 -37
- package/dist/components/RichTextEditor/serializer/utils/serializeNodeToHtmlRecursive.es.js.map +1 -1
- package/dist/components/RichTextEditor/utils/defaultDesignTokens.es.js +12 -2
- package/dist/components/RichTextEditor/utils/defaultDesignTokens.es.js.map +1 -1
- package/dist/components/RichTextEditor/utils/editorConfig.es.js +50 -44
- package/dist/components/RichTextEditor/utils/editorConfig.es.js.map +1 -1
- package/dist/components/RichTextEditor/utils/textStyles.d.ts +2 -0
- package/dist/components/RichTextEditor/utils/textStyles.es.js +6 -4
- package/dist/components/RichTextEditor/utils/textStyles.es.js.map +1 -1
- package/dist/components/TextInput/TextInput.es.js +40 -38
- package/dist/components/TextInput/TextInput.es.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.es.js +11 -11
- package/dist/components/Tooltip/Tooltip.es.js.map +1 -1
- package/dist/index.cjs.js +4 -4
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.es.js +3554 -3553
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +4 -4
- package/dist/index.umd.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/utilities/elements.d.ts +2 -0
- package/dist/utilities/elements.es.js +5 -0
- package/dist/utilities/elements.es.js.map +1 -0
- package/dist/utilities/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -3,6 +3,5 @@ import { Breadcrumb } from './Breadcrumbs';
|
|
|
3
3
|
declare type BreadcrumbItemProps = Pick<Breadcrumb, 'label' | 'link' | 'onClick'> & {
|
|
4
4
|
showSeparator: boolean;
|
|
5
5
|
};
|
|
6
|
-
export declare const getElementType: (link: BreadcrumbItemProps['link'], onClick: BreadcrumbItemProps['onClick']) => "button" | "a" | "span";
|
|
7
6
|
export declare const BreadcrumbItem: FC<BreadcrumbItemProps>;
|
|
8
7
|
export {};
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import { useBreadcrumbItem as
|
|
1
|
+
import { useBreadcrumbItem as u } from "@react-aria/breadcrumbs";
|
|
2
2
|
import { useFocusRing as w } from "@react-aria/focus";
|
|
3
3
|
import { mergeProps as f } from "@react-aria/utils";
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
4
|
+
import { getItemElementType as x } from "../../utilities/elements.es.js";
|
|
5
|
+
import { FOCUS_STYLE as a } from "../../utilities/focusStyle.es.js";
|
|
6
|
+
import e, { useRef as d } from "react";
|
|
6
7
|
const b = () => /* @__PURE__ */ e.createElement("svg", {
|
|
7
8
|
"aria-hidden": "true",
|
|
8
9
|
width: "13",
|
|
@@ -16,34 +17,33 @@ const b = () => /* @__PURE__ */ e.createElement("svg", {
|
|
|
16
17
|
y1: "16.0623",
|
|
17
18
|
x2: "8.46874",
|
|
18
19
|
y2: "0.845385"
|
|
19
|
-
})),
|
|
20
|
-
const
|
|
20
|
+
})), N = ({ label: t, link: n, onClick: c, showSeparator: l }) => {
|
|
21
|
+
const r = d(null), s = x(n, c), { itemProps: i } = u({
|
|
21
22
|
isCurrent: !1,
|
|
22
23
|
children: t,
|
|
23
|
-
elementType:
|
|
24
|
-
},
|
|
24
|
+
elementType: s
|
|
25
|
+
}, r), { isFocusVisible: o, focusProps: p } = w(), m = f(i, p);
|
|
25
26
|
return /* @__PURE__ */ e.createElement("li", {
|
|
26
27
|
className: "tw-flex tw-items-center tw-text-black-80 hover:tw-text-black-100 tw-text-xs dark:tw-text-black-10 dark:hover:tw-text-black-30 tw-transition-colors",
|
|
27
28
|
"data-test-id": "breadcrumb-item"
|
|
28
|
-
},
|
|
29
|
-
ref:
|
|
30
|
-
...
|
|
31
|
-
href:
|
|
32
|
-
className: o ?
|
|
33
|
-
}, t),
|
|
34
|
-
ref:
|
|
29
|
+
}, s === "a" && /* @__PURE__ */ e.createElement("a", {
|
|
30
|
+
ref: r,
|
|
31
|
+
...m,
|
|
32
|
+
href: n,
|
|
33
|
+
className: o ? a : ""
|
|
34
|
+
}, t), s === "button" && /* @__PURE__ */ e.createElement("button", {
|
|
35
|
+
ref: r,
|
|
35
36
|
type: "button",
|
|
36
|
-
...
|
|
37
|
-
onClick:
|
|
38
|
-
className: o ?
|
|
39
|
-
}, t),
|
|
40
|
-
ref:
|
|
41
|
-
...
|
|
42
|
-
className: o ?
|
|
37
|
+
...m,
|
|
38
|
+
onClick: c,
|
|
39
|
+
className: o ? a : ""
|
|
40
|
+
}, t), s === "span" && /* @__PURE__ */ e.createElement("span", {
|
|
41
|
+
ref: r,
|
|
42
|
+
...m,
|
|
43
|
+
className: o ? a : ""
|
|
43
44
|
}, t), l && /* @__PURE__ */ e.createElement(b, null));
|
|
44
45
|
};
|
|
45
46
|
export {
|
|
46
|
-
|
|
47
|
-
d as getElementType
|
|
47
|
+
N as BreadcrumbItem
|
|
48
48
|
};
|
|
49
49
|
//# sourceMappingURL=BreadcrumbItem.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/BreadcrumbItem.tsx"],"sourcesContent":["import { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport React, { FC, RefObject, useRef } from 'react';\nimport { Breadcrumb } from './Breadcrumbs';\n\nconst Separator = () => (\n <svg\n aria-hidden=\"true\"\n width=\"13\"\n height=\"17\"\n viewBox=\"0 0 13 17\"\n fill=\"none\"\n className=\"tw-stroke-current tw-text-black-20\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <line x1=\"3.52447\" y1=\"16.0623\" x2=\"8.46874\" y2=\"0.845385\" />\n </svg>\n);\n\ntype BreadcrumbItemProps = Pick<Breadcrumb, 'label' | 'link' | 'onClick'> & {\n showSeparator: boolean;\n};\n\nexport const
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/BreadcrumbItem.tsx"],"sourcesContent":["import { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\nimport { getItemElementType } from '@utilities/elements';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport React, { FC, RefObject, useRef } from 'react';\nimport { Breadcrumb } from './Breadcrumbs';\n\nconst Separator = () => (\n <svg\n aria-hidden=\"true\"\n width=\"13\"\n height=\"17\"\n viewBox=\"0 0 13 17\"\n fill=\"none\"\n className=\"tw-stroke-current tw-text-black-20\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <line x1=\"3.52447\" y1=\"16.0623\" x2=\"8.46874\" y2=\"0.845385\" />\n </svg>\n);\n\ntype BreadcrumbItemProps = Pick<Breadcrumb, 'label' | 'link' | 'onClick'> & {\n showSeparator: boolean;\n};\n\nexport const BreadcrumbItem: FC<BreadcrumbItemProps> = ({ label, link, onClick, showSeparator }) => {\n const ref = useRef<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement | null>(null);\n\n const contentElementType = getItemElementType(link, onClick);\n\n const { itemProps } = useBreadcrumbItem(\n {\n isCurrent: false,\n children: label,\n elementType: contentElementType,\n },\n ref,\n );\n const { isFocusVisible, focusProps } = useFocusRing();\n const props = mergeProps(itemProps, focusProps);\n\n return (\n <li\n className=\"tw-flex tw-items-center tw-text-black-80 hover:tw-text-black-100 tw-text-xs dark:tw-text-black-10 dark:hover:tw-text-black-30 tw-transition-colors\"\n data-test-id=\"breadcrumb-item\"\n >\n {contentElementType === 'a' && (\n <a\n ref={ref as RefObject<HTMLAnchorElement>}\n {...props}\n href={link}\n className={isFocusVisible ? FOCUS_STYLE : ''}\n >\n {label}\n </a>\n )}\n {contentElementType === 'button' && (\n <button\n ref={ref as RefObject<HTMLButtonElement>}\n type=\"button\"\n {...props}\n onClick={onClick}\n className={isFocusVisible ? FOCUS_STYLE : ''}\n >\n {label}\n </button>\n )}\n {contentElementType === 'span' && (\n <span ref={ref as RefObject<HTMLSpanElement>} {...props} className={isFocusVisible ? FOCUS_STYLE : ''}>\n {label}\n </span>\n )}\n {showSeparator && <Separator />}\n </li>\n );\n};\n"],"names":[],"mappings":";;;;;;AAQA,MAAM,IAAY,MACb,kBAAA,cAAA,OAAA;AAAA,EACG,eAAY;AAAA,EACZ,OAAM;AAAA,EACN,QAAO;AAAA,EACP,SAAQ;AAAA,EACR,MAAK;AAAA,EACL,WAAU;AAAA,EACV,OAAM;AAAA,GAEL,kBAAA,cAAA,QAAA;AAAA,EAAK,IAAG;AAAA,EAAU,IAAG;AAAA,EAAU,IAAG;AAAA,EAAU,IAAG;AAAA,CAAW,CAC/D,GAOS,IAA0C,CAAC,EAAE,UAAO,SAAM,YAAS,uBAAoB;AAC1F,QAAA,IAAM,EAAuE,IAAI,GAEjF,IAAqB,EAAmB,GAAM,CAAO,GAErD,EAAE,iBAAc,EAClB;AAAA,IACI,WAAW;AAAA,IACX,UAAU;AAAA,IACV,aAAa;AAAA,KAEjB,CACJ,GACM,EAAE,mBAAgB,kBAAe,EAAa,GAC9C,IAAQ,EAAW,GAAW,CAAU;AAE9C,SACK,kBAAA,cAAA,MAAA;AAAA,IACG,WAAU;AAAA,IACV,gBAAa;AAAA,EAEZ,GAAA,MAAuB,OACnB,kBAAA,cAAA,KAAA;AAAA,IACG;AAAA,IACC,GAAG;AAAA,IACJ,MAAM;AAAA,IACN,WAAW,IAAiB,IAAc;AAAA,EAAA,GAEzC,CACL,GAEH,MAAuB,YACnB,kBAAA,cAAA,UAAA;AAAA,IACG;AAAA,IACA,MAAK;AAAA,IACJ,GAAG;AAAA,IACJ;AAAA,IACA,WAAW,IAAiB,IAAc;AAAA,EAAA,GAEzC,CACL,GAEH,MAAuB,UACnB,kBAAA,cAAA,QAAA;AAAA,IAAK;AAAA,IAAyC,GAAG;AAAA,IAAO,WAAW,IAAiB,IAAc;AAAA,EAAA,GAC9F,CACL,GAEH,KAAiB,kBAAA,cAAC,OAAU,CACjC;AAER;"}
|
|
@@ -5,7 +5,7 @@ import { mergeProps as N } from "@react-aria/utils";
|
|
|
5
5
|
import { FOCUS_STYLE as p } from "../../utilities/focusStyle.es.js";
|
|
6
6
|
import { merge as a } from "../../utilities/merge.es.js";
|
|
7
7
|
import e, { useRef as h } from "react";
|
|
8
|
-
import {
|
|
8
|
+
import { getItemElementType as b } from "../../utilities/elements.es.js";
|
|
9
9
|
const w = ({ badges: t, children: r }) => /* @__PURE__ */ e.createElement("span", {
|
|
10
10
|
className: "tw-inline-flex tw-gap-x-2 tw-items-center"
|
|
11
11
|
}, r, t == null ? void 0 : t.map(({ children: n, ...m }, s) => /* @__PURE__ */ e.createElement(d, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CurrentBreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/CurrentBreadcrumbItem.tsx"],"sourcesContent":["import { Badge, BadgeProps } from '@components/Badge';\nimport { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport React, { FC, RefObject, useRef } from 'react';\nimport { Breadcrumb } from './Breadcrumbs';\nimport {
|
|
1
|
+
{"version":3,"file":"CurrentBreadcrumbItem.es.js","sources":["../../../src/components/Breadcrumbs/CurrentBreadcrumbItem.tsx"],"sourcesContent":["import { Badge, BadgeProps } from '@components/Badge';\nimport { useBreadcrumbItem } from '@react-aria/breadcrumbs';\nimport { useFocusRing } from '@react-aria/focus';\nimport { mergeProps } from '@react-aria/utils';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport React, { FC, RefObject, useRef } from 'react';\nimport { Breadcrumb } from './Breadcrumbs';\nimport { getItemElementType } from '@utilities/elements';\n\nconst ItemWithBadges: FC<{ badges?: BadgeProps[] }> = ({ badges, children }) => (\n <span className=\"tw-inline-flex tw-gap-x-2 tw-items-center\">\n {children}\n\n {badges?.map(({ children: badge, ...props }, index) => (\n <Badge {...props} key={`breadcrumb-badge-${index}`}>\n {badge}\n </Badge>\n ))}\n </span>\n);\n\ntype CurrentBreadcrumbItemProps = Breadcrumb;\n\nexport const CurrentBreadcrumbItem: FC<CurrentBreadcrumbItemProps> = ({\n label,\n badges,\n bold,\n decorator,\n link,\n onClick,\n}) => {\n const ref = useRef<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement | null>(null);\n const contentElementType = getItemElementType(link, onClick);\n const { itemProps } = useBreadcrumbItem(\n {\n isCurrent: true,\n children: label,\n elementType: contentElementType,\n },\n ref,\n );\n\n const classNames = merge([decorator && 'tw-flex tw-gap-x-1 tw-items-start tw-py-1', bold && 'tw-font-bold']);\n const { isFocusVisible, focusProps } = useFocusRing();\n const props = mergeProps(itemProps, focusProps);\n\n return (\n <li\n className=\"tw-w-full tw-inline-flex tw-align-middle tw-mt-1 tw-gap-x-1 tw-text-m tw-text-black dark:tw-text-white\"\n data-test-id=\"breadcrumb-item\"\n >\n {contentElementType === 'a' && (\n <ItemWithBadges badges={badges}>\n <a\n ref={ref as RefObject<HTMLAnchorElement>}\n {...props}\n href={link}\n className={merge([classNames, isFocusVisible ? FOCUS_STYLE : ''])}\n >\n {decorator}\n <span className={merge(['tw-leading-4', bold ? 'tw-font-bold' : ''])}>{label}</span>\n </a>\n </ItemWithBadges>\n )}\n {contentElementType === 'button' && (\n <ItemWithBadges badges={badges}>\n <button\n ref={ref as RefObject<HTMLButtonElement>}\n {...props}\n type=\"button\"\n onClick={onClick}\n className={merge(['tw-leading-4', classNames, isFocusVisible ? FOCUS_STYLE : ''])}\n >\n {decorator}\n {label}\n </button>\n </ItemWithBadges>\n )}\n {contentElementType === 'span' && (\n <>\n {decorator}\n <ItemWithBadges badges={badges}>\n <span\n ref={ref as RefObject<HTMLSpanElement>}\n {...props}\n className={merge([\n 'tw-leading-4 tw-py-1 ',\n bold && 'tw-font-bold',\n isFocusVisible && FOCUS_STYLE,\n ])}\n >\n {label}\n </span>\n </ItemWithBadges>\n </>\n )}\n </li>\n );\n};\n"],"names":[],"mappings":";;;;;;;;AAUA,MAAM,IAAgD,CAAC,EAAE,WAAQ,kBAC5D,kBAAA,cAAA,QAAA;AAAA,EAAK,WAAU;AAAA,GACX,GAEA,uBAAQ,IAAI,CAAC,EAAE,UAAU,MAAU,KAAS,MACxC,kBAAA,cAAA,GAAA;AAAA,EAAO,GAAG;AAAA,EAAO,KAAK,oBAAoB;AAAA,GACtC,CACL,EAER,GAKS,IAAwD,CAAC;AAAA,EAClE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACE;AACI,QAAA,IAAM,EAAuE,IAAI,GACjF,IAAqB,EAAmB,GAAM,CAAO,GACrD,EAAE,iBAAc,EAClB;AAAA,IACI,WAAW;AAAA,IACX,UAAU;AAAA,IACV,aAAa;AAAA,KAEjB,CACJ,GAEM,IAAa,EAAM,CAAC,KAAa,6CAA6C,KAAQ,cAAc,CAAC,GACrG,EAAE,mBAAgB,kBAAe,EAAa,GAC9C,IAAQ,EAAW,GAAW,CAAU;AAE9C,SACK,kBAAA,cAAA,MAAA;AAAA,IACG,WAAU;AAAA,IACV,gBAAa;AAAA,EAEZ,GAAA,MAAuB,OACnB,kBAAA,cAAA,GAAA;AAAA,IAAe;AAAA,EAAA,GACX,kBAAA,cAAA,KAAA;AAAA,IACG;AAAA,IACC,GAAG;AAAA,IACJ,MAAM;AAAA,IACN,WAAW,EAAM,CAAC,GAAY,IAAiB,IAAc,EAAE,CAAC;AAAA,EAAA,GAE/D,GACA,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAW,EAAM,CAAC,gBAAgB,IAAO,iBAAiB,EAAE,CAAC;AAAA,EAAA,GAAI,CAAM,CACjF,CACJ,GAEH,MAAuB,YACnB,kBAAA,cAAA,GAAA;AAAA,IAAe;AAAA,EAAA,GACX,kBAAA,cAAA,UAAA;AAAA,IACG;AAAA,IACC,GAAG;AAAA,IACJ,MAAK;AAAA,IACL;AAAA,IACA,WAAW,EAAM,CAAC,gBAAgB,GAAY,IAAiB,IAAc,EAAE,CAAC;AAAA,EAAA,GAE/E,GACA,CACL,CACJ,GAEH,MAAuB,UACpB,kBAAA,cAAA,EAAA,UAAA,MACK,GACA,kBAAA,cAAA,GAAA;AAAA,IAAe;AAAA,EAAA,GACX,kBAAA,cAAA,QAAA;AAAA,IACG;AAAA,IACC,GAAG;AAAA,IACJ,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAQ;AAAA,MACR,KAAkB;AAAA,IAAA,CACrB;AAAA,EAAA,GAEA,CACL,CACJ,CACJ,CAER;AAER;"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import t from "react";
|
|
2
|
-
import { useFloatingLinkUrlInput as
|
|
2
|
+
import { useFloatingLinkUrlInput as m } from "@udecode/plate";
|
|
3
3
|
import "../../../../../../../foundation/Icon/Generated/IconAdobeCreativeCloud.es.js";
|
|
4
4
|
import "../../../../../../../foundation/Icon/Generated/IconAdobeCreativeCloud12.es.js";
|
|
5
5
|
import "../../../../../../../foundation/Icon/Generated/IconAdobeCreativeCloud16.es.js";
|
|
@@ -1165,7 +1165,7 @@ import "../../../../../../../foundation/Icon/Generated/IconPause24.es.js";
|
|
|
1165
1165
|
import "../../../../../../../foundation/Icon/Generated/IconPause24Filled.es.js";
|
|
1166
1166
|
import "../../../../../../../foundation/Icon/Generated/IconPause32.es.js";
|
|
1167
1167
|
import "../../../../../../../foundation/Icon/Generated/IconPause32Filled.es.js";
|
|
1168
|
-
import
|
|
1168
|
+
import p from "../../../../../../../foundation/Icon/Generated/IconPen.es.js";
|
|
1169
1169
|
import "../../../../../../../foundation/Icon/Generated/IconPen12.es.js";
|
|
1170
1170
|
import "../../../../../../../foundation/Icon/Generated/IconPen16.es.js";
|
|
1171
1171
|
import "../../../../../../../foundation/Icon/Generated/IconPen20.es.js";
|
|
@@ -1570,7 +1570,7 @@ import "../../../../../../../foundation/Icon/Generated/IconTextOutdent16.es.js";
|
|
|
1570
1570
|
import "../../../../../../../foundation/Icon/Generated/IconTextOutdent20.es.js";
|
|
1571
1571
|
import "../../../../../../../foundation/Icon/Generated/IconTextOutdent24.es.js";
|
|
1572
1572
|
import "../../../../../../../foundation/Icon/Generated/IconTextOutdent32.es.js";
|
|
1573
|
-
import
|
|
1573
|
+
import e from "../../../../../../../foundation/Icon/Generated/IconTrashBin.es.js";
|
|
1574
1574
|
import "../../../../../../../foundation/Icon/Generated/IconTrashBin12.es.js";
|
|
1575
1575
|
import "../../../../../../../foundation/Icon/Generated/IconTrashBin16.es.js";
|
|
1576
1576
|
import "../../../../../../../foundation/Icon/Generated/IconTrashBin20.es.js";
|
|
@@ -1637,10 +1637,10 @@ import "../../../../../../../foundation/Icon/Generated/IconWorkflowShapes20.es.j
|
|
|
1637
1637
|
import "../../../../../../../foundation/Icon/Generated/IconWorkflowShapes24.es.js";
|
|
1638
1638
|
import "../../../../../../../foundation/Icon/Generated/IconWorkflowShapes32.es.js";
|
|
1639
1639
|
import "../../../../../../../foundation/Icon/IconsMap.es.js";
|
|
1640
|
-
import {
|
|
1641
|
-
import {
|
|
1642
|
-
const
|
|
1643
|
-
const
|
|
1640
|
+
import { FloatingLink as o } from "../FloatingLink.es.js";
|
|
1641
|
+
import { useRichTextEditorContext as n } from "../../../../../context/RichTextEditorContext.es.js";
|
|
1642
|
+
const UT = () => {
|
|
1643
|
+
const r = m({}), { designTokens: i } = n();
|
|
1644
1644
|
return /* @__PURE__ */ t.createElement("div", {
|
|
1645
1645
|
"data-test-id": "floating-link-edit",
|
|
1646
1646
|
className: "tw-bg-white tw-rounded tw-shadow tw-p-4 tw-min-w-[400px]"
|
|
@@ -1648,22 +1648,23 @@ const US = () => {
|
|
|
1648
1648
|
"data-test-id": "preview-link-flyout",
|
|
1649
1649
|
className: "tw-flex tw-justify-between"
|
|
1650
1650
|
}, /* @__PURE__ */ t.createElement("span", {
|
|
1651
|
-
|
|
1652
|
-
|
|
1651
|
+
style: i.link,
|
|
1652
|
+
className: "tw-pointer-events-none"
|
|
1653
|
+
}, r.defaultValue), /* @__PURE__ */ t.createElement("span", {
|
|
1653
1654
|
className: "tw-flex tw-gap-2"
|
|
1654
1655
|
}, /* @__PURE__ */ t.createElement("span", {
|
|
1655
1656
|
role: "button",
|
|
1656
1657
|
tabIndex: 0,
|
|
1657
1658
|
"data-test-id": "edit-link-button",
|
|
1658
1659
|
className: "tw-transition tw-cursor-pointer tw-rounded hover:tw-bg-black-10 tw-p-1"
|
|
1659
|
-
}, /* @__PURE__ */ t.createElement(
|
|
1660
|
+
}, /* @__PURE__ */ t.createElement(o.EditButton, null, /* @__PURE__ */ t.createElement(p, null))), /* @__PURE__ */ t.createElement("span", {
|
|
1660
1661
|
role: "button",
|
|
1661
1662
|
tabIndex: 0,
|
|
1662
1663
|
"data-test-id": "remove-link-button",
|
|
1663
1664
|
className: "tw-transition tw-cursor-pointer tw-rounded hover:tw-bg-black-10 tw-p-1"
|
|
1664
|
-
}, /* @__PURE__ */ t.createElement(
|
|
1665
|
+
}, /* @__PURE__ */ t.createElement(o.UnlinkButton, null, /* @__PURE__ */ t.createElement(e, null))))));
|
|
1665
1666
|
};
|
|
1666
1667
|
export {
|
|
1667
|
-
|
|
1668
|
+
UT as EditModal
|
|
1668
1669
|
};
|
|
1669
1670
|
//# sourceMappingURL=EditModal.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditModal.es.js","sources":["../../../../../../../../src/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/FloatingLink/EditLinkModal/EditModal.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React from 'react';\nimport { useFloatingLinkUrlInput } from '@udecode/plate';\nimport { IconPen, IconTrashBin } from '@foundation/Icon';\nimport {
|
|
1
|
+
{"version":3,"file":"EditModal.es.js","sources":["../../../../../../../../src/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/FloatingLink/EditLinkModal/EditModal.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React from 'react';\nimport { useFloatingLinkUrlInput } from '@udecode/plate';\nimport { IconPen, IconTrashBin } from '@foundation/Icon';\nimport { FloatingLink } from '../FloatingLink';\nimport { useRichTextEditorContext } from '@components/RichTextEditor/context/RichTextEditorContext';\n\nexport const EditModal = () => {\n const urlHtmlProps = useFloatingLinkUrlInput({});\n const { designTokens } = useRichTextEditorContext();\n\n return (\n <div data-test-id=\"floating-link-edit\" className=\"tw-bg-white tw-rounded tw-shadow tw-p-4 tw-min-w-[400px]\">\n <span data-test-id={'preview-link-flyout'} className=\"tw-flex tw-justify-between\">\n <span style={designTokens.link} className=\"tw-pointer-events-none\">\n {urlHtmlProps.defaultValue}\n </span>\n <span className=\"tw-flex tw-gap-2\">\n <span\n role=\"button\"\n tabIndex={0}\n data-test-id={'edit-link-button'}\n className=\"tw-transition tw-cursor-pointer tw-rounded hover:tw-bg-black-10 tw-p-1\"\n >\n <FloatingLink.EditButton>\n <IconPen />\n </FloatingLink.EditButton>\n </span>\n\n <span\n role=\"button\"\n tabIndex={0}\n data-test-id={'remove-link-button'}\n className=\"tw-transition tw-cursor-pointer tw-rounded hover:tw-bg-black-10 tw-p-1\"\n >\n <FloatingLink.UnlinkButton>\n <IconTrashBin />\n </FloatingLink.UnlinkButton>\n </span>\n </span>\n </span>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,KAAY,MAAM;AACrB,QAAA,IAAe,EAAwB,CAAA,CAAE,GACzC,EAAE,oBAAiB;AAEzB,SACK,kBAAA,cAAA,OAAA;AAAA,IAAI,gBAAa;AAAA,IAAqB,WAAU;AAAA,EAAA,GAC5C,kBAAA,cAAA,QAAA;AAAA,IAAK,gBAAc;AAAA,IAAuB,WAAU;AAAA,EAAA,GAChD,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,IAAM,WAAU;AAAA,EACrC,GAAA,EAAa,YAClB,GACC,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,EAAA,GACX,kBAAA,cAAA,QAAA;AAAA,IACG,MAAK;AAAA,IACL,UAAU;AAAA,IACV,gBAAc;AAAA,IACd,WAAU;AAAA,EAEV,GAAA,kBAAA,cAAC,EAAa,YAAb,sCACI,GAAQ,IAAA,CACb,CACJ,GAEC,kBAAA,cAAA,QAAA;AAAA,IACG,MAAK;AAAA,IACL,UAAU;AAAA,IACV,gBAAc;AAAA,IACd,WAAU;AAAA,EAEV,GAAA,kBAAA,cAAC,EAAa,cAAb,MACG,kBAAA,cAAC,OAAa,CAClB,CACJ,CACJ,CACJ,CACJ;AAER;"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useElementProps as
|
|
1
|
+
import s from "react";
|
|
2
|
+
import { useElementProps as i } from "@udecode/plate";
|
|
3
3
|
import { getUrlFromLinkOrLegacyLink as a } from "../utils/getUrl.es.js";
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
import { useRichTextEditorContext as m } from "../../../../context/RichTextEditorContext.es.js";
|
|
5
|
+
const p = (e) => ({
|
|
6
|
+
...i({
|
|
6
7
|
...e,
|
|
7
8
|
elementToAttributes: (t) => ({
|
|
8
9
|
href: a(t),
|
|
@@ -12,17 +13,16 @@ const i = (e) => ({
|
|
|
12
13
|
onMouseOver: (t) => {
|
|
13
14
|
t.stopPropagation();
|
|
14
15
|
}
|
|
15
|
-
}),
|
|
16
|
-
const r =
|
|
17
|
-
return /* @__PURE__ */
|
|
18
|
-
...
|
|
16
|
+
}), k = (e) => {
|
|
17
|
+
const r = p(e), { designTokens: t } = m(), { attributes: o, children: n } = e;
|
|
18
|
+
return /* @__PURE__ */ s.createElement("a", {
|
|
19
|
+
...o,
|
|
19
20
|
href: r.href,
|
|
20
21
|
target: r.target,
|
|
21
|
-
|
|
22
|
-
},
|
|
22
|
+
style: t.link
|
|
23
|
+
}, n);
|
|
23
24
|
};
|
|
24
25
|
export {
|
|
25
|
-
|
|
26
|
-
l as LinkMarkupElementNode
|
|
26
|
+
k as LinkMarkupElementNode
|
|
27
27
|
};
|
|
28
28
|
//# sourceMappingURL=LinkMarkupElementNode.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LinkMarkupElementNode.es.js","sources":["../../../../../../../src/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/LinkMarkupElement/LinkMarkupElementNode.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React from 'react';\nimport { HTMLPropsAs, LinkRootProps, useElementProps } from '@udecode/plate';\nimport { getUrlFromLinkOrLegacyLink } from '../utils';\nimport { TLinkElement } from '../types';\n\nconst useLink = (props: LinkRootProps): HTMLPropsAs<'a'> => {\n const _props = useElementProps<TLinkElement, 'a'>({\n ...props,\n elementToAttributes: (element) => ({\n href: getUrlFromLinkOrLegacyLink(element),\n target: element.target || '_blank',\n }),\n });\n\n return {\n ..._props,\n // quick fix: hovering <a> with href loses the editor focus\n onMouseOver: (e) => {\n e.stopPropagation();\n },\n };\n};\n\nexport const
|
|
1
|
+
{"version":3,"file":"LinkMarkupElementNode.es.js","sources":["../../../../../../../src/components/RichTextEditor/EditorActions/Plugins/LinkPlugin/LinkMarkupElement/LinkMarkupElementNode.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React from 'react';\nimport { HTMLPropsAs, LinkRootProps, useElementProps } from '@udecode/plate';\nimport { getUrlFromLinkOrLegacyLink } from '../utils';\nimport { TLinkElement } from '../types';\nimport { useRichTextEditorContext } from '@components/RichTextEditor/context/RichTextEditorContext';\n\nconst useLink = (props: LinkRootProps): HTMLPropsAs<'a'> => {\n const _props = useElementProps<TLinkElement, 'a'>({\n ...props,\n elementToAttributes: (element) => ({\n href: getUrlFromLinkOrLegacyLink(element),\n target: element.target || '_blank',\n }),\n });\n\n return {\n ..._props,\n // quick fix: hovering <a> with href loses the editor focus\n onMouseOver: (e) => {\n e.stopPropagation();\n },\n };\n};\n\nexport const LinkMarkupElementNode = (props: LinkRootProps) => {\n const htmlProps = useLink(props);\n const { designTokens } = useRichTextEditorContext();\n const { attributes, children } = props;\n\n return (\n <a {...attributes} href={htmlProps.href} target={htmlProps.target} style={designTokens.link}>\n {children}\n </a>\n );\n};\n"],"names":[],"mappings":";;;;AAQA,MAAM,IAAU,CAAC,MASN;AAAA,EACH,GATW,EAAmC;AAAA,IAC9C,GAAG;AAAA,IACH,qBAAqB,CAAC,MAAa;AAAA,MAC/B,MAAM,EAA2B,CAAO;AAAA,MACxC,QAAQ,EAAQ,UAAU;AAAA,IAAA;AAAA,EAC9B,CACH;AAAA,EAKG,aAAa,CAAC,MAAM;AAChB,MAAE,gBAAgB;AAAA,EACtB;AAAA,IAIK,IAAwB,CAAC,MAAyB;AACrD,QAAA,IAAY,EAAQ,CAAK,GACzB,EAAE,oBAAiB,KACnB,EAAE,eAAY,gBAAa;AAEjC,SACK,kBAAA,cAAA,KAAA;AAAA,IAAG,GAAG;AAAA,IAAY,MAAM,EAAU;AAAA,IAAM,QAAQ,EAAU;AAAA,IAAQ,OAAO,EAAa;AAAA,EAAA,GAClF,CACL;AAER;"}
|
|
@@ -291,7 +291,7 @@ import "../../../foundation/Icon/Generated/IconCardLayoutSmall16.es.js";
|
|
|
291
291
|
import "../../../foundation/Icon/Generated/IconCardLayoutSmall20.es.js";
|
|
292
292
|
import "../../../foundation/Icon/Generated/IconCardLayoutSmall24.es.js";
|
|
293
293
|
import "../../../foundation/Icon/Generated/IconCardLayoutSmall32.es.js";
|
|
294
|
-
import
|
|
294
|
+
import l from "../../../foundation/Icon/Generated/IconCaretDown.es.js";
|
|
295
295
|
import "../../../foundation/Icon/Generated/IconCaretDown12.es.js";
|
|
296
296
|
import "../../../foundation/Icon/Generated/IconCaretDown16.es.js";
|
|
297
297
|
import "../../../foundation/Icon/Generated/IconCaretDown20.es.js";
|
|
@@ -1634,41 +1634,41 @@ import "../../../foundation/Icon/Generated/IconWorkflowShapes16.es.js";
|
|
|
1634
1634
|
import "../../../foundation/Icon/Generated/IconWorkflowShapes20.es.js";
|
|
1635
1635
|
import "../../../foundation/Icon/Generated/IconWorkflowShapes24.es.js";
|
|
1636
1636
|
import "../../../foundation/Icon/Generated/IconWorkflowShapes32.es.js";
|
|
1637
|
-
import
|
|
1637
|
+
import o from "react";
|
|
1638
1638
|
import "../../../foundation/Icon/IconsMap.es.js";
|
|
1639
|
-
import { IconSize as
|
|
1640
|
-
import { usePlateEditorState as
|
|
1639
|
+
import { IconSize as n } from "../../../foundation/Icon/IconSize.es.js";
|
|
1640
|
+
import { usePlateEditorState as s, getPreventDefaultHandler as c } from "@udecode/plate";
|
|
1641
1641
|
import { merge as m } from "../../../utilities/merge.es.js";
|
|
1642
1642
|
import { useSelectedTextStyles as w } from "../hooks/useSelectedTextStyles.es.js";
|
|
1643
|
-
import { textStyleTitles as
|
|
1643
|
+
import { textStyleTitles as a } from "../utils/textStyles.es.js";
|
|
1644
1644
|
const x = "Mixed";
|
|
1645
|
-
var
|
|
1646
|
-
const
|
|
1645
|
+
var d = /* @__PURE__ */ ((t) => (t.UL = "ul", t.OL = "ol", t.CHECKLIST_ITEM = "checkbox_item", t))(d || {});
|
|
1646
|
+
const u = {
|
|
1647
1647
|
ul: "Bullet List",
|
|
1648
1648
|
ol: "List",
|
|
1649
1649
|
checkbox_item: "Checklist"
|
|
1650
|
-
}, T = { ...
|
|
1651
|
-
const p =
|
|
1652
|
-
return /* @__PURE__ */
|
|
1650
|
+
}, T = { ...u, ...a }, KI = ({ editorId: t, open: r }) => {
|
|
1651
|
+
const p = s(t), i = w(t), e = i.length === 1 ? T[i[0]] : x;
|
|
1652
|
+
return /* @__PURE__ */ o.createElement("button", {
|
|
1653
1653
|
"data-test-id": "textstyle-dropdown-trigger",
|
|
1654
1654
|
type: "button",
|
|
1655
1655
|
className: "tw-cursor-pointer tw-h-8 tw-w-full",
|
|
1656
|
-
onMouseDown: p ?
|
|
1657
|
-
}, /* @__PURE__ */
|
|
1656
|
+
onMouseDown: p ? c() : void 0
|
|
1657
|
+
}, /* @__PURE__ */ o.createElement("div", {
|
|
1658
1658
|
className: m([
|
|
1659
|
-
"tw-relative tw-inline-flex tw-flex-row tw-items-center tw-justify-between tw-overflow-hidden tw-text-text tw-rounded tw-gap-1 tw-px-2 hover:tw-text-
|
|
1660
|
-
|
|
1659
|
+
"tw-relative tw-inline-flex tw-flex-row tw-items-center tw-justify-between tw-overflow-hidden tw-text-text tw-rounded tw-gap-1 tw-px-2 hover:tw-text-box-selected-inverse hover:tw-bg-box-selected tw-h-6 tw-w-28",
|
|
1660
|
+
r && "tw-text-box-selected-inverse tw-bg-box-selected"
|
|
1661
1661
|
])
|
|
1662
|
-
}, /* @__PURE__ */
|
|
1662
|
+
}, /* @__PURE__ */ o.createElement("span", {
|
|
1663
1663
|
className: "tw-text-xs tw-truncate"
|
|
1664
|
-
}, e), /* @__PURE__ */
|
|
1665
|
-
className: m(["tw-transition-transform",
|
|
1666
|
-
}, /* @__PURE__ */
|
|
1667
|
-
size:
|
|
1664
|
+
}, e), /* @__PURE__ */ o.createElement("div", {
|
|
1665
|
+
className: m(["tw-transition-transform", r && "tw-rotate-180"])
|
|
1666
|
+
}, /* @__PURE__ */ o.createElement(l, {
|
|
1667
|
+
size: n.Size12
|
|
1668
1668
|
}))));
|
|
1669
1669
|
};
|
|
1670
1670
|
export {
|
|
1671
1671
|
KI as DropdownTrigger,
|
|
1672
|
-
|
|
1672
|
+
d as ListStyles
|
|
1673
1673
|
};
|
|
1674
1674
|
//# sourceMappingURL=DropdownTrigger.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownTrigger.es.js","sources":["../../../../src/components/RichTextEditor/TextStyleDropdown/DropdownTrigger.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretDown, IconSize } from '@foundation/Icon';\nimport { getPreventDefaultHandler, usePlateEditorState } from '@udecode/plate';\nimport { merge } from '@utilities/merge';\nimport React from 'react';\nimport { useSelectedTextStyles } from '../hooks/useSelectedTextStyles';\nimport { AvailableTextStyles } from '../types';\nimport { textStyleTitles } from '../utils/textStyles';\n\ntype DropdownTriggerProps = {\n editorId?: string;\n open: boolean;\n};\nconst DEFAULT_TEXTSTYLE_VALUE = 'Mixed';\n\nexport enum ListStyles {\n UL = 'ul',\n OL = 'ol',\n CHECKLIST_ITEM = 'checkbox_item',\n}\n\nconst listTitle: Record<ListStyles, string> = {\n [ListStyles.UL]: 'Bullet List',\n [ListStyles.OL]: 'List',\n [ListStyles.CHECKLIST_ITEM]: 'Checklist',\n};\n\nconst TEXT_STYLE_TITLES: Record<AvailableTextStyles, string> = { ...listTitle, ...textStyleTitles };\n\nexport const DropdownTrigger = ({ editorId, open }: DropdownTriggerProps) => {\n const editor = usePlateEditorState(editorId);\n const selectedTextStyles = useSelectedTextStyles(editorId);\n\n const label = selectedTextStyles.length === 1 ? TEXT_STYLE_TITLES[selectedTextStyles[0]] : DEFAULT_TEXTSTYLE_VALUE;\n\n return (\n <button\n data-test-id=\"textstyle-dropdown-trigger\"\n type=\"button\"\n className=\"tw-cursor-pointer tw-h-8 tw-w-full\"\n onMouseDown={editor ? getPreventDefaultHandler() : undefined}\n >\n <div\n className={merge([\n 'tw-relative tw-inline-flex tw-flex-row tw-items-center tw-justify-between tw-overflow-hidden tw-text-text tw-rounded tw-gap-1 tw-px-2 hover:tw-text-
|
|
1
|
+
{"version":3,"file":"DropdownTrigger.es.js","sources":["../../../../src/components/RichTextEditor/TextStyleDropdown/DropdownTrigger.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCaretDown, IconSize } from '@foundation/Icon';\nimport { getPreventDefaultHandler, usePlateEditorState } from '@udecode/plate';\nimport { merge } from '@utilities/merge';\nimport React from 'react';\nimport { useSelectedTextStyles } from '../hooks/useSelectedTextStyles';\nimport { AvailableTextStyles } from '../types';\nimport { textStyleTitles } from '../utils/textStyles';\n\ntype DropdownTriggerProps = {\n editorId?: string;\n open: boolean;\n};\nconst DEFAULT_TEXTSTYLE_VALUE = 'Mixed';\n\nexport enum ListStyles {\n UL = 'ul',\n OL = 'ol',\n CHECKLIST_ITEM = 'checkbox_item',\n}\n\nconst listTitle: Record<ListStyles, string> = {\n [ListStyles.UL]: 'Bullet List',\n [ListStyles.OL]: 'List',\n [ListStyles.CHECKLIST_ITEM]: 'Checklist',\n};\n\nconst TEXT_STYLE_TITLES: Record<AvailableTextStyles, string> = { ...listTitle, ...textStyleTitles };\n\nexport const DropdownTrigger = ({ editorId, open }: DropdownTriggerProps) => {\n const editor = usePlateEditorState(editorId);\n const selectedTextStyles = useSelectedTextStyles(editorId);\n\n const label = selectedTextStyles.length === 1 ? TEXT_STYLE_TITLES[selectedTextStyles[0]] : DEFAULT_TEXTSTYLE_VALUE;\n\n return (\n <button\n data-test-id=\"textstyle-dropdown-trigger\"\n type=\"button\"\n className=\"tw-cursor-pointer tw-h-8 tw-w-full\"\n onMouseDown={editor ? getPreventDefaultHandler() : undefined}\n >\n <div\n className={merge([\n 'tw-relative tw-inline-flex tw-flex-row tw-items-center tw-justify-between tw-overflow-hidden tw-text-text tw-rounded tw-gap-1 tw-px-2 hover:tw-text-box-selected-inverse hover:tw-bg-box-selected tw-h-6 tw-w-28',\n open && 'tw-text-box-selected-inverse tw-bg-box-selected',\n ])}\n >\n <span className=\"tw-text-xs tw-truncate\">{label}</span>\n <div className={merge(['tw-transition-transform', open && 'tw-rotate-180'])}>\n <IconCaretDown size={IconSize.Size12} />\n </div>\n </div>\n </button>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcA,MAAM,IAA0B;AAEpB,IAAA,sBAAA,MACH,GAAA,KAAA,MACA,EAAA,KAAA,MACY,EAAA,iBAAA,iBAHT,IAAA,KAAA,CAAA,CAAA;AAMZ,MAAM,IAAwC;AAAA,EAC1C,AAAC,IAAgB;AAAA,EACjB,AAAC,IAAgB;AAAA,EACjB,AAAC,eAA4B;AACjC,GAEM,IAAyD,EAAE,GAAG,GAAW,GAAG,EAAgB,GAErF,KAAkB,CAAC,EAAE,aAAU,cAAiC;AACnE,QAAA,IAAS,EAAoB,CAAQ,GACrC,IAAqB,EAAsB,CAAQ,GAEnD,IAAQ,EAAmB,WAAW,IAAI,EAAkB,EAAmB,MAAM;AAE3F,SACK,kBAAA,cAAA,UAAA;AAAA,IACG,gBAAa;AAAA,IACb,MAAK;AAAA,IACL,WAAU;AAAA,IACV,aAAa,IAAS,EAA6B,IAAA;AAAA,EAAA,GAElD,kBAAA,cAAA,OAAA;AAAA,IACG,WAAW,EAAM;AAAA,MACb;AAAA,MACA,KAAQ;AAAA,IAAA,CACX;AAAA,EAAA,GAEA,kBAAA,cAAA,QAAA;AAAA,IAAK,WAAU;AAAA,EAA0B,GAAA,CAAM,GAC/C,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAW,EAAM,CAAC,2BAA2B,KAAQ,eAAe,CAAC;AAAA,EAAA,GACrE,kBAAA,cAAA,GAAA;AAAA,IAAc,MAAM,EAAS;AAAA,EAAA,CAAQ,CAC1C,CACJ,CACJ;AAER;"}
|
|
@@ -1,62 +1,69 @@
|
|
|
1
|
-
import { ToolbarDropdown as
|
|
2
|
-
import e, { useState as c, useCallback as
|
|
3
|
-
import { useRichTextEditorContext as
|
|
4
|
-
import { TextStyles as t, textStyleTitles as
|
|
5
|
-
import { DropdownItem as
|
|
1
|
+
import { ToolbarDropdown as T } from "@udecode/plate";
|
|
2
|
+
import e, { useState as c, useCallback as o } from "react";
|
|
3
|
+
import { useRichTextEditorContext as p } from "../context/RichTextEditorContext.es.js";
|
|
4
|
+
import { TextStyles as t, textStyleTitles as l } from "../utils/textStyles.es.js";
|
|
5
|
+
import { DropdownItem as a } from "./DropdownItem.es.js";
|
|
6
6
|
import { DropdownTrigger as N } from "./DropdownTrigger.es.js";
|
|
7
7
|
const D = ({ editorId: E }) => {
|
|
8
|
-
const [m,
|
|
9
|
-
|
|
10
|
-
}, [m,
|
|
11
|
-
return /* @__PURE__ */ e.createElement(
|
|
8
|
+
const [m, s] = c(!1), { designTokens: n } = p(), r = o(() => {
|
|
9
|
+
s(!m);
|
|
10
|
+
}, [m, s]);
|
|
11
|
+
return /* @__PURE__ */ e.createElement(T, {
|
|
12
12
|
control: /* @__PURE__ */ e.createElement(N, {
|
|
13
13
|
editorId: E,
|
|
14
14
|
open: m
|
|
15
15
|
}),
|
|
16
16
|
open: m,
|
|
17
|
-
onOpen:
|
|
18
|
-
onClose:
|
|
17
|
+
onOpen: r,
|
|
18
|
+
onClose: r
|
|
19
19
|
}, /* @__PURE__ */ e.createElement("div", {
|
|
20
20
|
className: "tw-divide-y tw-divide-line"
|
|
21
|
-
}, /* @__PURE__ */ e.createElement(
|
|
21
|
+
}, /* @__PURE__ */ e.createElement(a, {
|
|
22
22
|
editorId: E,
|
|
23
23
|
type: t.ELEMENT_HEADING1
|
|
24
24
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
25
|
-
style:
|
|
26
|
-
},
|
|
25
|
+
style: n.heading1
|
|
26
|
+
}, l[t.ELEMENT_HEADING1])), /* @__PURE__ */ e.createElement(a, {
|
|
27
27
|
editorId: E,
|
|
28
28
|
type: t.ELEMENT_HEADING2
|
|
29
29
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
30
|
-
style:
|
|
31
|
-
},
|
|
30
|
+
style: n.heading2
|
|
31
|
+
}, l[t.ELEMENT_HEADING2])), /* @__PURE__ */ e.createElement(a, {
|
|
32
32
|
editorId: E,
|
|
33
33
|
type: t.ELEMENT_HEADING3
|
|
34
34
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
35
|
-
style:
|
|
36
|
-
},
|
|
35
|
+
style: n.heading3
|
|
36
|
+
}, l[t.ELEMENT_HEADING3])), /* @__PURE__ */ e.createElement(a, {
|
|
37
37
|
editorId: E,
|
|
38
38
|
type: t.ELEMENT_HEADING4
|
|
39
39
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
40
|
-
style:
|
|
41
|
-
},
|
|
40
|
+
style: n.heading4
|
|
41
|
+
}, l[t.ELEMENT_HEADING4])), /* @__PURE__ */ e.createElement(a, {
|
|
42
42
|
editorId: E,
|
|
43
43
|
type: t.ELEMENT_CUSTOM1
|
|
44
44
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
45
|
-
style:
|
|
46
|
-
},
|
|
45
|
+
style: n.custom1
|
|
46
|
+
}, l[t.ELEMENT_CUSTOM1])), /* @__PURE__ */ e.createElement(a, {
|
|
47
47
|
editorId: E,
|
|
48
48
|
type: t.ELEMENT_CUSTOM2
|
|
49
49
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
50
|
-
style:
|
|
51
|
-
},
|
|
50
|
+
style: n.custom2
|
|
51
|
+
}, l[t.ELEMENT_CUSTOM2])), /* @__PURE__ */ e.createElement(a, {
|
|
52
52
|
editorId: E,
|
|
53
53
|
type: t.ELEMENT_CUSTOM3
|
|
54
54
|
}, /* @__PURE__ */ e.createElement("span", {
|
|
55
|
-
style:
|
|
56
|
-
},
|
|
55
|
+
style: n.custom3
|
|
56
|
+
}, l[t.ELEMENT_CUSTOM3])), /* @__PURE__ */ e.createElement(a, {
|
|
57
|
+
editorId: E,
|
|
58
|
+
type: t.ELEMENT_QUOTE
|
|
59
|
+
}, /* @__PURE__ */ e.createElement("span", {
|
|
60
|
+
style: n.quote
|
|
61
|
+
}, l[t.ELEMENT_QUOTE])), /* @__PURE__ */ e.createElement(a, {
|
|
57
62
|
editorId: E,
|
|
58
63
|
type: t.ELEMENT_PARAGRAPH
|
|
59
|
-
}, /* @__PURE__ */ e.createElement("span",
|
|
64
|
+
}, /* @__PURE__ */ e.createElement("span", {
|
|
65
|
+
style: n.p
|
|
66
|
+
}, l[t.ELEMENT_PARAGRAPH]))));
|
|
60
67
|
};
|
|
61
68
|
export {
|
|
62
69
|
D as TextStyleDropdown
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextStyleDropdown.es.js","sources":["../../../../src/components/RichTextEditor/TextStyleDropdown/TextStyleDropdown.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ToolbarDropdown } from '@udecode/plate';\nimport React, { useCallback, useState } from 'react';\nimport { useRichTextEditorContext } from '../context/RichTextEditorContext';\nimport { TextStyles, textStyleTitles } from '../utils/textStyles';\nimport { DropdownItem } from './DropdownItem';\nimport { DropdownTrigger } from './DropdownTrigger';\n\ntype TextStyleDropdownProps = {\n editorId?: string;\n};\n\nexport const TextStyleDropdown = ({ editorId }: TextStyleDropdownProps) => {\n const [open, setOpen] = useState(false);\n\n const { designTokens } = useRichTextEditorContext();\n\n const onToggle = useCallback(() => {\n setOpen(!open);\n }, [open, setOpen]);\n\n return (\n <ToolbarDropdown\n control={<DropdownTrigger editorId={editorId} open={open} />}\n open={open}\n onOpen={onToggle}\n onClose={onToggle}\n >\n <div className=\"tw-divide-y tw-divide-line\">\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING1}>\n <span style={designTokens.heading1}>{textStyleTitles[TextStyles.ELEMENT_HEADING1]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING2}>\n <span style={designTokens.heading2}>{textStyleTitles[TextStyles.ELEMENT_HEADING2]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING3}>\n <span style={designTokens.heading3}>{textStyleTitles[TextStyles.ELEMENT_HEADING3]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING4}>\n <span style={designTokens.heading4}>{textStyleTitles[TextStyles.ELEMENT_HEADING4]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_CUSTOM1}>\n <span style={designTokens.custom1}>{textStyleTitles[TextStyles.ELEMENT_CUSTOM1]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_CUSTOM2}>\n <span style={designTokens.custom2}>{textStyleTitles[TextStyles.ELEMENT_CUSTOM2]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_CUSTOM3}>\n <span style={designTokens.custom3}>{textStyleTitles[TextStyles.ELEMENT_CUSTOM3]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_PARAGRAPH}>\n <span>{textStyleTitles[TextStyles.ELEMENT_PARAGRAPH]}</span>\n </DropdownItem>\n </div>\n </ToolbarDropdown>\n );\n};\n"],"names":[],"mappings":";;;;;;AAaa,MAAA,IAAoB,CAAC,EAAE,kBAAuC;AACvE,QAAM,CAAC,GAAM,KAAW,EAAS,EAAK,GAEhC,EAAE,oBAAiB,KAEnB,IAAW,EAAY,MAAM;AAC/B,MAAQ,CAAC,CAAI;AAAA,EAAA,GACd,CAAC,GAAM,CAAO,CAAC;AAElB,SACK,kBAAA,cAAA,GAAA;AAAA,IACG,SAAU,kBAAA,cAAA,GAAA;AAAA,MAAgB;AAAA,MAAoB;AAAA,IAAA,CAAY;AAAA,IAC1D;AAAA,IACA,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA,GAER,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAU,EAAgB,EAAW,gBAAiB,CACpF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAU,EAAgB,EAAW,gBAAiB,CACpF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAU,EAAgB,EAAW,gBAAiB,CACpF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,
|
|
1
|
+
{"version":3,"file":"TextStyleDropdown.es.js","sources":["../../../../src/components/RichTextEditor/TextStyleDropdown/TextStyleDropdown.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { ToolbarDropdown } from '@udecode/plate';\nimport React, { useCallback, useState } from 'react';\nimport { useRichTextEditorContext } from '../context/RichTextEditorContext';\nimport { TextStyles, textStyleTitles } from '../utils/textStyles';\nimport { DropdownItem } from './DropdownItem';\nimport { DropdownTrigger } from './DropdownTrigger';\n\ntype TextStyleDropdownProps = {\n editorId?: string;\n};\n\nexport const TextStyleDropdown = ({ editorId }: TextStyleDropdownProps) => {\n const [open, setOpen] = useState(false);\n\n const { designTokens } = useRichTextEditorContext();\n\n const onToggle = useCallback(() => {\n setOpen(!open);\n }, [open, setOpen]);\n\n return (\n <ToolbarDropdown\n control={<DropdownTrigger editorId={editorId} open={open} />}\n open={open}\n onOpen={onToggle}\n onClose={onToggle}\n >\n <div className=\"tw-divide-y tw-divide-line\">\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING1}>\n <span style={designTokens.heading1}>{textStyleTitles[TextStyles.ELEMENT_HEADING1]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING2}>\n <span style={designTokens.heading2}>{textStyleTitles[TextStyles.ELEMENT_HEADING2]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING3}>\n <span style={designTokens.heading3}>{textStyleTitles[TextStyles.ELEMENT_HEADING3]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_HEADING4}>\n <span style={designTokens.heading4}>{textStyleTitles[TextStyles.ELEMENT_HEADING4]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_CUSTOM1}>\n <span style={designTokens.custom1}>{textStyleTitles[TextStyles.ELEMENT_CUSTOM1]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_CUSTOM2}>\n <span style={designTokens.custom2}>{textStyleTitles[TextStyles.ELEMENT_CUSTOM2]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_CUSTOM3}>\n <span style={designTokens.custom3}>{textStyleTitles[TextStyles.ELEMENT_CUSTOM3]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_QUOTE}>\n <span style={designTokens.quote}>{textStyleTitles[TextStyles.ELEMENT_QUOTE]}</span>\n </DropdownItem>\n <DropdownItem editorId={editorId} type={TextStyles.ELEMENT_PARAGRAPH}>\n <span style={designTokens.p}>{textStyleTitles[TextStyles.ELEMENT_PARAGRAPH]}</span>\n </DropdownItem>\n </div>\n </ToolbarDropdown>\n );\n};\n"],"names":[],"mappings":";;;;;;AAaa,MAAA,IAAoB,CAAC,EAAE,kBAAuC;AACvE,QAAM,CAAC,GAAM,KAAW,EAAS,EAAK,GAEhC,EAAE,oBAAiB,KAEnB,IAAW,EAAY,MAAM;AAC/B,MAAQ,CAAC,CAAI;AAAA,EAAA,GACd,CAAC,GAAM,CAAO,CAAC;AAElB,SACK,kBAAA,cAAA,GAAA;AAAA,IACG,SAAU,kBAAA,cAAA,GAAA;AAAA,MAAgB;AAAA,MAAoB;AAAA,IAAA,CAAY;AAAA,IAC1D;AAAA,IACA,QAAQ;AAAA,IACR,SAAS;AAAA,EAAA,GAER,kBAAA,cAAA,OAAA;AAAA,IAAI,WAAU;AAAA,EAAA,GACV,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAW,EAAgB,EAAW,iBAAkB,CACtF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAU,EAAgB,EAAW,gBAAiB,CACpF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAU,EAAgB,EAAW,gBAAiB,CACpF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAU,EAAgB,EAAW,gBAAiB,CACpF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAQ,EAAgB,EAAW,cAAe,CAChF,GACC,kBAAA,cAAA,GAAA;AAAA,IAAa;AAAA,IAAoB,MAAM,EAAW;AAAA,EAAA,GAC9C,kBAAA,cAAA,QAAA;AAAA,IAAK,OAAO,EAAa;AAAA,EAAA,GAAI,EAAgB,EAAW,kBAAmB,CAChF,CACJ,CACJ;AAER;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { merge as r } from "../../../utilities/merge.es.js";
|
|
2
|
+
import s from "react";
|
|
3
|
+
import { useRichTextEditorContext as i } from "../context/RichTextEditorContext.es.js";
|
|
4
|
+
import { alignmentClassnames as a } from "../utils/alignment.es.js";
|
|
5
|
+
const f = ({ element: t, attributes: o, children: m }) => {
|
|
6
|
+
const { designTokens: n } = i(), e = t.align;
|
|
7
|
+
return /* @__PURE__ */ s.createElement("p", {
|
|
8
|
+
...o,
|
|
9
|
+
className: r([e && a[e]]),
|
|
10
|
+
style: n.quote
|
|
11
|
+
}, m);
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
f as QuoteElement
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=quote.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"quote.es.js","sources":["../../../../src/components/RichTextEditor/components/quote.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { PlateRenderElementProps } from '@udecode/plate';\nimport { merge } from '@utilities/merge';\nimport React, { FC } from 'react';\nimport { useRichTextEditorContext } from '../context/RichTextEditorContext';\nimport { alignmentClassnames } from '../utils/alignment';\n\nexport const QuoteElement: FC<PlateRenderElementProps> = ({ element, attributes, children }) => {\n const { designTokens } = useRichTextEditorContext();\n const align = element.align as string;\n\n return (\n <p {...attributes} className={merge([align && alignmentClassnames[align]])} style={designTokens.quote}>\n {children}\n </p>\n );\n};\n"],"names":[],"mappings":";;;;AAQO,MAAM,IAA4C,CAAC,EAAE,YAAS,eAAY,kBAAe;AACtF,QAAA,EAAE,oBAAiB,KACnB,IAAQ,EAAQ;AAEtB,SACK,kBAAA,cAAA,KAAA;AAAA,IAAG,GAAG;AAAA,IAAY,WAAW,EAAM,CAAC,KAAS,EAAoB,EAAM,CAAC;AAAA,IAAG,OAAO,EAAa;AAAA,EAAA,GAC3F,CACL;AAER;"}
|