@dxos/react-ui-editor 0.8.4-main.bc674ce → 0.8.4-main.bcb3aa67d6

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 (90) hide show
  1. package/dist/lib/browser/index.mjs +298 -377
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/node-esm/index.mjs +298 -377
  5. package/dist/lib/node-esm/index.mjs.map +4 -4
  6. package/dist/lib/node-esm/meta.json +1 -1
  7. package/dist/types/src/components/Editor/Editor.d.ts.map +1 -1
  8. package/dist/types/src/components/EditorMenuProvider/EditorMenuProvider.d.ts +1 -3
  9. package/dist/types/src/components/EditorMenuProvider/EditorMenuProvider.d.ts.map +1 -1
  10. package/dist/types/src/components/EditorMenuProvider/menu-presets.d.ts.map +1 -1
  11. package/dist/types/src/components/EditorMenuProvider/useEditorMenu.d.ts.map +1 -1
  12. package/dist/types/src/components/EditorPreviewProvider/EditorPreviewProvider.d.ts.map +1 -1
  13. package/dist/types/src/components/EditorToolbar/EditorToolbar.d.ts.map +1 -1
  14. package/dist/types/src/components/EditorToolbar/blocks.d.ts +3 -17
  15. package/dist/types/src/components/EditorToolbar/blocks.d.ts.map +1 -1
  16. package/dist/types/src/components/EditorToolbar/formatting.d.ts +3 -17
  17. package/dist/types/src/components/EditorToolbar/formatting.d.ts.map +1 -1
  18. package/dist/types/src/components/EditorToolbar/headings.d.ts +3 -17
  19. package/dist/types/src/components/EditorToolbar/headings.d.ts.map +1 -1
  20. package/dist/types/src/components/EditorToolbar/image.d.ts +3 -8
  21. package/dist/types/src/components/EditorToolbar/image.d.ts.map +1 -1
  22. package/dist/types/src/components/EditorToolbar/index.d.ts +0 -1
  23. package/dist/types/src/components/EditorToolbar/index.d.ts.map +1 -1
  24. package/dist/types/src/components/EditorToolbar/lists.d.ts +6 -0
  25. package/dist/types/src/components/EditorToolbar/lists.d.ts.map +1 -0
  26. package/dist/types/src/components/EditorToolbar/search.d.ts +3 -8
  27. package/dist/types/src/components/EditorToolbar/search.d.ts.map +1 -1
  28. package/dist/types/src/components/EditorToolbar/view-mode.d.ts +3 -17
  29. package/dist/types/src/components/EditorToolbar/view-mode.d.ts.map +1 -1
  30. package/dist/types/src/stories/Automerge.stories.d.ts +25 -24
  31. package/dist/types/src/stories/Automerge.stories.d.ts.map +1 -1
  32. package/dist/types/src/stories/Comments.stories.d.ts +1 -1
  33. package/dist/types/src/stories/EditorToolbar.stories.d.ts +26 -26
  34. package/dist/types/src/stories/EditorToolbar.stories.d.ts.map +1 -1
  35. package/dist/types/src/stories/Experimental.stories.d.ts +1 -1
  36. package/dist/types/src/stories/Markdown.stories.d.ts +1 -1
  37. package/dist/types/src/stories/Outliner.stories.d.ts +2 -2
  38. package/dist/types/src/stories/Outliner.stories.d.ts.map +1 -1
  39. package/dist/types/src/stories/Popover.stories.d.ts +2 -2
  40. package/dist/types/src/stories/Popover.stories.d.ts.map +1 -1
  41. package/dist/types/src/stories/Preview.stories.d.ts +1 -1
  42. package/dist/types/src/stories/Preview.stories.d.ts.map +1 -1
  43. package/dist/types/src/stories/TextEditor.stories.d.ts +1 -1
  44. package/dist/types/src/stories/components/EditorStory.d.ts +3 -3
  45. package/dist/types/src/stories/components/EditorStory.d.ts.map +1 -1
  46. package/dist/types/src/stories/components/util.d.ts +3 -3
  47. package/dist/types/src/stories/components/util.d.ts.map +1 -1
  48. package/dist/types/src/translations.d.ts +24 -24
  49. package/dist/types/src/translations.d.ts.map +1 -1
  50. package/dist/types/src/util/react.d.ts +1 -4
  51. package/dist/types/src/util/react.d.ts.map +1 -1
  52. package/dist/types/tsconfig.tsbuildinfo +1 -1
  53. package/package.json +45 -45
  54. package/src/components/Editor/Editor.stories.tsx +2 -2
  55. package/src/components/Editor/Editor.tsx +12 -6
  56. package/src/components/EditorContent/EditorContent.tsx +1 -1
  57. package/src/components/EditorMenuProvider/EditorMenuProvider.tsx +21 -28
  58. package/src/components/EditorMenuProvider/menu-presets.ts +1 -0
  59. package/src/components/EditorMenuProvider/useEditorMenu.ts +8 -1
  60. package/src/components/EditorPreviewProvider/EditorPreviewProvider.tsx +5 -7
  61. package/src/components/EditorToolbar/EditorToolbar.tsx +24 -61
  62. package/src/components/EditorToolbar/blocks.ts +54 -46
  63. package/src/components/EditorToolbar/formatting.ts +43 -44
  64. package/src/components/EditorToolbar/headings.ts +42 -48
  65. package/src/components/EditorToolbar/image.ts +16 -21
  66. package/src/components/EditorToolbar/index.ts +0 -1
  67. package/src/components/EditorToolbar/lists.ts +57 -0
  68. package/src/components/EditorToolbar/search.ts +16 -21
  69. package/src/components/EditorToolbar/view-mode.ts +34 -40
  70. package/src/stories/Automerge.stories.tsx +8 -10
  71. package/src/stories/Comments.stories.tsx +4 -4
  72. package/src/stories/EditorToolbar.stories.tsx +32 -17
  73. package/src/stories/Experimental.stories.tsx +3 -3
  74. package/src/stories/Markdown.stories.tsx +2 -2
  75. package/src/stories/Outliner.stories.tsx +4 -4
  76. package/src/stories/Popover.stories.tsx +6 -6
  77. package/src/stories/Preview.stories.tsx +58 -48
  78. package/src/stories/Tags.stories.tsx +5 -5
  79. package/src/stories/TextEditor.stories.tsx +2 -2
  80. package/src/stories/Theme.stories.tsx +2 -2
  81. package/src/stories/components/EditorStory.tsx +17 -12
  82. package/src/stories/components/util.tsx +19 -22
  83. package/src/translations.ts +29 -24
  84. package/src/util/react.tsx +2 -11
  85. package/dist/types/src/components/EditorToolbar/actions.d.ts +0 -24
  86. package/dist/types/src/components/EditorToolbar/actions.d.ts.map +0 -1
  87. package/dist/types/src/stories/CommandDialog.stories.d.ts +0 -14
  88. package/dist/types/src/stories/CommandDialog.stories.d.ts.map +0 -1
  89. package/src/components/EditorToolbar/actions.ts +0 -87
  90. package/src/stories/CommandDialog.stories.tsx +0 -81
@@ -1,24 +0,0 @@
1
- import { type EditorView } from '@codemirror/view';
2
- import { type Node } from '@dxos/app-graph';
3
- import { type MenuItemGroup, type ToolbarMenuActionGroupProperties } from '@dxos/react-ui-menu';
4
- import { type MenuActionProperties } from '@dxos/ui-types';
5
- import { type EditorToolbarState } from './useEditorToolbar';
6
- export declare const createLists: (state: EditorToolbarState, getView: () => EditorView) => {
7
- nodes: (Node.NodeArg<any, Record<string, any>> | Readonly<Omit<Readonly<{
8
- id: string;
9
- type: string;
10
- cacheable?: string[];
11
- properties: Readonly<MenuActionProperties>;
12
- data: Node.ActionData<never>;
13
- }>, "properties"> & {
14
- properties: Readonly<MenuActionProperties>;
15
- _actionContext?: Node.ActionContext;
16
- }>)[];
17
- edges: {
18
- source: string;
19
- target: string;
20
- }[];
21
- };
22
- export declare const createEditorAction: (id: string, props: Partial<MenuActionProperties>, invoke: () => void) => Node.Action<MenuActionProperties>;
23
- export declare const createEditorActionGroup: (id: string, props: Omit<ToolbarMenuActionGroupProperties, "icon">, icon?: string) => MenuItemGroup<ToolbarMenuActionGroupProperties>;
24
- //# sourceMappingURL=actions.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"actions.d.ts","sourceRoot":"","sources":["../../../../../src/components/EditorToolbar/actions.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAEnD,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EACL,KAAK,aAAa,EAClB,KAAK,gCAAgC,EAGtC,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAAE,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAI3D,OAAO,EAAE,KAAK,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAQ7D,eAAO,MAAM,WAAW,GAAI,OAAO,kBAAkB,EAAE,SAAS,MAAM,UAAU;;;;;;;;;;;;;;;CAW/E,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,IAAI,MAAM,EAAE,OAAO,OAAO,CAAC,oBAAoB,CAAC,EAAE,QAAQ,MAAM,IAAI,KAM/F,IAAI,CAAC,MAAM,CAAC,oBAAoB,CACvC,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAClC,IAAI,MAAM,EACV,OAAO,IAAI,CAAC,gCAAgC,EAAE,MAAM,CAAC,EACrD,OAAO,MAAM,KACZ,aAAa,CAAC,gCAAgC,CAShD,CAAC"}
@@ -1,14 +0,0 @@
1
- import { type StoryObj } from '@storybook/react-vite';
2
- import React from 'react';
3
- declare const meta: {
4
- title: string;
5
- render: () => React.JSX.Element;
6
- decorators: import("@storybook/react").Decorator[];
7
- parameters: {
8
- layout: string;
9
- };
10
- };
11
- export default meta;
12
- type Story = StoryObj<typeof meta>;
13
- export declare const Default: Story;
14
- //# sourceMappingURL=CommandDialog.stories.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"CommandDialog.stories.d.ts","sourceRoot":"","sources":["../../../../src/stories/CommandDialog.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAa,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,KAAuC,MAAM,OAAO,CAAC;AA8D5D,QAAA,MAAM,IAAI;;;;;;;CAOqB,CAAC;AAEhC,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}
@@ -1,87 +0,0 @@
1
- //
2
- // Copyright 2025 DXOS.org
3
- //
4
-
5
- import { type EditorView } from '@codemirror/view';
6
-
7
- import { type Node } from '@dxos/app-graph';
8
- import {
9
- type MenuItemGroup,
10
- type ToolbarMenuActionGroupProperties,
11
- createMenuAction,
12
- createMenuItemGroup,
13
- } from '@dxos/react-ui-menu';
14
- import { List, addList, removeList } from '@dxos/ui-editor';
15
- import { type MenuActionProperties } from '@dxos/ui-types';
16
-
17
- import { translationKey } from '../../translations';
18
-
19
- import { type EditorToolbarState } from './useEditorToolbar';
20
-
21
- const listStyles = {
22
- bullet: 'ph--list-bullets--regular',
23
- ordered: 'ph--list-numbers--regular',
24
- task: 'ph--list-checks--regular',
25
- };
26
-
27
- export const createLists = (state: EditorToolbarState, getView: () => EditorView) => {
28
- const value = state.listStyle ?? '';
29
- const listGroupAction = createListGroupAction(value);
30
- const listActionsMap = createListActions(value, getView);
31
- return {
32
- nodes: [listGroupAction as Node.NodeArg<any>, ...listActionsMap],
33
- edges: [
34
- { source: 'root', target: 'list' },
35
- ...listActionsMap.map(({ id }) => ({ source: listGroupAction.id, target: id })),
36
- ],
37
- };
38
- };
39
-
40
- export const createEditorAction = (id: string, props: Partial<MenuActionProperties>, invoke: () => void) => {
41
- const { label = [`${id} label`, { ns: translationKey }], ...rest } = props;
42
-
43
- return createMenuAction(id, invoke, {
44
- label,
45
- ...rest,
46
- }) as Node.Action<MenuActionProperties>;
47
- };
48
-
49
- export const createEditorActionGroup = (
50
- id: string,
51
- props: Omit<ToolbarMenuActionGroupProperties, 'icon'>,
52
- icon?: string,
53
- ): MenuItemGroup<ToolbarMenuActionGroupProperties> => {
54
- const { label = [`${id} label`, { ns: translationKey }], ...rest } = props;
55
-
56
- return createMenuItemGroup(id, {
57
- label,
58
- icon,
59
- iconOnly: true,
60
- ...rest,
61
- }) as MenuItemGroup<ToolbarMenuActionGroupProperties>;
62
- };
63
-
64
- const createListGroupAction = (value: string) =>
65
- createEditorActionGroup('list', {
66
- variant: 'toggleGroup',
67
- selectCardinality: 'single',
68
- value,
69
- } as ToolbarMenuActionGroupProperties);
70
-
71
- const createListActions = (value: string, getView: () => EditorView) =>
72
- Object.entries(listStyles).map(([listStyle, icon]) => {
73
- const checked = value === listStyle;
74
- return createEditorAction(`list-${listStyle}`, { checked, icon }, () => {
75
- const view = getView();
76
- if (!view) {
77
- return;
78
- }
79
-
80
- const listType = listStyle === 'ordered' ? List.Ordered : listStyle === 'bullet' ? List.Bullet : List.Task;
81
- if (checked) {
82
- removeList(listType)(view);
83
- } else {
84
- addList(listType)(view);
85
- }
86
- });
87
- });
@@ -1,81 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- import { type Meta, type StoryObj } from '@storybook/react-vite';
6
- import React, { type KeyboardEvent, useState } from 'react';
7
-
8
- import { type Button, IconButton, Input } from '@dxos/react-ui';
9
- import { withTheme } from '@dxos/react-ui/testing';
10
- import { editorWidth, join } from '@dxos/ui-editor';
11
- import { mx } from '@dxos/ui-theme';
12
-
13
- import { EditorStory } from './components';
14
-
15
- // TODO(burdon): Reimplement with Popover.
16
- const CommandDialog = ({ onAction }: { onAction: (action?: any) => void }) => {
17
- const [text, setText] = useState('');
18
-
19
- const handleInsert = () => {
20
- // TODO(burdon): Use queue ref.
21
- const link = `![${text}](dxn:queue:data:123)`;
22
- onAction(text.length ? { type: 'insert', text: link } : undefined);
23
- };
24
-
25
- const handleKeyDown = (event: KeyboardEvent<HTMLInputElement>) => {
26
- switch (event.key) {
27
- case 'Enter': {
28
- handleInsert();
29
- break;
30
- }
31
- case 'Escape': {
32
- onAction();
33
- break;
34
- }
35
- }
36
- };
37
-
38
- return (
39
- <div className='flex is-full justify-center'>
40
- <div
41
- className={mx(
42
- 'flex is-full p-2 gap-2 items-center bg-modalSurface border border-separator rounded-md',
43
- editorWidth,
44
- )}
45
- >
46
- <Input.Root>
47
- <Input.TextInput
48
- autoFocus={true}
49
- placeholder='Ask a question...'
50
- value={text}
51
- onChange={(ev) => setText(ev.target.value)}
52
- onKeyDown={handleKeyDown}
53
- />
54
- </Input.Root>
55
- <IconButton
56
- icon='ph--x--regular'
57
- label='Cancel'
58
- iconOnly
59
- variant='ghost'
60
- classNames='pli-0'
61
- onClick={() => onAction({ type: 'cancel' })}
62
- />
63
- </div>
64
- </div>
65
- );
66
- };
67
-
68
- const meta = {
69
- title: 'ui/react-ui-editor/CommandDialog',
70
- render: () => <EditorStory text={join('# Command', '', '')} extensions={[]} />,
71
- decorators: [withTheme],
72
- parameters: {
73
- layout: 'fullscreen',
74
- },
75
- } satisfies Meta<typeof Button>;
76
-
77
- export default meta;
78
-
79
- type Story = StoryObj<typeof meta>;
80
-
81
- export const Default: Story = {};