npm - @frontify/fondue - Versions diffs - 12.0.0-beta.16 → 12.0.0-beta.18 - Mend

@frontify/fondue 12.0.0-beta.16 → 12.0.0-beta.18

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 (41) hide show

package/dist/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.es.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { withPlateEventProvider as i, usePlateEditorState as u, useEventPlateId as c, someNode as m, ToolbarButton as d, unwrapList as f, getPreventDefaultHandler as p, toggleNodeType as P } from "@udecode/plate";
-import E from "react";
-const g = i(({ id: r, type: o, inactiveType: s, active: t, ...l }) => {
-  const e = u(c(r)), n = t != null ? t : !!(e != null && e.selection) && m(e, { match: { type: o } });
-  return /* @__PURE__ */ E.createElement(d, {
-    active: n,
+import { withPlateProvider as i, usePlateEditorState as u, useEventPlateId as c, someNode as m, ToolbarButton as d, unwrapList as f, getPreventDefaultHandler as p, toggleNodeType as P } from "@udecode/plate";
+import T from "react";
+const h = i(({ id: n, type: o, inactiveType: s, active: t, ...l }) => {
+  const e = u(c(n)), r = t != null ? t : !!(e != null && e.selection) && m(e, { match: { type: o } });
+  return /* @__PURE__ */ T.createElement(d, {
+    active: r,
     onMouseDown: (a) => {
-      !e || !e.selection || (n || f(e, {}), p(P, e, {
+      !e || !e.selection || (r || f(e, {}), p(P, e, {
         activeType: o,
         inactiveType: s
       })(a));
@@ -14,6 +14,6 @@ const g = i(({ id: r, type: o, inactiveType: s, active: t, ...l }) => {
   });
 });
 export {
-  g as CheckboxListToolbarButton
+  h as CheckboxListToolbarButton
 };
 //# sourceMappingURL=CheckboxListToolbarButton.es.js.map

package/dist/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CheckboxListToolbarButton.es.js","sources":["../../../../../../src/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.tsx"],"sourcesContent":["import {\n BlockToolbarButtonProps,\n ToolbarButton,\n getPreventDefaultHandler,\n someNode,\n toggleNodeType,\n unwrapList,\n useEventPlateId,\n usePlateEditorState,\n ~~withPlateEventProvider~~,\n} from '@udecode/plate';\nimport React from 'react';\n\nexport const CheckboxListToolbarButton = ~~withPlateEventProvider~~(\n ({ id, type, inactiveType, active, ...props }: BlockToolbarButtonProps) => {\n const editor = usePlateEditorState(useEventPlateId(id));\n\n const isActive = active ?? (!!editor?.selection && someNode(editor, { match: { type } }));\n\n return (\n <ToolbarButton\n active={isActive}\n onMouseDown={(event) => {\n if (!editor \|\| !editor.selection) {\n return;\n }\n\n if (!isActive) {\n unwrapList(editor, {});\n }\n\n getPreventDefaultHandler(toggleNodeType, editor, {\n activeType: type,\n inactiveType,\n })(event);\n }}\n {...props}\n />\n );\n },\n);\n"],"names":[],"mappings":";;AAaa,MAAA,IAA4B,EACrC,CAAC,EAAE,OAAI,SAAM,iBAAc,cAAW,QAAqC;AACvE,QAAM,IAAS,EAAoB,EAAgB,CAAE,CAAC,GAEhD,IAAW,gBAAY,CAAA,CAAC,gBAAQ,cAAa,EAAS,GAAQ,EAAE,OAAO,EAAE,WAAQ;AAEvF,SACK,kBAAA,cAAA,GAAA;AAAA,IACG,QAAQ;AAAA,IACR,aAAa,CAAC,MAAU;AACpB,MAAI,CAAC,KAAU,CAAC,EAAO,aAIlB,MACU,EAAA,GAAQ,CAAA,CAAE,GAGzB,EAAyB,GAAgB,GAAQ;AAAA,QAC7C,YAAY;AAAA,QACZ;AAAA,MAAA,CACH,EAAE,CAAK;AAAA,IACZ;AAAA,IACC,GAAG;AAAA,EAAA,CACR;AAER,CACJ;"}
1	+ {"version":3,"file":"CheckboxListToolbarButton.es.js","sources":["../../../../../../src/components/RichTextEditor/Plugins/CheckboxListPlugin/CheckboxListButton/CheckboxListToolbarButton.tsx"],"sourcesContent":["import {\n BlockToolbarButtonProps,\n ToolbarButton,\n getPreventDefaultHandler,\n someNode,\n toggleNodeType,\n unwrapList,\n useEventPlateId,\n usePlateEditorState,\n withPlateProvider,\n} from '@udecode/plate';\nimport React from 'react';\n\nexport const CheckboxListToolbarButton = withPlateProvider(\n ({ id, type, inactiveType, active, ...props }: BlockToolbarButtonProps) => {\n const editor = usePlateEditorState(useEventPlateId(id));\n\n const isActive = active ?? (!!editor?.selection && someNode(editor, { match: { type } }));\n\n return (\n <ToolbarButton\n active={isActive}\n onMouseDown={(event) => {\n if (!editor \|\| !editor.selection) {\n return;\n }\n\n if (!isActive) {\n unwrapList(editor, {});\n }\n\n getPreventDefaultHandler(toggleNodeType, editor, {\n activeType: type,\n inactiveType,\n })(event);\n }}\n {...props}\n />\n );\n },\n);\n"],"names":[],"mappings":";;AAaa,MAAA,IAA4B,EACrC,CAAC,EAAE,OAAI,SAAM,iBAAc,cAAW,QAAqC;AACvE,QAAM,IAAS,EAAoB,EAAgB,CAAE,CAAC,GAEhD,IAAW,gBAAY,CAAA,CAAC,gBAAQ,cAAa,EAAS,GAAQ,EAAE,OAAO,EAAE,WAAQ;AAEvF,SACK,kBAAA,cAAA,GAAA;AAAA,IACG,QAAQ;AAAA,IACR,aAAa,CAAC,MAAU;AACpB,MAAI,CAAC,KAAU,CAAC,EAAO,aAIlB,MACU,EAAA,GAAQ,CAAA,CAAE,GAGzB,EAAyB,GAAgB,GAAQ;AAAA,QAC7C,YAAY;AAAA,QACZ;AAAA,MAAA,CACH,EAAE,CAAK;AAAA,IACZ;AAAA,IACC,GAAG;AAAA,EAAA,CACR;AAER,CACJ;"}

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/CustomFloatingLink.es.js CHANGED Viewed

@@ -3,11 +3,13 @@ import { useFloatingLinkSelectors as i } from "@udecode/plate";
 import { FloatingLink as n } from "./FloatingLink.es.js";
 import { EditModal as l } from "./EditLinkModal/EditModal.es.js";
 import { InsertModal as m } from "./InsertLinkModal/InsertModal.es.js";
-const d = () => {
+import "../../../../../node_modules/@udecode/plate-core/dist/index.es.es.js";
+import "slate-react";
+const g = () => {
   const o = i().isEditing(), e = /* @__PURE__ */ t.createElement(m, null), r = o ? e : /* @__PURE__ */ t.createElement(l, null);
   return /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(n.InsertRoot, null, e), /* @__PURE__ */ t.createElement(n.EditRoot, null, r));
 };
 export {
-  d as CustomFloatingLink
+  g as CustomFloatingLink
 };
 //# sourceMappingURL=CustomFloatingLink.es.js.map

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/CustomFloatingLink.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomFloatingLink.es.js","sources":["../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/CustomFloatingLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React from 'react';\nimport { useFloatingLinkSelectors } from '@udecode/plate';\nimport { FloatingLink } from './FloatingLink';\nimport { EditModal } from './EditLinkModal';\nimport { InsertModal } from './InsertLinkModal';\n\nexport const CustomFloatingLink = () => {\n const isEditing = useFloatingLinkSelectors().isEditing();\n\n const input = <InsertModal />;\n const editContent = !isEditing ? <EditModal /> : input;\n\n return (\n <>\n <FloatingLink.InsertRoot>{input}</FloatingLink.InsertRoot>\n\n <FloatingLink.EditRoot>{editContent}</FloatingLink.EditRoot>\n </>\n );\n};\n"],"names":[],"mappings":"~~;;;;;~~AAQO,MAAM,IAAqB,MAAM;AAC9B,QAAA,IAAY,IAA2B,aAEvC,oCAAS,GAAY,IAAA,GACrB,IAAc,AAAC,IAA4B,IAAhB,kBAAA,cAAC,OAAU;AAE5C,SAEQ,kBAAA,cAAA,EAAA,UAAA,MAAA,kBAAA,cAAC,EAAa,YAAb,MAAyB,CAAM,GAEhC,kBAAA,cAAC,EAAa,UAAb,MAAuB,CAAY,CACxC;AAER;"}
1	+ {"version":3,"file":"CustomFloatingLink.es.js","sources":["../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/CustomFloatingLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport React from 'react';\nimport { useFloatingLinkSelectors } from '@udecode/plate';\nimport { FloatingLink } from './FloatingLink';\nimport { EditModal } from './EditLinkModal';\nimport { InsertModal } from './InsertLinkModal';\n\nexport const CustomFloatingLink = () => {\n const isEditing = useFloatingLinkSelectors().isEditing();\n\n const input = <InsertModal />;\n const editContent = !isEditing ? <EditModal /> : input;\n\n return (\n <>\n <FloatingLink.InsertRoot>{input}</FloatingLink.InsertRoot>\n\n <FloatingLink.EditRoot>{editContent}</FloatingLink.EditRoot>\n </>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAQO,MAAM,IAAqB,MAAM;AAC9B,QAAA,IAAY,IAA2B,aAEvC,oCAAS,GAAY,IAAA,GACrB,IAAc,AAAC,IAA4B,IAAhB,kBAAA,cAAC,OAAU;AAE5C,SAEQ,kBAAA,cAAA,EAAA,UAAA,MAAA,kBAAA,cAAC,EAAa,YAAb,MAAyB,CAAM,GAEhC,kBAAA,cAAC,EAAa,UAAb,MAAuB,CAAY,CACxC;AAER;"}

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/EditLinkModal/useFloatingLinkEdit.es.js CHANGED Viewed

@@ -1,43 +1,48 @@
-import { useCallback as k, useEffect as y } from "react";
-import { useEditorRef as L, usePlateSelectors as h, useFloatingLinkSelectors as s, getAboveNode as R, getPluginType as c, ELEMENT_LINK as l, getRangeBoundingClientRect as C, getStartPoint as F, getEndPoint as N, getDefaultBoundingClientRect as P, useVirtualFloatingLink as S, floatingLinkActions as o, someNode as B, floatingLinkSelectors as b, useComposedRef as x } from "@udecode/plate";
-import { getUrlFromEditor as A } from "../../utils/getUrl.es.js";
-const w = ({ floatingOptions: d, ...n }) => {
-  const e = L(), u = h(e.id).keyEditor(), g = s().mode(), a = s().open(), f = k(() => {
-    const t = R(e, {
-      match: { type: c(e, l) }
+import { useCallback as y, useEffect as F } from "react";
+import { useEditorRef as h, usePlateSelectors as C, useFloatingLinkSelectors as l, getPluginOptions as R, ELEMENT_LINK as n, getAboveNode as P, getPluginType as d, getRangeBoundingClientRect as b, getStartPoint as N, getEndPoint as O, getDefaultBoundingClientRect as S, useVirtualFloatingLink as B, floatingLinkActions as o, someNode as I, floatingLinkSelectors as g, useHotkeys as v, triggerFloatingLinkEdit as x, useFloatingLinkEnter as A, useFloatingLinkEscape as D, useComposedRef as H } from "@udecode/plate";
+import { getUrlFromEditor as T } from "../../utils/getUrl.es.js";
+const M = ({ floatingOptions: u, ...i }) => {
+  const e = h(), c = C().keyEditor(), a = l().mode(), f = l().isOpen(e.id), { triggerFloatingLinkHotkeys: m } = R(e, n), p = y(() => {
+    const t = P(e, {
+      match: { type: d(e, n) }
     });
     if (t) {
-      const [, r] = t;
-      return C(e, {
-        anchor: F(e, r),
-        focus: N(e, r)
+      const [, s] = t;
+      return b(e, {
+        anchor: N(e, s),
+        focus: O(e, s)
       });
     }
-    return P();
-  }, [e]), m = a && g === "edit", { update: i, style: p, floating: E } = S({
-    open: m,
-    getBoundingClientRect: f,
-    ...d
+    return S();
+  }, [e]), k = f && a === "edit", { update: r, style: E, floating: L } = B({
+    editorId: e.id,
+    open: k,
+    getBoundingClientRect: p,
+    ...u
   });
-  return y(() => {
-    const t = A(e);
-    if (t && o.url(t), e.selection && B(e, {
-      match: { type: c(e, l) }
+  return F(() => {
+    const t = T(e);
+    if (t && o.url(t), e.selection && I(e, {
+      match: { type: d(e, n) }
     })) {
-      o.show("edit"), i();
+      o.show("edit", e.id), r();
       return;
     }
-    b.mode() === "edit" && o.hide();
-  }, [e, u, i]), {
+    g.mode() === "edit" && o.hide();
+  }, [e, c, r]), v(m, (t) => {
+    t.preventDefault(), g.mode() === "edit" && x(e);
+  }, {
+    enableOnContentEditable: !0
+  }, []), A(), D(), {
     style: {
-      ...p,
+      ...E,
       zIndex: 1
     },
-    ...n,
-    ref: x(n.ref, E)
+    ...i,
+    ref: H(i.ref, L)
   };
 };
 export {
-  w as useFloatingLinkEdit
+  M as useFloatingLinkEdit
 };
 //# sourceMappingURL=useFloatingLinkEdit.es.js.map

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/EditLinkModal/useFloatingLinkEdit.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFloatingLinkEdit.es.js","sources":["../../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/EditLinkModal/useFloatingLinkEdit.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useCallback, useEffect } from 'react';\nimport {\n ELEMENT_LINK,\n FloatingLinkProps,\n HTMLPropsAs,\n floatingLinkActions,\n floatingLinkSelectors,\n getAboveNode,\n getDefaultBoundingClientRect,\n getEndPoint,\n getPluginType,\n getRangeBoundingClientRect,\n getStartPoint,\n someNode,\n useComposedRef,\n useEditorRef,\n useFloatingLinkSelectors,\n usePlateSelectors,\n useVirtualFloatingLink,\n} from '@udecode/plate';\nimport { getUrlFromEditor } from '../../utils';\n\nexport const useFloatingLinkEdit = ({ floatingOptions, ...props }: FloatingLinkProps): HTMLPropsAs<'div'> => {\n const editor = useEditorRef();\n const keyEditor = usePlateSelectors(~~editor.id~~).keyEditor();\n const mode = useFloatingLinkSelectors().mode();\n const open = useFloatingLinkSelectors().~~open~~();\n\n const getBoundingClientRect = useCallback(() => {\n const entry = getAboveNode(editor, {\n match: { type: getPluginType(editor, ELEMENT_LINK) },\n });\n\n if (entry) {\n const [, path] = entry;\n return getRangeBoundingClientRect(editor, {\n anchor: getStartPoint(editor, path),\n focus: getEndPoint(editor, path),\n });\n }\n\n return getDefaultBoundingClientRect();\n }, [editor]);\n\n const isOpen = open && mode === 'edit';\n\n const { update, style, floating } = useVirtualFloatingLink({\n open: isOpen,\n getBoundingClientRect,\n ...floatingOptions,\n });\n\n useEffect(() => {\n const url = getUrlFromEditor(editor);\n if (url) {\n floatingLinkActions.url(url);\n }\n if (\n editor.selection &&\n someNode(editor, {\n match: { type: getPluginType(editor, ELEMENT_LINK) },\n })\n ) {\n floatingLinkActions.show('edit');\n\n update();\n return;\n }\n\n if (floatingLinkSelectors.mode() === 'edit') {\n floatingLinkActions.hide();\n }\n }, [editor, keyEditor, update]);\n\n return {\n style: {\n ...style,\n zIndex: 1,\n },\n ...props,\n ref: useComposedRef<HTMLElement \| null>(props.ref, floating),\n };\n};\n"],"names":[],"mappings":";;;~~AAwBO~~,MAAM,IAAsB,CAAC,EAAE,uBAAoB,QAAmD;AACzG,QAAM,IAAS,KACT,IAAY,~~EAAkB~~,EAAO,EAAE,EAAE,~~UAAU~~,~~GACnD~~,~~IAAO~~,~~IAA2B~~,~~QAClC~~,~~IAAO,IAA2B,QAElC,~~IAAwB,EAAY,MAAM;AACtC,UAAA,IAAQ,EAAa,GAAQ;AAAA,MAC/B,OAAO,EAAE,MAAM,EAAc,GAAQ,CAAY,EAAE;AAAA,IAAA,CACtD;AAED,QAAI,GAAO;AACD,YAAA,CAAG,EAAA,KAAQ;AACjB,aAAO,EAA2B,GAAQ;AAAA,QACtC,QAAQ,EAAc,GAAQ,CAAI;AAAA,QAClC,OAAO,EAAY,GAAQ,CAAI;AAAA,MAAA,CAClC;AAAA,IACL;AAEA,WAAO,EAA6B;AAAA,EAAA,GACrC,CAAC,CAAM,CAAC,GAEL,IAAS,KAAQ,MAAS,QAE1B,EAAE,WAAQ,UAAO,gBAAa,EAAuB;AAAA,IACvD,MAAM;AAAA,IACN;AAAA,IACA,GAAG;AAAA,EAAA,CACN;AAED,WAAU,MAAM;AACN,UAAA,IAAM,EAAiB,CAAM;~~AAK~~/B,~~QAJA~~,KACA,EAAoB,IAAI,CAAG,~~GAG3B~~,EAAO,aACP,EAAS,GAAQ;AAAA,MACb,OAAO,EAAE,MAAM,EAAc,GAAQ,CAAY,EAAE;AAAA,IAAA,CACtD,GACH;~~AACE~~,~~QAAoB~~,KAAK,~~MAAM~~,~~GAExB~~;AACP;AAAA,IACJ;AAEI,IAAA,EAAsB,KAAK,MAAM,UACjC,EAAoB,KAAK;AAAA,EAE9B,GAAA,CAAC,GAAQ,GAAW,CAAM,CAAC,~~GAEvB~~;AAAA,IACH,OAAO;AAAA,MACH,GAAG;AAAA,MACH,QAAQ;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,IACH,KAAK,EAAmC,EAAM,KAAK,CAAQ;AAAA,EAAA;AAEnE;"}
1	+ {"version":3,"file":"useFloatingLinkEdit.es.js","sources":["../../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/EditLinkModal/useFloatingLinkEdit.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useCallback, useEffect } from 'react';\nimport {\n ELEMENT_LINK,\n FloatingLinkProps,\n HTMLPropsAs,\n LinkPlugin,\n floatingLinkActions,\n floatingLinkSelectors,\n getAboveNode,\n getDefaultBoundingClientRect,\n getEndPoint,\n getPluginOptions,\n getPluginType,\n getRangeBoundingClientRect,\n getStartPoint,\n someNode,\n triggerFloatingLinkEdit,\n useComposedRef,\n useEditorRef,\n useFloatingLinkEnter,\n useFloatingLinkEscape,\n useFloatingLinkSelectors,\n useHotkeys,\n usePlateSelectors,\n useVirtualFloatingLink,\n} from '@udecode/plate';\nimport { getUrlFromEditor } from '../../utils';\n\nexport const useFloatingLinkEdit = ({ floatingOptions, ...props }: FloatingLinkProps): HTMLPropsAs<'div'> => {\n const editor = useEditorRef();\n const keyEditor = usePlateSelectors().keyEditor();\n const mode = useFloatingLinkSelectors().mode();\n const open = useFloatingLinkSelectors().isOpen(editor.id);\n\n const { triggerFloatingLinkHotkeys } = getPluginOptions<LinkPlugin>(editor, ELEMENT_LINK);\n\n const getBoundingClientRect = useCallback(() => {\n const entry = getAboveNode(editor, {\n match: { type: getPluginType(editor, ELEMENT_LINK) },\n });\n\n if (entry) {\n const [, path] = entry;\n return getRangeBoundingClientRect(editor, {\n anchor: getStartPoint(editor, path),\n focus: getEndPoint(editor, path),\n });\n }\n\n return getDefaultBoundingClientRect();\n }, [editor]);\n\n const isOpen = open && mode === 'edit';\n\n const { update, style, floating } = useVirtualFloatingLink({\n editorId: editor.id,\n open: isOpen,\n getBoundingClientRect,\n ...floatingOptions,\n });\n\n useEffect(() => {\n const url = getUrlFromEditor(editor);\n if (url) {\n floatingLinkActions.url(url);\n }\n\n if (\n editor.selection &&\n someNode(editor, {\n match: { type: getPluginType(editor, ELEMENT_LINK) },\n })\n ) {\n floatingLinkActions.show('edit', editor.id);\n update();\n return;\n }\n\n if (floatingLinkSelectors.mode() === 'edit') {\n floatingLinkActions.hide();\n }\n }, [editor, keyEditor, update]);\n\n useHotkeys(\n triggerFloatingLinkHotkeys!,\n (e) => {\n e.preventDefault();\n\n if (floatingLinkSelectors.mode() === 'edit') {\n triggerFloatingLinkEdit(editor);\n }\n },\n {\n enableOnContentEditable: true,\n },\n [],\n );\n\n useFloatingLinkEnter();\n\n useFloatingLinkEscape();\n\n return {\n style: {\n ...style,\n zIndex: 1,\n },\n ...props,\n ref: useComposedRef<HTMLElement \| null>(props.ref, floating),\n };\n};\n"],"names":[],"mappings":";;;AA8BO,MAAM,IAAsB,CAAC,EAAE,uBAAoB,QAAmD;AACzG,QAAM,IAAS,KACT,IAAY,IAAoB,aAChC,IAAO,IAA2B,QAClC,IAAO,EAA2B,EAAA,OAAO,EAAO,EAAE,GAElD,EAAE,kCAA+B,EAA6B,GAAQ,CAAY,GAElF,IAAwB,EAAY,MAAM;AACtC,UAAA,IAAQ,EAAa,GAAQ;AAAA,MAC/B,OAAO,EAAE,MAAM,EAAc,GAAQ,CAAY,EAAE;AAAA,IAAA,CACtD;AAED,QAAI,GAAO;AACD,YAAA,CAAG,EAAA,KAAQ;AACjB,aAAO,EAA2B,GAAQ;AAAA,QACtC,QAAQ,EAAc,GAAQ,CAAI;AAAA,QAClC,OAAO,EAAY,GAAQ,CAAI;AAAA,MAAA,CAClC;AAAA,IACL;AAEA,WAAO,EAA6B;AAAA,EAAA,GACrC,CAAC,CAAM,CAAC,GAEL,IAAS,KAAQ,MAAS,QAE1B,EAAE,WAAQ,UAAO,gBAAa,EAAuB;AAAA,IACvD,UAAU,EAAO;AAAA,IACjB,MAAM;AAAA,IACN;AAAA,IACA,GAAG;AAAA,EAAA,CACN;AAED,WAAU,MAAM;AACN,UAAA,IAAM,EAAiB,CAAM;AAM/B,QALA,KACA,EAAoB,IAAI,CAAG,GAI3B,EAAO,aACP,EAAS,GAAQ;AAAA,MACb,OAAO,EAAE,MAAM,EAAc,GAAQ,CAAY,EAAE;AAAA,IAAA,CACtD,GACH;AACsB,QAAA,KAAK,QAAQ,EAAO,EAAE,GACnC;AACP;AAAA,IACJ;AAEI,IAAA,EAAsB,KAAK,MAAM,UACjC,EAAoB,KAAK;AAAA,EAE9B,GAAA,CAAC,GAAQ,GAAW,CAAM,CAAC,GAG1B,EAAA,GACA,CAAC,MAAM;AACH,MAAE,eAAe,GAEb,EAAsB,KAAK,MAAM,UACjC,EAAwB,CAAM;AAAA,EAClC,GAEJ;AAAA,IACI,yBAAyB;AAAA,EAC7B,GACA,CACJ,CAAA,GAEqB,KAEC,KAEf;AAAA,IACH,OAAO;AAAA,MACH,GAAG;AAAA,MACH,QAAQ;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,IACH,KAAK,EAAmC,EAAM,KAAK,CAAQ;AAAA,EAAA;AAEnE;"}

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/FloatingLink.es.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { createComponentAs as m, useFloatingLinkInsert as n, createElementAs as p, FloatingLink as r } from "@udecode/plate";
+import { createComponentAs as m, createElementAs as p, FloatingLink as r } from "@udecode/plate";
 import "react";
 import "../../../../../foundation/Icon/Generated/IconAdobeCreativeCloud.es.js";
 import "../../../../../foundation/Icon/Generated/IconAdobeCreativeCloud12.es.js";
@@ -1662,20 +1662,27 @@ import "../../../../../foundation/Icon/Generated/IconWorkflowShapes24.es.js";
 import "../../../../../foundation/Icon/Generated/IconWorkflowShapes32.es.js";
 import "../../../../../foundation/Icon/IconsMap.es.js";
 import "../../../context/RichTextEditorContext.es.js";
-import { useFloatingLinkEdit as e } from "./EditLinkModal/useFloatingLinkEdit.es.js";
+import { useFloatingLinkEdit as n } from "./EditLinkModal/useFloatingLinkEdit.es.js";
+import "../../../../Button/Button.es.js";
+import "../../../../Checkbox/Checkbox.es.js";
+import "../../../../FormControl/FormControl.es.js";
+import "@react-aria/focus";
+import "../../../../../utilities/focusStyle.es.js";
+import "./InsertLinkModal/useInsertModal.es.js";
+import { useFloatingLinkInsert as e } from "./InsertLinkModal/useFloatingLinkInsert.es.js";
 const s = m((i) => {
   var o;
-  const t = n(i);
+  const t = e(i);
   return ((o = t.style) == null ? void 0 : o.display) === "none" ? null : p("div", t);
 }), l = m((i) => {
   var o;
-  const t = e(i);
+  const t = n(i);
   return ((o = t.style) == null ? void 0 : o.display) === "none" ? null : p("div", t);
 });
 r.EditRoot = l;
 r.InsertRoot = s;
-const m$ = r;
+const u$ = r;
 export {
-  m$ as FloatingLink
+  u$ as FloatingLink
 };
 //# sourceMappingURL=FloatingLink.es.js.map

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/FloatingLink.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FloatingLink.es.js","sources":["../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/FloatingLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n FloatingLinkProps,\n FloatingLink as PlateFloatingLink,\n createComponentAs,\n createElementAs,\n ~~useFloatingLinkInsert,\n~~} from '@udecode/plate';\nimport { useFloatingLinkEdit } from './EditLinkModal';\n\nconst FloatingLinkInsertRoot = createComponentAs<FloatingLinkProps>((props) => {\n const htmlProps = useFloatingLinkInsert(props);\n\n if (htmlProps.style?.display === 'none') {\n return null;\n }\n\n return createElementAs('div', htmlProps);\n});\n\nconst FloatingLinkEditRoot = createComponentAs<FloatingLinkProps>((props) => {\n const htmlProps = useFloatingLinkEdit(props);\n\n if (htmlProps.style?.display === 'none') {\n return null;\n }\n\n return createElementAs('div', htmlProps);\n});\n\nPlateFloatingLink.EditRoot = FloatingLinkEditRoot;\nPlateFloatingLink.InsertRoot = FloatingLinkInsertRoot;\n\nexport const FloatingLink = PlateFloatingLink;\n"],"names":["PlateFloatingLink"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,IAAyB,EAAqC,CAAC,MAAU;;AACrE,QAAA,IAAY,EAAsB,CAAK;AAEzC,SAAA,QAAU,UAAV,kBAAiB,aAAY,SACtB,OAGJ,EAAgB,OAAO,CAAS;AAC3C,CAAC,GAEK,IAAuB,EAAqC,CAAC,MAAU;;AACnE,QAAA,IAAY,EAAoB,CAAK;AAEvC,SAAA,QAAU,UAAV,kBAAiB,aAAY,SACtB,OAGJ,EAAgB,OAAO,CAAS;AAC3C,CAAC;AAEDA,EAAkB,WAAW;AAC7BA,EAAkB,aAAa;AAExB,MAAM,KAAeA;"}
1	+ {"version":3,"file":"FloatingLink.es.js","sources":["../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/FloatingLink.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport {\n FloatingLinkProps,\n FloatingLink as PlateFloatingLink,\n createComponentAs,\n createElementAs,\n} from '@udecode/plate';\nimport { useFloatingLinkEdit } from './EditLinkModal';\nimport { useFloatingLinkInsert } from './InsertLinkModal';\n\nconst FloatingLinkInsertRoot = createComponentAs<FloatingLinkProps>((props) => {\n const htmlProps = useFloatingLinkInsert(props);\n\n if (htmlProps.style?.display === 'none') {\n return null;\n }\n\n return createElementAs('div', htmlProps);\n});\n\nconst FloatingLinkEditRoot = createComponentAs<FloatingLinkProps>((props) => {\n const htmlProps = useFloatingLinkEdit(props);\n\n if (htmlProps.style?.display === 'none') {\n return null;\n }\n\n return createElementAs('div', htmlProps);\n});\n\nPlateFloatingLink.EditRoot = FloatingLinkEditRoot;\nPlateFloatingLink.InsertRoot = FloatingLinkInsertRoot;\n\nexport const FloatingLink = PlateFloatingLink;\n"],"names":["PlateFloatingLink"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,MAAM,IAAyB,EAAqC,CAAC,MAAU;;AACrE,QAAA,IAAY,EAAsB,CAAK;AAEzC,SAAA,QAAU,UAAV,kBAAiB,aAAY,SACtB,OAGJ,EAAgB,OAAO,CAAS;AAC3C,CAAC,GAEK,IAAuB,EAAqC,CAAC,MAAU;;AACnE,QAAA,IAAY,EAAoB,CAAK;AAEvC,SAAA,QAAU,UAAV,kBAAiB,aAAY,SACtB,OAGJ,EAAgB,OAAO,CAAS;AAC3C,CAAC;AAEDA,EAAkB,WAAW;AAC7BA,EAAkB,aAAa;AAExB,MAAM,KAAeA;"}

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/InsertLinkModal/index.d.ts CHANGED Viewed

	@@ -1 +1,2 @@
1 1	export * from './InsertModal';
2	+ export * from './useFloatingLinkInsert';

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/InsertLinkModal/useFloatingLinkInsert.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import { FloatingLinkProps, HTMLPropsAs } from '@udecode/plate';
2	+ export declare const useFloatingLinkInsert: ({ floatingOptions, ...props }: FloatingLinkProps) => HTMLPropsAs<'div'>;

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/InsertLinkModal/useFloatingLinkInsert.es.js ADDED Viewed

@@ -0,0 +1,38 @@
+import { useEffect as m } from "react";
+import { useEditorRef as p, useFloatingLinkSelectors as r, getPluginOptions as k, ELEMENT_LINK as L, useHotkeys as E, triggerFloatingLinkInsert as F, useOnClickOutside as C, floatingLinkSelectors as I, floatingLinkActions as n, focusEditor as O, useVirtualFloatingLink as y, useFloatingLinkEscape as R, useComposedRef as S } from "@udecode/plate";
+import { getSelectionBoundingClientRect as b } from "../../../../../../node_modules/@udecode/plate-floating/dist/index.es.es.js";
+import { useFocused as h } from "slate-react";
+const N = ({ floatingOptions: l, ...o }) => {
+  const e = p(), i = h(), u = r().mode(), t = r().isOpen(e.id), { triggerFloatingLinkHotkeys: d } = k(e, L);
+  E(d, (a) => {
+    a.preventDefault(), F(e, {
+      focused: i
+    });
+  }, {
+    enableOnContentEditable: !0
+  }, [i]);
+  const c = C(() => {
+    I.mode() === "insert" && t && (n.hide(), O(e, e.selection));
+  }), { update: s, style: f, floating: g } = y({
+    editorId: e.id,
+    open: t && u === "insert",
+    getBoundingClientRect: b,
+    whileElementsMounted: () => {
+    },
+    ...l
+  });
+  return m(() => {
+    t ? (s(), n.updated(!0)) : n.updated(!1);
+  }, [t, s]), R(), {
+    style: {
+      ...f,
+      zIndex: 1
+    },
+    ...o,
+    ref: S(o.ref, g, c)
+  };
+};
+export {
+  N as useFloatingLinkInsert
+};
+//# sourceMappingURL=useFloatingLinkInsert.es.js.map

package/dist/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/InsertLinkModal/useFloatingLinkInsert.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useFloatingLinkInsert.es.js","sources":["../../../../../../../src/components/RichTextEditor/Plugins/LinkPlugin/FloatingLink/InsertLinkModal/useFloatingLinkInsert.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport {\n ELEMENT_LINK,\n FloatingLinkProps,\n HTMLPropsAs,\n LinkPlugin,\n floatingLinkActions,\n floatingLinkSelectors,\n focusEditor,\n getPluginOptions,\n triggerFloatingLinkInsert,\n useComposedRef,\n useEditorRef,\n useFloatingLinkEscape,\n useFloatingLinkSelectors,\n useHotkeys,\n useOnClickOutside,\n useVirtualFloatingLink,\n} from '@udecode/plate';\nimport { getSelectionBoundingClientRect } from '@udecode/plate-floating';\nimport { useFocused } from 'slate-react';\n\nexport const useFloatingLinkInsert = ({ floatingOptions, ...props }: FloatingLinkProps): HTMLPropsAs<'div'> => {\n const editor = useEditorRef();\n const focused = useFocused();\n const mode = useFloatingLinkSelectors().mode();\n const open = useFloatingLinkSelectors().isOpen(editor.id);\n\n const { triggerFloatingLinkHotkeys } = getPluginOptions<LinkPlugin>(editor, ELEMENT_LINK);\n\n useHotkeys(\n triggerFloatingLinkHotkeys!,\n (e) => {\n e.preventDefault();\n\n triggerFloatingLinkInsert(editor, {\n focused,\n });\n },\n {\n enableOnContentEditable: true,\n },\n [focused],\n );\n\n const ref = useOnClickOutside(() => {\n if (floatingLinkSelectors.mode() === 'insert' && open) {\n floatingLinkActions.hide();\n focusEditor(editor, editor.selection!);\n }\n });\n\n const { update, style, floating } = useVirtualFloatingLink({\n editorId: editor.id,\n open: open && mode === 'insert',\n getBoundingClientRect: getSelectionBoundingClientRect,\n // eslint-disable-next-line @typescript-eslint/no-empty-function\n whileElementsMounted: () => {},\n ...floatingOptions,\n });\n\n // wait for update before focusing input\n useEffect(() => {\n if (open) {\n update();\n floatingLinkActions.updated(true);\n } else {\n floatingLinkActions.updated(false);\n }\n }, [open, update]);\n\n useFloatingLinkEscape();\n\n return {\n style: {\n ...style,\n zIndex: 1,\n },\n ...props,\n ref: useComposedRef<HTMLElement | null>(props.ref, floating, ref),\n };\n};\n"],"names":[],"mappings":";;;;AAsBO,MAAM,IAAwB,CAAC,EAAE,uBAAoB,QAAmD;AAC3G,QAAM,IAAS,KACT,IAAU,KACV,IAAO,IAA2B,QAClC,IAAO,EAA2B,EAAA,OAAO,EAAO,EAAE,GAElD,EAAE,kCAA+B,EAA6B,GAAQ,CAAY;AAGpF,IAAA,GACA,CAAC,MAAM;AACH,MAAE,eAAe,GAEjB,EAA0B,GAAQ;AAAA,MAC9B;AAAA,IAAA,CACH;AAAA,EAAA,GAEL;AAAA,IACI,yBAAyB;AAAA,EAAA,GAE7B,CAAC,CAAO,CACZ;AAEM,QAAA,IAAM,EAAkB,MAAM;AAChC,IAAI,EAAsB,WAAW,YAAY,KAC7C,GAAoB,KAAK,GACb,EAAA,GAAQ,EAAO,SAAU;AAAA,EACzC,CACH,GAEK,EAAE,WAAQ,UAAO,gBAAa,EAAuB;AAAA,IACvD,UAAU,EAAO;AAAA,IACjB,MAAM,KAAQ,MAAS;AAAA,IACvB,uBAAuB;AAAA,IAEvB,sBAAsB,MAAM;AAAA,IAAC;AAAA,IAC7B,GAAG;AAAA,EAAA,CACN;AAGD,WAAU,MAAM;AACZ,IAAI,IACO,MACP,EAAoB,QAAQ,EAAI,KAEhC,EAAoB,QAAQ,EAAK;AAAA,EACrC,GACD,CAAC,GAAM,CAAM,CAAC,GAEK,KAEf;AAAA,IACH,OAAO;AAAA,MACH,GAAG;AAAA,MACH,QAAQ;AAAA,IACZ;AAAA,IACA,GAAG;AAAA,IACH,KAAK,EAAmC,EAAM,KAAK,GAAU,CAAG;AAAA,EAAA;AAExE;"}

package/dist/components/Slider/Slider.d.ts CHANGED Viewed

@@ -12,7 +12,7 @@ export declare type TextOrNumberItem = {
 };
 export declare type SliderProps = {
     id?: string;
-    items: TextOrNumberItem[] | IconItem[];
+    items: (TextOrNumberItem | IconItem)[];
     activeItemId: string;
     onChange: (id: string) => void;
     ariaLabel?: string;

package/dist/components/Slider/Slider.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Slider.es.js","sources":["../../../src/components/Slider/Slider.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport { IconProps } from '@foundation/Icon/IconProps';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useFocusRing } from '@react-aria/focus';\nimport { setInteractionModality } from '@react-aria/interactions';\nimport { useRadio, useRadioGroup } from '@react-aria/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { RadioGroupState, useRadioGroupState } from '@react-stately/radio';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { motion } from 'framer-motion';\nimport React, { FC, ReactElement, useMemo, useRef } from 'react';\n\nexport type IconItem = {\n id: string;\n icon: ReactElement<IconProps>;\n value?: string;\n ariaLabel: string;\n};\n\nexport type TextOrNumberItem = {\n id: string;\n value: string \| number;\n};\n\nexport type SliderProps = {\n id?: string;\n items: TextOrNumberItem[] \| IconItem[];\n activeItemId: string;\n onChange: (id: string) => void;\n ariaLabel?: string;\n disabled?: boolean;\n};\n\nconst isIconItem = (item: TextOrNumberItem \| IconItem): item is IconItem => (item as IconItem).icon !== undefined;\n\ninterface SliderItemProps {\n id: string;\n item: TextOrNumberItem \| IconItem;\n disabled: boolean;\n radioGroupState: RadioGroupState;\n}\n\nconst SliderItem = (props: SliderItemProps) => {\n const { id, item, disabled, radioGroupState } = props;\n const ref = useRef<HTMLInputElement \| null>(null);\n const isActive = item.id === radioGroupState.selectedValue;\n const { inputProps } = useRadio(\n {\n value: item.id,\n 'aria-label': isIconItem(item) ? item.ariaLabel : item.value.toString(),\n isDisabled: disabled,\n id: isActive ? id : undefined,\n },\n radioGroupState,\n ref,\n );\n const { isFocusVisible, focusProps } = useFocusRing();\n\n const handleMockLabelClick = () => {\n if (!disabled) {\n radioGroupState.setSelectedValue(item.id);\n ref.current?.focus();\n setInteractionModality('pointer');\n }\n };\n\n const getSliderItemTestId = () => {\n switch (true) {\n case isIconItem(item):\n return 'slider-item-icon';\n case typeof item.value === 'string':\n return 'slider-item-text';\n default:\n return 'slider-item-number';\n }\n };\n\n return (\n <li key={item.id} className={merge(['tw-relative', isFocusVisible && FOCUS_STYLE])}>\n <div\n // TODO: Change element back to label when bug #2380 from @react-aria is fixed\n // https://github.com/adobe/react-spectrum/issues/2380\n role=\"none\"\n onClick={handleMockLabelClick}\n data-test-id={getSliderItemTestId()}\n className={merge([\n 'tw-relative tw-w-full tw-z-10 tw-inline-flex tw-justify-center tw-items-center tw-font-sans tw-font-normal tw-h-full tw-text-center',\n isActive && !disabled ? 'tw-text-black' : 'tw-text-black-80',\n !disabled ? 'hover:tw-text-black hover:tw-cursor-pointer' : '',\n ])}\n >\n <VisuallyHidden>\n <input {...inputProps} {...focusProps} data-test-id=\"slider-input\" ref={ref} />\n </VisuallyHidden>\n <span className=\"tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap tw-flex\">\n {isIconItem(item) && <span aria-label={item.ariaLabel}>{item.icon}</span>}\n {item.value && <span className={isIconItem(item) ? 'tw-ml-2' : ''}>{item.value.toString()}</span>}\n </span>\n </div>\n </li>\n );\n};\n\nexport const Slider: FC<SliderProps> = ({\n id: propId,\n items,\n activeItemId,\n onChange,\n ariaLabel = 'Slider',\n disabled = false,\n}) => {\n const id = useMemoizedId(propId);\n const groupProps = { onChange, value: activeItemId, label: ariaLabel, isDisabled: disabled };\n const radioGroupState = useRadioGroupState(groupProps);\n const { radioGroupProps } = useRadioGroup(groupProps, radioGroupState);\n const itemElements = useMemo(() => {\n return items.map((item, i) => (\n <SliderItem\n id={id}\n item={item}\n disabled={disabled}\n radioGroupState={radioGroupState}\n key={`slider-${id}-item-${i}`}\n />\n ));\n }, [items, id, disabled, radioGroupState]);\n const selectedIndex = items.findIndex((item) => item.id === radioGroupState.selectedValue);\n\n return (\n <ul\n {...radioGroupProps}\n data-test-id=\"slider\"\n className=\"tw-relative tw-h-9 tw-w-full tw-grid tw-grid-flow-col tw-auto-cols-fr tw-justify-evenly tw-p-0 tw-border tw-border-black-20 tw-m-0 tw-bg-black-0 tw-rounded tw-font-sans tw-text-s tw-list-none tw-select-none\"\n >\n <motion.div\n aria-hidden=\"true\"\n // div border is not included in width so it must be subtracted from translation.\n animate={{ x: `calc(${100 selectedIndex}% - ${2 * selectedIndex}px)` }}\n initial={false}\n transition={{ type: 'tween', duration: 0.3 }}\n style={{\n width: `${100 / items.length}%`,\n }}\n className={merge([\n 'tw-absolute tw--inset-px tw-h-full tw-box-content tw-border tw-rounded tw-pointer-events-none',\n disabled\n ? 'tw-border-line-x-strong tw-border-opacity-30 tw-bg-black-0'\n : 'tw-border-black tw-bg-white',\n ])}\n />\n {itemElements}\n </ul>\n );\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"Slider.es.js","sources":["../../../src/components/Slider/Slider.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. /\n\nimport { IconProps } from '@foundation/Icon/IconProps';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useFocusRing } from '@react-aria/focus';\nimport { setInteractionModality } from '@react-aria/interactions';\nimport { useRadio, useRadioGroup } from '@react-aria/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\nimport { RadioGroupState, useRadioGroupState } from '@react-stately/radio';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { motion } from 'framer-motion';\nimport React, { FC, ReactElement, useMemo, useRef } from 'react';\n\nexport type IconItem = {\n id: string;\n icon: ReactElement<IconProps>;\n value?: string;\n ariaLabel: string;\n};\n\nexport type TextOrNumberItem = {\n id: string;\n value: string \| number;\n};\n\nexport type SliderProps = {\n id?: string;\n items: (TextOrNumberItem \| IconItem)[];\n activeItemId: string;\n onChange: (id: string) => void;\n ariaLabel?: string;\n disabled?: boolean;\n};\n\nconst isIconItem = (item: TextOrNumberItem \| IconItem): item is IconItem => (item as IconItem).icon !== undefined;\n\ninterface SliderItemProps {\n id: string;\n item: TextOrNumberItem \| IconItem;\n disabled: boolean;\n radioGroupState: RadioGroupState;\n}\n\nconst SliderItem = (props: SliderItemProps) => {\n const { id, item, disabled, radioGroupState } = props;\n const ref = useRef<HTMLInputElement \| null>(null);\n const isActive = item.id === radioGroupState.selectedValue;\n const { inputProps } = useRadio(\n {\n value: item.id,\n 'aria-label': isIconItem(item) ? item.ariaLabel : item.value.toString(),\n isDisabled: disabled,\n id: isActive ? id : undefined,\n },\n radioGroupState,\n ref,\n );\n const { isFocusVisible, focusProps } = useFocusRing();\n\n const handleMockLabelClick = () => {\n if (!disabled) {\n radioGroupState.setSelectedValue(item.id);\n ref.current?.focus();\n setInteractionModality('pointer');\n }\n };\n\n const getSliderItemTestId = () => {\n switch (true) {\n case isIconItem(item):\n return 'slider-item-icon';\n case typeof item.value === 'string':\n return 'slider-item-text';\n default:\n return 'slider-item-number';\n }\n };\n\n return (\n <li key={item.id} className={merge(['tw-relative', isFocusVisible && FOCUS_STYLE])}>\n <div\n // TODO: Change element back to label when bug #2380 from @react-aria is fixed\n // https://github.com/adobe/react-spectrum/issues/2380\n role=\"none\"\n onClick={handleMockLabelClick}\n data-test-id={getSliderItemTestId()}\n className={merge([\n 'tw-relative tw-w-full tw-z-10 tw-inline-flex tw-justify-center tw-items-center tw-font-sans tw-font-normal tw-h-full tw-text-center',\n isActive && !disabled ? 'tw-text-black' : 'tw-text-black-80',\n !disabled ? 'hover:tw-text-black hover:tw-cursor-pointer' : '',\n ])}\n >\n <VisuallyHidden>\n <input {...inputProps} {...focusProps} data-test-id=\"slider-input\" ref={ref} />\n </VisuallyHidden>\n <span className=\"tw-overflow-hidden tw-text-ellipsis tw-whitespace-nowrap tw-flex\">\n {isIconItem(item) && <span aria-label={item.ariaLabel}>{item.icon}</span>}\n {item.value && <span className={isIconItem(item) ? 'tw-ml-2' : ''}>{item.value.toString()}</span>}\n </span>\n </div>\n </li>\n );\n};\n\nexport const Slider: FC<SliderProps> = ({\n id: propId,\n items,\n activeItemId,\n onChange,\n ariaLabel = 'Slider',\n disabled = false,\n}) => {\n const id = useMemoizedId(propId);\n const groupProps = { onChange, value: activeItemId, label: ariaLabel, isDisabled: disabled };\n const radioGroupState = useRadioGroupState(groupProps);\n const { radioGroupProps } = useRadioGroup(groupProps, radioGroupState);\n const itemElements = useMemo(() => {\n return items.map((item, i) => (\n <SliderItem\n id={id}\n item={item}\n disabled={disabled}\n radioGroupState={radioGroupState}\n key={`slider-${id}-item-${i}`}\n />\n ));\n }, [items, id, disabled, radioGroupState]);\n const selectedIndex = items.findIndex((item) => item.id === radioGroupState.selectedValue);\n\n return (\n <ul\n {...radioGroupProps}\n data-test-id=\"slider\"\n className=\"tw-relative tw-h-9 tw-w-full tw-grid tw-grid-flow-col tw-auto-cols-fr tw-justify-evenly tw-p-0 tw-border tw-border-black-20 tw-m-0 tw-bg-black-0 tw-rounded tw-font-sans tw-text-s tw-list-none tw-select-none\"\n >\n <motion.div\n aria-hidden=\"true\"\n // div border is not included in width so it must be subtracted from translation.\n animate={{ x: `calc(${100 selectedIndex}% - ${2 * selectedIndex}px)` }}\n initial={false}\n transition={{ type: 'tween', duration: 0.3 }}\n style={{\n width: `${100 / items.length}%`,\n }}\n className={merge([\n 'tw-absolute tw--inset-px tw-h-full tw-box-content tw-border tw-rounded tw-pointer-events-none',\n disabled\n ? 'tw-border-line-x-strong tw-border-opacity-30 tw-bg-black-0'\n : 'tw-border-black tw-bg-white',\n ])}\n />\n {itemElements}\n </ul>\n );\n};\n"],"names":[],"mappings":"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"}