@dxos/react-ui-editor 0.3.9-main.9ca5eac → 0.3.9-main.9da1d41

package/src/components/TextEditor/extensions/markdown/bundle.ts

@@ -0,0 +1,99 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { closeBrackets, closeBracketsKeymap } from '@codemirror/autocomplete';
+import { defaultKeymap, history, historyKeymap, indentWithTab } from '@codemirror/commands';
+import { markdownLanguage, markdown } from '@codemirror/lang-markdown';
+import {
+  bracketMatching,
+  defaultHighlightStyle,
+  foldKeymap,
+  indentOnInput,
+  syntaxHighlighting,
+} from '@codemirror/language';
+import { languages } from '@codemirror/language-data';
+import { lintKeymap } from '@codemirror/lint';
+import { highlightSelectionMatches, searchKeymap } from '@codemirror/search';
+import { EditorState, type Extension } from '@codemirror/state';
+import { oneDarkHighlightStyle } from '@codemirror/theme-one-dark';
+import {
+  crosshairCursor,
+  drawSelection,
+  dropCursor,
+  EditorView,
+  highlightActiveLine,
+  highlightActiveLineGutter,
+  highlightSpecialChars,
+  keymap,
+  placeholder,
+  rectangularSelection,
+} from '@codemirror/view';
+// import { GFM } from '@lezer/markdown';
+
+import type { ThemeMode } from '@dxos/react-ui';
+
+import { markdownTagsExtension } from './tags';
+import { markdownHighlightStyle } from './theme';
+
+export type MarkdownBundleOptions = {
+  themeMode?: ThemeMode;
+  placeholder?: string;
+};
+
+export const markdownBundle = ({ themeMode, placeholder: _placeholder }: MarkdownBundleOptions): Extension[] => {
+  // All of https://github.com/codemirror/basic-setup minus line numbers and fold gutter.
+  // https://codemirror.net/docs/ref/#codemirror.basicSetup
+  return [
+    bracketMatching(),
+    closeBrackets(),
+    _placeholder && placeholder(_placeholder),
+
+    EditorState.allowMultipleSelections.of(true),
+    EditorView.lineWrapping,
+
+    // autocompletion(),
+    crosshairCursor(),
+    dropCursor(),
+    drawSelection(),
+    highlightActiveLine(),
+    highlightActiveLineGutter(),
+    highlightSelectionMatches(),
+    highlightSpecialChars(),
+    history(),
+    indentOnInput(),
+    rectangularSelection(),
+
+    keymap.of([
+      ...closeBracketsKeymap,
+      // ...completionKeymap,
+      ...defaultKeymap,
+      ...foldKeymap,
+      ...historyKeymap,
+      ...lintKeymap,
+      ...searchKeymap,
+      indentWithTab,
+    ]),
+
+    // Main extension.
+    // https://github.com/codemirror/lang-markdown
+    markdown({
+      base: markdownLanguage,
+      codeLanguages: languages,
+      extensions: [
+        // TODO(burdon): This seems to upgrade the parser.
+        // GitHub flavored markdown bundle: Table, TaskList, Strikethrough, and Autolink.
+        // https://github.com/lezer-parser/markdown?tab=readme-ov-file#github-flavored-markdown
+        // https://github.github.com/gfm
+        // GFM,
+
+        // Custom styling.
+        markdownTagsExtension,
+      ],
+    }),
+
+    // TODO(thure): All but one rule here apply to both themes; rename or refactor.
+    syntaxHighlighting(markdownHighlightStyle),
+    themeMode === 'dark' ? syntaxHighlighting(oneDarkHighlightStyle) : syntaxHighlighting(defaultHighlightStyle),
+  ].filter(Boolean) as Extension[];
+};

package/src/components/TextEditor/extensions/markdown/index.ts

@@ -0,0 +1,6 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+export * from './bundle';
+export * from './theme';

package/src/components/{Markdown/markdownTheme.ts → TextEditor/extensions/markdown/theme.ts}

@@ -7,12 +7,10 @@ import { HighlightStyle } from '@codemirror/language';
 import { tags } from '@lezer/highlight';
 import get from 'lodash.get';
 
-import { markdownTags } from './markdownTags';
-import { bold, heading, italic, mark, strikethrough, tokens } from '../../styles';
-
-// TODO(burdon): Use theme colors.
-// TODO(burdon): Light mode.
+import { markdownTags } from './tags';
+import { bold, heading, italic, mark, strikethrough, tokens, type ThemeStyles } from '../../../../styles';
 
+// TODO(burdon): Rationalize theme/colors. Hoist onto single property object.
 export const chalky = '#e5c07b';
 export const coral = '#e06c75';
 export const cyan = '#56b6c2';
@@ -28,12 +26,15 @@ export const highlightBackground = '#2c313a';
 const _background = '#282c34';
 export const tooltipBackground = '#353a42';
 const _selection = '#3E4451';
-export const cursor = '#ffffff';
 
 const monospace = get(tokens, 'fontFamily.mono', ['monospace']).join(',');
 
-export const markdownTheme = {
-  // TODO(thure): consider whether these commented-out rules from one-dark-theme should be integrated.
+/**
+ * NOTE: The '&' prefix denotes the CM editor root.
+ * https://codemirror.net/examples/styling
+ */
+export const markdownTheme: ThemeStyles = {
+  // TODO(thure): Consider whether these commented-out rules from one-dark-theme should be integrated.
   // '&': {
   //   color: ivory,
   //   backgroundColor: background
@@ -71,7 +72,7 @@ export const markdownTheme = {
   //   color: '#ddd'
   // },
 
-  '.cm-tooltip': {
+  '& .cm-tooltip': {
     backgroundColor: 'transparent',
     border: 'none',
   },
@@ -98,6 +99,7 @@ export const markdownTheme = {
   },
   '& .cm-line': {
     paddingInline: 0,
+    lineHeight: 1.6,
     minBlockSize: '1.6em',
   },
   '& .cm-line *': {
@@ -116,16 +118,17 @@ export const markdownTheme = {
     background: get(tokens, 'extend.colors.primary.600', '#00ffff') + '44',
   },
   '& .cm-content': {
+    padding: 0,
     caretColor: 'black',
   },
   '.dark & .cm-content': {
-    caretColor: cursor,
+    caretColor: 'white',
   },
   '& .cm-cursor': {
     borderLeftColor: 'black',
   },
   '.dark & .cm-cursor': {
-    borderLeftColor: cursor,
+    borderLeftColor: 'white',
   },
   '.cm-placeholder': {
     fontFamily: get(tokens, 'fontFamily.body', []).join(','),
@@ -164,6 +167,14 @@ export const markdownTheme = {
   '& .cm-yLineSelection': {
     margin: '0',
   },
+  '.cm-link': {
+    color: 'rgb(20 89 208)', // TODO(burdon): Rationalize.
+    textDecorationLine: 'underline',
+    textDecorationThickness: '1px',
+    textUnderlineOffset: '2px',
+    borderRadius: '.125rem',
+  },
+  // TODO(burdon): Document.
   ...Object.keys(get(tokens, 'extend.fontSize', {})).reduce((acc: Record<string, any>, fontSize) => {
     const height = get(tokens, ['extend', 'fontSize', fontSize, 1, 'lineHeight']);
     // TODO(thure): This appears to be the best or only way to set selection caret heights, but it's far more verbose than it needs to be.
@@ -174,7 +185,7 @@ export const markdownTheme = {
   }, {}),
 };
 
-export const markdownDarkHighlighting = HighlightStyle.define(
+export const markdownHighlightStyle = HighlightStyle.define(
   [
     {
       tag: [

package/src/components/TextEditor/index.ts

@@ -2,10 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
-export { type StyleSpec } from 'style-mod';
 export { tags } from '@lezer/highlight';
 
-export * from './TextEditor';
-
 export * from './extensions';
-export * from './theme';
+export * from './TextEditor';

package/src/components/TextEditor/yjs.stories.tsx

@@ -0,0 +1,55 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import '@dxosTheme';
+
+import React, { useState } from 'react';
+
+import { PublicKey } from '@dxos/react-client';
+import { TextKind } from '@dxos/react-client/echo';
+import { ClientRepeater, textGenerator, useDataGenerator } from '@dxos/react-client/testing';
+import { useId, Input } from '@dxos/react-ui';
+import { withTheme } from '@dxos/storybook-utils';
+
+import { MarkdownEditor } from './TextEditor';
+import { Replicator, useYjsModel } from '../../testing';
+
+export default {
+  component: MarkdownEditor,
+  decorators: [withTheme],
+};
+
+const replicator = new Replicator(TextKind.PLAIN);
+
+const Story = () => {
+  const [generate, setGenerate] = useState(false);
+  const generateId = useId('generate');
+
+  const [id] = useState(PublicKey.random().toHex());
+  const model = useYjsModel({ id, replicator });
+
+  useDataGenerator({
+    generator: generate ? textGenerator : undefined,
+    options: { text: typeof model?.content !== 'string' ? model?.content : undefined },
+  });
+
+  return (
+    <main className='flex flex-col flex-1 p-4 gap-4'>
+      <div id={generateId} className='flex gap-2'>
+        <Input.Root>
+          <Input.Checkbox checked={generate} onCheckedChange={(checked) => setGenerate(!!checked)} />
+          <Input.Label>Start</Input.Label>
+        </Input.Root>
+      </div>
+      <div className='border'>
+        <MarkdownEditor model={model} />
+      </div>
+    </main>
+  );
+};
+
+export const Default = {
+  // TODO(wittjosiah): Decorator for doing this without clients being initialized?
+  render: () => <ClientRepeater count={2} Component={Story} />,
+};

package/src/components/index.ts

@@ -2,7 +2,4 @@
 // Copyright 2022 DXOS.org
 //
 
-export * from './Editor';
-export * from './Markdown';
-export * from './RichText';
 export * from './TextEditor';

package/src/hooks/index.ts

@@ -0,0 +1,7 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+export * from './useCollaboration';
+export * from './useTextModel';
+export * from './yjs';

package/src/hooks/useCollaboration.ts

@@ -0,0 +1,35 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import type { Extension } from '@codemirror/state';
+import { useEffect, useMemo } from 'react';
+import { yCollab } from 'y-codemirror.next';
+
+import { generateName } from '@dxos/display-name';
+import type { ThemeMode } from '@dxos/react-ui';
+import { getColorForValue } from '@dxos/react-ui-theme';
+import { YText } from '@dxos/text-model';
+
+import type { EditorModel } from './useTextModel';
+
+/**
+ * Replication and awareness (incl. remote selection).
+ * https://codemirror.net/docs/ref/#collab
+ */
+export const useCollaboration = (model: EditorModel, themeMode: ThemeMode): Extension | undefined => {
+  const { provider, peer, content } = model;
+  const extension = useMemo(() => (content instanceof YText ? yCollab(content, provider?.awareness) : undefined), []);
+
+  useEffect(() => {
+    if (provider && peer) {
+      provider.awareness.setLocalStateField('user', {
+        name: peer.name ?? generateName(peer.id),
+        color: getColorForValue({ value: peer.id, type: 'color' }),
+        colorLight: getColorForValue({ value: peer.id, themeMode, type: 'highlight' }),
+      });
+    }
+  }, [provider, peer, themeMode]);
+
+  return extension;
+};

package/src/{model.ts → hooks/useTextModel.ts}

@@ -2,8 +2,7 @@
 // Copyright 2023 DXOS.org
 //
 
-import { type EditorView } from '@codemirror/view';
-import { type ComponentProps, useMemo } from 'react';
+import { useMemo } from 'react';
 import type * as awarenessProtocol from 'y-protocols/awareness';
 
 import { type Space, type TextObject } from '@dxos/react-client/echo';
@@ -12,17 +11,7 @@ import type { YText, YXmlFragment } from '@dxos/text-model';
 
 import { SpaceAwarenessProvider } from './yjs';
 
-export type EditorSlots = {
-  root?: Omit<ComponentProps<'div'>, 'ref'>;
-  editor?: {
-    className?: string;
-    placeholder?: string;
-    spellCheck?: boolean;
-    tabIndex?: number;
-    markdownTheme?: Parameters<typeof EditorView.theme>[0];
-  };
-};
-
+// TODO(burdon): Move.
 type Awareness = awarenessProtocol.Awareness;
 type Provider = { awareness: Awareness };
 
@@ -43,8 +32,9 @@ export type UseTextModelOptions = {
   text?: TextObject;
 };
 
-// TODO(wittjosiah): Factor out to common package? @dxos/react-client?
+// TODO(burdon): Don't support returning undefined (and remove checks from calling code).
 // TODO(burdon): Decouple space (make Editor less dependent on entire stack)?
+// TODO(wittjosiah): Factor out to common package? @dxos/react-client?
 export const useTextModel = ({ identity, space, text }: UseTextModelOptions): EditorModel | undefined => {
   const provider = useMemo(() => {
     if (!space || !text?.doc) {

package/src/index.ts

@@ -2,8 +2,8 @@
 // Copyright 2022 DXOS.org
 //
 
-export * from './components';
-export * from './model';
-
 export { TextKind } from '@dxos/protocols/proto/dxos/echo/model/text';
 export { Doc, YText, YXmlFragment } from '@dxos/text-model';
+
+export * from './components';
+export * from './hooks';

package/src/styles/tokens.ts

@@ -2,7 +2,13 @@
 // Copyright 2023 DXOS.org
 //
 
+import type { StyleSpec } from 'style-mod';
+
 import { tailwindConfig, type TailwindConfig } from '@dxos/react-ui-theme';
 
+export type ThemeStyles = {
+  [selector: string]: StyleSpec;
+};
+
 // TODO(thure): Why export the whole theme? Can this be done differently?
 export const tokens: TailwindConfig['theme'] = tailwindConfig({}).theme;

package/src/testing/replicator.ts

@@ -15,8 +15,7 @@ import { Event } from '@dxos/async';
 import { log } from '@dxos/log';
 import { TextKind } from '@dxos/protocols/proto/dxos/echo/model/text';
 
-import { type EditorModel } from '../model';
-import { cursorColor } from '../yjs';
+import { cursorColor, type EditorModel } from '../hooks';
 
 type Awareness = awarenessProtocol.Awareness;
 

package/dist/types/src/automerge/demo.d.ts

@@ -1,25 +0,0 @@
-import { Event } from '@dxos/async';
-import { type Doc, next as automerge, type ChangeOptions, type ChangeFn, type Heads } from '@dxos/automerge/automerge';
-export declare class Peer {
-    changeEvent: Event<void>;
-    storage: Map<string, Uint8Array>;
-    stats: {
-        messagesSent: number;
-        messagesReceived: number;
-        bytesSent: number;
-        bytesReceived: number;
-        snapshotBytes: number;
-        incrementalBytes: number;
-    };
-    doc: Doc<{
-        text: string;
-    }>;
-    change(options: string | ChangeOptions<any> | ChangeFn<any>, callback?: ChangeFn<any>): void;
-    changeAt(scope: Heads, options: string | ChangeOptions<any> | ChangeFn<any>, callback?: ChangeFn<any>): automerge.Heads | null;
-    replicate(): {
-        readable: ReadableStream<Uint8Array>;
-        writable: WritableStream<Uint8Array>;
-    };
-    private _handleChange;
-}
-//# sourceMappingURL=demo.d.ts.map

package/dist/types/src/automerge/demo.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"demo.d.ts","sourceRoot":"","sources":["../../../../src/automerge/demo.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,EACL,KAAK,GAAG,EACR,IAAI,IAAI,SAAS,EACjB,KAAK,aAAa,EAClB,KAAK,QAAQ,EACb,KAAK,KAAK,EAEX,MAAM,2BAA2B,CAAC;AAEnC,qBAAa,IAAI;IACf,WAAW,cAAe;IAE1B,OAAO,0BAAiC;IACxC,KAAK;;;;;;;MAOH;IAEF,GAAG,EAAG,GAAG,CAAC;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAE5B,MAAM,CAAC,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,EAAE,QAAQ,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC;IAKrF,QAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,GAAG,aAAa,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC,GAAG,CAAC,EAAE,QAAQ,CAAC,EAAE,QAAQ,CAAC,GAAG,CAAC;IAOrG,SAAS,IAAI;QAAE,QAAQ,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;QAAC,QAAQ,EAAE,cAAc,CAAC,UAAU,CAAC,CAAA;KAAE;IAgD3F,OAAO,CAAC,aAAa;CAgBtB"}

package/dist/types/src/components/Editor/Editor.d.ts

@@ -1,15 +0,0 @@
-import React from 'react';
-import { type EditorSlots, type UseTextModelOptions } from '../../model';
-import { type MarkdownEditorRef } from '../Markdown';
-export type EditorProps = UseTextModelOptions & {
-    slots?: EditorSlots;
-};
-/**
- * Memoized editor which depends on DXOS platform.
- *
- * Determines which editor to render based on the kind of text.
- */
-export declare const Editor: React.MemoExoticComponent<React.ForwardRefExoticComponent<UseTextModelOptions & {
-    slots?: EditorSlots | undefined;
-} & React.RefAttributes<MarkdownEditorRef | import("@tiptap/react").Editor>>>;
-//# sourceMappingURL=Editor.d.ts.map

package/dist/types/src/components/Editor/Editor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Editor.d.ts","sourceRoot":"","sources":["../../../../../src/components/Editor/Editor.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAqC,MAAM,OAAO,CAAC;AAI1D,OAAO,EAAE,KAAK,WAAW,EAAgB,KAAK,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACvF,OAAO,EAAkB,KAAK,iBAAiB,EAAE,MAAM,aAAa,CAAC;AAGrE,MAAM,MAAM,WAAW,GAAG,mBAAmB,GAAG;IAC9C,KAAK,CAAC,EAAE,WAAW,CAAC;CACrB,CAAC;AAEF;;;;GAIG;AAGH,eAAO,MAAM,MAAM;;6EASlB,CAAC"}

package/dist/types/src/components/Editor/Editor.stories.d.ts

@@ -1,29 +0,0 @@
-import '@dxosTheme';
-import React from 'react';
-declare const _default: {
-    component: React.MemoExoticComponent<React.ForwardRefExoticComponent<import("../..").UseTextModelOptions & {
-        slots?: import("../..").EditorSlots | undefined;
-    } & React.RefAttributes<import("..").MarkdownEditorRef | import("@tiptap/react").Editor>>>;
-    decorators: import("@storybook/react").Decorator[];
-};
-export default _default;
-export declare const Markdown: {
-    render: (args: {
-        id: number;
-    }) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R, any>[];
-};
-export declare const Rich: {
-    render: (args: {
-        id: number;
-    }) => JSX.Element;
-    args: {
-        slots: {
-            editor: {
-                className: string;
-            };
-        };
-    };
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R, any>[];
-};
-//# sourceMappingURL=Editor.stories.d.ts.map

package/dist/types/src/components/Editor/Editor.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Editor.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Editor/Editor.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAEpB,OAAO,KAAmB,MAAM,OAAO,CAAC;;;;;;;AAYxC,wBAGE;AAoCF,eAAO,MAAM,QAAQ;mBACJ;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE;;CAE9B,CAAC;AAWF,eAAO,MAAM,IAAI;mBACA;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE;;;;;;;;;CAS9B,CAAC"}

package/dist/types/src/components/Editor/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Editor';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/components/Editor/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Editor/index.ts"],"names":[],"mappings":"AAIA,cAAc,UAAU,CAAC"}

package/dist/types/src/components/Markdown/Markdown.d.ts

@@ -1,20 +0,0 @@
-import { EditorState, type Extension, type Text } from '@codemirror/state';
-import { EditorView } from '@codemirror/view';
-import React from 'react';
-import { type EditorModel, type EditorSlots } from '../../model';
-export declare const EditorModes: readonly ["default", "vim"];
-export type EditorMode = (typeof EditorModes)[number];
-export type MarkdownEditorProps = {
-    model?: EditorModel;
-    slots?: EditorSlots;
-    editorMode?: EditorMode;
-    extensions?: Extension[];
-    onChange?: (content: string | Text) => void;
-};
-export type MarkdownEditorRef = {
-    editor: HTMLDivElement | null;
-    state?: EditorState;
-    view?: EditorView;
-};
-export declare const MarkdownEditor: React.ForwardRefExoticComponent<MarkdownEditorProps & React.RefAttributes<MarkdownEditorRef>>;
-//# sourceMappingURL=Markdown.d.ts.map

package/dist/types/src/components/Markdown/Markdown.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Markdown.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/Markdown.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,WAAW,EAAE,KAAK,SAAS,EAAc,KAAK,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEvF,OAAO,EAUL,UAAU,EACX,MAAM,kBAAkB,CAAC;AAG1B,OAAO,KAQN,MAAM,OAAO,CAAC;AAUf,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAEjE,eAAO,MAAM,WAAW,6BAA8B,CAAC;AACvD,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC;AAEtD,MAAM,MAAM,mBAAmB,GAAG;IAChC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,UAAU,CAAC,EAAE,SAAS,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,cAAc,GAAG,IAAI,CAAC;IAC9B,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,cAAc,+FA+I1B,CAAC"}

package/dist/types/src/components/Markdown/Markdown.stories.d.ts

@@ -1,20 +0,0 @@
-import '@dxosTheme';
-import React from 'react';
-declare const _default: {
-    component: React.ForwardRefExoticComponent<import("./Markdown").MarkdownEditorProps & React.RefAttributes<import("./Markdown").MarkdownEditorRef>>;
-    decorators: import("@storybook/react").Decorator[];
-};
-export default _default;
-export declare const Default: {
-    args: {
-        model: {
-            id: string;
-            content: string;
-        };
-    };
-};
-export declare const WithYjs: {
-    render: () => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R, any>[];
-};
-//# sourceMappingURL=Markdown.stories.d.ts.map

package/dist/types/src/components/Markdown/Markdown.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Markdown.stories.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/Markdown.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;AAEpB,OAAO,KAAmB,MAAM,OAAO,CAAC;;;;;AAWxC,wBAGE;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC;AAIF,eAAO,MAAM,OAAO;;;CAyBnB,CAAC"}

package/dist/types/src/components/Markdown/index.d.ts

@@ -1,2 +0,0 @@
-export * from './Markdown';
-//# sourceMappingURL=index.d.ts.map

package/dist/types/src/components/Markdown/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/index.ts"],"names":[],"mappings":"AAIA,cAAc,YAAY,CAAC"}

package/dist/types/src/components/Markdown/markdownTags.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"markdownTags.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/markdownTags.ts"],"names":[],"mappings":"AAIA,OAAO,EAAa,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,KAAK,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEtD,eAAO,MAAM,YAAY;;;;;;;;;;;;CAYxB,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,cAgBnC,CAAC"}

package/dist/types/src/components/Markdown/markdownTheme.d.ts

@@ -1,93 +0,0 @@
-import { HighlightStyle } from '@codemirror/language';
-export declare const chalky = "#e5c07b";
-export declare const coral = "#e06c75";
-export declare const cyan = "#56b6c2";
-export declare const invalid = "#ffffff";
-export declare const ivory = "#abb2bf";
-export declare const stone = "#7d8799";
-export declare const malibu = "#61afef";
-export declare const sage = "#98c379";
-export declare const whiskey = "#d19a66";
-export declare const violet = "#c678dd";
-export declare const highlightBackground = "#2c313a";
-export declare const tooltipBackground = "#353a42";
-export declare const cursor = "#ffffff";
-export declare const markdownTheme: {
-    '.cm-tooltip': {
-        backgroundColor: string;
-        border: string;
-    };
-    '&.cm-focused': {
-        outline: string;
-    };
-    '& .cm-line': {
-        paddingInline: number;
-        minBlockSize: string;
-    };
-    '& .cm-line *': {
-        lineHeight: number;
-    };
-    '&.cm-focused .cm-selectionBackground, & .cm-selectionBackground': {
-        background: any;
-    };
-    '.dark & .cm-selectionBackground, .dark &.cm-focused .cm-selectionBackground': {
-        background: any;
-    };
-    '& .cm-selectionMatch': {
-        background: string;
-    };
-    '.dark & .cm-selectionMatch': {
-        background: string;
-    };
-    '& .cm-content': {
-        caretColor: string;
-    };
-    '.dark & .cm-content': {
-        caretColor: string;
-    };
-    '& .cm-cursor': {
-        borderLeftColor: string;
-    };
-    '.dark & .cm-cursor': {
-        borderLeftColor: string;
-    };
-    '.cm-placeholder': {
-        fontFamily: any;
-    };
-    '& .cm-scroller': {
-        fontFamily: any;
-        overflow: string;
-    };
-    '& .cm-activeLine': {
-        backgroundColor: string;
-    };
-    '.dark & .cm-activeLine': {
-        backgroundColor: string;
-    };
-    '& .cm-ySelectionInfo': {
-        fontFamily: any;
-        padding: string;
-        marginBlockStart: string;
-    };
-    '& .cm-ySelection, & .cm-selectionMatch': {
-        paddingBlockStart: string;
-        paddingBlockEnd: string;
-    };
-    '& .cm-ySelection, & .cm-yLineSelection': {
-        mixBlendMode: string;
-    };
-    '.dark & .cm-ySelection, .dark & .cm-yLineSelection': {
-        mixBlendMode: string;
-    };
-    '& .cm-ySelectionCaret': {
-        display: string;
-        insetBlockStart: string;
-        blockSize: string;
-        verticalAlign: string;
-    };
-    '& .cm-yLineSelection': {
-        margin: string;
-    };
-};
-export declare const markdownDarkHighlighting: HighlightStyle;
-//# sourceMappingURL=markdownTheme.d.ts.map

package/dist/types/src/components/Markdown/markdownTheme.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"markdownTheme.d.ts","sourceRoot":"","sources":["../../../../../src/components/Markdown/markdownTheme.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAUtD,eAAO,MAAM,MAAM,YAAY,CAAC;AAChC,eAAO,MAAM,KAAK,YAAY,CAAC;AAC/B,eAAO,MAAM,IAAI,YAAY,CAAC;AAC9B,eAAO,MAAM,OAAO,YAAY,CAAC;AACjC,eAAO,MAAM,KAAK,YAAY,CAAC;AAC/B,eAAO,MAAM,KAAK,YAAY,CAAC;AAC/B,eAAO,MAAM,MAAM,YAAY,CAAC;AAChC,eAAO,MAAM,IAAI,YAAY,CAAC;AAC9B,eAAO,MAAM,OAAO,YAAY,CAAC;AACjC,eAAO,MAAM,MAAM,YAAY,CAAC;AAEhC,eAAO,MAAM,mBAAmB,YAAY,CAAC;AAE7C,eAAO,MAAM,iBAAiB,YAAY,CAAC;AAE3C,eAAO,MAAM,MAAM,YAAY,CAAC;AAIhC,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4IzB,CAAC;AAEF,eAAO,MAAM,wBAAwB,gBA6EpC,CAAC"}