@dxos/plugin-help 0.8.4-main.ae835ea → 0.8.4-main.bc674ce

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 (113) hide show
  1. package/dist/lib/browser/app-graph-builder-DX3VXARQ.mjs +79 -0
  2. package/dist/lib/browser/app-graph-builder-DX3VXARQ.mjs.map +7 -0
  3. package/dist/lib/browser/{chunk-BCYK4LXW.mjs → chunk-IM2QVQOH.mjs} +1 -1
  4. package/dist/lib/browser/chunk-IM2QVQOH.mjs.map +7 -0
  5. package/dist/lib/browser/chunk-TS66J4C6.mjs +58 -0
  6. package/dist/lib/browser/chunk-TS66J4C6.mjs.map +7 -0
  7. package/dist/lib/browser/chunk-W5XAZM46.mjs +360 -0
  8. package/dist/lib/browser/chunk-W5XAZM46.mjs.map +7 -0
  9. package/dist/lib/browser/index.mjs +58 -55
  10. package/dist/lib/browser/index.mjs.map +4 -4
  11. package/dist/lib/browser/meta.json +1 -1
  12. package/dist/lib/browser/meta.mjs +1 -1
  13. package/dist/lib/browser/react-root-SZRF6EXG.mjs +43 -0
  14. package/dist/lib/browser/react-root-SZRF6EXG.mjs.map +7 -0
  15. package/dist/lib/browser/{react-surface-K3QAYZIQ.mjs → react-surface-DWNTJBVM.mjs} +12 -11
  16. package/dist/lib/browser/react-surface-DWNTJBVM.mjs.map +7 -0
  17. package/dist/lib/browser/state-VRPLKT3F.mjs +27 -0
  18. package/dist/lib/browser/state-VRPLKT3F.mjs.map +7 -0
  19. package/dist/lib/browser/types/index.mjs +8 -6
  20. package/dist/types/src/HelpPlugin.d.ts +2 -1
  21. package/dist/types/src/HelpPlugin.d.ts.map +1 -1
  22. package/dist/types/src/capabilities/app-graph-builder/app-graph-builder.d.ts +6 -0
  23. package/dist/types/src/capabilities/app-graph-builder/app-graph-builder.d.ts.map +1 -0
  24. package/dist/types/src/capabilities/app-graph-builder/index.d.ts +3 -0
  25. package/dist/types/src/capabilities/app-graph-builder/index.d.ts.map +1 -0
  26. package/dist/types/src/capabilities/index.d.ts +5 -8
  27. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  28. package/dist/types/src/capabilities/operation-resolver/index.d.ts +2 -0
  29. package/dist/types/src/capabilities/operation-resolver/index.d.ts.map +1 -0
  30. package/dist/types/src/capabilities/operation-resolver/operation-resolver.d.ts +5 -0
  31. package/dist/types/src/capabilities/operation-resolver/operation-resolver.d.ts.map +1 -0
  32. package/dist/types/src/capabilities/react-root/index.d.ts +6 -0
  33. package/dist/types/src/capabilities/react-root/index.d.ts.map +1 -0
  34. package/dist/types/src/capabilities/react-root/react-root.d.ts +10 -0
  35. package/dist/types/src/capabilities/react-root/react-root.d.ts.map +1 -0
  36. package/dist/types/src/capabilities/react-surface/index.d.ts +3 -0
  37. package/dist/types/src/capabilities/react-surface/index.d.ts.map +1 -0
  38. package/dist/types/src/capabilities/react-surface/react-surface.d.ts +5 -0
  39. package/dist/types/src/capabilities/react-surface/react-surface.d.ts.map +1 -0
  40. package/dist/types/src/capabilities/state/index.d.ts +11 -0
  41. package/dist/types/src/capabilities/state/index.d.ts.map +1 -0
  42. package/dist/types/src/capabilities/state/state.d.ts +13 -0
  43. package/dist/types/src/capabilities/state/state.d.ts.map +1 -0
  44. package/dist/types/src/components/Shortcuts/ShortcutsDialog.d.ts.map +1 -1
  45. package/dist/types/src/components/Shortcuts/ShortcutsHints.d.ts.map +1 -1
  46. package/dist/types/src/components/Tooltip/Tooltip.d.ts.map +1 -1
  47. package/dist/types/src/components/WelcomeTour/WelcomeTour.stories.d.ts.map +1 -1
  48. package/dist/types/src/index.d.ts +1 -1
  49. package/dist/types/src/index.d.ts.map +1 -1
  50. package/dist/types/src/meta.d.ts +2 -2
  51. package/dist/types/src/meta.d.ts.map +1 -1
  52. package/dist/types/src/types/capabilities.d.ts +21 -0
  53. package/dist/types/src/types/capabilities.d.ts.map +1 -0
  54. package/dist/types/src/types/index.d.ts +1 -0
  55. package/dist/types/src/types/index.d.ts.map +1 -1
  56. package/dist/types/src/types/schema.d.ts +16 -12
  57. package/dist/types/src/types/schema.d.ts.map +1 -1
  58. package/dist/types/tsconfig.tsbuildinfo +1 -1
  59. package/package.json +38 -34
  60. package/src/HelpPlugin.tsx +16 -42
  61. package/src/capabilities/app-graph-builder/app-graph-builder.ts +61 -0
  62. package/src/capabilities/app-graph-builder/index.ts +7 -0
  63. package/src/capabilities/index.ts +5 -8
  64. package/src/capabilities/operation-resolver/index.ts +5 -0
  65. package/src/capabilities/operation-resolver/operation-resolver.ts +23 -0
  66. package/src/capabilities/react-root/index.ts +7 -0
  67. package/src/capabilities/react-root/react-root.tsx +36 -0
  68. package/src/capabilities/react-surface/index.ts +7 -0
  69. package/src/capabilities/react-surface/react-surface.tsx +34 -0
  70. package/src/capabilities/state/index.ts +7 -0
  71. package/src/capabilities/state/state.ts +27 -0
  72. package/src/components/Shortcuts/ShortcutsDialog.tsx +3 -6
  73. package/src/components/Shortcuts/ShortcutsHints.tsx +14 -6
  74. package/src/components/Shortcuts/ShortcutsList.tsx +1 -1
  75. package/src/components/Shortcuts/ShortcutsSection.tsx +1 -1
  76. package/src/components/Shortcuts/styles.ts +1 -1
  77. package/src/components/Tooltip/Tooltip.tsx +0 -1
  78. package/src/components/WelcomeTour/WelcomeTour.stories.tsx +12 -8
  79. package/src/components/WelcomeTour/WelcomeTour.tsx +2 -2
  80. package/src/index.ts +1 -1
  81. package/src/meta.ts +2 -2
  82. package/src/types/capabilities.ts +24 -0
  83. package/src/types/index.ts +1 -0
  84. package/src/types/schema.ts +11 -7
  85. package/dist/lib/browser/app-graph-builder-V35EXVG5.mjs +0 -80
  86. package/dist/lib/browser/app-graph-builder-V35EXVG5.mjs.map +0 -7
  87. package/dist/lib/browser/chunk-AZJJLAG7.mjs +0 -16
  88. package/dist/lib/browser/chunk-AZJJLAG7.mjs.map +0 -7
  89. package/dist/lib/browser/chunk-BCYK4LXW.mjs.map +0 -7
  90. package/dist/lib/browser/chunk-I7FKM6VC.mjs +0 -34
  91. package/dist/lib/browser/chunk-I7FKM6VC.mjs.map +0 -7
  92. package/dist/lib/browser/chunk-RGVUINGG.mjs +0 -407
  93. package/dist/lib/browser/chunk-RGVUINGG.mjs.map +0 -7
  94. package/dist/lib/browser/react-root-7LMCJR73.mjs +0 -34
  95. package/dist/lib/browser/react-root-7LMCJR73.mjs.map +0 -7
  96. package/dist/lib/browser/react-surface-K3QAYZIQ.mjs.map +0 -7
  97. package/dist/lib/browser/state-5PVJCYWJ.mjs +0 -29
  98. package/dist/lib/browser/state-5PVJCYWJ.mjs.map +0 -7
  99. package/dist/types/src/capabilities/app-graph-builder.d.ts +0 -4
  100. package/dist/types/src/capabilities/app-graph-builder.d.ts.map +0 -1
  101. package/dist/types/src/capabilities/capabilities.d.ts +0 -10
  102. package/dist/types/src/capabilities/capabilities.d.ts.map +0 -1
  103. package/dist/types/src/capabilities/react-root.d.ts +0 -8
  104. package/dist/types/src/capabilities/react-root.d.ts.map +0 -1
  105. package/dist/types/src/capabilities/react-surface.d.ts +0 -4
  106. package/dist/types/src/capabilities/react-surface.d.ts.map +0 -1
  107. package/dist/types/src/capabilities/state.d.ts +0 -4
  108. package/dist/types/src/capabilities/state.d.ts.map +0 -1
  109. package/src/capabilities/app-graph-builder.ts +0 -78
  110. package/src/capabilities/capabilities.ts +0 -13
  111. package/src/capabilities/react-root.tsx +0 -33
  112. package/src/capabilities/react-surface.tsx +0 -30
  113. package/src/capabilities/state.ts +0 -24
package/package.json CHANGED
@@ -1,9 +1,13 @@
1
1
  {
2
2
  "name": "@dxos/plugin-help",
3
- "version": "0.8.4-main.ae835ea",
3
+ "version": "0.8.4-main.bc674ce",
4
4
  "description": "Help plugin.",
5
5
  "homepage": "https://dxos.org",
6
6
  "bugs": "https://github.com/dxos/dxos/issues",
7
+ "repository": {
8
+ "type": "git",
9
+ "url": "https://github.com/dxos/dxos"
10
+ },
7
11
  "license": "MIT",
8
12
  "author": "DXOS.org",
9
13
  "sideEffects": true,
@@ -41,47 +45,47 @@
41
45
  "src"
42
46
  ],
43
47
  "dependencies": {
44
- "@fluentui/react-tabster": "^9.24.2",
45
- "@preact-signals/safe-react": "^0.9.0",
48
+ "@effect-atom/atom": "^0.4.13",
49
+ "@fluentui/react-tabster": "9.26.11",
46
50
  "react-joyride": "^2.7.2",
47
- "@dxos/app-framework": "0.8.4-main.ae835ea",
48
- "@dxos/debug": "0.8.4-main.ae835ea",
49
- "@dxos/app-graph": "0.8.4-main.ae835ea",
50
- "@dxos/echo": "0.8.4-main.ae835ea",
51
- "@dxos/live-object": "0.8.4-main.ae835ea",
52
- "@dxos/local-storage": "0.8.4-main.ae835ea",
53
- "@dxos/plugin-client": "0.8.4-main.ae835ea",
54
- "@dxos/plugin-graph": "0.8.4-main.ae835ea",
55
- "@dxos/keyboard": "0.8.4-main.ae835ea",
56
- "@dxos/plugin-space": "0.8.4-main.ae835ea",
57
- "@dxos/react-client": "0.8.4-main.ae835ea",
58
- "@dxos/util": "0.8.4-main.ae835ea"
51
+ "@dxos/app-framework": "0.8.4-main.bc674ce",
52
+ "@dxos/app-graph": "0.8.4-main.bc674ce",
53
+ "@dxos/debug": "0.8.4-main.bc674ce",
54
+ "@dxos/echo": "0.8.4-main.bc674ce",
55
+ "@dxos/effect": "0.8.4-main.bc674ce",
56
+ "@dxos/plugin-client": "0.8.4-main.bc674ce",
57
+ "@dxos/operation": "0.8.4-main.bc674ce",
58
+ "@dxos/plugin-graph": "0.8.4-main.bc674ce",
59
+ "@dxos/keyboard": "0.8.4-main.bc674ce",
60
+ "@dxos/plugin-space": "0.8.4-main.bc674ce",
61
+ "@dxos/util": "0.8.4-main.bc674ce",
62
+ "@dxos/react-client": "0.8.4-main.bc674ce"
59
63
  },
60
64
  "devDependencies": {
61
- "@effect-rx/rx-react": "0.42.4",
62
- "@effect/platform": "0.92.1",
63
- "@types/react": "~19.2.2",
64
- "@types/react-dom": "~19.2.2",
65
- "effect": "3.18.3",
66
- "react": "~19.2.0",
67
- "react-dom": "~19.2.0",
65
+ "@effect-atom/atom-react": "^0.4.6",
66
+ "@effect/platform": "0.93.6",
67
+ "@types/react": "~19.2.7",
68
+ "@types/react-dom": "~19.2.3",
69
+ "effect": "3.19.11",
70
+ "react": "~19.2.3",
71
+ "react-dom": "~19.2.3",
68
72
  "react-floater": "0.7.9",
69
73
  "type-fest": "4.10.1",
70
74
  "vite": "7.1.9",
71
- "@dxos/plugin-storybook-layout": "0.8.4-main.ae835ea",
72
- "@dxos/random": "0.8.4-main.ae835ea",
73
- "@dxos/react-ui": "0.8.4-main.ae835ea",
74
- "@dxos/react-ui-theme": "0.8.4-main.ae835ea",
75
- "@dxos/storybook-utils": "0.8.4-main.ae835ea"
75
+ "@dxos/random": "0.8.4-main.bc674ce",
76
+ "@dxos/storybook-utils": "0.8.4-main.bc674ce",
77
+ "@dxos/plugin-testing": "0.8.4-main.bc674ce",
78
+ "@dxos/react-ui": "0.8.4-main.bc674ce",
79
+ "@dxos/ui-theme": "0.8.4-main.bc674ce"
76
80
  },
77
81
  "peerDependencies": {
78
- "@effect-rx/rx-react": "^0.34.1",
79
- "@effect/platform": "^0.80.12",
80
- "effect": "^3.13.3",
81
- "react": "^19.0.0",
82
- "react-dom": "^19.0.0",
83
- "@dxos/react-ui": "0.8.4-main.ae835ea",
84
- "@dxos/react-ui-theme": "0.8.4-main.ae835ea"
82
+ "@effect-atom/atom-react": "^0.4.6",
83
+ "@effect/platform": "0.93.6",
84
+ "effect": "3.19.11",
85
+ "react": "~19.2.3",
86
+ "react-dom": "~19.2.3",
87
+ "@dxos/react-ui": "0.8.4-main.bc674ce",
88
+ "@dxos/ui-theme": "0.8.4-main.bc674ce"
85
89
  },
86
90
  "publishConfig": {
87
91
  "access": "public"
@@ -2,54 +2,28 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { Capabilities, Events, contributes, createResolver, defineModule, definePlugin } from '@dxos/app-framework';
5
+ import { Common, Plugin } from '@dxos/app-framework';
6
6
 
7
- import { AppGraphBuilder, HelpCapabilities, HelpState, ReactRoot, ReactSurface } from './capabilities';
7
+ import { AppGraphBuilder, HelpState, OperationResolver, ReactRoot, ReactSurface } from './capabilities';
8
8
  import { meta } from './meta';
9
9
  import { translations } from './translations';
10
- import { HelpAction, type Step } from './types';
10
+ import { type Step } from './types';
11
11
 
12
12
  export type HelpPluginOptions = { steps?: Step[] };
13
13
 
14
- export const HelpPlugin = definePlugin<HelpPluginOptions>(meta, ({ steps = [] }) => [
15
- defineModule({
16
- id: `${meta.id}/module/state`,
17
- activatesOn: Events.Startup,
14
+ export const HelpPlugin = Plugin.define<HelpPluginOptions>(meta).pipe(
15
+ Plugin.addModule({
16
+ activatesOn: Common.ActivationEvent.Startup,
18
17
  activate: HelpState,
19
18
  }),
20
- defineModule({
21
- id: `${meta.id}/module/translations`,
22
- activatesOn: Events.SetupTranslations,
23
- activate: () => contributes(Capabilities.Translations, translations),
24
- }),
25
- defineModule({
26
- id: `${meta.id}/module/react-root`,
27
- activatesOn: Events.Startup,
19
+ Common.Plugin.addTranslationsModule({ translations }),
20
+ Plugin.addModule(({ steps = [] }) => ({
21
+ id: 'react-root',
22
+ activatesOn: Common.ActivationEvent.Startup,
28
23
  activate: () => ReactRoot(steps),
29
- }),
30
- defineModule({
31
- id: `${meta.id}/module/react-surface`,
32
- activatesOn: Events.SetupReactSurface,
33
- activate: ReactSurface,
34
- }),
35
- defineModule({
36
- id: `${meta.id}/module/intent-resolver`,
37
- activatesOn: Events.SetupIntentResolver,
38
- activate: (context) =>
39
- contributes(
40
- Capabilities.IntentResolver,
41
- createResolver({
42
- intent: HelpAction.Start,
43
- resolve: () => {
44
- const state = context.getCapability(HelpCapabilities.MutableState);
45
- state.running = true;
46
- },
47
- }),
48
- ),
49
- }),
50
- defineModule({
51
- id: `${meta.id}/module/app-graph-builder`,
52
- activatesOn: Events.SetupAppGraph,
53
- activate: AppGraphBuilder,
54
- }),
55
- ]);
24
+ })),
25
+ Common.Plugin.addSurfaceModule({ activate: ReactSurface }),
26
+ Common.Plugin.addOperationResolverModule({ activate: OperationResolver }),
27
+ Common.Plugin.addAppGraphModule({ activate: AppGraphBuilder }),
28
+ Plugin.make,
29
+ );
@@ -0,0 +1,61 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import * as Effect from 'effect/Effect';
6
+
7
+ import { Capability, Common } from '@dxos/app-framework';
8
+ import { GraphBuilder, NodeMatcher } from '@dxos/app-graph';
9
+ import { Operation } from '@dxos/operation';
10
+
11
+ import { SHORTCUTS_DIALOG } from '../../components';
12
+ import { meta } from '../../meta';
13
+ import { HelpCapabilities, HelpOperation } from '../../types';
14
+
15
+ export default Capability.makeModule(
16
+ Effect.fnUntraced(function* () {
17
+ const extensions = yield* GraphBuilder.createExtension({
18
+ id: meta.id,
19
+ match: NodeMatcher.whenRoot,
20
+ actions: () =>
21
+ Effect.succeed([
22
+ {
23
+ id: HelpOperation.Start.meta.key,
24
+ data: Effect.fnUntraced(function* () {
25
+ yield* Common.Capability.updateAtomValue(HelpCapabilities.State, (s) => ({ ...s, showHints: true }));
26
+ yield* Operation.invoke(HelpOperation.Start);
27
+ }),
28
+ properties: {
29
+ label: ['open help tour', { ns: meta.id }],
30
+ icon: 'ph--info--regular',
31
+ keyBinding: {
32
+ macos: 'shift+meta+/',
33
+ windows: 'shift+ctrl+/',
34
+ linux: 'shift+ctrl+?',
35
+ },
36
+ testId: 'helpPlugin.openHelp',
37
+ },
38
+ },
39
+ {
40
+ id: `${meta.id}/open-shortcuts`,
41
+ data: Effect.fnUntraced(function* () {
42
+ yield* Common.Capability.updateAtomValue(HelpCapabilities.State, (s) => ({ ...s, showHints: true }));
43
+ yield* Operation.invoke(Common.LayoutOperation.UpdateDialog, {
44
+ subject: SHORTCUTS_DIALOG,
45
+ blockAlign: 'center',
46
+ });
47
+ }),
48
+ properties: {
49
+ label: ['open shortcuts label', { ns: meta.id }],
50
+ icon: 'ph--keyboard--regular',
51
+ keyBinding: {
52
+ macos: 'meta+ctrl+/',
53
+ },
54
+ },
55
+ },
56
+ ]),
57
+ });
58
+
59
+ return Capability.contributes(Common.Capability.AppGraphBuilder, extensions);
60
+ }),
61
+ );
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Capability } from '@dxos/app-framework';
6
+
7
+ export const AppGraphBuilder = Capability.lazy('AppGraphBuilder', () => import('./app-graph-builder'));
@@ -2,11 +2,8 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
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';
5
+ export * from './app-graph-builder';
6
+ export * from './operation-resolver';
7
+ export * from './react-root';
8
+ export * from './react-surface';
9
+ export * from './state';
@@ -0,0 +1,5 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ export { default as OperationResolver } from './operation-resolver';
@@ -0,0 +1,23 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import * as Effect from 'effect/Effect';
6
+
7
+ import { Capability, Common } from '@dxos/app-framework';
8
+ import { OperationResolver } from '@dxos/operation';
9
+
10
+ import { HelpCapabilities, HelpOperation } from '../../types';
11
+
12
+ export default Capability.makeModule(
13
+ Effect.fnUntraced(function* () {
14
+ return Capability.contributes(Common.Capability.OperationResolver, [
15
+ OperationResolver.make({
16
+ operation: HelpOperation.Start,
17
+ handler: Effect.fnUntraced(function* () {
18
+ yield* Common.Capability.updateAtomValue(HelpCapabilities.State, (state) => ({ ...state, running: true }));
19
+ }),
20
+ }),
21
+ ]);
22
+ }),
23
+ );
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Capability } from '@dxos/app-framework';
6
+
7
+ export const ReactRoot = Capability.lazy('ReactRoot', () => import('./react-root'));
@@ -0,0 +1,36 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import * as Effect from 'effect/Effect';
6
+ import React from 'react';
7
+
8
+ import { Capability, Common } from '@dxos/app-framework';
9
+ import { useAtomCapabilityState } from '@dxos/app-framework/react';
10
+
11
+ import { WelcomeTour } from '../../components';
12
+ import { meta } from '../../meta';
13
+ import { HelpCapabilities, type Step } from '../../types';
14
+
15
+ export default Capability.makeModule(
16
+ Effect.fnUntraced(function* (steps?: Step[]) {
17
+ return Capability.contributes(Common.Capability.ReactRoot, {
18
+ id: meta.id,
19
+ root: () => {
20
+ const [state, updateState] = useAtomCapabilityState(HelpCapabilities.State);
21
+ return (
22
+ <WelcomeTour
23
+ steps={steps ?? []}
24
+ running={state.running}
25
+ onRunningChanged={(newState) => {
26
+ updateState((s) => ({ ...s, running: newState }));
27
+ if (!newState) {
28
+ updateState((s) => ({ ...s, showHints: false }));
29
+ }
30
+ }}
31
+ />
32
+ );
33
+ },
34
+ });
35
+ }),
36
+ );
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Capability } from '@dxos/app-framework';
6
+
7
+ export const ReactSurface = Capability.lazy('ReactSurface', () => import('./react-surface'));
@@ -0,0 +1,34 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import * as Effect from 'effect/Effect';
6
+ import React from 'react';
7
+
8
+ import { Capability, Common } from '@dxos/app-framework';
9
+
10
+ import { SHORTCUTS_DIALOG, ShortcutsDialogContent, ShortcutsHints, ShortcutsList } from '../../components';
11
+ import { meta } from '../../meta';
12
+
13
+ export default Capability.makeModule(() =>
14
+ Effect.succeed(
15
+ Capability.contributes(Common.Capability.ReactSurface, [
16
+ Common.createSurface({
17
+ id: `${meta.id}/hints`,
18
+ role: 'hints',
19
+ component: () => <ShortcutsHints />,
20
+ }),
21
+ Common.createSurface({
22
+ id: `${meta.id}/keyshortcuts`,
23
+ role: 'keyshortcuts',
24
+ component: () => <ShortcutsList />,
25
+ }),
26
+ Common.createSurface({
27
+ id: SHORTCUTS_DIALOG,
28
+ role: 'dialog',
29
+ filter: (data): data is { component: string } => data.component === SHORTCUTS_DIALOG,
30
+ component: () => <ShortcutsDialogContent />,
31
+ }),
32
+ ]),
33
+ ),
34
+ );
@@ -0,0 +1,7 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { Capability } from '@dxos/app-framework';
6
+
7
+ export const HelpState = Capability.lazy('HelpState', () => import('./state'));
@@ -0,0 +1,27 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import * as Effect from 'effect/Effect';
6
+
7
+ import { Capability } from '@dxos/app-framework';
8
+ import { createKvsStore } from '@dxos/effect';
9
+
10
+ import { meta } from '../../meta';
11
+ import { HelpCapabilities } from '../../types';
12
+
13
+ export default Capability.makeModule(() =>
14
+ Effect.sync(() => {
15
+ const stateAtom = createKvsStore({
16
+ key: meta.id,
17
+ schema: HelpCapabilities.StateSchema,
18
+ defaultValue: () => ({
19
+ running: false,
20
+ showHints: true,
21
+ showWelcome: true,
22
+ }),
23
+ });
24
+
25
+ return Capability.contributes(HelpCapabilities.State, stateAtom);
26
+ }),
27
+ );
@@ -4,7 +4,7 @@
4
4
 
5
5
  import React from 'react';
6
6
 
7
- import { Button, Dialog, Icon, useTranslation } from '@dxos/react-ui';
7
+ import { Dialog, IconButton, useTranslation } from '@dxos/react-ui';
8
8
 
9
9
  import { meta } from '../../meta';
10
10
 
@@ -16,14 +16,11 @@ export const ShortcutsDialogContent = () => {
16
16
  const { t } = useTranslation(meta.id);
17
17
 
18
18
  return (
19
- <Dialog.Content classNames='p-0 bs-content max-bs-full md:max-is-[25rem] overflow-hidden'>
19
+ <Dialog.Content>
20
20
  <div role='none' className='flex justify-between mbe-1 pbs-3 pis-2 pie-3 @md:pbs-4 @md:pis-4 @md:pie-5'>
21
21
  <Dialog.Title>{t('shortcuts dialog title')}</Dialog.Title>
22
-
23
22
  <Dialog.Close asChild>
24
- <Button density='fine' variant='ghost' autoFocus>
25
- <Icon icon='ph--x--bold' size={3} />
26
- </Button>
23
+ <IconButton icon='ph--x--bold' iconOnly size={3} label='Close' variant='ghost' autoFocus />
27
24
  </Dialog.Close>
28
25
  </div>
29
26
 
@@ -5,12 +5,13 @@
5
5
  import React from 'react';
6
6
 
7
7
  import { type KeyBinding, Keyboard } from '@dxos/keyboard';
8
- import { Button, Icon, toLocalizedString, useTranslation } from '@dxos/react-ui';
8
+ import { IconButton, toLocalizedString, useTranslation } from '@dxos/react-ui';
9
+ import { osTranslations } from '@dxos/ui-theme';
9
10
 
10
11
  import { Key } from './Key';
11
12
 
12
13
  const Shortcut = ({ binding }: { binding: KeyBinding }) => {
13
- const { t } = useTranslation('os');
14
+ const { t } = useTranslation(osTranslations);
14
15
  return (
15
16
  <div role='none' className='flex items-center gap-2 whitespace-nowrap'>
16
17
  <Key binding={binding.shortcut} />
@@ -26,14 +27,21 @@ export const ShortcutsHints = ({ onClose }: { onClose?: () => void }) => {
26
27
  const hints = bindings.filter((binding) => defaults.includes(binding.shortcut));
27
28
 
28
29
  return (
29
- <div role='none' className='flex overflow-hidden px-2 gap-4'>
30
+ <div role='none' className='flex overflow-hidden pli-2 gap-4'>
30
31
  {hints.map((binding) => (
31
32
  <Shortcut key={binding.shortcut} binding={binding} />
32
33
  ))}
33
34
  {onClose && (
34
- <Button variant='ghost' classNames='p-0 cursor-pointer' onClick={onClose}>
35
- <Icon icon='ph--x--regular' size={4} />
36
- </Button>
35
+ <IconButton
36
+ icon='ph--x--regular'
37
+ size={4}
38
+ label='Close'
39
+ iconOnly
40
+ noTooltip
41
+ variant='ghost'
42
+ classNames='p-0 cursor-pointer'
43
+ onClick={onClose}
44
+ />
37
45
  )}
38
46
  </div>
39
47
  );
@@ -6,7 +6,7 @@ import React, { Fragment } from 'react';
6
6
 
7
7
  import { Keyboard } from '@dxos/keyboard';
8
8
  import { toLocalizedString, useTranslation } from '@dxos/react-ui';
9
- import { mx } from '@dxos/react-ui-theme';
9
+ import { mx } from '@dxos/ui-theme';
10
10
 
11
11
  import { meta } from '../../meta';
12
12
 
@@ -4,7 +4,7 @@
4
4
 
5
5
  import React from 'react';
6
6
 
7
- import { descriptionText } from '@dxos/react-ui-theme';
7
+ import { descriptionText } from '@dxos/ui-theme';
8
8
 
9
9
  import { ShortcutsList } from './ShortcutsList';
10
10
 
@@ -2,7 +2,7 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { mx } from '@dxos/react-ui-theme';
5
+ import { mx } from '@dxos/ui-theme';
6
6
 
7
7
  export const shortcutKey = mx(
8
8
  'inline-flex min-is-[24px] bs-[24px] pli-0.5 justify-center items-center text-xs',
@@ -67,7 +67,6 @@ export const Tooltip = forwardRef<HTMLDivElement, TooltipRenderProps>(
67
67
  iconOnly
68
68
  label={backProps['aria-label']}
69
69
  onClick={backProps.onClick}
70
- size={5}
71
70
  variant='primary'
72
71
  data-testid='helpPlugin.tooltip.back'
73
72
  />
@@ -6,7 +6,7 @@ import { type Meta, type StoryObj } from '@storybook/react-vite';
6
6
  import React, { useState } from 'react';
7
7
 
8
8
  import { withPluginManager } from '@dxos/app-framework/testing';
9
- import { StorybookLayoutPlugin } from '@dxos/plugin-storybook-layout';
9
+ import { StorybookPlugin } from '@dxos/plugin-testing';
10
10
  import { faker } from '@dxos/random';
11
11
  import { Button, Icon } from '@dxos/react-ui';
12
12
  import { withTheme } from '@dxos/react-ui/testing';
@@ -23,8 +23,8 @@ const App = () => {
23
23
  };
24
24
 
25
25
  return (
26
- <div className='flex flex-col h-full p-4 space-y-8'>
27
- <div className='flex items-center gap-2 py-2'>
26
+ <div className='flex flex-col bs-full p-4 space-y-8'>
27
+ <div className='flex items-center gap-2 plb-2'>
28
28
  <Button data-joyride='basic/1' onClick={() => start()}>
29
29
  Start
30
30
  </Button>
@@ -32,7 +32,7 @@ const App = () => {
32
32
  <div>{String(running)}</div>
33
33
  </div>
34
34
  <div>
35
- <ul className='p-2 border border-blue-500 rounded-md' data-joyride='basic/2'>
35
+ <ul className='p-2 border border-primary-500 rounded-md' data-joyride='basic/2'>
36
36
  {items.map((item, i) => (
37
37
  <li key={i} className='flex items-center gap-2'>
38
38
  <Icon icon='ph--circle--regular' />
@@ -41,13 +41,13 @@ const App = () => {
41
41
  ))}
42
42
  </ul>
43
43
  </div>
44
- <div className='flex items-center gap-2 py-2'>
44
+ <div className='flex items-center gap-2 plb-2'>
45
45
  <Button data-joyride='basic/3' onClick={handleAdd}>
46
46
  Add
47
47
  </Button>
48
48
  </div>
49
49
  <div className='flex grow' />
50
- <div className='flex items-center py-2'>
50
+ <div className='flex items-center plb-2'>
51
51
  <div className='grow' />
52
52
  <Icon icon='ph--circle--regular' data-joyride='basic/4' />
53
53
  <Icon icon='ph--circle--regular' />
@@ -108,8 +108,12 @@ const meta = {
108
108
  title: 'plugins/plugin-help/WelcomeTour',
109
109
  component: WelcomeTour,
110
110
  render: DefaultStory,
111
- // TODO(wittjosiah): Try to write story which does not depend on plugin manager.
112
- decorators: [withTheme, withPluginManager({ plugins: [StorybookLayoutPlugin({})] })],
111
+ decorators: [
112
+ withTheme,
113
+ withPluginManager({
114
+ plugins: [StorybookPlugin({})],
115
+ }),
116
+ ],
113
117
  } satisfies Meta<typeof WelcomeTour>;
114
118
 
115
119
  export default meta;
@@ -5,7 +5,7 @@
5
5
  import React, { useState } from 'react';
6
6
  import Joyride, { ACTIONS, EVENTS } from 'react-joyride';
7
7
 
8
- import { useLayout, usePluginManager } from '@dxos/app-framework';
8
+ import { useLayout, usePluginManager } from '@dxos/app-framework/react';
9
9
  import { useAsyncEffect } from '@dxos/react-ui';
10
10
 
11
11
  import { HelpContext, type Step } from '../../types';
@@ -76,7 +76,7 @@ export const WelcomeTour = ({ steps: initialSteps, running: runningProp, onRunni
76
76
  const setStepIndex = (index: number) => {
77
77
  if (runningProp) {
78
78
  const step = steps[index];
79
- step?.before?.(manager.context);
79
+ step?.before?.(manager.capabilities);
80
80
  }
81
81
  _setStepIndex(index);
82
82
  };
package/src/index.ts CHANGED
@@ -2,7 +2,7 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- export { HelpCapabilities } from './capabilities';
5
+ export { HelpCapabilities } from './types';
6
6
  export * from './components';
7
7
  export * from './meta';
8
8
  export * from './HelpPlugin';
package/src/meta.ts CHANGED
@@ -2,10 +2,10 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { type PluginMeta } from '@dxos/app-framework';
5
+ import { type Plugin } from '@dxos/app-framework';
6
6
  import { trim } from '@dxos/util';
7
7
 
8
- export const meta: PluginMeta = {
8
+ export const meta: Plugin.Meta = {
9
9
  id: 'dxos.org/plugin/help',
10
10
  name: 'Help',
11
11
  description: trim`
@@ -0,0 +1,24 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ import { type Atom } from '@effect-atom/atom-react';
6
+ import * as Schema from 'effect/Schema';
7
+
8
+ import { Capability } from '@dxos/app-framework';
9
+
10
+ import { meta } from '../meta';
11
+
12
+ export namespace HelpCapabilities {
13
+ export const StateSchema = Schema.mutable(
14
+ Schema.Struct({
15
+ running: Schema.Boolean,
16
+ showHints: Schema.Boolean,
17
+ showWelcome: Schema.Boolean,
18
+ }),
19
+ );
20
+
21
+ export type State = Schema.Schema.Type<typeof StateSchema>;
22
+
23
+ export const State = Capability.make<Atom.Writable<State>>(`${meta.id}/capability/state`);
24
+ }