@dxos/plugin-presenter 0.8.4-main.c85a9c8dae → 0.8.4-main.dfabb4ec29

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 (194) hide show
  1. package/dist/lib/{browser/CollectionPresenterContainer-5RJIT3DA.mjs → neutral/CollectionPresenterContainer-JMX6INMS.mjs} +12 -18
  2. package/dist/lib/neutral/CollectionPresenterContainer-JMX6INMS.mjs.map +7 -0
  3. package/dist/lib/{browser/DocumentPresenterContainer-ISD6N5FM.mjs → neutral/DocumentPresenterContainer-KCDZ2O2C.mjs} +5 -9
  4. package/dist/lib/neutral/DocumentPresenterContainer-KCDZ2O2C.mjs.map +7 -0
  5. package/dist/lib/neutral/MarkdownSlide-WXILOIBE.mjs +18 -0
  6. package/dist/lib/neutral/MarkdownSlide-WXILOIBE.mjs.map +7 -0
  7. package/dist/lib/neutral/PresenterPlugin.mjs +23 -0
  8. package/dist/lib/neutral/PresenterPlugin.mjs.map +7 -0
  9. package/dist/lib/neutral/PresenterPlugin.node.mjs +16 -0
  10. package/dist/lib/neutral/PresenterPlugin.node.mjs.map +7 -0
  11. package/dist/lib/neutral/PresenterSettings-2G4XD4QY.mjs +25 -0
  12. package/dist/lib/neutral/PresenterSettings-2G4XD4QY.mjs.map +7 -0
  13. package/dist/lib/{browser/app-graph-builder-LNUGLW3H.mjs → neutral/app-graph-builder-LOVUQ6U5.mjs} +24 -39
  14. package/dist/lib/neutral/app-graph-builder-LOVUQ6U5.mjs.map +7 -0
  15. package/dist/lib/neutral/capabilities/index.mjs +13 -0
  16. package/dist/lib/neutral/capabilities/index.mjs.map +7 -0
  17. package/dist/lib/{browser/chunk-VQVZVXPJ.mjs → neutral/chunk-4XSSDLGN.mjs} +2 -2
  18. package/dist/lib/{browser/chunk-VQVZVXPJ.mjs.map → neutral/chunk-4XSSDLGN.mjs.map} +3 -3
  19. package/dist/lib/neutral/chunk-DCPA267T.mjs +68 -0
  20. package/dist/lib/neutral/chunk-DCPA267T.mjs.map +7 -0
  21. package/dist/lib/neutral/chunk-J5LGTIGS.mjs +10 -0
  22. package/dist/lib/neutral/chunk-J5LGTIGS.mjs.map +7 -0
  23. package/dist/lib/{browser/chunk-46CHA6Y5.mjs → neutral/chunk-V323QBC3.mjs} +8 -8
  24. package/dist/lib/neutral/chunk-V323QBC3.mjs.map +7 -0
  25. package/dist/lib/{browser/chunk-BHTOR7TG.mjs → neutral/components/index.mjs} +37 -20
  26. package/dist/lib/neutral/components/index.mjs.map +7 -0
  27. package/dist/lib/neutral/containers/index.mjs +13 -0
  28. package/dist/lib/neutral/containers/index.mjs.map +7 -0
  29. package/dist/lib/neutral/index.mjs +18 -0
  30. package/dist/lib/neutral/index.mjs.map +7 -0
  31. package/dist/lib/neutral/meta.json +1 -0
  32. package/dist/lib/neutral/meta.mjs +8 -0
  33. package/dist/lib/neutral/meta.mjs.map +7 -0
  34. package/dist/lib/neutral/plugin.mjs +12 -0
  35. package/dist/lib/neutral/plugin.mjs.map +7 -0
  36. package/dist/lib/neutral/react-surface-ATYTHPAA.mjs +55 -0
  37. package/dist/lib/neutral/react-surface-ATYTHPAA.mjs.map +7 -0
  38. package/dist/lib/{browser/settings-GIQOCH6O.mjs → neutral/settings-R6LRDAAK.mjs} +7 -11
  39. package/dist/lib/neutral/settings-R6LRDAAK.mjs.map +7 -0
  40. package/dist/lib/neutral/translations.mjs +19 -0
  41. package/dist/lib/neutral/translations.mjs.map +7 -0
  42. package/dist/lib/neutral/types/index.mjs +14 -0
  43. package/dist/lib/neutral/types/index.mjs.map +7 -0
  44. package/dist/types/src/PresenterPlugin.d.ts +1 -0
  45. package/dist/types/src/PresenterPlugin.d.ts.map +1 -1
  46. package/dist/types/src/PresenterPlugin.node.d.ts +4 -0
  47. package/dist/types/src/PresenterPlugin.node.d.ts.map +1 -0
  48. package/dist/types/src/PresenterPlugin.test.d.ts +2 -0
  49. package/dist/types/src/PresenterPlugin.test.d.ts.map +1 -0
  50. package/dist/types/src/capabilities/app-graph-builder.d.ts.map +1 -0
  51. package/dist/types/src/capabilities/index.d.ts +4 -3
  52. package/dist/types/src/capabilities/index.d.ts.map +1 -1
  53. package/dist/types/src/capabilities/react-surface.d.ts.map +1 -0
  54. package/dist/types/src/capabilities/{settings/settings.d.ts → settings.d.ts} +2 -5
  55. package/dist/types/src/capabilities/settings.d.ts.map +1 -0
  56. package/dist/types/src/components/Markdown/Panel.d.ts +8 -0
  57. package/dist/types/src/components/Markdown/Panel.d.ts.map +1 -0
  58. package/dist/types/src/components/Markdown/{Container.stories.d.ts → Panel.stories.d.ts} +1 -1
  59. package/dist/types/src/components/Markdown/Panel.stories.d.ts.map +1 -0
  60. package/dist/types/src/components/Markdown/Slide.d.ts +1 -1
  61. package/dist/types/src/components/Markdown/Slide.d.ts.map +1 -1
  62. package/dist/types/src/components/Markdown/Slide.stories.d.ts.map +1 -1
  63. package/dist/types/src/components/Markdown/index.d.ts +1 -1
  64. package/dist/types/src/components/Markdown/index.d.ts.map +1 -1
  65. package/dist/types/src/components/Markdown/theme.d.ts.map +1 -1
  66. package/dist/types/src/components/Presenter/Layout.d.ts +5 -5
  67. package/dist/types/src/components/Presenter/Layout.d.ts.map +1 -1
  68. package/dist/types/src/components/Presenter/Pager.d.ts.map +1 -1
  69. package/dist/types/src/components/Presenter/Pager.stories.d.ts.map +1 -1
  70. package/dist/types/src/components/PresenterSettings/PresenterSettings.d.ts +6 -0
  71. package/dist/types/src/components/PresenterSettings/PresenterSettings.d.ts.map +1 -0
  72. package/dist/types/src/components/PresenterSettings/PresenterSettings.stories.d.ts +23 -0
  73. package/dist/types/src/components/PresenterSettings/PresenterSettings.stories.d.ts.map +1 -0
  74. package/dist/types/src/components/PresenterSettings/index.d.ts +2 -0
  75. package/dist/types/src/components/PresenterSettings/index.d.ts.map +1 -0
  76. package/dist/types/src/components/RevealPlayer/RevealPlayer.d.ts +5 -4
  77. package/dist/types/src/components/RevealPlayer/RevealPlayer.d.ts.map +1 -1
  78. package/dist/types/src/components/RevealPlayer/RevealPlayer.stories.d.ts +7 -6
  79. package/dist/types/src/components/RevealPlayer/RevealPlayer.stories.d.ts.map +1 -1
  80. package/dist/types/src/components/index.d.ts +2 -0
  81. package/dist/types/src/components/index.d.ts.map +1 -1
  82. package/dist/types/src/containers/CollectionPresenterContainer/CollectionPresenterContainer.d.ts +2 -3
  83. package/dist/types/src/containers/CollectionPresenterContainer/CollectionPresenterContainer.d.ts.map +1 -1
  84. package/dist/types/src/containers/CollectionPresenterContainer/index.d.ts +1 -2
  85. package/dist/types/src/containers/CollectionPresenterContainer/index.d.ts.map +1 -1
  86. package/dist/types/src/containers/DocumentPresenterContainer/DocumentPresenterContainer.d.ts +1 -1
  87. package/dist/types/src/containers/DocumentPresenterContainer/DocumentPresenterContainer.d.ts.map +1 -1
  88. package/dist/types/src/containers/DocumentPresenterContainer/index.d.ts +1 -2
  89. package/dist/types/src/containers/DocumentPresenterContainer/index.d.ts.map +1 -1
  90. package/dist/types/src/containers/MarkdownSlide/MarkdownSlide.d.ts +1 -1
  91. package/dist/types/src/containers/MarkdownSlide/MarkdownSlide.d.ts.map +1 -1
  92. package/dist/types/src/containers/MarkdownSlide/index.d.ts +1 -2
  93. package/dist/types/src/containers/MarkdownSlide/index.d.ts.map +1 -1
  94. package/dist/types/src/containers/index.d.ts +0 -1
  95. package/dist/types/src/containers/index.d.ts.map +1 -1
  96. package/dist/types/src/index.d.ts +1 -2
  97. package/dist/types/src/index.d.ts.map +1 -1
  98. package/dist/types/src/plugin.d.ts +3 -0
  99. package/dist/types/src/plugin.d.ts.map +1 -0
  100. package/dist/types/src/testing.d.ts.map +1 -1
  101. package/dist/types/src/translations.d.ts +4 -6
  102. package/dist/types/src/translations.d.ts.map +1 -1
  103. package/dist/types/src/types/PresenterCapabilities.d.ts +4 -0
  104. package/dist/types/src/types/PresenterCapabilities.d.ts.map +1 -0
  105. package/dist/types/src/types/PresenterOperation.d.ts +17 -0
  106. package/dist/types/src/types/PresenterOperation.d.ts.map +1 -0
  107. package/dist/types/src/types/Settings.d.ts +7 -0
  108. package/dist/types/src/types/Settings.d.ts.map +1 -0
  109. package/dist/types/src/types/index.d.ts +11 -0
  110. package/dist/types/src/types/index.d.ts.map +1 -0
  111. package/dist/types/src/useExitPresenter.d.ts +1 -1
  112. package/dist/types/src/useExitPresenter.d.ts.map +1 -1
  113. package/dist/types/tsconfig.tsbuildinfo +1 -1
  114. package/package.json +85 -34
  115. package/src/PresenterPlugin.node.ts +16 -0
  116. package/src/PresenterPlugin.test.ts +23 -0
  117. package/src/PresenterPlugin.tsx +5 -3
  118. package/src/capabilities/{app-graph-builder/app-graph-builder.ts → app-graph-builder.ts} +23 -26
  119. package/src/capabilities/index.ts +5 -3
  120. package/src/capabilities/react-surface.tsx +68 -0
  121. package/src/capabilities/{settings/settings.ts → settings.ts} +4 -4
  122. package/src/components/Markdown/{Container.stories.tsx → Panel.stories.tsx} +5 -5
  123. package/src/components/Markdown/{Container.tsx → Panel.tsx} +4 -4
  124. package/src/components/Markdown/Slide.stories.tsx +1 -1
  125. package/src/components/Markdown/Slide.tsx +2 -2
  126. package/src/components/Markdown/index.ts +1 -1
  127. package/src/components/Presenter/Layout.tsx +24 -23
  128. package/src/components/PresenterSettings/PresenterSettings.stories.tsx +32 -0
  129. package/src/components/PresenterSettings/PresenterSettings.tsx +31 -0
  130. package/src/components/PresenterSettings/index.ts +5 -0
  131. package/src/components/RevealPlayer/RevealPlayer.stories.tsx +2 -2
  132. package/src/components/RevealPlayer/RevealPlayer.tsx +104 -105
  133. package/src/components/index.ts +4 -0
  134. package/src/containers/CollectionPresenterContainer/CollectionPresenterContainer.tsx +13 -6
  135. package/src/containers/CollectionPresenterContainer/index.ts +1 -3
  136. package/src/containers/DocumentPresenterContainer/DocumentPresenterContainer.tsx +3 -2
  137. package/src/containers/DocumentPresenterContainer/index.ts +1 -3
  138. package/src/containers/MarkdownSlide/MarkdownSlide.tsx +4 -4
  139. package/src/containers/MarkdownSlide/index.ts +1 -3
  140. package/src/containers/index.ts +0 -1
  141. package/src/index.ts +1 -3
  142. package/src/meta.ts +1 -1
  143. package/src/plugin.ts +9 -0
  144. package/src/testing.ts +6 -6
  145. package/src/translations.ts +4 -5
  146. package/src/types/PresenterCapabilities.ts +15 -0
  147. package/src/types/PresenterOperation.ts +25 -0
  148. package/src/types/Settings.ts +20 -0
  149. package/src/types/index.ts +21 -0
  150. package/src/useExitPresenter.ts +9 -8
  151. package/dist/lib/browser/CollectionPresenterContainer-5RJIT3DA.mjs.map +0 -7
  152. package/dist/lib/browser/DocumentPresenterContainer-ISD6N5FM.mjs.map +0 -7
  153. package/dist/lib/browser/MarkdownSlide-Q2XLZTMW.mjs +0 -23
  154. package/dist/lib/browser/MarkdownSlide-Q2XLZTMW.mjs.map +0 -7
  155. package/dist/lib/browser/PresenterSettings-WGQMXH4I.mjs +0 -31
  156. package/dist/lib/browser/PresenterSettings-WGQMXH4I.mjs.map +0 -7
  157. package/dist/lib/browser/app-graph-builder-LNUGLW3H.mjs.map +0 -7
  158. package/dist/lib/browser/chunk-46CHA6Y5.mjs.map +0 -7
  159. package/dist/lib/browser/chunk-BHTOR7TG.mjs.map +0 -7
  160. package/dist/lib/browser/chunk-PSOOAW44.mjs +0 -50
  161. package/dist/lib/browser/chunk-PSOOAW44.mjs.map +0 -7
  162. package/dist/lib/browser/index.mjs +0 -65
  163. package/dist/lib/browser/index.mjs.map +0 -7
  164. package/dist/lib/browser/meta.json +0 -1
  165. package/dist/lib/browser/react-surface-UCM2KRSP.mjs +0 -67
  166. package/dist/lib/browser/react-surface-UCM2KRSP.mjs.map +0 -7
  167. package/dist/lib/browser/settings-GIQOCH6O.mjs.map +0 -7
  168. package/dist/types/src/capabilities/app-graph-builder/app-graph-builder.d.ts.map +0 -1
  169. package/dist/types/src/capabilities/app-graph-builder/index.d.ts +0 -3
  170. package/dist/types/src/capabilities/app-graph-builder/index.d.ts.map +0 -1
  171. package/dist/types/src/capabilities/react-surface/index.d.ts +0 -3
  172. package/dist/types/src/capabilities/react-surface/index.d.ts.map +0 -1
  173. package/dist/types/src/capabilities/react-surface/react-surface.d.ts.map +0 -1
  174. package/dist/types/src/capabilities/settings/index.d.ts +0 -7
  175. package/dist/types/src/capabilities/settings/index.d.ts.map +0 -1
  176. package/dist/types/src/capabilities/settings/settings.d.ts.map +0 -1
  177. package/dist/types/src/components/Markdown/Container.d.ts +0 -8
  178. package/dist/types/src/components/Markdown/Container.d.ts.map +0 -1
  179. package/dist/types/src/components/Markdown/Container.stories.d.ts.map +0 -1
  180. package/dist/types/src/containers/PresenterSettings/PresenterSettings.d.ts +0 -8
  181. package/dist/types/src/containers/PresenterSettings/PresenterSettings.d.ts.map +0 -1
  182. package/dist/types/src/containers/PresenterSettings/index.d.ts +0 -3
  183. package/dist/types/src/containers/PresenterSettings/index.d.ts.map +0 -1
  184. package/dist/types/src/types.d.ts +0 -49
  185. package/dist/types/src/types.d.ts.map +0 -1
  186. package/src/capabilities/app-graph-builder/index.ts +0 -7
  187. package/src/capabilities/react-surface/index.ts +0 -7
  188. package/src/capabilities/react-surface/react-surface.tsx +0 -71
  189. package/src/capabilities/settings/index.ts +0 -7
  190. package/src/containers/PresenterSettings/PresenterSettings.tsx +0 -35
  191. package/src/containers/PresenterSettings/index.ts +0 -7
  192. package/src/types.ts +0 -54
  193. /package/dist/types/src/capabilities/{app-graph-builder/app-graph-builder.d.ts → app-graph-builder.d.ts} +0 -0
  194. /package/dist/types/src/capabilities/{react-surface/react-surface.d.ts → react-surface.d.ts} +0 -0
@@ -6,9 +6,9 @@ import { type Meta } from '@storybook/react-vite';
6
6
 
7
7
  import { withLayout, withTheme } from '@dxos/react-ui/testing';
8
8
 
9
- import CONTENT from '../../../testing/deck.md?raw';
10
- import { translations } from '../../translations';
9
+ import { translations } from '#translations';
11
10
 
11
+ import CONTENT from '../../../testing/deck.md?raw';
12
12
  import { RevealPlayer } from './RevealPlayer';
13
13
 
14
14
  // https://revealjs.com/markdown
@@ -3,9 +3,7 @@
3
3
  //
4
4
 
5
5
  import 'reveal.js/dist/reveal.css';
6
-
7
6
  import 'reveal.js/dist/theme/black.css';
8
-
9
7
  // https://github.com/highlightjs/highlight.js/tree/main/src/styles
10
8
  // import 'highlight.js/styles/github-dark.css';
11
9
  import 'highlight.js/styles/tokyo-night-dark.css';
@@ -17,8 +15,8 @@ import Reveal from 'reveal.js';
17
15
  import RevealHighlight from 'reveal.js/plugin/highlight/highlight';
18
16
  import RevealMarkdown from 'reveal.js/plugin/markdown/plugin.js';
19
17
 
20
- import { type ThemedClassName, useAsyncEffect } from '@dxos/react-ui';
21
- import { mx } from '@dxos/ui-theme';
18
+ import { useAsyncEffect } from '@dxos/react-ui';
19
+ import { composable, composableProps } from '@dxos/ui-theme';
22
20
 
23
21
  const styles = `
24
22
  <style type="text/css">
@@ -61,118 +59,119 @@ const styles = `
61
59
  </style>
62
60
  `;
63
61
 
64
- export type RevealProps = ThemedClassName<{
62
+ export type RevealProps = {
65
63
  content: string;
66
64
  slide?: number;
67
65
  fullscreen?: boolean;
68
66
  onExit?: () => void;
69
- }>;
70
-
71
- export const RevealPlayer = ({ classNames, content, slide, fullscreen = true, onExit }: RevealProps) => {
72
- const deckDivRef = useRef<HTMLDivElement>(null);
73
- const deckRef = useRef<Reveal.Api | null>(null);
74
-
75
- useAsyncEffect(async () => {
76
- if (deckRef.current) {
77
- return;
78
- }
79
-
80
- // Required for syntax highlighting.
81
- hljs.registerLanguage('typescript', typescript);
82
-
83
- // https://revealjs.com/react
84
- // https://revealjs.com/config
85
- // https://github.com/hakimel/reveal.js
86
- // TODO(burdon): Fragments and scroll view steps 2 at a time (safe mode?)
87
- deckRef.current = new Reveal(deckDivRef.current!, {
88
- // view: 'scroll',
89
- progress: false,
90
- transition: 'none',
91
- slideNumber: false,
92
- embedded: true,
93
-
94
- // Disable autoplay to prevent errors in headless environments (e.g., CI).
95
- autoPlayMedia: false,
96
-
97
- // TODO(burdon): Speaker view requires server to serve popout window.
98
- // https://revealjs.com/speaker-view
99
- showNotes: false,
100
-
101
- // width: 1600,
102
- // height: 900,
103
- margin: 0.1,
104
- // center: false,
105
- // minScale: 0.1,
106
- // maxScale: 1.4,
107
-
108
- // https://revealjs.com/markdown
109
- // TODO(burdon): Requires server to serve popout window.
110
- plugins: [RevealMarkdown, RevealHighlight],
111
-
112
- // See https://marked.js.org/using_advanced#options
113
- markdown: {
114
- gfm: true,
115
- smartypants: true,
116
- highlight: (code, language) => {
117
- if (language) {
118
- return hljs.highlight(code, { language }).value;
119
- }
67
+ };
120
68
 
121
- return hljs.highlightAuto(code).value;
69
+ export const RevealPlayer = composable<HTMLDivElement, RevealProps>(
70
+ ({ content, slide, fullscreen = true, onExit, children, ...props }, forwardedRef) => {
71
+ const deckDivRef = useRef<HTMLDivElement>(null);
72
+ const deckRef = useRef<Reveal.Api | null>(null);
73
+
74
+ useAsyncEffect(async () => {
75
+ if (deckRef.current) {
76
+ return;
77
+ }
78
+
79
+ // Required for syntax highlighting.
80
+ hljs.registerLanguage('typescript', typescript);
81
+
82
+ // https://revealjs.com/react
83
+ // https://revealjs.com/config
84
+ // https://github.com/hakimel/reveal.js
85
+ // TODO(burdon): Fragments and scroll view steps 2 at a time (safe mode?)
86
+ deckRef.current = new Reveal(deckDivRef.current!, {
87
+ // view: 'scroll',
88
+ progress: false,
89
+ transition: 'none',
90
+ slideNumber: false,
91
+ embedded: true,
92
+
93
+ // Disable autoplay to prevent errors in headless environments (e.g., CI).
94
+ autoPlayMedia: false,
95
+
96
+ // TODO(burdon): Speaker view requires server to serve popout window.
97
+ // https://revealjs.com/speaker-view
98
+ showNotes: false,
99
+
100
+ // width: 1600,
101
+ // height: 900,
102
+ margin: 0.1,
103
+ // center: false,
104
+ // minScale: 0.1,
105
+ // maxScale: 1.4,
106
+
107
+ // https://revealjs.com/markdown
108
+ // TODO(burdon): Requires server to serve popout window.
109
+ plugins: [RevealMarkdown, RevealHighlight],
110
+
111
+ // See https://marked.js.org/using_advanced#options
112
+ markdown: {
113
+ gfm: true,
114
+ smartypants: true,
115
+ highlight: (code, language) => {
116
+ if (language) {
117
+ return hljs.highlight(code, { language }).value;
118
+ }
119
+
120
+ return hljs.highlightAuto(code).value;
121
+ },
122
122
  },
123
- },
124
- });
123
+ });
125
124
 
126
- await deckRef.current.initialize();
125
+ await deckRef.current.initialize();
127
126
 
128
- if (slide !== undefined) {
129
- deckRef.current.slide(slide < 0 ? deckRef.current?.getTotalSlides() + slide : slide - 1);
130
- }
127
+ if (slide !== undefined) {
128
+ deckRef.current.slide(slide < 0 ? deckRef.current?.getTotalSlides() + slide : slide - 1);
129
+ }
131
130
 
132
- deckRef.current.addKeyBinding({ keyCode: 27, key: 'Escape', description: 'Exit full screen' }, () => {
133
- onExit?.();
134
- });
131
+ deckRef.current.addKeyBinding({ keyCode: 27, key: 'Escape', description: 'Exit full screen' }, () => {
132
+ onExit?.();
133
+ });
135
134
 
136
- return () => {
137
- try {
138
- if (deckRef.current) {
139
- deckRef.current.destroy();
140
- deckRef.current = null;
135
+ return () => {
136
+ try {
137
+ if (deckRef.current) {
138
+ deckRef.current.destroy();
139
+ deckRef.current = null;
140
+ }
141
+ } catch {
142
+ // Ignore.
141
143
  }
142
- } catch {
143
- // Ignore.
144
- }
145
- };
146
- });
147
-
148
- // TOOD(burdon): Trap cursor keys (otherwise tabster grabs focus.)
149
- return (
150
- <div
151
- className={mx(
152
- 'grid place-items-center w-full h-full overflow-hidden bg-black',
153
- fullscreen && 'absolute inset-0',
154
- classNames,
155
- )}
156
- >
157
- <div className='relative aspect-video w-full h-full h-auto max-h-full overflow-hidden'>
158
- <div ref={deckDivRef} className='absolute inset-0 reveal'>
159
- {/* NOTE: Must be in head. */}
160
- <style>
161
- <link rel='preconnect' href='https://fonts.googleapis.com' />
162
- <link rel='preconnect' href='https://fonts.gstatic.com' {...{ crossOrigin: '' }} />
163
- <link
164
- rel='stylesheet'
165
- href='https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap'
166
- />
167
- </style>
168
- <div className='slides'>
169
- <div className='text-center!' />
170
- <section {...{ 'data-markdown': [] }}>
171
- <textarea {...{ 'data-template': true }} defaultValue={[styles, content].join('\n')}></textarea>
172
- </section>
144
+ };
145
+ });
146
+
147
+ // TOOD(burdon): Trap cursor keys (otherwise tabster grabs focus.)
148
+ return (
149
+ <div
150
+ {...composableProps(props, {
151
+ classNames: ['dx-container grid place-items-center bg-black', fullscreen && 'absolute inset-0'],
152
+ })}
153
+ ref={forwardedRef}
154
+ >
155
+ <div className='relative aspect-video h-full w-full h-auto max-h-full overflow-hidden'>
156
+ <div ref={deckDivRef} className='absolute inset-0 reveal'>
157
+ {/* NOTE: Must be in head. */}
158
+ <style>
159
+ <link rel='preconnect' href='https://fonts.googleapis.com' />
160
+ <link rel='preconnect' href='https://fonts.gstatic.com' {...{ crossOrigin: '' }} />
161
+ <link
162
+ rel='stylesheet'
163
+ href='https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap'
164
+ />
165
+ </style>
166
+ <div className='slides'>
167
+ <div className='text-center!' />
168
+ <section {...{ 'data-markdown': [] }}>
169
+ <textarea {...{ 'data-template': true }} defaultValue={[styles, content].join('\n')}></textarea>
170
+ </section>
171
+ </div>
173
172
  </div>
174
173
  </div>
175
174
  </div>
176
- </div>
177
- );
178
- };
175
+ );
176
+ },
177
+ );
@@ -2,6 +2,10 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
+ import { type ComponentType, lazy } from 'react';
6
+
5
7
  export * from './Markdown';
6
8
  export * from './Presenter';
7
9
  export * from './RevealPlayer';
10
+
11
+ export const PresenterSettings: ComponentType<any> = lazy(() => import('./PresenterSettings'));
@@ -5,15 +5,16 @@
5
5
  import React, { useContext, useState } from 'react';
6
6
 
7
7
  import { Surface } from '@dxos/app-framework/ui';
8
- import { type SurfaceComponentProps } from '@dxos/app-toolkit/ui';
9
- import { type Collection } from '@dxos/echo';
8
+ import { AppSurface } from '@dxos/app-toolkit/ui';
9
+ import { type Collection, Obj } from '@dxos/echo';
10
10
  import { Panel } from '@dxos/react-ui';
11
11
 
12
- import { PageNumber, Pager, Layout as PresenterLayout } from '../../components';
13
- import { PresenterContext } from '../../types';
12
+ import { PageNumber, Pager, Layout as PresenterLayout } from '#components';
13
+ import { PresenterContext } from '#types';
14
+
14
15
  import { useExitPresenter } from '../../useExitPresenter';
15
16
 
16
- type CollectionPresenterContainerProps = SurfaceComponentProps<Collection.Collection>;
17
+ export type CollectionPresenterContainerProps = AppSurface.ObjectArticleProps<Collection.Collection>;
17
18
 
18
19
  export const CollectionPresenterContainer = ({ role, subject: collection }: CollectionPresenterContainerProps) => {
19
20
  const [slide, setSlide] = useState(0);
@@ -35,7 +36,13 @@ export const CollectionPresenterContainer = ({ role, subject: collection }: Coll
35
36
  />
36
37
  }
37
38
  >
38
- <Surface.Surface role='slide' data={{ subject: collection.objects[slide] }} />
39
+ <Surface.Surface
40
+ type={AppSurface.Slide}
41
+ data={{
42
+ subject: collection.objects[slide],
43
+ attendableId: Obj.getDXN(collection).toString(),
44
+ }}
45
+ />
39
46
  </PresenterLayout>
40
47
  </Panel.Content>
41
48
  </Panel.Root>
@@ -2,6 +2,4 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { CollectionPresenterContainer } from './CollectionPresenterContainer';
6
-
7
- export default CollectionPresenterContainer;
5
+ export { CollectionPresenterContainer as default } from './CollectionPresenterContainer';
@@ -4,10 +4,11 @@
4
4
 
5
5
  import React, { type FC } from 'react';
6
6
 
7
- import { type Markdown } from '@dxos/plugin-markdown/types';
7
+ import { type Markdown } from '@dxos/plugin-markdown';
8
8
  import { Panel } from '@dxos/react-ui';
9
9
 
10
- import { RevealPlayer } from '../../components';
10
+ import { RevealPlayer } from '#components';
11
+
11
12
  import { useExitPresenter } from '../../useExitPresenter';
12
13
 
13
14
  export const DocumentPresenterContainer: FC<{ document: Markdown.Document }> = ({ document }) => {
@@ -2,6 +2,4 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { DocumentPresenterContainer } from './DocumentPresenterContainer';
6
-
7
- export default DocumentPresenterContainer;
5
+ export { DocumentPresenterContainer as default } from './DocumentPresenterContainer';
@@ -4,9 +4,9 @@
4
4
 
5
5
  import React from 'react';
6
6
 
7
- import { type Markdown } from '@dxos/plugin-markdown/types';
7
+ import { type Markdown } from '@dxos/plugin-markdown';
8
8
 
9
- import { Container, Slide } from '../../components';
9
+ import { Panel, Slide } from '#components';
10
10
 
11
11
  type MarkdownSlideProps = {
12
12
  document: Markdown.Document;
@@ -19,8 +19,8 @@ export const MarkdownSlide = ({ document }: MarkdownSlideProps) => {
19
19
  }
20
20
 
21
21
  return (
22
- <Container>
22
+ <Panel>
23
23
  <Slide content={content} />
24
- </Container>
24
+ </Panel>
25
25
  );
26
26
  };
@@ -2,6 +2,4 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { MarkdownSlide } from './MarkdownSlide';
6
-
7
- export default MarkdownSlide;
5
+ export { MarkdownSlide as default } from './MarkdownSlide';
@@ -7,4 +7,3 @@ import { type ComponentType, lazy } from 'react';
7
7
  export const CollectionPresenterContainer: ComponentType<any> = lazy(() => import('./CollectionPresenterContainer'));
8
8
  export const DocumentPresenterContainer: ComponentType<any> = lazy(() => import('./DocumentPresenterContainer'));
9
9
  export const MarkdownSlide: ComponentType<any> = lazy(() => import('./MarkdownSlide'));
10
- export const PresenterSettings: ComponentType<any> = lazy(() => import('./PresenterSettings'));
package/src/index.ts CHANGED
@@ -2,7 +2,5 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- export * from './components';
6
-
7
5
  export * from './meta';
8
- export * from './PresenterPlugin';
6
+ export * from './types';
package/src/meta.ts CHANGED
@@ -6,7 +6,7 @@ import { type Plugin } from '@dxos/app-framework';
6
6
  import { trim } from '@dxos/util';
7
7
 
8
8
  export const meta: Plugin.Meta = {
9
- id: 'dxos.org/plugin/presenter',
9
+ id: 'org.dxos.plugin.presenter',
10
10
  name: 'Presenter',
11
11
  description: trim`
12
12
  Transform markdown documents into interactive presentation slideshows.
package/src/plugin.ts ADDED
@@ -0,0 +1,9 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import { Plugin } from '@dxos/app-framework';
6
+
7
+ import { meta } from './meta';
8
+
9
+ export const PresenterPlugin = Plugin.lazy(meta, () => import('#plugin'));
package/src/testing.ts CHANGED
@@ -2,7 +2,7 @@
2
2
  // Copyright 2023 DXOS.org
3
3
  //
4
4
 
5
- import { faker } from '@dxos/random';
5
+ import { random } from '@dxos/random';
6
6
 
7
7
  type SlideOptions = {
8
8
  text?: string;
@@ -26,21 +26,21 @@ export const createSlide = (options: SlideOptions = {}) => {
26
26
 
27
27
  const list = (length = 3) =>
28
28
  Array.from({ length })
29
- .map(() => `- ${faker.lorem.sentence(3)}`)
29
+ .map(() => `- ${random.lorem.sentence(3)}`)
30
30
  .join('\n');
31
31
 
32
32
  const ordered = (length = 3) =>
33
33
  Array.from({ length })
34
- .map((_, i) => `${i + 1}. ${faker.lorem.sentence(3)}`)
34
+ .map((_, i) => `${i + 1}. ${random.lorem.sentence(3)}`)
35
35
  .join('\n');
36
36
 
37
37
  return [
38
- `# ${num}${faker.lorem.sentence(3)}`,
39
- options.text && faker.lorem.sentences(),
38
+ `# ${num}${random.lorem.sentence(3)}`,
39
+ options.text && random.lorem.sentences(),
40
40
  options.code && code(),
41
41
  options.list && list(options.list),
42
42
  options.ordered && ordered(options.ordered),
43
- faker.lorem.sentences(),
43
+ random.lorem.sentences(),
44
44
  ]
45
45
  .filter(Boolean)
46
46
  .join('\n\r');
@@ -4,16 +4,15 @@
4
4
 
5
5
  import { type Resource } from '@dxos/react-ui';
6
6
 
7
- import { meta } from './meta';
7
+ import { meta } from '#meta';
8
8
 
9
9
  export const translations = [
10
10
  {
11
11
  'en-US': {
12
12
  [meta.id]: {
13
- 'plugin name': 'Presenter',
14
- 'settings title': 'Presenter settings',
15
- 'toggle presentation label': 'Present',
16
- 'present collections label': 'Present collections (experimental)',
13
+ 'plugin.name': 'Presenter',
14
+ 'settings.title': 'Presenter settings',
15
+ 'toggle-presentation.label': 'Present',
17
16
  },
18
17
  },
19
18
  },
@@ -0,0 +1,15 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ // @import-as-namespace
6
+
7
+ import { type Atom } from '@effect-atom/atom-react';
8
+
9
+ import { Capability } from '@dxos/app-framework';
10
+
11
+ import { meta } from '#meta';
12
+
13
+ // Inline import to avoid `Settings` namespace alias colliding with the
14
+ // `Settings` capability export below.
15
+ export const Settings = Capability.make<Atom.Writable<import('./Settings').Settings>>(`${meta.id}.capability.settings`);
@@ -0,0 +1,25 @@
1
+ //
2
+ // Copyright 2025 DXOS.org
3
+ //
4
+
5
+ // @import-as-namespace
6
+
7
+ import * as Schema from 'effect/Schema';
8
+
9
+ import { Operation } from '@dxos/compute';
10
+ import { Collection } from '@dxos/echo';
11
+ import { Markdown } from '@dxos/plugin-markdown';
12
+
13
+ import { meta } from '#meta';
14
+
15
+ const PRESENTER_OPERATION = `${meta.id}.operation`;
16
+
17
+ // TODO(wittjosiah): This appears to be unused.
18
+ export const TogglePresentation = Operation.make({
19
+ meta: { key: `${PRESENTER_OPERATION}.toggle-presentation`, name: 'Toggle Presentation' },
20
+ input: Schema.Struct({
21
+ object: Schema.Union(Markdown.Document, Collection.Collection),
22
+ state: Schema.optional(Schema.Boolean),
23
+ }),
24
+ output: Schema.Void,
25
+ });
@@ -0,0 +1,20 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ // @import-as-namespace
6
+
7
+ import * as Schema from 'effect/Schema';
8
+
9
+ export const Settings = Schema.mutable(
10
+ Schema.Struct({
11
+ presentCollections: Schema.optional(
12
+ Schema.Boolean.annotations({
13
+ title: 'Present collections (experimental)',
14
+ description: 'Enable presenting collections of documents as a slideshow.',
15
+ }),
16
+ ),
17
+ }),
18
+ );
19
+
20
+ export interface Settings extends Schema.Schema.Type<typeof Settings> {}
@@ -0,0 +1,21 @@
1
+ //
2
+ // Copyright 2023 DXOS.org
3
+ //
4
+
5
+ import { type Context, createContext } from 'react';
6
+
7
+ export type PresenterContextType = {
8
+ running: boolean;
9
+ start: () => void;
10
+ stop: () => void;
11
+ };
12
+
13
+ export const PresenterContext: Context<PresenterContextType> = createContext<PresenterContextType>({
14
+ running: false,
15
+ start: () => {},
16
+ stop: () => {},
17
+ });
18
+
19
+ export * as PresenterCapabilities from './PresenterCapabilities';
20
+ export * as PresenterOperation from './PresenterOperation';
21
+ export * as Settings from './Settings';
@@ -6,10 +6,9 @@ import { useAtomValue } from '@effect-atom/atom-react';
6
6
  import { useCallback, useMemo } from 'react';
7
7
 
8
8
  import { useCapability, useOperationInvoker } from '@dxos/app-framework/ui';
9
- import { LayoutOperation } from '@dxos/app-toolkit';
9
+ import { LayoutOperation, getObjectPathFromObject, getSpacePath } from '@dxos/app-toolkit';
10
10
  import { Obj } from '@dxos/echo';
11
- import { DeckCapabilities } from '@dxos/plugin-deck';
12
- import { DeckOperation } from '@dxos/plugin-deck/types';
11
+ import { DeckCapabilities, DeckOperation } from '@dxos/plugin-deck';
13
12
 
14
13
  export const useExitPresenter = (object: any) => {
15
14
  const { invokePromise } = useOperationInvoker();
@@ -20,16 +19,18 @@ export const useExitPresenter = (object: any) => {
20
19
  const deck = useMemo(() => state.decks[state.activeDeck], [state.decks, state.activeDeck]);
21
20
 
22
21
  return useCallback(() => {
23
- const objectId = Obj.getDXN(object).toString();
22
+ const objectPath = getObjectPathFromObject(object);
23
+ const db = Obj.getDatabase(object);
24
24
  if (deck?.fullscreen) {
25
25
  void invokePromise(DeckOperation.Adjust, {
26
- type: 'solo--fullscreen',
27
- id: objectId,
26
+ type: 'solo--fullscreen' as const,
27
+ id: objectPath,
28
28
  });
29
29
  }
30
+
30
31
  return invokePromise(LayoutOperation.Open, {
31
- subject: [objectId],
32
- workspace: Obj.getDatabase(object)?.spaceId,
32
+ subject: [objectPath],
33
+ workspace: db ? getSpacePath(db.spaceId) : undefined,
33
34
  });
34
35
  }, [invokePromise, object, deck]);
35
36
  };
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/containers/CollectionPresenterContainer/CollectionPresenterContainer.tsx", "../../../src/containers/CollectionPresenterContainer/index.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { useContext, useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework/ui';\nimport { type SurfaceComponentProps } from '@dxos/app-toolkit/ui';\nimport { type Collection } from '@dxos/echo';\nimport { Panel } from '@dxos/react-ui';\n\nimport { PageNumber, Pager, Layout as PresenterLayout } from '../../components';\nimport { PresenterContext } from '../../types';\nimport { useExitPresenter } from '../../useExitPresenter';\n\ntype CollectionPresenterContainerProps = SurfaceComponentProps<Collection.Collection>;\n\nexport const CollectionPresenterContainer = ({ role, subject: collection }: CollectionPresenterContainerProps) => {\n const [slide, setSlide] = useState(0);\n const { running } = useContext(PresenterContext);\n const handleExit = useExitPresenter(collection);\n\n return (\n <Panel.Root role={role} classNames='relative'>\n <Panel.Content asChild>\n <PresenterLayout\n bottomRight={<PageNumber index={slide} count={collection.objects.length} />}\n bottomLeft={\n <Pager\n index={slide}\n count={collection.objects.length}\n keys={running}\n onChange={setSlide}\n onExit={handleExit}\n />\n }\n >\n <Surface.Surface role='slide' data={{ subject: collection.objects[slide] }} />\n </PresenterLayout>\n </Panel.Content>\n </Panel.Root>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { CollectionPresenterContainer } from './CollectionPresenterContainer';\n\nexport default CollectionPresenterContainer;\n"],
5
- "mappings": ";;;;;;;;;;;;;;AAIA,OAAOA,SAASC,YAAYC,gBAAgB;AAE5C,SAASC,eAAe;AAGxB,SAASC,aAAa;AAQf,IAAMC,+BAA+B,CAAC,EAAEC,MAAMC,SAASC,WAAU,MAAqC;AAC3G,QAAM,CAACC,OAAOC,QAAAA,IAAYC,SAAS,CAAA;AACnC,QAAM,EAAEC,QAAO,IAAKC,WAAWC,gBAAAA;AAC/B,QAAMC,aAAaC,iBAAiBR,UAAAA;AAEpC,SACE,sBAAA,cAACS,MAAMC,MAAI;IAACZ;IAAYa,YAAW;KACjC,sBAAA,cAACF,MAAMG,SAAO;IAACC,SAAAA;KACb,sBAAA,cAACC,QAAAA;IACCC,aAAa,sBAAA,cAACC,YAAAA;MAAWC,OAAOhB;MAAOiB,OAAOlB,WAAWmB,QAAQC;;IACjEC,YACE,sBAAA,cAACC,OAAAA;MACCL,OAAOhB;MACPiB,OAAOlB,WAAWmB,QAAQC;MAC1BG,MAAMnB;MACNoB,UAAUtB;MACVuB,QAAQlB;;KAIZ,sBAAA,cAACmB,QAAQA,SAAO;IAAC5B,MAAK;IAAQ6B,MAAM;MAAE5B,SAASC,WAAWmB,QAAQlB,KAAAA;IAAO;;AAKnF;;;ACpCA,IAAA,uCAAe2B;",
6
- "names": ["React", "useContext", "useState", "Surface", "Panel", "CollectionPresenterContainer", "role", "subject", "collection", "slide", "setSlide", "useState", "running", "useContext", "PresenterContext", "handleExit", "useExitPresenter", "Panel", "Root", "classNames", "Content", "asChild", "PresenterLayout", "bottomRight", "PageNumber", "index", "count", "objects", "length", "bottomLeft", "Pager", "keys", "onChange", "onExit", "Surface", "data", "CollectionPresenterContainer"]
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/containers/DocumentPresenterContainer/DocumentPresenterContainer.tsx", "../../../src/containers/DocumentPresenterContainer/index.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { type FC } from 'react';\n\nimport { type Markdown } from '@dxos/plugin-markdown/types';\nimport { Panel } from '@dxos/react-ui';\n\nimport { RevealPlayer } from '../../components';\nimport { useExitPresenter } from '../../useExitPresenter';\n\nexport const DocumentPresenterContainer: FC<{ document: Markdown.Document }> = ({ document }) => {\n const handleExit = useExitPresenter(document);\n\n return (\n <Panel.Root classNames='relative'>\n <Panel.Content asChild>\n <RevealPlayer content={document.content.target?.content ?? ''} onExit={handleExit} />\n </Panel.Content>\n </Panel.Root>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { DocumentPresenterContainer } from './DocumentPresenterContainer';\n\nexport default DocumentPresenterContainer;\n"],
5
- "mappings": ";;;;;;;;AAIA,OAAOA,WAAwB;AAG/B,SAASC,aAAa;AAKf,IAAMC,6BAAkE,CAAC,EAAEC,SAAQ,MAAE;AAC1F,QAAMC,aAAaC,iBAAiBF,QAAAA;AAEpC,SACE,sBAAA,cAACG,MAAMC,MAAI;IAACC,YAAW;KACrB,sBAAA,cAACF,MAAMG,SAAO;IAACC,SAAAA;KACb,sBAAA,cAACC,cAAAA;IAAaC,SAAST,SAASS,QAAQC,QAAQD,WAAW;IAAIE,QAAQV;;AAI/E;;;AChBA,IAAA,qCAAeW;",
6
- "names": ["React", "Panel", "DocumentPresenterContainer", "document", "handleExit", "useExitPresenter", "Panel", "Root", "classNames", "Content", "asChild", "RevealPlayer", "content", "target", "onExit", "DocumentPresenterContainer"]
7
- }
@@ -1,23 +0,0 @@
1
- import {
2
- Container,
3
- Slide
4
- } from "./chunk-BHTOR7TG.mjs";
5
-
6
- // src/containers/MarkdownSlide/MarkdownSlide.tsx
7
- import React from "react";
8
- var MarkdownSlide = ({ document }) => {
9
- const content = document.content.target?.content;
10
- if (!content) {
11
- return null;
12
- }
13
- return /* @__PURE__ */ React.createElement(Container, null, /* @__PURE__ */ React.createElement(Slide, {
14
- content
15
- }));
16
- };
17
-
18
- // src/containers/MarkdownSlide/index.ts
19
- var MarkdownSlide_default = MarkdownSlide;
20
- export {
21
- MarkdownSlide_default as default
22
- };
23
- //# sourceMappingURL=MarkdownSlide-Q2XLZTMW.mjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/containers/MarkdownSlide/MarkdownSlide.tsx", "../../../src/containers/MarkdownSlide/index.ts"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type Markdown } from '@dxos/plugin-markdown/types';\n\nimport { Container, Slide } from '../../components';\n\ntype MarkdownSlideProps = {\n document: Markdown.Document;\n};\n\nexport const MarkdownSlide = ({ document }: MarkdownSlideProps) => {\n const content = document.content.target?.content;\n if (!content) {\n return null;\n }\n\n return (\n <Container>\n <Slide content={content} />\n </Container>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { MarkdownSlide } from './MarkdownSlide';\n\nexport default MarkdownSlide;\n"],
5
- "mappings": ";;;;;;AAIA,OAAOA,WAAW;AAUX,IAAMC,gBAAgB,CAAC,EAAEC,SAAQ,MAAsB;AAC5D,QAAMC,UAAUD,SAASC,QAAQC,QAAQD;AACzC,MAAI,CAACA,SAAS;AACZ,WAAO;EACT;AAEA,SACE,sBAAA,cAACE,WAAAA,MACC,sBAAA,cAACC,OAAAA;IAAMH;;AAGb;;;ACnBA,IAAA,wBAAeI;",
6
- "names": ["React", "MarkdownSlide", "document", "content", "target", "Container", "Slide", "MarkdownSlide"]
7
- }