@dxos/plugin-help 0.8.4-main.1da679c → 0.8.4-main.21d9917

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 (116) 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-IM2QVQOH.mjs +16 -0
  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 -57
  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 -3
  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-75XTT4QZ.mjs → react-surface-DWNTJBVM.mjs} +15 -14
  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 +1 -1
  45. package/dist/types/src/components/Shortcuts/ShortcutsDialog.d.ts.map +1 -1
  46. package/dist/types/src/components/Shortcuts/ShortcutsHints.d.ts.map +1 -1
  47. package/dist/types/src/components/Tooltip/Tooltip.d.ts.map +1 -1
  48. package/dist/types/src/components/WelcomeTour/WelcomeTour.stories.d.ts +0 -1
  49. package/dist/types/src/components/WelcomeTour/WelcomeTour.stories.d.ts.map +1 -1
  50. package/dist/types/src/index.d.ts +1 -1
  51. package/dist/types/src/index.d.ts.map +1 -1
  52. package/dist/types/src/meta.d.ts +2 -3
  53. package/dist/types/src/meta.d.ts.map +1 -1
  54. package/dist/types/src/types/capabilities.d.ts +21 -0
  55. package/dist/types/src/types/capabilities.d.ts.map +1 -0
  56. package/dist/types/src/types/index.d.ts +1 -0
  57. package/dist/types/src/types/index.d.ts.map +1 -1
  58. package/dist/types/src/types/schema.d.ts +17 -13
  59. package/dist/types/src/types/schema.d.ts.map +1 -1
  60. package/dist/types/tsconfig.tsbuildinfo +1 -1
  61. package/package.json +39 -34
  62. package/src/HelpPlugin.tsx +19 -47
  63. package/src/capabilities/app-graph-builder/app-graph-builder.ts +61 -0
  64. package/src/capabilities/app-graph-builder/index.ts +7 -0
  65. package/src/capabilities/index.ts +5 -8
  66. package/src/capabilities/operation-resolver/index.ts +5 -0
  67. package/src/capabilities/operation-resolver/operation-resolver.ts +23 -0
  68. package/src/capabilities/react-root/index.ts +7 -0
  69. package/src/capabilities/react-root/react-root.tsx +36 -0
  70. package/src/capabilities/react-surface/index.ts +7 -0
  71. package/src/capabilities/react-surface/react-surface.tsx +34 -0
  72. package/src/capabilities/state/index.ts +7 -0
  73. package/src/capabilities/state/state.ts +27 -0
  74. package/src/components/Shortcuts/ShortcutsDialog.tsx +6 -9
  75. package/src/components/Shortcuts/ShortcutsHints.tsx +14 -6
  76. package/src/components/Shortcuts/ShortcutsList.tsx +3 -3
  77. package/src/components/Shortcuts/ShortcutsSection.tsx +1 -1
  78. package/src/components/Shortcuts/styles.ts +1 -1
  79. package/src/components/Tooltip/Tooltip.tsx +0 -1
  80. package/src/components/WelcomeTour/WelcomeTour.stories.tsx +14 -9
  81. package/src/components/WelcomeTour/WelcomeTour.tsx +2 -2
  82. package/src/index.ts +1 -1
  83. package/src/meta.ts +8 -6
  84. package/src/types/capabilities.ts +24 -0
  85. package/src/types/index.ts +1 -0
  86. package/src/types/schema.ts +12 -8
  87. package/dist/lib/browser/app-graph-builder-DB3PXQVE.mjs +0 -79
  88. package/dist/lib/browser/app-graph-builder-DB3PXQVE.mjs.map +0 -7
  89. package/dist/lib/browser/chunk-3Y4CMOZP.mjs +0 -13
  90. package/dist/lib/browser/chunk-3Y4CMOZP.mjs.map +0 -7
  91. package/dist/lib/browser/chunk-4CVVSQQC.mjs +0 -407
  92. package/dist/lib/browser/chunk-4CVVSQQC.mjs.map +0 -7
  93. package/dist/lib/browser/chunk-J2SJSGSX.mjs +0 -34
  94. package/dist/lib/browser/chunk-J2SJSGSX.mjs.map +0 -7
  95. package/dist/lib/browser/chunk-LDRUZNSN.mjs +0 -16
  96. package/dist/lib/browser/chunk-LDRUZNSN.mjs.map +0 -7
  97. package/dist/lib/browser/react-root-3KNEZQPN.mjs +0 -34
  98. package/dist/lib/browser/react-root-3KNEZQPN.mjs.map +0 -7
  99. package/dist/lib/browser/react-surface-75XTT4QZ.mjs.map +0 -7
  100. package/dist/lib/browser/state-54VZ6MVS.mjs +0 -29
  101. package/dist/lib/browser/state-54VZ6MVS.mjs.map +0 -7
  102. package/dist/types/src/capabilities/app-graph-builder.d.ts +0 -4
  103. package/dist/types/src/capabilities/app-graph-builder.d.ts.map +0 -1
  104. package/dist/types/src/capabilities/capabilities.d.ts +0 -10
  105. package/dist/types/src/capabilities/capabilities.d.ts.map +0 -1
  106. package/dist/types/src/capabilities/react-root.d.ts +0 -8
  107. package/dist/types/src/capabilities/react-root.d.ts.map +0 -1
  108. package/dist/types/src/capabilities/react-surface.d.ts +0 -4
  109. package/dist/types/src/capabilities/react-surface.d.ts.map +0 -1
  110. package/dist/types/src/capabilities/state.d.ts +0 -4
  111. package/dist/types/src/capabilities/state.d.ts.map +0 -1
  112. package/src/capabilities/app-graph-builder.ts +0 -77
  113. package/src/capabilities/capabilities.ts +0 -13
  114. package/src/capabilities/react-root.tsx +0 -33
  115. package/src/capabilities/react-surface.tsx +0 -30
  116. package/src/capabilities/state.ts +0 -24
package/src/meta.ts CHANGED
@@ -2,13 +2,15 @@
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
+ import { trim } from '@dxos/util';
6
7
 
7
- // TODO(burdon): Rename Guide? Help?
8
- export const HELP_PLUGIN = 'dxos.org/plugin/help';
9
-
10
- export const meta: PluginMeta = {
11
- id: HELP_PLUGIN,
8
+ export const meta: Plugin.Meta = {
9
+ id: 'dxos.org/plugin/help',
12
10
  name: 'Help',
11
+ description: trim`
12
+ Built-in help system with documentation, tutorials, and contextual assistance.
13
+ Access keyboard shortcuts, feature guides, and support resources.
14
+ `,
13
15
  icon: 'ph--info--regular',
14
16
  };
@@ -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
+ }
@@ -2,4 +2,5 @@
2
2
  // Copyright 2025 DXOS.org
3
3
  //
4
4
 
5
+ export * from './capabilities';
5
6
  export * from './schema';
@@ -2,16 +2,17 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { Schema } from 'effect';
5
+ import * as Schema from 'effect/Schema';
6
6
  import { type Context, createContext } from 'react';
7
7
  import { type Step as BaseStep } from 'react-joyride';
8
8
 
9
- import { type PluginContext } from '@dxos/app-framework';
9
+ import { Capability, type CapabilityManager } from '@dxos/app-framework';
10
+ import { Operation } from '@dxos/operation';
10
11
 
11
12
  import { meta } from '../meta';
12
13
 
13
14
  export type Step = BaseStep & {
14
- before?: (context: PluginContext) => void;
15
+ before?: (capabilities: CapabilityManager.CapabilityManager) => void;
15
16
  };
16
17
 
17
18
  export type HelpContextType = {
@@ -32,9 +33,12 @@ export const HelpContext: Context<HelpContextType> = createContext<HelpContextTy
32
33
  stop: () => {},
33
34
  });
34
35
 
35
- export namespace HelpAction {
36
- export class Start extends Schema.TaggedClass<Start>()(`${meta.id}/action/start`, {
37
- input: Schema.Void,
38
- output: Schema.Void,
39
- }) {}
36
+ const HELP_OPERATION = `${meta.id}/operation`;
37
+
38
+ export namespace HelpOperation {
39
+ export const Start = Operation.make({
40
+ meta: { key: `${HELP_OPERATION}/start`, name: 'Start Help' },
41
+ services: [Capability.Service],
42
+ schema: { input: Schema.Void, output: Schema.Void },
43
+ });
40
44
  }
@@ -1,79 +0,0 @@
1
- import {
2
- SHORTCUTS_DIALOG
3
- } from "./chunk-4CVVSQQC.mjs";
4
- import {
5
- HelpAction
6
- } from "./chunk-J2SJSGSX.mjs";
7
- import {
8
- HelpCapabilities
9
- } from "./chunk-LDRUZNSN.mjs";
10
- import {
11
- HELP_PLUGIN
12
- } from "./chunk-3Y4CMOZP.mjs";
13
-
14
- // src/capabilities/app-graph-builder.ts
15
- import { Rx } from "@effect-rx/rx-react";
16
- import { Option, pipe } from "effect";
17
- import { Capabilities, LayoutAction, contributes, createIntent } from "@dxos/app-framework";
18
- import { createExtension } from "@dxos/app-graph";
19
- var app_graph_builder_default = ((context) => contributes(Capabilities.AppGraphBuilder, createExtension({
20
- id: HELP_PLUGIN,
21
- actions: (node) => Rx.make((get) => pipe(get(node), Option.flatMap((node2) => node2.id === "root" ? Option.some(node2) : Option.none()), Option.map(() => [
22
- {
23
- id: HelpAction.Start._tag,
24
- data: async () => {
25
- const { dispatchPromise: dispatch } = context.getCapability(Capabilities.IntentDispatcher);
26
- const state = context.getCapability(HelpCapabilities.MutableState);
27
- state.showHints = true;
28
- await dispatch(createIntent(HelpAction.Start));
29
- },
30
- properties: {
31
- label: [
32
- "open help tour",
33
- {
34
- ns: HELP_PLUGIN
35
- }
36
- ],
37
- icon: "ph--info--regular",
38
- keyBinding: {
39
- macos: "shift+meta+/",
40
- // TODO(wittjosiah): Test on windows to see if it behaves the same as linux.
41
- windows: "shift+ctrl+/",
42
- linux: "shift+ctrl+?"
43
- },
44
- testId: "helpPlugin.openHelp"
45
- }
46
- },
47
- {
48
- id: "dxos.org/plugin/help/open-shortcuts",
49
- data: async () => {
50
- const { dispatchPromise: dispatch } = context.getCapability(Capabilities.IntentDispatcher);
51
- const state = context.getCapability(HelpCapabilities.MutableState);
52
- state.showHints = true;
53
- await dispatch(createIntent(LayoutAction.UpdateDialog, {
54
- part: "dialog",
55
- subject: SHORTCUTS_DIALOG,
56
- options: {
57
- blockAlign: "center"
58
- }
59
- }));
60
- },
61
- properties: {
62
- label: [
63
- "open shortcuts label",
64
- {
65
- ns: HELP_PLUGIN
66
- }
67
- ],
68
- icon: "ph--keyboard--regular",
69
- keyBinding: {
70
- macos: "meta+ctrl+/"
71
- }
72
- }
73
- }
74
- ]), Option.getOrElse(() => [])))
75
- })));
76
- export {
77
- app_graph_builder_default as default
78
- };
79
- //# sourceMappingURL=app-graph-builder-DB3PXQVE.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/capabilities/app-graph-builder.ts"],
4
- "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Rx } from '@effect-rx/rx-react';\nimport { Option, pipe } from 'effect';\n\nimport { Capabilities, LayoutAction, type PluginContext, contributes, createIntent } from '@dxos/app-framework';\nimport { createExtension } from '@dxos/app-graph';\n\nimport { SHORTCUTS_DIALOG } from '../components';\nimport { HELP_PLUGIN } from '../meta';\nimport { HelpAction } from '../types';\n\nimport { HelpCapabilities } from './capabilities';\n\nexport default (context: PluginContext) =>\n contributes(\n Capabilities.AppGraphBuilder,\n createExtension({\n id: HELP_PLUGIN,\n actions: (node) =>\n Rx.make((get) =>\n pipe(\n get(node),\n Option.flatMap((node) => (node.id === 'root' ? Option.some(node) : Option.none())),\n Option.map(() => [\n {\n id: HelpAction.Start._tag,\n data: async () => {\n const { dispatchPromise: dispatch } = context.getCapability(Capabilities.IntentDispatcher);\n const state = context.getCapability(HelpCapabilities.MutableState);\n state.showHints = true;\n await dispatch(createIntent(HelpAction.Start));\n },\n properties: {\n label: ['open help tour', { ns: HELP_PLUGIN }],\n icon: 'ph--info--regular',\n keyBinding: {\n macos: 'shift+meta+/',\n // TODO(wittjosiah): Test on windows to see if it behaves the same as linux.\n windows: 'shift+ctrl+/',\n linux: 'shift+ctrl+?',\n },\n testId: 'helpPlugin.openHelp',\n },\n },\n {\n id: 'dxos.org/plugin/help/open-shortcuts',\n data: async () => {\n const { dispatchPromise: dispatch } = context.getCapability(Capabilities.IntentDispatcher);\n const state = context.getCapability(HelpCapabilities.MutableState);\n state.showHints = true;\n await dispatch(\n createIntent(LayoutAction.UpdateDialog, {\n part: 'dialog',\n subject: SHORTCUTS_DIALOG,\n options: {\n blockAlign: 'center',\n },\n }),\n );\n },\n properties: {\n label: ['open shortcuts label', { ns: HELP_PLUGIN }],\n icon: 'ph--keyboard--regular',\n keyBinding: {\n macos: 'meta+ctrl+/',\n },\n },\n },\n ]),\n Option.getOrElse(() => []),\n ),\n ),\n }),\n );\n"],
5
- "mappings": ";;;;;;;;;;;;;;AAIA,SAASA,UAAU;AACnB,SAASC,QAAQC,YAAY;AAE7B,SAASC,cAAcC,cAAkCC,aAAaC,oBAAoB;AAC1F,SAASC,uBAAuB;AAQhC,IAAA,6BAAe,CAACC,YACdC,YACEC,aAAaC,iBACbC,gBAAgB;EACdC,IAAIC;EACJC,SAAS,CAACC,SACRC,GAAGC,KAAK,CAACC,QACPC,KACED,IAAIH,IAAAA,GACJK,OAAOC,QAAQ,CAACN,UAAUA,MAAKH,OAAO,SAASQ,OAAOE,KAAKP,KAAAA,IAAQK,OAAOG,KAAI,CAAA,GAC9EH,OAAOI,IAAI,MAAM;IACf;MACEZ,IAAIa,WAAWC,MAAMC;MACrBC,MAAM,YAAA;AACJ,cAAM,EAAEC,iBAAiBC,SAAQ,IAAKvB,QAAQwB,cAActB,aAAauB,gBAAgB;AACzF,cAAMC,QAAQ1B,QAAQwB,cAAcG,iBAAiBC,YAAY;AACjEF,cAAMG,YAAY;AAClB,cAAMN,SAASO,aAAaZ,WAAWC,KAAK,CAAA;MAC9C;MACAY,YAAY;QACVC,OAAO;UAAC;UAAkB;YAAEC,IAAI3B;UAAY;;QAC5C4B,MAAM;QACNC,YAAY;UACVC,OAAO;;UAEPC,SAAS;UACTC,OAAO;QACT;QACAC,QAAQ;MACV;IACF;IACA;MACElC,IAAI;MACJgB,MAAM,YAAA;AACJ,cAAM,EAAEC,iBAAiBC,SAAQ,IAAKvB,QAAQwB,cAActB,aAAauB,gBAAgB;AACzF,cAAMC,QAAQ1B,QAAQwB,cAAcG,iBAAiBC,YAAY;AACjEF,cAAMG,YAAY;AAClB,cAAMN,SACJO,aAAaU,aAAaC,cAAc;UACtCC,MAAM;UACNC,SAASC;UACTC,SAAS;YACPC,YAAY;UACd;QACF,CAAA,CAAA;MAEJ;MACAf,YAAY;QACVC,OAAO;UAAC;UAAwB;YAAEC,IAAI3B;UAAY;;QAClD4B,MAAM;QACNC,YAAY;UACVC,OAAO;QACT;MACF;IACF;GACD,GACDvB,OAAOkC,UAAU,MAAM,CAAA,CAAE,CAAA,CAAA;AAGjC,CAAA,CAAA;",
6
- "names": ["Rx", "Option", "pipe", "Capabilities", "LayoutAction", "contributes", "createIntent", "createExtension", "context", "contributes", "Capabilities", "AppGraphBuilder", "createExtension", "id", "HELP_PLUGIN", "actions", "node", "Rx", "make", "get", "pipe", "Option", "flatMap", "some", "none", "map", "HelpAction", "Start", "_tag", "data", "dispatchPromise", "dispatch", "getCapability", "IntentDispatcher", "state", "HelpCapabilities", "MutableState", "showHints", "createIntent", "properties", "label", "ns", "icon", "keyBinding", "macos", "windows", "linux", "testId", "LayoutAction", "UpdateDialog", "part", "subject", "SHORTCUTS_DIALOG", "options", "blockAlign", "getOrElse"]
7
- }
@@ -1,13 +0,0 @@
1
- // src/meta.ts
2
- var HELP_PLUGIN = "dxos.org/plugin/help";
3
- var meta = {
4
- id: HELP_PLUGIN,
5
- name: "Help",
6
- icon: "ph--info--regular"
7
- };
8
-
9
- export {
10
- HELP_PLUGIN,
11
- meta
12
- };
13
- //# sourceMappingURL=chunk-3Y4CMOZP.mjs.map
@@ -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 const meta: PluginMeta = {\n id: HELP_PLUGIN,\n name: 'Help',\n icon: 'ph--info--regular',\n};\n"],
5
- "mappings": ";AAOO,IAAMA,cAAc;AAEpB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;EACNC,MAAM;AACR;",
6
- "names": ["HELP_PLUGIN", "meta", "id", "name", "icon"]
7
- }
@@ -1,407 +0,0 @@
1
- import {
2
- HelpContext
3
- } from "./chunk-J2SJSGSX.mjs";
4
- import {
5
- HELP_PLUGIN
6
- } from "./chunk-3Y4CMOZP.mjs";
7
-
8
- // src/components/Shortcuts/Key.tsx
9
- import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
10
- import React from "react";
11
- import { keySymbols } from "@dxos/keyboard";
12
-
13
- // src/components/Shortcuts/styles.ts
14
- import { mx } from "@dxos/react-ui-theme";
15
- var shortcutKey = mx("inline-flex min-is-[24px] bs-[24px] pli-0.5 justify-center items-center text-xs", "rounded bg-neutral-100 dark:bg-neutral-900");
16
-
17
- // src/components/Shortcuts/Key.tsx
18
- var Key = ({ binding }) => {
19
- var _effect = _useSignals();
20
- try {
21
- return /* @__PURE__ */ React.createElement("span", {
22
- role: "term",
23
- className: "inline-flex gap-1",
24
- "aria-label": binding,
25
- id: binding
26
- }, keySymbols(binding).map((c, i) => /* @__PURE__ */ React.createElement("span", {
27
- key: i,
28
- className: shortcutKey
29
- }, c)));
30
- } finally {
31
- _effect.f();
32
- }
33
- };
34
-
35
- // src/components/Shortcuts/ShortcutsList.tsx
36
- import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
37
- import React2, { Fragment } from "react";
38
- import { Keyboard } from "@dxos/keyboard";
39
- import { toLocalizedString, useTranslation } from "@dxos/react-ui";
40
- import { mx as mx2 } from "@dxos/react-ui-theme";
41
- var ShortcutsList = () => {
42
- var _effect = _useSignals2();
43
- try {
44
- const { t } = useTranslation(HELP_PLUGIN);
45
- const bindings = Keyboard.singleton.getBindings();
46
- bindings.sort((a, b) => {
47
- return toLocalizedString(a.data, t)?.toLowerCase().localeCompare(toLocalizedString(b.data, t)?.toLowerCase());
48
- });
49
- return /* @__PURE__ */ React2.createElement("dl", {
50
- className: mx2("is-fit grid grid-cols-[min-content_minmax(12rem,1fr)] gap-2 mlb-4 text-subdued select-none")
51
- }, bindings.map((binding, i) => /* @__PURE__ */ React2.createElement(Fragment, {
52
- key: i
53
- }, /* @__PURE__ */ React2.createElement(Key, {
54
- binding: binding.shortcut
55
- }), /* @__PURE__ */ React2.createElement("span", {
56
- role: "definition",
57
- className: "mis-4",
58
- "aria-labelledby": binding.shortcut
59
- }, toLocalizedString(binding.data, t)))));
60
- } finally {
61
- _effect.f();
62
- }
63
- };
64
-
65
- // src/components/Shortcuts/ShortcutsDialog.tsx
66
- import { useSignals as _useSignals3 } from "@preact-signals/safe-react/tracking";
67
- import React3 from "react";
68
- import { Button, Dialog, Icon, useTranslation as useTranslation2 } from "@dxos/react-ui";
69
- var SHORTCUTS_DIALOG = `${HELP_PLUGIN}/ShortcutsDialog`;
70
- var ShortcutsDialogContent = () => {
71
- var _effect = _useSignals3();
72
- try {
73
- const { t } = useTranslation2(HELP_PLUGIN);
74
- return /* @__PURE__ */ React3.createElement(Dialog.Content, {
75
- classNames: "p-0 bs-content max-bs-full md:max-is-[25rem] overflow-hidden"
76
- }, /* @__PURE__ */ React3.createElement("div", {
77
- role: "none",
78
- className: "flex justify-between mbe-1 pbs-3 pis-2 pie-3 @md:pbs-4 @md:pis-4 @md:pie-5"
79
- }, /* @__PURE__ */ React3.createElement(Dialog.Title, null, t("shortcuts dialog title")), /* @__PURE__ */ React3.createElement(Dialog.Close, {
80
- asChild: true
81
- }, /* @__PURE__ */ React3.createElement(Button, {
82
- density: "fine",
83
- variant: "ghost",
84
- autoFocus: true
85
- }, /* @__PURE__ */ React3.createElement(Icon, {
86
- icon: "ph--x--bold",
87
- size: 3
88
- })))), /* @__PURE__ */ React3.createElement("div", {
89
- className: "flex items-center justify-center"
90
- }, /* @__PURE__ */ React3.createElement(ShortcutsList, null)));
91
- } finally {
92
- _effect.f();
93
- }
94
- };
95
-
96
- // src/components/Shortcuts/ShortcutsHints.tsx
97
- import { useSignals as _useSignals4 } from "@preact-signals/safe-react/tracking";
98
- import React4 from "react";
99
- import { Keyboard as Keyboard2 } from "@dxos/keyboard";
100
- import { Button as Button2, Icon as Icon2, toLocalizedString as toLocalizedString2, useTranslation as useTranslation3 } from "@dxos/react-ui";
101
- var Shortcut = ({ binding }) => {
102
- var _effect = _useSignals4();
103
- try {
104
- const { t } = useTranslation3("os");
105
- return /* @__PURE__ */ React4.createElement("div", {
106
- role: "none",
107
- className: "flex items-center gap-2 whitespace-nowrap"
108
- }, /* @__PURE__ */ React4.createElement(Key, {
109
- binding: binding.shortcut
110
- }), /* @__PURE__ */ React4.createElement("span", {
111
- className: "text-sm"
112
- }, toLocalizedString2(binding.data, t)));
113
- } finally {
114
- _effect.f();
115
- }
116
- };
117
- var ShortcutsHints = ({ onClose }) => {
118
- var _effect = _useSignals4();
119
- try {
120
- const defaults = [
121
- "meta+k",
122
- "meta+/",
123
- "meta+,"
124
- ];
125
- const bindings = Keyboard2.singleton.getBindings();
126
- const hints = bindings.filter((binding) => defaults.includes(binding.shortcut));
127
- return /* @__PURE__ */ React4.createElement("div", {
128
- role: "none",
129
- className: "flex overflow-hidden px-2 gap-4"
130
- }, hints.map((binding) => /* @__PURE__ */ React4.createElement(Shortcut, {
131
- key: binding.shortcut,
132
- binding
133
- })), onClose && /* @__PURE__ */ React4.createElement(Button2, {
134
- variant: "ghost",
135
- classNames: "p-0 cursor-pointer",
136
- onClick: onClose
137
- }, /* @__PURE__ */ React4.createElement(Icon2, {
138
- icon: "ph--x--regular",
139
- size: 4
140
- })));
141
- } finally {
142
- _effect.f();
143
- }
144
- };
145
-
146
- // src/components/Shortcuts/ShortcutsSection.tsx
147
- import { useSignals as _useSignals5 } from "@preact-signals/safe-react/tracking";
148
- import React5 from "react";
149
- import { descriptionText } from "@dxos/react-ui-theme";
150
- var ShortcutsSection = () => {
151
- var _effect = _useSignals5();
152
- try {
153
- return /* @__PURE__ */ React5.createElement("section", {
154
- className: descriptionText
155
- }, /* @__PURE__ */ React5.createElement(ShortcutsList, null));
156
- } finally {
157
- _effect.f();
158
- }
159
- };
160
-
161
- // src/components/Tooltip/Tooltip.tsx
162
- import { useSignals as _useSignals6 } from "@preact-signals/safe-react/tracking";
163
- import { useArrowNavigationGroup, useFocusableGroup } from "@fluentui/react-tabster";
164
- import React6, { forwardRef } from "react";
165
- import { Button as Button3, Icon as Icon3, IconButton } from "@dxos/react-ui";
166
- var floaterProps = {
167
- styles: {
168
- // Arrow color is set by joyride.
169
- arrow: {
170
- length: 8,
171
- spread: 16
172
- },
173
- floater: {
174
- // TODO(burdon): Get tokens from theme.
175
- filter: "drop-shadow(0 0 0.75rem rgba(0, 0, 0, 0.2))"
176
- }
177
- }
178
- };
179
- var Tooltip = /* @__PURE__ */ forwardRef(({ step: { title, content }, index, size, isLastStep, backProps, closeProps, primaryProps }, forwardedRef) => {
180
- var _effect = _useSignals6();
181
- try {
182
- const arrowNavigationAttrs = useArrowNavigationGroup({
183
- axis: "horizontal"
184
- });
185
- const focusableGroupAttrs = useFocusableGroup({
186
- tabBehavior: "limited-trap-focus"
187
- });
188
- return /* @__PURE__ */ React6.createElement("div", {
189
- className: "flex flex-col is-[15rem] min-bs-[10rem] overflow-hidden rounded-md shadow-xl bg-accentSurface text-accentSurfaceText",
190
- role: "tooltip",
191
- "data-testid": "helpPlugin.tooltip",
192
- "data-step": index + 1,
193
- ...focusableGroupAttrs,
194
- ref: forwardedRef
195
- }, /* @__PURE__ */ React6.createElement("div", {
196
- className: "flex p-2"
197
- }, /* @__PURE__ */ React6.createElement("h2", {
198
- className: "grow pli-2 plb-1 text-lg font-medium text-accentSurfaceText"
199
- }, title), /* @__PURE__ */ React6.createElement(IconButton, {
200
- density: "fine",
201
- icon: "ph--x--bold",
202
- iconOnly: true,
203
- label: closeProps["aria-label"],
204
- onClick: closeProps.onClick,
205
- size: 4,
206
- variant: "primary",
207
- "data-testid": "helpPlugin.tooltip.close"
208
- })), /* @__PURE__ */ React6.createElement("div", {
209
- className: "flex grow pli-4 mlb-2"
210
- }, content), /* @__PURE__ */ React6.createElement("div", {
211
- className: "flex p-2 items-center justify-between",
212
- ...arrowNavigationAttrs
213
- }, /* @__PURE__ */ React6.createElement(IconButton, {
214
- classNames: [
215
- !(index > 0 && backProps) && "invisible"
216
- ],
217
- icon: "ph--caret-left--regular",
218
- iconOnly: true,
219
- label: backProps["aria-label"],
220
- onClick: backProps.onClick,
221
- size: 5,
222
- variant: "primary",
223
- "data-testid": "helpPlugin.tooltip.back"
224
- }), /* @__PURE__ */ React6.createElement("div", {
225
- className: "flex grow gap-2 justify-center"
226
- }, /* @__PURE__ */ React6.createElement("div", {
227
- className: "flex"
228
- }, Array.from({
229
- length: size
230
- }).map((_, i) => /* @__PURE__ */ React6.createElement(Icon3, {
231
- key: i,
232
- icon: index === i ? "ph--circle--fill" : "ph--circle--regular",
233
- size: 2,
234
- classNames: "mli-1 cursor-pointer"
235
- })))), isLastStep ? /* @__PURE__ */ React6.createElement(Button3, {
236
- variant: "primary",
237
- onClick: closeProps.onClick,
238
- title: closeProps["aria-label"],
239
- autoFocus: true,
240
- "data-testid": "helpPlugin.tooltip.finish"
241
- }, "Done") : /* @__PURE__ */ React6.createElement(IconButton, {
242
- autoFocus: true,
243
- icon: "ph--caret-right--regular",
244
- iconOnly: true,
245
- label: primaryProps["aria-label"],
246
- onClick: primaryProps.onClick,
247
- size: 6,
248
- variant: "primary",
249
- "data-testid": "helpPlugin.tooltip.next"
250
- })));
251
- } finally {
252
- _effect.f();
253
- }
254
- });
255
-
256
- // src/components/WelcomeTour/WelcomeTour.tsx
257
- import { useSignals as _useSignals7 } from "@preact-signals/safe-react/tracking";
258
- import React7, { useState } from "react";
259
- import Joyride, { ACTIONS, EVENTS } from "react-joyride";
260
- import { useLayout, usePluginManager } from "@dxos/app-framework";
261
- import { useAsyncEffect } from "@dxos/react-ui";
262
- var addStepClass = (target) => {
263
- const element = typeof target === "string" ? document.querySelector(target) : target;
264
- if (element) {
265
- element.classList.add("joyride-target");
266
- }
267
- };
268
- var removeTargetClass = (target) => {
269
- const element = typeof target === "string" ? document.querySelector(target) : target;
270
- if (element) {
271
- element.classList.remove("joyride-target");
272
- }
273
- };
274
- var getTarget = (step) => {
275
- return typeof step.target === "string" ? document.querySelector(step.target) : step.target;
276
- };
277
- var waitForTarget = async (step) => {
278
- if (typeof step.target === "string") {
279
- const target = step.target;
280
- const element = document.querySelector(target);
281
- if (element) {
282
- return;
283
- }
284
- await new Promise((resolve) => {
285
- const observer = new MutationObserver((mutations) => {
286
- mutations.forEach((mutation) => {
287
- if (mutation.addedNodes.length > 0) {
288
- const element2 = document.querySelector(target);
289
- if (element2) {
290
- observer.disconnect();
291
- resolve();
292
- }
293
- }
294
- });
295
- });
296
- observer.observe(document.body, {
297
- childList: true,
298
- subtree: true
299
- });
300
- });
301
- }
302
- };
303
- var WelcomeTour = ({ steps: initialSteps, running: runningProp, onRunningChanged }) => {
304
- var _effect = _useSignals7();
305
- try {
306
- const manager = usePluginManager();
307
- const layout = useLayout();
308
- const [running, setRunning] = useState(!!runningProp && !!getTarget(initialSteps[0]));
309
- const [stepIndex, _setStepIndex] = useState(0);
310
- const [steps, setSteps] = useState(initialSteps);
311
- const paused = layout.dialogOpen;
312
- const setStepIndex = (index) => {
313
- if (runningProp) {
314
- const step = steps[index];
315
- step?.before?.(manager.context);
316
- }
317
- _setStepIndex(index);
318
- };
319
- const setRunningChanged = (state) => {
320
- if (typeof runningProp !== "undefined") {
321
- onRunningChanged?.(state);
322
- } else {
323
- if (state) {
324
- setStepIndex(0);
325
- setRunning(true);
326
- } else {
327
- setRunning(false);
328
- }
329
- }
330
- };
331
- useAsyncEffect(async () => {
332
- if (runningProp) {
333
- await waitForTarget(steps[stepIndex]);
334
- setStepIndex(0);
335
- setRunning(true);
336
- } else if (typeof runningProp !== "undefined") {
337
- setRunning(false);
338
- }
339
- }, [
340
- runningProp
341
- ]);
342
- const callback = async (options) => {
343
- const { type, action, index, size } = options;
344
- switch (type) {
345
- case EVENTS.STEP_BEFORE:
346
- addStepClass(options.step.target);
347
- break;
348
- case EVENTS.TOUR_END:
349
- break;
350
- case EVENTS.STEP_AFTER:
351
- removeTargetClass(options.step.target);
352
- switch (action) {
353
- case ACTIONS.NEXT:
354
- if (index < size - 1) {
355
- setStepIndex(index + 1);
356
- }
357
- break;
358
- case ACTIONS.PREV:
359
- if (index > 0) {
360
- setStepIndex(index - 1);
361
- }
362
- break;
363
- case ACTIONS.CLOSE:
364
- setRunningChanged(false);
365
- setStepIndex(0);
366
- break;
367
- }
368
- break;
369
- }
370
- };
371
- return /* @__PURE__ */ React7.createElement(HelpContext.Provider, {
372
- value: {
373
- running: running && !paused,
374
- steps,
375
- setSteps,
376
- setIndex: setStepIndex,
377
- start: () => setRunningChanged(true),
378
- stop: () => setRunningChanged(false)
379
- }
380
- }, /* @__PURE__ */ React7.createElement("style", null, `.joyride-target {
381
- --controls-opacity: 1;
382
- }`), /* @__PURE__ */ React7.createElement(Joyride, {
383
- continuous: true,
384
- steps,
385
- stepIndex,
386
- run: running && !paused,
387
- callback,
388
- floaterProps,
389
- tooltipComponent: Tooltip
390
- }));
391
- } finally {
392
- _effect.f();
393
- }
394
- };
395
-
396
- export {
397
- Key,
398
- ShortcutsList,
399
- SHORTCUTS_DIALOG,
400
- ShortcutsDialogContent,
401
- ShortcutsHints,
402
- ShortcutsSection,
403
- floaterProps,
404
- Tooltip,
405
- WelcomeTour
406
- };
407
- //# sourceMappingURL=chunk-4CVVSQQC.mjs.map