@soul-refiner/design-system 2.0.0-alpha.2 → 2.0.0-alpha.20

package/dist/node_modules/@udecode/plate-link/dist/index.js

@@ -0,0 +1,585 @@
+'use strict';
+
+var React = require('react');
+require('slate-react');
+var index$5 = require('../../plate-normalizers/dist/index.js');
+var slate = require('slate');
+var index$1 = require('../../plate-core/dist/index.js');
+var index$3 = require('../../utils/dist/index.js');
+var index$2 = require('../../slate/dist/index.js');
+var index$4 = require('../../slate-utils/dist/index.js');
+var index = require('../../../zustand-x/dist/index.js');
+var reactUtils = require('@udecode/react-utils');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+var createLinkNode = (editor, { url, text = "", target, children }) => {
+  const type = index$1.getPluginType(editor, ELEMENT_LINK);
+  return {
+    type,
+    url,
+    target,
+    children: children != null ? children : [{ text }]
+  };
+};
+var getLinkAttributes = (editor, link) => {
+  const { allowedSchemes, defaultLinkAttributes, dangerouslySkipSanitization } = index$1.getPluginOptions(editor, ELEMENT_LINK);
+  const attributes = __spreadValues({}, defaultLinkAttributes);
+  const href = dangerouslySkipSanitization ? link.url : index$3.sanitizeUrl(link.url, { allowedSchemes }) || void 0;
+  if (href !== void 0) {
+    attributes.href = href;
+  }
+  if ("target" in link) {
+    attributes.target = link.target;
+  }
+  return attributes;
+};
+var floatingLinkStore = index.createZustandStore("floatingLink")({
+  openEditorId: null,
+  mouseDown: false,
+  updated: false,
+  url: "",
+  text: "",
+  newTab: false,
+  mode: "",
+  isEditing: false
+}).extendActions((set) => ({
+  reset: () => {
+    set.url("");
+    set.text("");
+    set.newTab(false);
+    set.mode("");
+    set.isEditing(false);
+  }
+})).extendActions((set) => ({
+  show: (mode, editorId) => {
+    set.mode(mode);
+    set.isEditing(false);
+    set.openEditorId(editorId);
+  },
+  hide: () => {
+    set.openEditorId(null);
+    set.reset();
+  }
+})).extendSelectors((state) => ({
+  isOpen: (editorId) => state.openEditorId === editorId
+}));
+var floatingLinkActions = floatingLinkStore.set;
+var floatingLinkSelectors = floatingLinkStore.get;
+var useFloatingLinkSelectors = () => floatingLinkStore.use;
+
+// src/components/FloatingLink/FloatingLinkNewTabInput.tsx
+var useFloatingLinkNewTabInputState = () => {
+  const updated = useFloatingLinkSelectors().updated();
+  const ref = React__default.default.useRef(null);
+  const [checked, setChecked] = React__default.default.useState(
+    floatingLinkSelectors.newTab()
+  );
+  React__default.default.useEffect(() => {
+    if (ref.current && updated) {
+      setTimeout(() => {
+        var _a;
+        (_a = ref.current) == null ? void 0 : _a.focus();
+      }, 0);
+    }
+  }, [updated]);
+  return {
+    ref,
+    checked,
+    setChecked
+  };
+};
+var useFloatingLinkNewTabInput = ({
+  checked,
+  ref,
+  setChecked
+}) => {
+  const onChange = React__default.default.useCallback(
+    (e) => {
+      setChecked(e.target.checked);
+      floatingLinkActions.newTab(e.target.checked);
+    },
+    [setChecked]
+  );
+  return {
+    ref,
+    props: {
+      onChange,
+      checked,
+      type: "checkbox"
+    }
+  };
+};
+reactUtils.createPrimitiveComponent("input")({
+  propsHook: useFloatingLinkNewTabInput,
+  stateHook: useFloatingLinkNewTabInputState
+});
+var useFloatingLinkUrlInputState = () => {
+  const updated = useFloatingLinkSelectors().updated();
+  const ref = React__default.default.useRef(null);
+  React__default.default.useEffect(() => {
+    if (ref.current && updated) {
+      setTimeout(() => {
+        var _a;
+        (_a = ref.current) == null ? void 0 : _a.focus();
+      }, 0);
+    }
+  }, [updated]);
+  return {
+    ref
+  };
+};
+var useFloatingLinkUrlInput = (state) => {
+  const onChange = React__default.default.useCallback((e) => {
+    floatingLinkActions.url(e.target.value);
+  }, []);
+  return {
+    ref: state.ref,
+    props: {
+      onChange,
+      defaultValue: floatingLinkSelectors.url()
+    }
+  };
+};
+reactUtils.createPrimitiveComponent("input")({
+  propsHook: useFloatingLinkUrlInput,
+  stateHook: useFloatingLinkUrlInputState
+});
+var useLinkOpenButtonState = () => {
+  const editor = index$1.useEditorRef();
+  const selection = index$1.useEditorSelection();
+  const entry = React__default.default.useMemo(
+    () => index$2.findNode(editor, {
+      match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+    }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [editor, selection]
+  );
+  if (!entry) {
+    return {};
+  }
+  const [element] = entry;
+  return {
+    element
+  };
+};
+var useLinkOpenButton = ({ element }) => {
+  const editor = index$1.useEditorRef();
+  if (!element) {
+    return {
+      props: {}
+    };
+  }
+  const linkAttributes = getLinkAttributes(editor, element);
+  return {
+    props: __spreadProps(__spreadValues({}, linkAttributes), {
+      target: "_blank",
+      "aria-label": "Open link in a new tab",
+      onMouseOver: (e) => {
+        e.stopPropagation();
+      }
+    })
+  };
+};
+reactUtils.createPrimitiveComponent("a")({
+  stateHook: useLinkOpenButtonState,
+  propsHook: useLinkOpenButton
+});
+var insertLink = (editor, createLinkNodeOptions, options) => {
+  index$2.insertNodes(
+    editor,
+    [createLinkNode(editor, createLinkNodeOptions)],
+    options
+  );
+};
+var unwrapLink = (editor, options) => {
+  return index$2.withoutNormalizing(editor, () => {
+    var _a, _b, _c, _d, _e, _f;
+    if (options == null ? void 0 : options.split) {
+      const linkAboveAnchor = index$2.getAboveNode(editor, {
+        at: (_a = editor.selection) == null ? void 0 : _a.anchor,
+        match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+      });
+      if (linkAboveAnchor) {
+        index$2.splitNodes(editor, {
+          at: (_b = editor.selection) == null ? void 0 : _b.anchor,
+          match: (n) => index$2.isElement(n) && n.type === index$1.getPluginType(editor, ELEMENT_LINK)
+        });
+        unwrapLink(editor, {
+          at: (_c = editor.selection) == null ? void 0 : _c.anchor
+        });
+        return true;
+      }
+      const linkAboveFocus = index$2.getAboveNode(editor, {
+        at: (_d = editor.selection) == null ? void 0 : _d.focus,
+        match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+      });
+      if (linkAboveFocus) {
+        index$2.splitNodes(editor, {
+          at: (_e = editor.selection) == null ? void 0 : _e.focus,
+          match: (n) => index$2.isElement(n) && n.type === index$1.getPluginType(editor, ELEMENT_LINK)
+        });
+        unwrapLink(editor, {
+          at: (_f = editor.selection) == null ? void 0 : _f.focus
+        });
+        return true;
+      }
+    }
+    index$2.unwrapNodes(editor, __spreadValues({
+      match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+    }, options));
+  });
+};
+var upsertLinkText = (editor, { text }) => {
+  const newLink = index$2.getAboveNode(editor, {
+    match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+  });
+  if (newLink) {
+    const [newLinkNode, newLinkPath] = newLink;
+    if ((text == null ? void 0 : text.length) && text !== index$2.getEditorString(editor, newLinkPath)) {
+      const firstText = newLinkNode.children[0];
+      index$4.replaceNodeChildren(editor, {
+        at: newLinkPath,
+        nodes: __spreadProps(__spreadValues({}, firstText), { text }),
+        insertOptions: {
+          select: true
+        }
+      });
+    }
+  }
+};
+var wrapLink = (editor, _a) => {
+  var _b = _a, { url, target } = _b, options = __objRest(_b, ["url", "target"]);
+  index$2.wrapNodes(
+    editor,
+    {
+      type: index$1.getPluginType(editor, ELEMENT_LINK),
+      url,
+      target,
+      children: []
+    },
+    __spreadValues({ split: true }, options)
+  );
+};
+
+// src/transforms/upsertLink.ts
+var upsertLink = (editor, {
+  url,
+  text,
+  target,
+  insertTextInLink,
+  insertNodesOptions,
+  skipValidation = false
+}) => {
+  var _a, _b, _c;
+  const at = editor.selection;
+  if (!at)
+    return;
+  const linkAbove = index$2.getAboveNode(editor, {
+    at,
+    match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+  });
+  if (insertTextInLink && linkAbove) {
+    editor.insertText(url);
+    return true;
+  }
+  if (!skipValidation && !validateUrl(editor, url))
+    return;
+  if (index$3.isDefined(text) && text.length === 0) {
+    text = url;
+  }
+  if (linkAbove) {
+    if (url !== ((_a = linkAbove[0]) == null ? void 0 : _a.url) || target !== ((_b = linkAbove[0]) == null ? void 0 : _b.target)) {
+      index$2.setNodes(
+        editor,
+        { url, target },
+        {
+          at: linkAbove[1]
+        }
+      );
+    }
+    upsertLinkText(editor, { url, text, target });
+    return true;
+  }
+  const linkEntry = index$2.findNode(editor, {
+    at,
+    match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+  });
+  const [linkNode, linkPath] = linkEntry != null ? linkEntry : [];
+  let shouldReplaceText = false;
+  if (linkPath && (text == null ? void 0 : text.length)) {
+    const linkText = index$2.getEditorString(editor, linkPath);
+    if (text !== linkText) {
+      shouldReplaceText = true;
+    }
+  }
+  if (index$2.isExpanded(at)) {
+    if (linkAbove) {
+      unwrapLink(editor, {
+        at: linkAbove[1]
+      });
+    } else {
+      unwrapLink(editor, {
+        split: true
+      });
+    }
+    wrapLink(editor, {
+      url,
+      target
+    });
+    upsertLinkText(editor, { url, target, text });
+    return true;
+  }
+  if (shouldReplaceText) {
+    index$2.removeNodes(editor, {
+      at: linkPath
+    });
+  }
+  const props = index$2.getNodeProps(linkNode != null ? linkNode : {});
+  const path = (_c = editor.selection) == null ? void 0 : _c.focus.path;
+  if (!path)
+    return;
+  const leaf = index$2.getNodeLeaf(editor, path);
+  if (!(text == null ? void 0 : text.length)) {
+    text = url;
+  }
+  insertLink(
+    editor,
+    __spreadProps(__spreadValues({}, props), {
+      url,
+      target,
+      children: [
+        __spreadProps(__spreadValues({}, leaf), {
+          text
+        })
+      ]
+    }),
+    insertNodesOptions
+  );
+  return true;
+};
+var validateUrl = (editor, url) => {
+  const { allowedSchemes, isUrl: isUrl2, dangerouslySkipSanitization } = index$1.getPluginOptions(editor, ELEMENT_LINK);
+  if (isUrl2 && !isUrl2(url))
+    return false;
+  if (!dangerouslySkipSanitization && !index$3.sanitizeUrl(url, {
+    allowedSchemes,
+    permitInvalid: true
+  }))
+    return false;
+  return true;
+};
+var withLink = (editor, {
+  type,
+  options: { isUrl: isUrl2, getUrlHref, rangeBeforeOptions, keepSelectedTextOnPaste }
+}) => {
+  const { insertData, insertText, apply, normalizeNode, insertBreak } = editor;
+  const wrapLink2 = () => {
+    index$2.withoutNormalizing(editor, () => {
+      var _a;
+      const selection = editor.selection;
+      let beforeWordRange = index$4.getRangeBefore(
+        editor,
+        selection,
+        rangeBeforeOptions
+      );
+      if (!beforeWordRange) {
+        beforeWordRange = index$4.getRangeFromBlockStart(editor);
+      }
+      if (!beforeWordRange)
+        return;
+      const hasLink = index$2.someNode(editor, {
+        at: beforeWordRange,
+        match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+      });
+      if (hasLink)
+        return;
+      let beforeWordText = index$2.getEditorString(editor, beforeWordRange);
+      beforeWordText = (_a = getUrlHref == null ? void 0 : getUrlHref(beforeWordText)) != null ? _a : beforeWordText;
+      if (!isUrl2(beforeWordText))
+        return;
+      index$2.select(editor, beforeWordRange);
+      upsertLink(editor, {
+        url: beforeWordText
+      });
+      index$2.collapseSelection(editor, { edge: "end" });
+    });
+  };
+  editor.insertBreak = () => {
+    if (!index$2.isCollapsed(editor.selection))
+      return insertBreak();
+    wrapLink2();
+    insertBreak();
+  };
+  editor.insertText = (text) => {
+    if (text === " " && index$2.isCollapsed(editor.selection)) {
+      wrapLink2();
+    }
+    insertText(text);
+  };
+  editor.insertData = (data) => {
+    const text = data.getData("text/plain");
+    const textHref = getUrlHref == null ? void 0 : getUrlHref(text);
+    if (text) {
+      const value = textHref || text;
+      const inserted = upsertLink(editor, {
+        text: keepSelectedTextOnPaste ? void 0 : value,
+        url: value,
+        insertTextInLink: true
+      });
+      if (inserted)
+        return;
+    }
+    insertData(data);
+  };
+  editor.apply = (operation) => {
+    if (operation.type === "set_selection") {
+      const range = operation.newProperties;
+      if (range && range.focus && range.anchor && index$2.isCollapsed(range)) {
+        const entry = index$2.getAboveNode(editor, {
+          at: range,
+          match: { type: index$1.getPluginType(editor, ELEMENT_LINK) }
+        });
+        if (entry) {
+          const [, path] = entry;
+          let newPoint;
+          if (index$2.isStartPoint(editor, range.focus, path)) {
+            newPoint = index$4.getPreviousNodeEndPoint(editor, path);
+          }
+          if (index$2.isEndPoint(editor, range.focus, path)) {
+            newPoint = index$4.getNextNodeStartPoint(editor, path);
+          }
+          if (newPoint) {
+            operation.newProperties = {
+              anchor: newPoint,
+              focus: newPoint
+            };
+          }
+        }
+      }
+    }
+    apply(operation);
+  };
+  editor.normalizeNode = ([node, path]) => {
+    if (node.type === index$1.getPluginType(editor, ELEMENT_LINK)) {
+      const range = editor.selection;
+      if (range && index$2.isCollapsed(range) && index$2.isEndPoint(editor, range.focus, path)) {
+        const nextPoint = index$4.getNextNodeStartPoint(editor, path);
+        if (nextPoint) {
+          index$2.select(editor, nextPoint);
+        } else {
+          const nextPath = slate.Path.next(path);
+          index$2.insertNodes(editor, { text: "" }, { at: nextPath });
+          index$2.select(editor, nextPath);
+        }
+      }
+    }
+    normalizeNode([node, path]);
+  };
+  editor = index$5.withRemoveEmptyNodes(
+    editor,
+    index$1.mockPlugin({
+      options: { types: type }
+    })
+  );
+  return editor;
+};
+
+// src/createLinkPlugin.ts
+var ELEMENT_LINK = "a";
+var createLinkPlugin = index$1.createPluginFactory({
+  key: ELEMENT_LINK,
+  isElement: true,
+  isInline: true,
+  withOverrides: withLink,
+  options: {
+    allowedSchemes: ["http", "https", "mailto", "tel"],
+    dangerouslySkipSanitization: false,
+    defaultLinkAttributes: {},
+    isUrl: index$3.isUrl,
+    rangeBeforeOptions: {
+      matchString: " ",
+      skipInvalid: true,
+      afterMatch: true
+    },
+    triggerFloatingLinkHotkeys: "meta+k, ctrl+k",
+    keepSelectedTextOnPaste: true
+  },
+  then: (editor, { type }) => ({
+    props: ({ element }) => ({
+      nodeProps: getLinkAttributes(editor, element)
+    }),
+    deserializeHtml: {
+      rules: [
+        {
+          validNodeName: "A"
+        }
+      ],
+      getNode: (el) => {
+        const url = el.getAttribute("href");
+        if (url && validateUrl(editor, url)) {
+          return {
+            type,
+            url,
+            target: el.getAttribute("target") || "_blank"
+          };
+        }
+      }
+    }
+  })
+});
+
+exports.ELEMENT_LINK = ELEMENT_LINK;
+exports.createLinkNode = createLinkNode;
+exports.createLinkPlugin = createLinkPlugin;
+exports.floatingLinkActions = floatingLinkActions;
+exports.floatingLinkSelectors = floatingLinkSelectors;
+exports.floatingLinkStore = floatingLinkStore;
+exports.getLinkAttributes = getLinkAttributes;
+exports.insertLink = insertLink;
+exports.unwrapLink = unwrapLink;
+exports.upsertLink = upsertLink;
+exports.upsertLinkText = upsertLinkText;
+exports.useFloatingLinkNewTabInput = useFloatingLinkNewTabInput;
+exports.useFloatingLinkNewTabInputState = useFloatingLinkNewTabInputState;
+exports.useFloatingLinkSelectors = useFloatingLinkSelectors;
+exports.useFloatingLinkUrlInput = useFloatingLinkUrlInput;
+exports.useFloatingLinkUrlInputState = useFloatingLinkUrlInputState;
+exports.useLinkOpenButton = useLinkOpenButton;
+exports.useLinkOpenButtonState = useLinkOpenButtonState;
+exports.validateUrl = validateUrl;
+exports.withLink = withLink;
+exports.wrapLink = wrapLink;