@os-design/editor 1.0.204 → 1.0.205

package/src/Editor/utils/getSelectedBlockElement.ts

@@ -0,0 +1,17 @@
+import getSelectionRange from './getSelectionRange';
+
+const getSelectedBlockElement = (): Element | null => {
+  const selectionRange = getSelectionRange();
+  if (!selectionRange) return null;
+
+  let node: Node | null = selectionRange.startContainer;
+
+  do {
+    if (node instanceof Element && node.getAttribute('data-block') === 'true')
+      return node;
+    node = node.parentNode;
+  } while (node != null);
+  return null;
+};
+
+export default getSelectedBlockElement;

package/src/Editor/utils/getSelectionRange.ts

@@ -0,0 +1,7 @@
+const getSelectionRange = (): Range | null => {
+  const selection = document.getSelection();
+  if (!selection || selection.rangeCount === 0) return null;
+  return selection.getRangeAt(0);
+};
+
+export default getSelectionRange;

package/src/Editor/utils/setLink.ts

@@ -0,0 +1,22 @@
+import { EditorState, RichUtils } from 'draft-js';
+
+const setLink = (editorState: EditorState, url: string): EditorState => {
+  const containsLink = RichUtils.currentBlockContainsLink(editorState);
+  if (containsLink) return editorState;
+
+  const contentState = editorState.getCurrentContent();
+  const contentStateWithLink = contentState.createEntity('LINK', 'MUTABLE', {
+    url,
+  });
+  const entityKey = contentStateWithLink.getLastCreatedEntityKey();
+  const nextEditorState = EditorState.set(editorState, {
+    currentContent: contentStateWithLink,
+  });
+  return RichUtils.toggleLink(
+    nextEditorState,
+    nextEditorState.getSelection(),
+    entityKey
+  );
+};
+
+export default setLink;

package/src/Editor/utils/transformers.ts

@@ -0,0 +1,20 @@
+import { EditorState } from 'draft-js';
+
+export const editorStateToFirstParagraph = (
+  editorState: EditorState
+): string => {
+  const firstUnstyledBlock = editorState
+    .getCurrentContent()
+    .getBlocksAsArray()
+    .find((block) => block.getType() === 'unstyled');
+
+  return firstUnstyledBlock ? firstUnstyledBlock.getText() : '';
+};
+
+export const editorStateToMetaDescription = (
+  editorState: EditorState
+): string =>
+  editorStateToFirstParagraph(editorState)
+    .slice(0, 200)
+    .replace(/^(.*[.?!])(.*)/, '$1')
+    .trim();

package/src/Editor/utils/unsetLink.ts

@@ -0,0 +1,11 @@
+import { EditorState, RichUtils } from 'draft-js';
+
+const unsetLink = (editorState: EditorState): EditorState => {
+  const containsLink = RichUtils.currentBlockContainsLink(editorState);
+  if (!containsLink) return editorState;
+
+  const selectionState = editorState.getSelection();
+  return RichUtils.toggleLink(editorState, selectionState, null);
+};
+
+export default unsetLink;

package/src/EditorSkeleton/index.tsx

@@ -0,0 +1,21 @@
+import styled from '@emotion/styled';
+
+import { InputSkeleton, InputSkeletonProps } from '@os-design/core';
+import React, { forwardRef } from 'react';
+
+export type EditorSkeletonProps = InputSkeletonProps;
+
+const StyledEditorSkeleton = styled(InputSkeleton)`
+  height: ${(p) => p.theme.editorMinHeight}em;
+`;
+
+/**
+ * Provides an editor placeholder while a user waits for the content to load.
+ */
+const EditorSkeleton = forwardRef<HTMLDivElement, EditorSkeletonProps>(
+  (props, ref) => <StyledEditorSkeleton {...props} ref={ref} />
+);
+
+EditorSkeleton.displayName = 'EditorSkeleton';
+
+export default EditorSkeleton;

package/src/index.ts

@@ -0,0 +1,16 @@
+export { default as Editor } from './Editor';
+export { default as addNewBlockAt } from './Editor/utils/addNewBlockAt';
+export { default as changeBlock } from './Editor/utils/changeBlock';
+export { default as createContentEditorState } from './Editor/utils/createContentEditorState';
+export { default as createDecorator } from './Editor/utils/createDecorator';
+export { default as createEmptyEditorState } from './Editor/utils/createEmptyEditorState';
+export { default as defaultStyleToolbarItems } from './Editor/utils/defaultStyleToolbarItems';
+export { default as getCurrentBlock } from './Editor/utils/getCurrentBlock';
+export { default as imageBlock } from './Editor/blocks/imageBlock';
+export { default as videoBlock } from './Editor/blocks/videoBlock';
+export { default as EditorSkeleton } from './EditorSkeleton';
+
+export * from './Editor';
+export * from './Editor/utils/transformers';
+export * from './Editor/blocks/types';
+export * from './EditorSkeleton';