@dxos/plugin-help 0.7.5-main.499c70c → 0.7.5-main.6a330ac

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 (86) hide show
  1. package/dist/lib/browser/app-graph-builder-X4XWALX3.mjs +78 -0
  2. package/dist/lib/browser/app-graph-builder-X4XWALX3.mjs.map +7 -0
  3. package/dist/lib/browser/{chunk-RHSC3EWO.mjs → chunk-24E4WRKH.mjs} +2 -2
  4. package/dist/lib/browser/chunk-24E4WRKH.mjs.map +7 -0
  5. package/dist/lib/browser/{chunk-STC3ORFI.mjs → chunk-76XWX6N3.mjs} +3 -3
  6. package/dist/lib/browser/chunk-76XWX6N3.mjs.map +7 -0
  7. package/dist/lib/browser/chunk-C7PCVS5K.mjs +361 -0
  8. package/dist/lib/browser/chunk-C7PCVS5K.mjs.map +7 -0
  9. package/dist/lib/browser/chunk-GJTAQWB6.mjs +16 -0
  10. package/dist/lib/browser/chunk-GJTAQWB6.mjs.map +7 -0
  11. package/dist/lib/browser/index.mjs +70 -484
  12. package/dist/lib/browser/index.mjs.map +4 -4
  13. package/dist/lib/browser/meta.json +1 -1
  14. package/dist/lib/browser/meta.mjs +3 -3
  15. package/dist/lib/browser/react-root-4AV22UGT.mjs +34 -0
  16. package/dist/lib/browser/react-root-4AV22UGT.mjs.map +7 -0
  17. package/dist/lib/browser/react-surface-7S3NUVZH.mjs +36 -0
  18. package/dist/lib/browser/react-surface-7S3NUVZH.mjs.map +7 -0
  19. package/dist/lib/browser/state-SLKOTRHH.mjs +29 -0
  20. package/dist/lib/browser/state-SLKOTRHH.mjs.map +7 -0
  21. package/dist/lib/browser/types.mjs +2 -2
  22. package/dist/types/src/HelpPlugin.d.ts +2 -7
  23. package/dist/types/src/HelpPlugin.d.ts.map +1 -1
  24. package/dist/types/src/capabilities/app-graph-builder.d.ts +181 -0
  25. package/dist/types/src/capabilities/app-graph-builder.d.ts.map +1 -0
  26. package/dist/types/src/capabilities/capabilities.d.ts +10 -0
  27. package/dist/types/src/capabilities/capabilities.d.ts.map +1 -0
  28. package/dist/types/src/capabilities/index.d.ts +185 -0
  29. package/dist/types/src/capabilities/index.d.ts.map +1 -0
  30. package/dist/types/src/capabilities/react-root.d.ts +8 -0
  31. package/dist/types/src/capabilities/react-root.d.ts.map +1 -0
  32. package/dist/types/src/capabilities/react-surface.d.ts +4 -0
  33. package/dist/types/src/capabilities/react-surface.d.ts.map +1 -0
  34. package/dist/types/src/capabilities/state.d.ts +4 -0
  35. package/dist/types/src/capabilities/state.d.ts.map +1 -0
  36. package/dist/types/src/components/Shortcuts/Key.d.ts +1 -2
  37. package/dist/types/src/components/Shortcuts/Key.d.ts.map +1 -1
  38. package/dist/types/src/components/Shortcuts/ShortcutsDialog.d.ts +1 -2
  39. package/dist/types/src/components/Shortcuts/ShortcutsDialog.d.ts.map +1 -1
  40. package/dist/types/src/components/Shortcuts/ShortcutsHints.d.ts +1 -2
  41. package/dist/types/src/components/Shortcuts/ShortcutsHints.d.ts.map +1 -1
  42. package/dist/types/src/components/Shortcuts/ShortcutsList.d.ts +1 -2
  43. package/dist/types/src/components/Shortcuts/ShortcutsList.d.ts.map +1 -1
  44. package/dist/types/src/components/Shortcuts/ShortcutsSection.d.ts +1 -2
  45. package/dist/types/src/components/Shortcuts/ShortcutsSection.d.ts.map +1 -1
  46. package/dist/types/src/components/WelcomeTour/WelcomeTour.d.ts +8 -0
  47. package/dist/types/src/components/WelcomeTour/WelcomeTour.d.ts.map +1 -0
  48. package/dist/types/src/components/WelcomeTour/WelcomeTour.stories.d.ts +10 -0
  49. package/dist/types/src/components/WelcomeTour/WelcomeTour.stories.d.ts.map +1 -0
  50. package/dist/types/src/components/WelcomeTour/index.d.ts +2 -0
  51. package/dist/types/src/components/WelcomeTour/index.d.ts.map +1 -0
  52. package/dist/types/src/components/index.d.ts +1 -1
  53. package/dist/types/src/components/index.d.ts.map +1 -1
  54. package/dist/types/src/hooks/useHelp.d.ts +1 -1
  55. package/dist/types/src/hooks/useHelp.d.ts.map +1 -1
  56. package/dist/types/src/index.d.ts +4 -5
  57. package/dist/types/src/index.d.ts.map +1 -1
  58. package/dist/types/src/meta.d.ts +1 -2
  59. package/dist/types/src/meta.d.ts.map +1 -1
  60. package/dist/types/src/types.d.ts +2 -6
  61. package/dist/types/src/types.d.ts.map +1 -1
  62. package/dist/types/tsconfig.tsbuildinfo +1 -1
  63. package/package.json +20 -26
  64. package/src/HelpPlugin.tsx +47 -127
  65. package/src/capabilities/app-graph-builder.ts +66 -0
  66. package/src/capabilities/capabilities.ts +13 -0
  67. package/src/capabilities/index.ts +12 -0
  68. package/src/capabilities/react-root.tsx +32 -0
  69. package/src/capabilities/react-surface.tsx +30 -0
  70. package/src/capabilities/state.ts +23 -0
  71. package/src/components/{HelpContextProvider/HelpContextProvider.stories.tsx → WelcomeTour/WelcomeTour.stories.tsx} +9 -8
  72. package/src/components/{HelpContextProvider/HelpContextProvider.tsx → WelcomeTour/WelcomeTour.tsx} +10 -16
  73. package/src/components/WelcomeTour/index.ts +5 -0
  74. package/src/components/index.ts +1 -1
  75. package/src/index.ts +4 -9
  76. package/src/meta.ts +1 -1
  77. package/src/types.ts +2 -10
  78. package/dist/lib/browser/chunk-RHSC3EWO.mjs.map +0 -7
  79. package/dist/lib/browser/chunk-STC3ORFI.mjs.map +0 -7
  80. package/dist/types/src/components/HelpContextProvider/HelpContextProvider.d.ts +0 -9
  81. package/dist/types/src/components/HelpContextProvider/HelpContextProvider.d.ts.map +0 -1
  82. package/dist/types/src/components/HelpContextProvider/HelpContextProvider.stories.d.ts +0 -10
  83. package/dist/types/src/components/HelpContextProvider/HelpContextProvider.stories.d.ts.map +0 -1
  84. package/dist/types/src/components/HelpContextProvider/index.d.ts +0 -2
  85. package/dist/types/src/components/HelpContextProvider/index.d.ts.map +0 -1
  86. package/src/components/HelpContextProvider/index.ts +0 -5
package/package.json CHANGED
@@ -1,21 +1,18 @@
1
1
  {
2
2
  "name": "@dxos/plugin-help",
3
- "version": "0.7.5-main.499c70c",
3
+ "version": "0.7.5-main.6a330ac",
4
4
  "description": "Help plugin.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
7
7
  "license": "MIT",
8
8
  "author": "DXOS.org",
9
9
  "sideEffects": true,
10
+ "type": "module",
10
11
  "exports": {
11
12
  ".": {
12
13
  "types": "./dist/types/src/index.d.ts",
13
14
  "browser": "./dist/lib/browser/index.mjs"
14
15
  },
15
- "./meta": {
16
- "types": "./dist/types/src/meta.d.ts",
17
- "browser": "./dist/lib/browser/meta.mjs"
18
- },
19
16
  "./types": {
20
17
  "types": "./dist/types/src/types.d.ts",
21
18
  "browser": "./dist/lib/browser/types.mjs"
@@ -24,9 +21,6 @@
24
21
  "types": "dist/types/src/index.d.ts",
25
22
  "typesVersions": {
26
23
  "*": {
27
- "meta": [
28
- "dist/types/src/meta.d.ts"
29
- ],
30
24
  "types": [
31
25
  "dist/types/src/types.d.ts"
32
26
  ]
@@ -37,20 +31,20 @@
37
31
  "src"
38
32
  ],
39
33
  "dependencies": {
40
- "@fluentui/react-tabster": "^9.19.0",
34
+ "@fluentui/react-tabster": "9.23.3",
41
35
  "lodash.get": "^4.4.2",
42
36
  "react-joyride": "^2.7.2",
43
- "@dxos/app-framework": "0.7.5-main.499c70c",
44
- "@dxos/debug": "0.7.5-main.499c70c",
45
- "@dxos/echo-schema": "0.7.5-main.499c70c",
46
- "@dxos/app-graph": "0.7.5-main.499c70c",
47
- "@dxos/live-object": "0.7.5-main.499c70c",
48
- "@dxos/keyboard": "0.7.5-main.499c70c",
49
- "@dxos/local-storage": "0.7.5-main.499c70c",
50
- "@dxos/plugin-client": "0.7.5-main.499c70c",
51
- "@dxos/plugin-graph": "0.7.5-main.499c70c",
52
- "@dxos/react-client": "0.7.5-main.499c70c",
53
- "@dxos/plugin-space": "0.7.5-main.499c70c"
37
+ "@dxos/app-graph": "0.7.5-main.6a330ac",
38
+ "@dxos/debug": "0.7.5-main.6a330ac",
39
+ "@dxos/local-storage": "0.7.5-main.6a330ac",
40
+ "@dxos/app-framework": "0.7.5-main.6a330ac",
41
+ "@dxos/keyboard": "0.7.5-main.6a330ac",
42
+ "@dxos/echo-schema": "0.7.5-main.6a330ac",
43
+ "@dxos/live-object": "0.7.5-main.6a330ac",
44
+ "@dxos/plugin-client": "0.7.5-main.6a330ac",
45
+ "@dxos/plugin-graph": "0.7.5-main.6a330ac",
46
+ "@dxos/plugin-space": "0.7.5-main.6a330ac",
47
+ "@dxos/react-client": "0.7.5-main.6a330ac"
54
48
  },
55
49
  "devDependencies": {
56
50
  "@phosphor-icons/react": "^2.1.5",
@@ -62,17 +56,17 @@
62
56
  "react-floater": "0.7.9",
63
57
  "type-fest": "4.10.1",
64
58
  "vite": "5.4.7",
65
- "@dxos/random": "0.7.5-main.499c70c",
66
- "@dxos/react-ui": "0.7.5-main.499c70c",
67
- "@dxos/react-ui-theme": "0.7.5-main.499c70c",
68
- "@dxos/storybook-utils": "0.7.5-main.499c70c"
59
+ "@dxos/random": "0.7.5-main.6a330ac",
60
+ "@dxos/react-ui": "0.7.5-main.6a330ac",
61
+ "@dxos/storybook-utils": "0.7.5-main.6a330ac",
62
+ "@dxos/react-ui-theme": "0.7.5-main.6a330ac"
69
63
  },
70
64
  "peerDependencies": {
71
65
  "@phosphor-icons/react": "^2.1.5",
72
66
  "react": "~18.2.0",
73
67
  "react-dom": "~18.2.0",
74
- "@dxos/react-ui-theme": "0.7.5-main.499c70c",
75
- "@dxos/react-ui": "0.7.5-main.499c70c"
68
+ "@dxos/react-ui": "0.7.5-main.6a330ac",
69
+ "@dxos/react-ui-theme": "0.7.5-main.6a330ac"
76
70
  },
77
71
  "publishConfig": {
78
72
  "access": "public"
@@ -2,136 +2,56 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import React from 'react';
5
+ import { createResolver, defineModule, definePlugin, Events, contributes, Capabilities } from '@dxos/app-framework';
6
6
 
7
- import {
8
- resolvePlugin,
9
- type PluginDefinition,
10
- parseIntentPlugin,
11
- LayoutAction,
12
- createSurface,
13
- createResolver,
14
- createIntent,
15
- } from '@dxos/app-framework';
16
- import { createExtension, type Node } from '@dxos/app-graph';
17
- import { create } from '@dxos/live-object';
18
- import { LocalStorageStore } from '@dxos/local-storage';
19
-
20
- import {
21
- HelpContextProvider,
22
- SHORTCUTS_DIALOG,
23
- ShortcutsDialogContent,
24
- ShortcutsHints,
25
- ShortcutsList,
26
- } from './components';
27
- import meta, { HELP_PLUGIN } from './meta';
7
+ import { AppGraphBuilder, HelpState, ReactRoot, ReactSurface } from './capabilities';
8
+ import { HelpCapabilities } from './capabilities/capabilities';
9
+ import { meta } from './meta';
28
10
  import translations from './translations';
29
- import { type Step, type HelpPluginProvides, HelpAction } from './types';
30
-
31
- export type HelpSettingsProps = { showHints?: boolean; showWelcome?: boolean };
11
+ import { type Step, HelpAction } from './types';
32
12
 
33
13
  export type HelpPluginOptions = { steps?: Step[] };
34
14
 
35
- export const HelpPlugin = ({ steps = [] }: HelpPluginOptions): PluginDefinition<HelpPluginProvides> => {
36
- const settings = new LocalStorageStore<HelpSettingsProps>(HELP_PLUGIN, { showHints: true, showWelcome: true });
37
- const state = create<{ running: boolean }>({ running: false });
38
- return {
39
- meta,
40
- ready: async () => {
41
- settings
42
- .prop({ key: 'showHints', type: LocalStorageStore.bool({ allowUndefined: true }) })
43
- .prop({ key: 'showWelcome', type: LocalStorageStore.bool({ allowUndefined: true }) });
44
- },
45
- provides: {
46
- context: ({ children }) => {
47
- return (
48
- <HelpContextProvider
49
- steps={steps}
50
- running={state.running}
51
- onRunningChanged={(newState) => {
52
- state.running = newState;
53
- if (!newState) {
54
- settings.values.showHints = false;
55
- }
56
- }}
57
- >
58
- {children}
59
- </HelpContextProvider>
60
- );
61
- },
62
- translations,
63
- graph: {
64
- builder: (plugins) => {
65
- const dispatch = resolvePlugin(plugins, parseIntentPlugin)?.provides.intent.dispatchPromise;
66
-
67
- return createExtension({
68
- id: HELP_PLUGIN,
69
- filter: (node): node is Node<null> => node.id === 'root',
70
- actions: () => [
71
- {
72
- id: HelpAction.Start._tag,
73
- data: async () => {
74
- settings.values.showHints = true;
75
- await dispatch?.(createIntent(HelpAction.Start));
76
- },
77
- properties: {
78
- label: ['open help tour', { ns: HELP_PLUGIN }],
79
- icon: 'ph--info--regular',
80
- keyBinding: {
81
- macos: 'shift+meta+/',
82
- // TODO(wittjosiah): Test on windows to see if it behaves the same as linux.
83
- windows: 'shift+ctrl+/',
84
- linux: 'shift+ctrl+?',
85
- },
86
- testId: 'helpPlugin.openHelp',
87
- },
88
- },
89
- {
90
- id: 'dxos.org/plugin/help/open-shortcuts',
91
- data: async () => {
92
- settings.values.showHints = true;
93
- await dispatch?.(
94
- createIntent(LayoutAction.SetLayout, { element: 'dialog', component: SHORTCUTS_DIALOG }),
95
- );
96
- },
97
- properties: {
98
- label: ['open shortcuts label', { ns: HELP_PLUGIN }],
99
- icon: 'ph--keyboard--regular',
100
- keyBinding: {
101
- macos: 'meta+ctrl+/',
102
- },
103
- },
104
- },
105
- ],
106
- });
107
- },
108
- },
109
- surface: {
110
- definitions: () => [
111
- createSurface({
112
- id: `${HELP_PLUGIN}/hints`,
113
- role: 'hints',
114
- component: () => <ShortcutsHints />,
115
- }),
116
- createSurface({
117
- id: `${HELP_PLUGIN}/keyshortcuts`,
118
- role: 'keyshortcuts',
119
- component: () => <ShortcutsList />,
120
- }),
121
- createSurface({
122
- id: SHORTCUTS_DIALOG,
123
- role: 'dialog',
124
- filter: (data): data is any => data.component === SHORTCUTS_DIALOG,
125
- component: () => <ShortcutsDialogContent />,
126
- }),
127
- ],
128
- },
129
- intent: {
130
- resolvers: () =>
131
- createResolver(HelpAction.Start, () => {
132
- state.running = true;
15
+ export const HelpPlugin = ({ steps = [] }: HelpPluginOptions) =>
16
+ definePlugin(meta, [
17
+ defineModule({
18
+ id: `${meta.id}/module/state`,
19
+ activatesOn: Events.Startup,
20
+ activate: HelpState,
21
+ }),
22
+ defineModule({
23
+ id: `${meta.id}/module/translations`,
24
+ activatesOn: Events.SetupTranslations,
25
+ activate: () => contributes(Capabilities.Translations, translations),
26
+ }),
27
+ defineModule({
28
+ id: `${meta.id}/module/react-root`,
29
+ activatesOn: Events.Startup,
30
+ activate: () => ReactRoot(steps),
31
+ }),
32
+ defineModule({
33
+ id: `${meta.id}/module/react-surface`,
34
+ activatesOn: Events.SetupReactSurface,
35
+ activate: ReactSurface,
36
+ }),
37
+ defineModule({
38
+ id: `${meta.id}/module/intent-resolver`,
39
+ activatesOn: Events.SetupIntentResolver,
40
+ activate: (context) =>
41
+ contributes(
42
+ Capabilities.IntentResolver,
43
+ createResolver({
44
+ intent: HelpAction.Start,
45
+ resolve: () => {
46
+ const state = context.requestCapability(HelpCapabilities.MutableState);
47
+ state.running = true;
48
+ },
133
49
  }),
134
- },
135
- },
136
- };
137
- };
50
+ ),
51
+ }),
52
+ defineModule({
53
+ id: `${meta.id}/module/app-graph-builder`,
54
+ activatesOn: Events.SetupAppGraph,
55
+ activate: AppGraphBuilder,
56
+ }),
57
+ ]);
@@ -0,0 +1,66 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Capabilities, contributes, createIntent, LayoutAction, type PluginsContext } from '@dxos/app-framework';
6
+ import { createExtension, type Node } from '@dxos/app-graph';
7
+
8
+ import { HelpCapabilities } from './capabilities';
9
+ import { SHORTCUTS_DIALOG } from '../components';
10
+ import { HELP_PLUGIN } from '../meta';
11
+ import { HelpAction } from '../types';
12
+
13
+ export default (context: PluginsContext) =>
14
+ contributes(
15
+ Capabilities.AppGraphBuilder,
16
+ createExtension({
17
+ id: HELP_PLUGIN,
18
+ filter: (node): node is Node<null> => node.id === 'root',
19
+ actions: () => [
20
+ {
21
+ id: HelpAction.Start._tag,
22
+ data: async () => {
23
+ const { dispatchPromise: dispatch } = context.requestCapability(Capabilities.IntentDispatcher);
24
+ const state = context.requestCapability(HelpCapabilities.MutableState);
25
+ state.showHints = true;
26
+ await dispatch(createIntent(HelpAction.Start));
27
+ },
28
+ properties: {
29
+ label: ['open help tour', { ns: HELP_PLUGIN }],
30
+ icon: 'ph--info--regular',
31
+ keyBinding: {
32
+ macos: 'shift+meta+/',
33
+ // TODO(wittjosiah): Test on windows to see if it behaves the same as linux.
34
+ windows: 'shift+ctrl+/',
35
+ linux: 'shift+ctrl+?',
36
+ },
37
+ testId: 'helpPlugin.openHelp',
38
+ },
39
+ },
40
+ {
41
+ id: 'dxos.org/plugin/help/open-shortcuts',
42
+ data: async () => {
43
+ const { dispatchPromise: dispatch } = context.requestCapability(Capabilities.IntentDispatcher);
44
+ const state = context.requestCapability(HelpCapabilities.MutableState);
45
+ state.showHints = true;
46
+ await dispatch(
47
+ createIntent(LayoutAction.UpdateDialog, {
48
+ part: 'dialog',
49
+ subject: SHORTCUTS_DIALOG,
50
+ options: {
51
+ blockAlign: 'center',
52
+ },
53
+ }),
54
+ );
55
+ },
56
+ properties: {
57
+ label: ['open shortcuts label', { ns: HELP_PLUGIN }],
58
+ icon: 'ph--keyboard--regular',
59
+ keyBinding: {
60
+ macos: 'meta+ctrl+/',
61
+ },
62
+ },
63
+ },
64
+ ],
65
+ }),
66
+ );
@@ -0,0 +1,13 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { defineCapability } from '@dxos/app-framework';
6
+
7
+ import { HELP_PLUGIN } from '../meta';
8
+
9
+ export namespace HelpCapabilities {
10
+ export type State = { running: boolean; showHints: boolean; showWelcome: boolean };
11
+ export const State = defineCapability<Readonly<State>>(`${HELP_PLUGIN}/capability/state`);
12
+ export const MutableState = defineCapability<State>(`${HELP_PLUGIN}/capability/state`);
13
+ }
@@ -0,0 +1,12 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { lazy } from '@dxos/app-framework';
6
+
7
+ export const AppGraphBuilder = lazy(() => import('./app-graph-builder'));
8
+ export const ReactRoot = lazy(() => import('./react-root'));
9
+ export const ReactSurface = lazy(() => import('./react-surface'));
10
+ export const HelpState = lazy(() => import('./state'));
11
+
12
+ export * from './capabilities';
@@ -0,0 +1,32 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import React from 'react';
6
+
7
+ import { Capabilities, contributes, useCapability } from '@dxos/app-framework';
8
+
9
+ import { HelpCapabilities } from './capabilities';
10
+ import { WelcomeTour } from '../components';
11
+ import { HELP_PLUGIN } from '../meta';
12
+ import { type Step } from '../types';
13
+
14
+ export default (steps: Step[]) =>
15
+ contributes(Capabilities.ReactRoot, {
16
+ id: HELP_PLUGIN,
17
+ root: () => {
18
+ const state = useCapability(HelpCapabilities.MutableState);
19
+ return (
20
+ <WelcomeTour
21
+ steps={steps}
22
+ running={state.running}
23
+ onRunningChanged={(newState) => {
24
+ state.running = newState;
25
+ if (!newState) {
26
+ state.showHints = false;
27
+ }
28
+ }}
29
+ />
30
+ );
31
+ },
32
+ });
@@ -0,0 +1,30 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import React from 'react';
6
+
7
+ import { Capabilities, contributes, createSurface } from '@dxos/app-framework';
8
+
9
+ import { SHORTCUTS_DIALOG, ShortcutsDialogContent, ShortcutsHints, ShortcutsList } from '../components';
10
+ import { HELP_PLUGIN } from '../meta';
11
+
12
+ export default () =>
13
+ contributes(Capabilities.ReactSurface, [
14
+ createSurface({
15
+ id: `${HELP_PLUGIN}/hints`,
16
+ role: 'hints',
17
+ component: () => <ShortcutsHints />,
18
+ }),
19
+ createSurface({
20
+ id: `${HELP_PLUGIN}/keyshortcuts`,
21
+ role: 'keyshortcuts',
22
+ component: () => <ShortcutsList />,
23
+ }),
24
+ createSurface({
25
+ id: SHORTCUTS_DIALOG,
26
+ role: 'dialog',
27
+ filter: (data): data is any => data.component === SHORTCUTS_DIALOG,
28
+ component: () => <ShortcutsDialogContent />,
29
+ }),
30
+ ]);
@@ -0,0 +1,23 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { contributes } from '@dxos/app-framework';
6
+ import { LocalStorageStore } from '@dxos/local-storage';
7
+
8
+ import { HelpCapabilities } from './capabilities';
9
+ import { HELP_PLUGIN } from '../meta';
10
+
11
+ export default () => {
12
+ const state = new LocalStorageStore<HelpCapabilities.State>(HELP_PLUGIN, {
13
+ running: false,
14
+ showHints: true,
15
+ showWelcome: true,
16
+ });
17
+
18
+ state
19
+ .prop({ key: 'showHints', type: LocalStorageStore.bool() })
20
+ .prop({ key: 'showWelcome', type: LocalStorageStore.bool() });
21
+
22
+ return contributes(HelpCapabilities.State, state.values);
23
+ };
@@ -12,7 +12,7 @@ import { faker } from '@dxos/random';
12
12
  import { Button } from '@dxos/react-ui';
13
13
  import { withTheme } from '@dxos/storybook-utils';
14
14
 
15
- import { HelpContextProvider, type HelpContextProviderProps } from './HelpContextProvider';
15
+ import { WelcomeTour, type WelcomeTourProps } from './WelcomeTour';
16
16
  import { useHelp } from '../../hooks';
17
17
 
18
18
  const App = () => {
@@ -57,18 +57,19 @@ const App = () => {
57
57
  );
58
58
  };
59
59
 
60
- const DefaultStory = ({ steps = [] }: HelpContextProviderProps) => (
61
- <HelpContextProvider steps={steps}>
60
+ const DefaultStory = ({ steps = [] }: WelcomeTourProps) => (
61
+ <>
62
+ <WelcomeTour steps={steps} />
62
63
  <div className='fixed inset-0 overflow-hidden'>
63
64
  <App />
64
65
  </div>
65
- </HelpContextProvider>
66
+ </>
66
67
  );
67
68
 
68
69
  // TODO(burdon): Tour should prompt user to create a Stack -- and respond to it being created.
69
70
  // Use beacon to simulate click.
70
71
 
71
- export const Default: StoryObj<typeof HelpContextProvider> = {
72
+ export const Default: StoryObj<typeof WelcomeTour> = {
72
73
  args: {
73
74
  // https://docs.react-joyride.com/step#options
74
75
  steps: [
@@ -103,9 +104,9 @@ export const Default: StoryObj<typeof HelpContextProvider> = {
103
104
  /**
104
105
  * IMPORTANT: Run in separate tab.
105
106
  */
106
- const meta: Meta<typeof HelpContextProvider> = {
107
- title: 'plugins/plugin-help/Joyride',
108
- component: HelpContextProvider,
107
+ const meta: Meta<typeof WelcomeTour> = {
108
+ title: 'plugins/plugin-help/WelcomeTour',
109
+ component: WelcomeTour,
109
110
  render: DefaultStory,
110
111
  decorators: [withTheme],
111
112
  };
@@ -2,10 +2,10 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import React, { type PropsWithChildren, useState, useEffect } from 'react';
5
+ import React, { useState, useEffect } from 'react';
6
6
  import Joyride, { ACTIONS, EVENTS } from 'react-joyride';
7
7
 
8
- import { usePlugins, resolvePlugin, parseLayoutPlugin } from '@dxos/app-framework';
8
+ import { usePluginManager, useLayout } from '@dxos/app-framework';
9
9
 
10
10
  import { type Step, HelpContext } from '../../types';
11
11
  import { floaterProps, Tooltip } from '../Tooltip';
@@ -57,30 +57,25 @@ const waitForTarget = async (step: Step) => {
57
57
  }
58
58
  };
59
59
 
60
- export type HelpContextProviderProps = PropsWithChildren<{
60
+ export type WelcomeTourProps = {
61
61
  steps: Step[];
62
62
  running?: boolean;
63
63
  onRunningChanged?: (state: boolean) => any;
64
- }>;
65
-
66
- export const HelpContextProvider = ({
67
- children,
68
- steps: initialSteps,
69
- running: runningProp,
70
- onRunningChanged,
71
- }: HelpContextProviderProps) => {
72
- const { plugins } = usePlugins();
73
- const layoutPlugin = resolvePlugin(plugins, parseLayoutPlugin);
64
+ };
65
+
66
+ export const WelcomeTour = ({ steps: initialSteps, running: runningProp, onRunningChanged }: WelcomeTourProps) => {
67
+ const manager = usePluginManager();
68
+ const layout = useLayout();
74
69
  const [running, setRunning] = useState(!!runningProp && !!getTarget(initialSteps[0]));
75
70
  const [stepIndex, _setStepIndex] = useState(0);
76
71
  const [steps, setSteps] = useState(initialSteps);
77
72
 
78
- const paused = layoutPlugin?.provides.layout.dialogOpen;
73
+ const paused = layout.dialogOpen;
79
74
 
80
75
  const setStepIndex = (index: number) => {
81
76
  if (runningProp) {
82
77
  const step = steps[index];
83
- step?.before?.({ plugins, step });
78
+ step?.before?.(manager.context);
84
79
  }
85
80
  _setStepIndex(index);
86
81
  };
@@ -170,7 +165,6 @@ export const HelpContextProvider = ({
170
165
  floaterProps={floaterProps}
171
166
  tooltipComponent={Tooltip}
172
167
  />
173
- {children}
174
168
  </HelpContext.Provider>
175
169
  );
176
170
  };
@@ -0,0 +1,5 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ export * from './WelcomeTour';
@@ -2,6 +2,6 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- export * from './HelpContextProvider';
6
5
  export * from './Shortcuts';
7
6
  export * from './Tooltip';
7
+ export * from './WelcomeTour';
package/src/index.ts CHANGED
@@ -2,14 +2,9 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { HelpPlugin } from './HelpPlugin';
6
- import { type Step } from './types';
7
-
8
- export type { Step };
9
-
5
+ export { HelpCapabilities } from './capabilities';
10
6
  export * from './components';
11
- export * from './hooks';
12
-
7
+ export * from './meta';
13
8
  export * from './HelpPlugin';
14
-
15
- export default HelpPlugin;
9
+ export * from './hooks';
10
+ export * from './types';
package/src/meta.ts CHANGED
@@ -7,7 +7,7 @@ import { type PluginMeta } from '@dxos/app-framework';
7
7
  // TODO(burdon): Rename Guide? Help?
8
8
  export const HELP_PLUGIN = 'dxos.org/plugin/help';
9
9
 
10
- export default {
10
+ export const meta = {
11
11
  id: HELP_PLUGIN,
12
12
  name: 'Help',
13
13
  icon: 'ph--info--regular',
package/src/types.ts CHANGED
@@ -5,19 +5,13 @@
5
5
  import { type Context, createContext } from 'react';
6
6
  import { type Step as BaseStep } from 'react-joyride';
7
7
 
8
- import {
9
- type Plugin,
10
- type GraphBuilderProvides,
11
- type IntentResolverProvides,
12
- type SurfaceProvides,
13
- type TranslationsProvides,
14
- } from '@dxos/app-framework';
8
+ import { type PluginsContext } from '@dxos/app-framework';
15
9
  import { S } from '@dxos/echo-schema';
16
10
 
17
11
  import { HELP_PLUGIN } from './meta';
18
12
 
19
13
  export type Step = BaseStep & {
20
- before?: (context: { plugins: Plugin[]; step: Step }) => void;
14
+ before?: (context: PluginsContext) => void;
21
15
  };
22
16
 
23
17
  export type HelpContextType = {
@@ -38,8 +32,6 @@ export const HelpContext: Context<HelpContextType> = createContext<HelpContextTy
38
32
  stop: () => {},
39
33
  });
40
34
 
41
- export type HelpPluginProvides = GraphBuilderProvides & IntentResolverProvides & SurfaceProvides & TranslationsProvides;
42
-
43
35
  export const HELP_ACTION = `${HELP_PLUGIN}/action`;
44
36
  export namespace HelpAction {
45
37
  export class Start extends S.TaggedClass<Start>()(`${HELP_ACTION}/start`, {
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/types.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Context, createContext } from 'react';\nimport { type Step as BaseStep } from 'react-joyride';\n\nimport {\n type Plugin,\n type GraphBuilderProvides,\n type IntentResolverProvides,\n type SurfaceProvides,\n type TranslationsProvides,\n} from '@dxos/app-framework';\nimport { S } from '@dxos/echo-schema';\n\nimport { HELP_PLUGIN } from './meta';\n\nexport type Step = BaseStep & {\n before?: (context: { plugins: Plugin[]; step: Step }) => void;\n};\n\nexport type HelpContextType = {\n running: boolean;\n steps: Step[];\n setSteps: (steps: Step[]) => void;\n setIndex: (index: number) => void;\n start: () => void;\n stop: () => void;\n};\n\nexport const HelpContext: Context<HelpContextType> = createContext<HelpContextType>({\n running: false,\n steps: [],\n setSteps: () => {},\n setIndex: () => {},\n start: () => {},\n stop: () => {},\n});\n\nexport type HelpPluginProvides = GraphBuilderProvides & IntentResolverProvides & SurfaceProvides & TranslationsProvides;\n\nexport const HELP_ACTION = `${HELP_PLUGIN}/action`;\nexport namespace HelpAction {\n export class Start extends S.TaggedClass<Start>()(`${HELP_ACTION}/start`, {\n input: S.Void,\n output: S.Void,\n }) {}\n}\n"],
5
- "mappings": ";;;;;AAIA,SAAuBA,qBAAqB;AAU5C,SAASC,SAAS;AAiBX,IAAMC,cAAwCC,cAA+B;EAClFC,SAAS;EACTC,OAAO,CAAA;EACPC,UAAU,MAAA;EAAO;EACjBC,UAAU,MAAA;EAAO;EACjBC,OAAO,MAAA;EAAO;EACdC,MAAM,MAAA;EAAO;AACf,CAAA;AAIO,IAAMC,cAAc,GAAGC,WAAAA;;UACbC,aAAAA;EACR,MAAMC,cAAcC,EAAEC,YAAW,EAAU,GAAGL,WAAAA,UAAqB;IACxEM,OAAOF,EAAEG;IACTC,QAAQJ,EAAEG;EACZ,CAAA,EAAA;EAAI;cAHSJ,QAAAA;AAIf,GALiBD,eAAAA,aAAAA,CAAAA,EAAAA;",
6
- "names": ["createContext", "S", "HelpContext", "createContext", "running", "steps", "setSteps", "setIndex", "start", "stop", "HELP_ACTION", "HELP_PLUGIN", "HelpAction", "Start", "S", "TaggedClass", "input", "Void", "output"]
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/meta.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\n// TODO(burdon): Rename Guide? Help?\nexport const HELP_PLUGIN = 'dxos.org/plugin/help';\n\nexport default {\n id: HELP_PLUGIN,\n name: 'Help',\n icon: 'ph--info--regular',\n} satisfies PluginMeta;\n"],
5
- "mappings": ";AAOO,IAAMA,cAAc;AAE3B,IAAA,eAAe;EACbC,IAAID;EACJE,MAAM;EACNC,MAAM;AACR;",
6
- "names": ["HELP_PLUGIN", "id", "name", "icon"]
7
- }