@dxos/storybook-utils 0.8.4-main.dedc0f3 → 0.8.4-main.e00bdcdb52

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 (53) hide show
  1. package/dist/lib/browser/index.mjs +20 -181
  2. package/dist/lib/browser/index.mjs.map +4 -4
  3. package/dist/lib/browser/meta.json +1 -1
  4. package/dist/lib/node-esm/index.mjs +20 -181
  5. package/dist/lib/node-esm/index.mjs.map +4 -4
  6. package/dist/lib/node-esm/meta.json +1 -1
  7. package/dist/types/src/components/index.d.ts +0 -2
  8. package/dist/types/src/components/index.d.ts.map +1 -1
  9. package/dist/types/src/decorators/index.d.ts +1 -2
  10. package/dist/types/src/decorators/index.d.ts.map +1 -1
  11. package/dist/types/src/decorators/withLayout.d.ts +1 -19
  12. package/dist/types/src/decorators/withLayout.d.ts.map +1 -1
  13. package/dist/types/src/decorators/withRegistry.d.ts +6 -0
  14. package/dist/types/src/decorators/withRegistry.d.ts.map +1 -0
  15. package/dist/types/src/index.d.ts +0 -2
  16. package/dist/types/src/index.d.ts.map +1 -1
  17. package/dist/types/src/stories/test/Test.d.ts.map +1 -1
  18. package/dist/types/src/stories/test/Test.stories.d.ts +3 -18
  19. package/dist/types/src/stories/test/Test.stories.d.ts.map +1 -1
  20. package/dist/types/tsconfig.tsbuildinfo +1 -1
  21. package/package.json +20 -21
  22. package/src/components/index.ts +0 -4
  23. package/src/decorators/index.ts +1 -2
  24. package/src/decorators/withLayout.tsx +15 -77
  25. package/src/decorators/withRegistry.tsx +23 -0
  26. package/src/index.ts +0 -6
  27. package/src/stories/test/Test.stories.tsx +4 -6
  28. package/src/stories/test/Test.test.tsx +1 -10
  29. package/src/stories/test/Test.tsx +1 -1
  30. package/dist/types/src/components/CardContainers/ExtrinsicCardContainer.d.ts +0 -12
  31. package/dist/types/src/components/CardContainers/ExtrinsicCardContainer.d.ts.map +0 -1
  32. package/dist/types/src/components/CardContainers/IntrinsicCardContainer.d.ts +0 -9
  33. package/dist/types/src/components/CardContainers/IntrinsicCardContainer.d.ts.map +0 -1
  34. package/dist/types/src/components/CardContainers/PopoverCardContainer.d.ts +0 -5
  35. package/dist/types/src/components/CardContainers/PopoverCardContainer.d.ts.map +0 -1
  36. package/dist/types/src/components/CardContainers/index.d.ts +0 -4
  37. package/dist/types/src/components/CardContainers/index.d.ts.map +0 -1
  38. package/dist/types/src/components/ThemeEditor.d.ts +0 -5
  39. package/dist/types/src/components/ThemeEditor.d.ts.map +0 -1
  40. package/dist/types/src/decorators/withTheme.d.ts +0 -6
  41. package/dist/types/src/decorators/withTheme.d.ts.map +0 -1
  42. package/dist/types/src/decorators/withThemeEditor.d.ts +0 -6
  43. package/dist/types/src/decorators/withThemeEditor.d.ts.map +0 -1
  44. package/dist/types/src/util.d.ts +0 -6
  45. package/dist/types/src/util.d.ts.map +0 -1
  46. package/src/components/CardContainers/ExtrinsicCardContainer.tsx +0 -72
  47. package/src/components/CardContainers/IntrinsicCardContainer.tsx +0 -48
  48. package/src/components/CardContainers/PopoverCardContainer.tsx +0 -24
  49. package/src/components/CardContainers/index.ts +0 -7
  50. package/src/components/ThemeEditor.tsx +0 -18
  51. package/src/decorators/withTheme.tsx +0 -30
  52. package/src/decorators/withThemeEditor.tsx +0 -28
  53. package/src/util.tsx +0 -12
@@ -1,190 +1,29 @@
1
- // src/index.ts
2
- import { registerSignalsRuntime } from "@dxos/echo-signals/react";
3
-
4
- // src/components/ThemeEditor.tsx
5
- import React, { memo } from "react";
6
- import { DxThemeEditor as NaturalDxThemeEditor } from "@dxos/lit-theme-editor";
7
- import { createComponent } from "@dxos/lit-ui/react";
8
- import "@dxos/lit-theme-editor/dx-theme-editor.pcss";
9
- var DxThemeEditor = createComponent({
10
- tagName: "dx-theme-editor",
11
- elementClass: NaturalDxThemeEditor,
12
- react: React
13
- });
14
- var ThemeEditor = /* @__PURE__ */ memo(DxThemeEditor);
15
-
16
- // src/components/CardContainers/ExtrinsicCardContainer.tsx
17
- import { useControllableState } from "@radix-ui/react-use-controllable-state";
18
- import React2 from "react";
19
- import { ResizeHandle, resizeAttributes, sizeStyle } from "@dxos/react-ui-dnd";
20
- var DEFAULT_INLINE_SIZE = 24;
21
- var MIN_INLINE_SIZE = 8;
22
- var DEFAULT_BLOCK_SIZE = 24;
23
- var MIN_BLOCK_SIZE = 8;
24
- var ExtrinsicCardContainer = ({ children, defaultInlineSize, inlineSize: propInlineSize, defaultBlockSize, blockSize: propBlockSize, onInlineSizeChange, onBlockSizeChange }) => {
25
- const [inlineSize = DEFAULT_INLINE_SIZE, setInlineSize] = useControllableState({
26
- prop: propInlineSize,
27
- defaultProp: defaultInlineSize,
28
- onChange: onInlineSizeChange
29
- });
30
- const [blockSize = DEFAULT_BLOCK_SIZE, setBlockSize] = useControllableState({
31
- prop: propBlockSize,
32
- defaultProp: defaultBlockSize,
33
- onChange: onBlockSizeChange
34
- });
35
- return /* @__PURE__ */ React2.createElement("div", {
36
- className: "grid relative border border-dashed border-subduedSeparator p-4 rounded-lg overflow-hidden contain-layout",
37
- style: {
38
- ...sizeStyle(inlineSize, "horizontal"),
39
- ...sizeStyle(blockSize, "vertical")
40
- },
41
- ...resizeAttributes
42
- }, children, /* @__PURE__ */ React2.createElement(ResizeHandle, {
43
- side: "inline-end",
44
- fallbackSize: DEFAULT_INLINE_SIZE,
45
- minSize: MIN_INLINE_SIZE,
46
- size: inlineSize,
47
- onSizeChange: setInlineSize
48
- }), /* @__PURE__ */ React2.createElement(ResizeHandle, {
49
- side: "block-end",
50
- fallbackSize: DEFAULT_BLOCK_SIZE,
51
- minSize: MIN_BLOCK_SIZE,
52
- size: blockSize,
53
- onSizeChange: setBlockSize
54
- }));
55
- };
56
-
57
- // src/components/CardContainers/IntrinsicCardContainer.tsx
58
- import { useControllableState as useControllableState2 } from "@radix-ui/react-use-controllable-state";
59
- import React3 from "react";
60
- import { ResizeHandle as ResizeHandle2, resizeAttributes as resizeAttributes2, sizeStyle as sizeStyle2 } from "@dxos/react-ui-dnd";
61
- var DEFAULT_SIZE = 24;
62
- var MIN_SIZE = 8;
63
- var IntrinsicCardContainer = ({ children, defaultSize, size: propSize, onSizeChange }) => {
64
- const [size = DEFAULT_SIZE, setSize] = useControllableState2({
65
- prop: propSize,
66
- defaultProp: defaultSize,
67
- onChange: onSizeChange
68
- });
69
- return /* @__PURE__ */ React3.createElement("div", {
70
- className: "relative border border-dashed border-subduedSeparator p-4 rounded-lg",
71
- style: sizeStyle2(size, "horizontal"),
72
- ...resizeAttributes2
73
- }, children, /* @__PURE__ */ React3.createElement(ResizeHandle2, {
74
- side: "inline-end",
75
- fallbackSize: DEFAULT_SIZE,
76
- minSize: MIN_SIZE,
77
- size,
78
- onSizeChange: setSize
79
- }));
80
- };
81
-
82
- // src/components/CardContainers/PopoverCardContainer.tsx
83
- import React4 from "react";
84
- import { Icon, Popover } from "@dxos/react-ui";
85
- var PopoverCardContainer = ({ children, icon = "ph--placeholder--regular" }) => {
86
- return /* @__PURE__ */ React4.createElement(Popover.Root, {
87
- open: true
88
- }, /* @__PURE__ */ React4.createElement(Popover.Content, {
89
- onOpenAutoFocus: (event) => event.preventDefault()
90
- }, /* @__PURE__ */ React4.createElement(Popover.Viewport, null, children), /* @__PURE__ */ React4.createElement(Popover.Arrow, null)), /* @__PURE__ */ React4.createElement(Popover.Trigger, null, /* @__PURE__ */ React4.createElement(Icon, {
91
- icon,
92
- size: 5
93
- })));
94
- };
95
-
96
1
  // src/decorators/withLayout.tsx
97
- import defaultsDeep from "lodash.defaultsdeep";
98
- import React5 from "react";
99
- import { DensityProvider } from "@dxos/react-ui";
100
- import { mx } from "@dxos/react-ui-theme";
101
- var defaultOptions = {
102
- density: "fine"
103
- };
104
- var providers = [
105
- (children, options) => {
106
- return options?.density ? /* @__PURE__ */ React5.createElement(DensityProvider, {
107
- density: options.density
108
- }, children) : children;
2
+ import React from "react";
3
+ var withLayout = (Story, context) => {
4
+ switch (context.parameters.layout) {
5
+ case "fullscreen":
6
+ return /* @__PURE__ */ React.createElement("div", {
7
+ role: "none",
8
+ className: "fixed inset-0 flex flex-col overflow-hidden bg-base-surface"
9
+ }, /* @__PURE__ */ React.createElement(Story, null));
10
+ default:
11
+ return /* @__PURE__ */ React.createElement(Story, null);
109
12
  }
110
- ];
111
- var withLayout = ({ classNames, fullscreen, Container = fullscreen ? FullscreenContainer : DefaultContainer, ...providedOptions } = {}) => {
112
- return (Story, _context) => {
113
- const children = /* @__PURE__ */ React5.createElement(Container, {
114
- classNames,
115
- fullscreen
116
- }, /* @__PURE__ */ React5.createElement(Story, null));
117
- const options = defaultsDeep({}, providedOptions, defaultOptions);
118
- return providers.reduceRight((acc, provider) => provider(acc, options), children);
119
- };
120
- };
121
- var layoutCentered = "bg-deckSurface justify-center overflow-y-auto";
122
- var DefaultContainer = ({ children, classNames }) => {
123
- return /* @__PURE__ */ React5.createElement("div", {
124
- role: "none",
125
- className: mx(classNames)
126
- }, children);
127
- };
128
- var FullscreenContainer = ({ children, classNames }) => {
129
- return /* @__PURE__ */ React5.createElement("div", {
130
- role: "none",
131
- className: mx("fixed inset-0 flex overflow-hidden", classNames)
132
- }, children);
133
- };
134
- var ColumnContainer = ({ children, classNames = "w-[30rem]", ...props }) => {
135
- return /* @__PURE__ */ React5.createElement(FullscreenContainer, {
136
- classNames: "justify-center bg-modalSurface",
137
- ...props
138
- }, /* @__PURE__ */ React5.createElement("div", {
139
- role: "none",
140
- className: mx("flex flex-col h-full overflow-y-auto bg-baseSurface", classNames)
141
- }, children));
142
13
  };
143
14
 
144
- // src/decorators/withTheme.tsx
145
- import React6, { memo as memo2 } from "react";
146
- import { ThemeProvider, Tooltip } from "@dxos/react-ui";
147
- import { defaultTx } from "@dxos/react-ui-theme";
148
- var withTheme = (Story, context) => {
149
- const { globals: { theme }, parameters: { translations } } = context;
150
- const MemoizedStory = /* @__PURE__ */ memo2(Story);
151
- return /* @__PURE__ */ React6.createElement(ThemeProvider, {
152
- tx: defaultTx,
153
- themeMode: theme,
154
- resourceExtensions: translations,
155
- noCache: true
156
- }, /* @__PURE__ */ React6.createElement(Tooltip.Provider, null, /* @__PURE__ */ React6.createElement(MemoizedStory, null)));
15
+ // src/decorators/withRegistry.tsx
16
+ import { Registry, RegistryContext } from "@effect-atom/atom-react";
17
+ import React2, { memo, useMemo } from "react";
18
+ var withRegistry = (Story) => {
19
+ const registry = useMemo(() => Registry.make(), []);
20
+ const MemoizedStory = /* @__PURE__ */ memo(Story);
21
+ return /* @__PURE__ */ React2.createElement(RegistryContext.Provider, {
22
+ value: registry
23
+ }, /* @__PURE__ */ React2.createElement(MemoizedStory, null));
157
24
  };
158
-
159
- // src/decorators/withThemeEditor.tsx
160
- import React7, { memo as memo3 } from "react";
161
- var withThemeEditor = (Story, context) => {
162
- const MemoizedStory = /* @__PURE__ */ memo3(Story);
163
- return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(MemoizedStory, null), /* @__PURE__ */ React7.createElement("div", {
164
- className: "absolute top-4 bottom-4 right-4 z-10"
165
- }, /* @__PURE__ */ React7.createElement("div", {
166
- className: "h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded"
167
- }, /* @__PURE__ */ React7.createElement(ThemeEditor, null))));
168
- };
169
-
170
- // src/util.tsx
171
- import React8 from "react";
172
- var render = (r) => (args) => /* @__PURE__ */ React8.createElement(React8.Fragment, null, r(args) ?? /* @__PURE__ */ React8.createElement("div", null));
173
-
174
- // src/index.ts
175
- registerSignalsRuntime();
176
25
  export {
177
- ColumnContainer,
178
- DefaultContainer,
179
- ExtrinsicCardContainer,
180
- FullscreenContainer,
181
- IntrinsicCardContainer,
182
- PopoverCardContainer,
183
- ThemeEditor,
184
- layoutCentered,
185
- render,
186
26
  withLayout,
187
- withTheme,
188
- withThemeEditor
27
+ withRegistry
189
28
  };
190
29
  //# sourceMappingURL=index.mjs.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/index.ts", "../../../src/components/ThemeEditor.tsx", "../../../src/components/CardContainers/ExtrinsicCardContainer.tsx", "../../../src/components/CardContainers/IntrinsicCardContainer.tsx", "../../../src/components/CardContainers/PopoverCardContainer.tsx", "../../../src/decorators/withLayout.tsx", "../../../src/decorators/withTheme.tsx", "../../../src/decorators/withThemeEditor.tsx", "../../../src/util.tsx"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { registerSignalsRuntime } from '@dxos/echo-signals/react';\n\nexport * from './components';\nexport * from './decorators';\nexport * from './util';\n\nregisterSignalsRuntime();\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { memo } from 'react';\n\nimport { DxThemeEditor as NaturalDxThemeEditor } from '@dxos/lit-theme-editor';\nimport { createComponent } from '@dxos/lit-ui/react';\n\nimport '@dxos/lit-theme-editor/dx-theme-editor.pcss';\n\nconst DxThemeEditor = createComponent({\n tagName: 'dx-theme-editor',\n elementClass: NaturalDxThemeEditor,\n react: React,\n});\n\nexport const ThemeEditor = memo(DxThemeEditor);\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type PropsWithChildren } from 'react';\n\nimport { ResizeHandle, type Size, resizeAttributes, sizeStyle } from '@dxos/react-ui-dnd';\n\n// Default size in rem\nconst DEFAULT_INLINE_SIZE = 24;\nconst MIN_INLINE_SIZE = 8;\nconst DEFAULT_BLOCK_SIZE = 24;\nconst MIN_BLOCK_SIZE = 8;\n\nexport type ExtrinsicCardContainerProps = PropsWithChildren<{\n defaultInlineSize?: Size;\n inlineSize?: Size;\n defaultBlockSize?: Size;\n blockSize?: Size;\n onInlineSizeChange?: (size: Size, commit?: boolean) => void;\n onBlockSizeChange?: (size: Size, commit?: boolean) => void;\n}>;\n\nexport const ExtrinsicCardContainer = ({\n children,\n defaultInlineSize,\n inlineSize: propInlineSize,\n defaultBlockSize,\n blockSize: propBlockSize,\n onInlineSizeChange,\n onBlockSizeChange,\n}: ExtrinsicCardContainerProps) => {\n const [inlineSize = DEFAULT_INLINE_SIZE, setInlineSize] = useControllableState<Size>({\n prop: propInlineSize,\n defaultProp: defaultInlineSize,\n onChange: onInlineSizeChange,\n });\n\n const [blockSize = DEFAULT_BLOCK_SIZE, setBlockSize] = useControllableState<Size>({\n prop: propBlockSize,\n defaultProp: defaultBlockSize,\n onChange: onBlockSizeChange,\n });\n\n return (\n <div\n className='grid relative border border-dashed border-subduedSeparator p-4 rounded-lg overflow-hidden contain-layout'\n style={{\n ...sizeStyle(inlineSize, 'horizontal'),\n ...sizeStyle(blockSize, 'vertical'),\n }}\n {...resizeAttributes}\n >\n {children}\n <ResizeHandle\n side='inline-end'\n fallbackSize={DEFAULT_INLINE_SIZE}\n minSize={MIN_INLINE_SIZE}\n size={inlineSize}\n onSizeChange={setInlineSize}\n />\n <ResizeHandle\n side='block-end'\n fallbackSize={DEFAULT_BLOCK_SIZE}\n minSize={MIN_BLOCK_SIZE}\n size={blockSize}\n onSizeChange={setBlockSize}\n />\n </div>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type PropsWithChildren } from 'react';\n\nimport { ResizeHandle, type Size, resizeAttributes, sizeStyle } from '@dxos/react-ui-dnd';\n\n// Default size in rem\nconst DEFAULT_SIZE = 24;\nconst MIN_SIZE = 8;\n\nexport type IntrinsicCardContainerProps = PropsWithChildren<{\n defaultSize?: Size;\n size?: Size;\n onSizeChange?: (size: Size, commit?: boolean) => void;\n}>;\n\nexport const IntrinsicCardContainer = ({\n children,\n defaultSize,\n size: propSize,\n onSizeChange,\n}: IntrinsicCardContainerProps) => {\n const [size = DEFAULT_SIZE, setSize] = useControllableState<Size>({\n prop: propSize,\n defaultProp: defaultSize,\n onChange: onSizeChange,\n });\n\n return (\n <div\n className='relative border border-dashed border-subduedSeparator p-4 rounded-lg'\n style={sizeStyle(size, 'horizontal')}\n {...resizeAttributes}\n >\n {children}\n <ResizeHandle\n side='inline-end'\n fallbackSize={DEFAULT_SIZE}\n minSize={MIN_SIZE}\n size={size}\n onSizeChange={setSize}\n />\n </div>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { type PropsWithChildren } from 'react';\n\nimport { Icon, Popover } from '@dxos/react-ui';\n\nexport const PopoverCardContainer = ({\n children,\n icon = 'ph--placeholder--regular',\n}: PropsWithChildren<{ icon: string }>) => {\n return (\n <Popover.Root open>\n <Popover.Content onOpenAutoFocus={(event) => event.preventDefault()}>\n <Popover.Viewport>{children}</Popover.Viewport>\n <Popover.Arrow />\n </Popover.Content>\n <Popover.Trigger>\n <Icon icon={icon} size={5} />\n </Popover.Trigger>\n </Popover.Root>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport React, { type FC, type JSX, type PropsWithChildren } from 'react';\n\nimport { type Density, DensityProvider, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\ntype ProviderOptions = {\n fullscreen?: boolean;\n density?: Density;\n};\n\nconst defaultOptions: ProviderOptions = {\n density: 'fine',\n};\n\ntype Provider = (children: JSX.Element, options: ProviderOptions) => JSX.Element;\n\nconst providers: Provider[] = [\n (children, options) => {\n return options?.density ? <DensityProvider density={options.density}>{children}</DensityProvider> : children;\n },\n];\n\nexport type ContainerProps = ThemedClassName<PropsWithChildren<Pick<ProviderOptions, 'fullscreen'>>>;\n\nexport type WithLayoutProps = ThemedClassName<ProviderOptions & { Container?: FC<ContainerProps> }>;\n\n/**\n * Decorator to layout the story container, adding optional providers.\n */\nexport const withLayout = ({\n classNames,\n fullscreen,\n Container = fullscreen ? FullscreenContainer : DefaultContainer,\n ...providedOptions\n}: WithLayoutProps = {}): Decorator => {\n // TODO(burdon): Inspect \"fullscreen\" parameter in context.\n return (Story, _context) => {\n const children = (\n <Container classNames={classNames} fullscreen={fullscreen}>\n <Story />\n </Container>\n );\n\n const options = defaultsDeep({}, providedOptions, defaultOptions);\n return providers.reduceRight((acc, provider) => provider(acc, options), children);\n };\n};\n\n// TODO(burdon): Use consistently.\nexport const layoutCentered = 'bg-deckSurface justify-center overflow-y-auto';\n\nexport const DefaultContainer = ({ children, classNames }: ContainerProps) => {\n return (\n <div role='none' className={mx(classNames)}>\n {children}\n </div>\n );\n};\n\nexport const FullscreenContainer = ({ children, classNames }: ContainerProps) => {\n return (\n <div role='none' className={mx('fixed inset-0 flex overflow-hidden', classNames)}>\n {children}\n </div>\n );\n};\n\nexport const ColumnContainer = ({ children, classNames = 'w-[30rem]', ...props }: ContainerProps) => {\n return (\n <FullscreenContainer classNames='justify-center bg-modalSurface' {...props}>\n <div role='none' className={mx('flex flex-col h-full overflow-y-auto bg-baseSurface', classNames)}>\n {children}\n </div>\n </FullscreenContainer>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React, { memo } from 'react';\n\nimport { type ThemeMode, ThemeProvider, Tooltip } from '@dxos/react-ui';\nimport { defaultTx } from '@dxos/react-ui-theme';\n\n/**\n * Adds theme decorator.\n */\nexport const withTheme: Decorator = (Story, context) => {\n const {\n globals: { theme },\n parameters: { translations },\n } = context;\n\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n\n return (\n <ThemeProvider tx={defaultTx} themeMode={theme as ThemeMode} resourceExtensions={translations} noCache>\n <Tooltip.Provider>\n <MemoizedStory />\n </Tooltip.Provider>\n </ThemeProvider>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React, { memo } from 'react';\n\nimport { ThemeEditor } from '../components';\n\n/**\n * Show theme editor.\n */\n// TODO(burdon): Ideally move to storybook-addon-theme, but this has a build issue since the addon would depend on the vite theme plugin.\nexport const withThemeEditor: Decorator = (Story, context) => {\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n\n return (\n <>\n <MemoizedStory />\n <div className='absolute top-4 bottom-4 right-4 z-10'>\n <div className='h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded'>\n <ThemeEditor />\n </div>\n </div>\n </>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type FC } from 'react';\n\n/**\n * Story renderer wrapper.\n */\nexport const render =\n <T,>(r: FC<T>) =>\n (args: T) => <>{r(args) ?? <div />}</>;\n"],
5
- "mappings": "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",
6
- "names": ["registerSignalsRuntime", "React", "memo", "DxThemeEditor", "NaturalDxThemeEditor", "createComponent", "DxThemeEditor", "createComponent", "tagName", "elementClass", "NaturalDxThemeEditor", "react", "React", "ThemeEditor", "memo", "useControllableState", "React", "ResizeHandle", "resizeAttributes", "sizeStyle", "DEFAULT_INLINE_SIZE", "MIN_INLINE_SIZE", "DEFAULT_BLOCK_SIZE", "MIN_BLOCK_SIZE", "ExtrinsicCardContainer", "children", "defaultInlineSize", "inlineSize", "propInlineSize", "defaultBlockSize", "blockSize", "propBlockSize", "onInlineSizeChange", "onBlockSizeChange", "setInlineSize", "useControllableState", "prop", "defaultProp", "onChange", "setBlockSize", "React", "div", "className", "style", "sizeStyle", "resizeAttributes", "ResizeHandle", "side", "fallbackSize", "minSize", "size", "onSizeChange", "useControllableState", "React", "ResizeHandle", "resizeAttributes", "sizeStyle", "DEFAULT_SIZE", "MIN_SIZE", "IntrinsicCardContainer", "children", "defaultSize", "size", "propSize", "onSizeChange", "setSize", "useControllableState", "prop", "defaultProp", "onChange", "React", "div", "className", "style", "sizeStyle", "resizeAttributes", "ResizeHandle", "side", "fallbackSize", "minSize", "React", "Icon", "Popover", "PopoverCardContainer", "children", "icon", "React", "Popover", "Root", "open", "Content", "onOpenAutoFocus", "event", "preventDefault", "Viewport", "Arrow", "Trigger", "Icon", "size", "defaultsDeep", "React", "DensityProvider", "mx", "defaultOptions", "density", "providers", "children", "options", "React", "DensityProvider", "withLayout", "classNames", "fullscreen", "Container", "FullscreenContainer", "DefaultContainer", "providedOptions", "Story", "_context", "defaultsDeep", "reduceRight", "acc", "provider", "layoutCentered", "div", "role", "className", "mx", "ColumnContainer", "props", "React", "memo", "ThemeProvider", "Tooltip", "defaultTx", "withTheme", "Story", "context", "globals", "theme", "parameters", "translations", "MemoizedStory", "memo", "React", "ThemeProvider", "tx", "defaultTx", "themeMode", "resourceExtensions", "noCache", "Tooltip", "Provider", "React", "memo", "withThemeEditor", "Story", "context", "MemoizedStory", "memo", "React", "div", "className", "ThemeEditor", "React", "render", "r", "args", "React", "div", "registerSignalsRuntime"]
3
+ "sources": ["../../../src/decorators/withLayout.tsx", "../../../src/decorators/withRegistry.tsx"],
4
+ "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React from 'react';\n\nexport const withLayout: Decorator = (Story, context) => {\n switch (context.parameters.layout) {\n case 'fullscreen':\n return (\n <div role='none' className='fixed inset-0 flex flex-col overflow-hidden bg-base-surface'>\n <Story />\n </div>\n );\n\n default:\n return <Story />;\n }\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { Registry, RegistryContext } from '@effect-atom/atom-react';\nimport { type Decorator } from '@storybook/react';\nimport React, { memo, useMemo } from 'react';\n\n/**\n * Adds Effect Atom registry context for storybook.\n */\nexport const withRegistry: Decorator = (Story) => {\n const registry = useMemo(() => Registry.make(), []);\n\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n\n return (\n <RegistryContext.Provider value={registry}>\n <MemoizedStory />\n </RegistryContext.Provider>\n );\n};\n"],
5
+ "mappings": ";AAKA,OAAOA,WAAW;AAEX,IAAMC,aAAwB,CAACC,OAAOC,YAAAA;AAC3C,UAAQA,QAAQC,WAAWC,QAAM;IAC/B,KAAK;AACH,aACE,sBAAA,cAACC,OAAAA;QAAIC,MAAK;QAAOC,WAAU;SACzB,sBAAA,cAACN,OAAAA,IAAAA,CAAAA;IAIP;AACE,aAAO,sBAAA,cAACA,OAAAA,IAAAA;EACZ;AACF;;;ACfA,SAASO,UAAUC,uBAAuB;AAE1C,OAAOC,UAASC,MAAMC,eAAe;AAK9B,IAAMC,eAA0B,CAACC,UAAAA;AACtC,QAAMC,WAAWH,QAAQ,MAAMJ,SAASQ,KAAI,GAAI,CAAA,CAAE;AAGlD,QAAMC,gBAAgBN,qBAAKG,KAAAA;AAE3B,SACE,gBAAAJ,OAAA,cAACD,gBAAgBS,UAAQ;IAACC,OAAOJ;KAC/B,gBAAAL,OAAA,cAACO,eAAAA,IAAAA,CAAAA;AAGP;",
6
+ "names": ["React", "withLayout", "Story", "context", "parameters", "layout", "div", "role", "className", "Registry", "RegistryContext", "React", "memo", "useMemo", "withRegistry", "Story", "registry", "make", "MemoizedStory", "Provider", "value"]
7
7
  }
@@ -1 +1 @@
1
- {"inputs":{"src/components/ThemeEditor.tsx":{"bytes":1828,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor","kind":"import-statement","external":true},{"path":"@dxos/lit-ui/react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor/dx-theme-editor.pcss","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/ExtrinsicCardContainer.tsx":{"bytes":6610,"imports":[{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/IntrinsicCardContainer.tsx":{"bytes":4021,"imports":[{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/PopoverCardContainer.tsx":{"bytes":2566,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/index.ts":{"bytes":764,"imports":[{"path":"src/components/CardContainers/ExtrinsicCardContainer.tsx","kind":"import-statement","original":"./ExtrinsicCardContainer"},{"path":"src/components/CardContainers/IntrinsicCardContainer.tsx","kind":"import-statement","original":"./IntrinsicCardContainer"},{"path":"src/components/CardContainers/PopoverCardContainer.tsx","kind":"import-statement","original":"./PopoverCardContainer"}],"format":"esm"},"src/components/index.ts":{"bytes":686,"imports":[{"path":"src/components/ThemeEditor.tsx","kind":"import-statement","original":"./ThemeEditor"},{"path":"src/components/CardContainers/index.ts","kind":"import-statement","original":"./CardContainers"}],"format":"esm"},"src/decorators/withLayout.tsx":{"bytes":7744,"imports":[{"path":"lodash.defaultsdeep","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withTheme.tsx":{"bytes":2822,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withThemeEditor.tsx":{"bytes":2713,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"src/components/index.ts","kind":"import-statement","original":"../components"}],"format":"esm"},"src/decorators/index.ts":{"bytes":671,"imports":[{"path":"src/decorators/withLayout.tsx","kind":"import-statement","original":"./withLayout"},{"path":"src/decorators/withTheme.tsx","kind":"import-statement","original":"./withTheme"},{"path":"src/decorators/withThemeEditor.tsx","kind":"import-statement","original":"./withThemeEditor"}],"format":"esm"},"src/util.tsx":{"bytes":999,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":943,"imports":[{"path":"@dxos/echo-signals/react","kind":"import-statement","external":true},{"path":"src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"src/decorators/index.ts","kind":"import-statement","original":"./decorators"},{"path":"src/util.tsx","kind":"import-statement","original":"./util"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":15640},"dist/lib/browser/index.mjs":{"imports":[{"path":"@dxos/echo-signals/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor","kind":"import-statement","external":true},{"path":"@dxos/lit-ui/react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor/dx-theme-editor.pcss","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"lodash.defaultsdeep","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["ColumnContainer","DefaultContainer","ExtrinsicCardContainer","FullscreenContainer","IntrinsicCardContainer","PopoverCardContainer","ThemeEditor","layoutCentered","render","withLayout","withTheme","withThemeEditor"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":93},"src/components/ThemeEditor.tsx":{"bytesInOutput":405},"src/components/index.ts":{"bytesInOutput":0},"src/components/CardContainers/ExtrinsicCardContainer.tsx":{"bytesInOutput":1572},"src/components/CardContainers/index.ts":{"bytesInOutput":0},"src/components/CardContainers/IntrinsicCardContainer.tsx":{"bytesInOutput":949},"src/components/CardContainers/PopoverCardContainer.tsx":{"bytesInOutput":626},"src/decorators/withLayout.tsx":{"bytesInOutput":1764},"src/decorators/index.ts":{"bytesInOutput":0},"src/decorators/withTheme.tsx":{"bytesInOutput":608},"src/decorators/withThemeEditor.tsx":{"bytesInOutput":588},"src/util.tsx":{"bytesInOutput":181}},"bytes":7431}}}
1
+ {"inputs":{"src/decorators/withLayout.tsx":{"bytes":1705,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withRegistry.tsx":{"bytes":2112,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/index.ts":{"bytes":482,"imports":[{"path":"src/decorators/withLayout.tsx","kind":"import-statement","original":"./withLayout"},{"path":"src/decorators/withRegistry.tsx","kind":"import-statement","original":"./withRegistry"}],"format":"esm"},"src/index.ts":{"bytes":382,"imports":[{"path":"src/decorators/index.ts","kind":"import-statement","original":"./decorators"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":1968},"dist/lib/browser/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["withLayout","withRegistry"],"entryPoint":"src/index.ts","inputs":{"src/decorators/withLayout.tsx":{"bytesInOutput":432},"src/decorators/index.ts":{"bytesInOutput":0},"src/decorators/withRegistry.tsx":{"bytesInOutput":418},"src/index.ts":{"bytesInOutput":0}},"bytes":995}}}
@@ -1,192 +1,31 @@
1
1
  import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
2
2
 
3
- // src/index.ts
4
- import { registerSignalsRuntime } from "@dxos/echo-signals/react";
5
-
6
- // src/components/ThemeEditor.tsx
7
- import React, { memo } from "react";
8
- import { DxThemeEditor as NaturalDxThemeEditor } from "@dxos/lit-theme-editor";
9
- import { createComponent } from "@dxos/lit-ui/react";
10
- import "@dxos/lit-theme-editor/dx-theme-editor.pcss";
11
- var DxThemeEditor = createComponent({
12
- tagName: "dx-theme-editor",
13
- elementClass: NaturalDxThemeEditor,
14
- react: React
15
- });
16
- var ThemeEditor = /* @__PURE__ */ memo(DxThemeEditor);
17
-
18
- // src/components/CardContainers/ExtrinsicCardContainer.tsx
19
- import { useControllableState } from "@radix-ui/react-use-controllable-state";
20
- import React2 from "react";
21
- import { ResizeHandle, resizeAttributes, sizeStyle } from "@dxos/react-ui-dnd";
22
- var DEFAULT_INLINE_SIZE = 24;
23
- var MIN_INLINE_SIZE = 8;
24
- var DEFAULT_BLOCK_SIZE = 24;
25
- var MIN_BLOCK_SIZE = 8;
26
- var ExtrinsicCardContainer = ({ children, defaultInlineSize, inlineSize: propInlineSize, defaultBlockSize, blockSize: propBlockSize, onInlineSizeChange, onBlockSizeChange }) => {
27
- const [inlineSize = DEFAULT_INLINE_SIZE, setInlineSize] = useControllableState({
28
- prop: propInlineSize,
29
- defaultProp: defaultInlineSize,
30
- onChange: onInlineSizeChange
31
- });
32
- const [blockSize = DEFAULT_BLOCK_SIZE, setBlockSize] = useControllableState({
33
- prop: propBlockSize,
34
- defaultProp: defaultBlockSize,
35
- onChange: onBlockSizeChange
36
- });
37
- return /* @__PURE__ */ React2.createElement("div", {
38
- className: "grid relative border border-dashed border-subduedSeparator p-4 rounded-lg overflow-hidden contain-layout",
39
- style: {
40
- ...sizeStyle(inlineSize, "horizontal"),
41
- ...sizeStyle(blockSize, "vertical")
42
- },
43
- ...resizeAttributes
44
- }, children, /* @__PURE__ */ React2.createElement(ResizeHandle, {
45
- side: "inline-end",
46
- fallbackSize: DEFAULT_INLINE_SIZE,
47
- minSize: MIN_INLINE_SIZE,
48
- size: inlineSize,
49
- onSizeChange: setInlineSize
50
- }), /* @__PURE__ */ React2.createElement(ResizeHandle, {
51
- side: "block-end",
52
- fallbackSize: DEFAULT_BLOCK_SIZE,
53
- minSize: MIN_BLOCK_SIZE,
54
- size: blockSize,
55
- onSizeChange: setBlockSize
56
- }));
57
- };
58
-
59
- // src/components/CardContainers/IntrinsicCardContainer.tsx
60
- import { useControllableState as useControllableState2 } from "@radix-ui/react-use-controllable-state";
61
- import React3 from "react";
62
- import { ResizeHandle as ResizeHandle2, resizeAttributes as resizeAttributes2, sizeStyle as sizeStyle2 } from "@dxos/react-ui-dnd";
63
- var DEFAULT_SIZE = 24;
64
- var MIN_SIZE = 8;
65
- var IntrinsicCardContainer = ({ children, defaultSize, size: propSize, onSizeChange }) => {
66
- const [size = DEFAULT_SIZE, setSize] = useControllableState2({
67
- prop: propSize,
68
- defaultProp: defaultSize,
69
- onChange: onSizeChange
70
- });
71
- return /* @__PURE__ */ React3.createElement("div", {
72
- className: "relative border border-dashed border-subduedSeparator p-4 rounded-lg",
73
- style: sizeStyle2(size, "horizontal"),
74
- ...resizeAttributes2
75
- }, children, /* @__PURE__ */ React3.createElement(ResizeHandle2, {
76
- side: "inline-end",
77
- fallbackSize: DEFAULT_SIZE,
78
- minSize: MIN_SIZE,
79
- size,
80
- onSizeChange: setSize
81
- }));
82
- };
83
-
84
- // src/components/CardContainers/PopoverCardContainer.tsx
85
- import React4 from "react";
86
- import { Icon, Popover } from "@dxos/react-ui";
87
- var PopoverCardContainer = ({ children, icon = "ph--placeholder--regular" }) => {
88
- return /* @__PURE__ */ React4.createElement(Popover.Root, {
89
- open: true
90
- }, /* @__PURE__ */ React4.createElement(Popover.Content, {
91
- onOpenAutoFocus: (event) => event.preventDefault()
92
- }, /* @__PURE__ */ React4.createElement(Popover.Viewport, null, children), /* @__PURE__ */ React4.createElement(Popover.Arrow, null)), /* @__PURE__ */ React4.createElement(Popover.Trigger, null, /* @__PURE__ */ React4.createElement(Icon, {
93
- icon,
94
- size: 5
95
- })));
96
- };
97
-
98
3
  // src/decorators/withLayout.tsx
99
- import defaultsDeep from "lodash.defaultsdeep";
100
- import React5 from "react";
101
- import { DensityProvider } from "@dxos/react-ui";
102
- import { mx } from "@dxos/react-ui-theme";
103
- var defaultOptions = {
104
- density: "fine"
105
- };
106
- var providers = [
107
- (children, options) => {
108
- return options?.density ? /* @__PURE__ */ React5.createElement(DensityProvider, {
109
- density: options.density
110
- }, children) : children;
4
+ import React from "react";
5
+ var withLayout = (Story, context) => {
6
+ switch (context.parameters.layout) {
7
+ case "fullscreen":
8
+ return /* @__PURE__ */ React.createElement("div", {
9
+ role: "none",
10
+ className: "fixed inset-0 flex flex-col overflow-hidden bg-base-surface"
11
+ }, /* @__PURE__ */ React.createElement(Story, null));
12
+ default:
13
+ return /* @__PURE__ */ React.createElement(Story, null);
111
14
  }
112
- ];
113
- var withLayout = ({ classNames, fullscreen, Container = fullscreen ? FullscreenContainer : DefaultContainer, ...providedOptions } = {}) => {
114
- return (Story, _context) => {
115
- const children = /* @__PURE__ */ React5.createElement(Container, {
116
- classNames,
117
- fullscreen
118
- }, /* @__PURE__ */ React5.createElement(Story, null));
119
- const options = defaultsDeep({}, providedOptions, defaultOptions);
120
- return providers.reduceRight((acc, provider) => provider(acc, options), children);
121
- };
122
- };
123
- var layoutCentered = "bg-deckSurface justify-center overflow-y-auto";
124
- var DefaultContainer = ({ children, classNames }) => {
125
- return /* @__PURE__ */ React5.createElement("div", {
126
- role: "none",
127
- className: mx(classNames)
128
- }, children);
129
- };
130
- var FullscreenContainer = ({ children, classNames }) => {
131
- return /* @__PURE__ */ React5.createElement("div", {
132
- role: "none",
133
- className: mx("fixed inset-0 flex overflow-hidden", classNames)
134
- }, children);
135
- };
136
- var ColumnContainer = ({ children, classNames = "w-[30rem]", ...props }) => {
137
- return /* @__PURE__ */ React5.createElement(FullscreenContainer, {
138
- classNames: "justify-center bg-modalSurface",
139
- ...props
140
- }, /* @__PURE__ */ React5.createElement("div", {
141
- role: "none",
142
- className: mx("flex flex-col h-full overflow-y-auto bg-baseSurface", classNames)
143
- }, children));
144
15
  };
145
16
 
146
- // src/decorators/withTheme.tsx
147
- import React6, { memo as memo2 } from "react";
148
- import { ThemeProvider, Tooltip } from "@dxos/react-ui";
149
- import { defaultTx } from "@dxos/react-ui-theme";
150
- var withTheme = (Story, context) => {
151
- const { globals: { theme }, parameters: { translations } } = context;
152
- const MemoizedStory = /* @__PURE__ */ memo2(Story);
153
- return /* @__PURE__ */ React6.createElement(ThemeProvider, {
154
- tx: defaultTx,
155
- themeMode: theme,
156
- resourceExtensions: translations,
157
- noCache: true
158
- }, /* @__PURE__ */ React6.createElement(Tooltip.Provider, null, /* @__PURE__ */ React6.createElement(MemoizedStory, null)));
17
+ // src/decorators/withRegistry.tsx
18
+ import { Registry, RegistryContext } from "@effect-atom/atom-react";
19
+ import React2, { memo, useMemo } from "react";
20
+ var withRegistry = (Story) => {
21
+ const registry = useMemo(() => Registry.make(), []);
22
+ const MemoizedStory = /* @__PURE__ */ memo(Story);
23
+ return /* @__PURE__ */ React2.createElement(RegistryContext.Provider, {
24
+ value: registry
25
+ }, /* @__PURE__ */ React2.createElement(MemoizedStory, null));
159
26
  };
160
-
161
- // src/decorators/withThemeEditor.tsx
162
- import React7, { memo as memo3 } from "react";
163
- var withThemeEditor = (Story, context) => {
164
- const MemoizedStory = /* @__PURE__ */ memo3(Story);
165
- return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(MemoizedStory, null), /* @__PURE__ */ React7.createElement("div", {
166
- className: "absolute top-4 bottom-4 right-4 z-10"
167
- }, /* @__PURE__ */ React7.createElement("div", {
168
- className: "h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded"
169
- }, /* @__PURE__ */ React7.createElement(ThemeEditor, null))));
170
- };
171
-
172
- // src/util.tsx
173
- import React8 from "react";
174
- var render = (r) => (args) => /* @__PURE__ */ React8.createElement(React8.Fragment, null, r(args) ?? /* @__PURE__ */ React8.createElement("div", null));
175
-
176
- // src/index.ts
177
- registerSignalsRuntime();
178
27
  export {
179
- ColumnContainer,
180
- DefaultContainer,
181
- ExtrinsicCardContainer,
182
- FullscreenContainer,
183
- IntrinsicCardContainer,
184
- PopoverCardContainer,
185
- ThemeEditor,
186
- layoutCentered,
187
- render,
188
28
  withLayout,
189
- withTheme,
190
- withThemeEditor
29
+ withRegistry
191
30
  };
192
31
  //# sourceMappingURL=index.mjs.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
- "sources": ["../../../src/index.ts", "../../../src/components/ThemeEditor.tsx", "../../../src/components/CardContainers/ExtrinsicCardContainer.tsx", "../../../src/components/CardContainers/IntrinsicCardContainer.tsx", "../../../src/components/CardContainers/PopoverCardContainer.tsx", "../../../src/decorators/withLayout.tsx", "../../../src/decorators/withTheme.tsx", "../../../src/decorators/withThemeEditor.tsx", "../../../src/util.tsx"],
4
- "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { registerSignalsRuntime } from '@dxos/echo-signals/react';\n\nexport * from './components';\nexport * from './decorators';\nexport * from './util';\n\nregisterSignalsRuntime();\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { memo } from 'react';\n\nimport { DxThemeEditor as NaturalDxThemeEditor } from '@dxos/lit-theme-editor';\nimport { createComponent } from '@dxos/lit-ui/react';\n\nimport '@dxos/lit-theme-editor/dx-theme-editor.pcss';\n\nconst DxThemeEditor = createComponent({\n tagName: 'dx-theme-editor',\n elementClass: NaturalDxThemeEditor,\n react: React,\n});\n\nexport const ThemeEditor = memo(DxThemeEditor);\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type PropsWithChildren } from 'react';\n\nimport { ResizeHandle, type Size, resizeAttributes, sizeStyle } from '@dxos/react-ui-dnd';\n\n// Default size in rem\nconst DEFAULT_INLINE_SIZE = 24;\nconst MIN_INLINE_SIZE = 8;\nconst DEFAULT_BLOCK_SIZE = 24;\nconst MIN_BLOCK_SIZE = 8;\n\nexport type ExtrinsicCardContainerProps = PropsWithChildren<{\n defaultInlineSize?: Size;\n inlineSize?: Size;\n defaultBlockSize?: Size;\n blockSize?: Size;\n onInlineSizeChange?: (size: Size, commit?: boolean) => void;\n onBlockSizeChange?: (size: Size, commit?: boolean) => void;\n}>;\n\nexport const ExtrinsicCardContainer = ({\n children,\n defaultInlineSize,\n inlineSize: propInlineSize,\n defaultBlockSize,\n blockSize: propBlockSize,\n onInlineSizeChange,\n onBlockSizeChange,\n}: ExtrinsicCardContainerProps) => {\n const [inlineSize = DEFAULT_INLINE_SIZE, setInlineSize] = useControllableState<Size>({\n prop: propInlineSize,\n defaultProp: defaultInlineSize,\n onChange: onInlineSizeChange,\n });\n\n const [blockSize = DEFAULT_BLOCK_SIZE, setBlockSize] = useControllableState<Size>({\n prop: propBlockSize,\n defaultProp: defaultBlockSize,\n onChange: onBlockSizeChange,\n });\n\n return (\n <div\n className='grid relative border border-dashed border-subduedSeparator p-4 rounded-lg overflow-hidden contain-layout'\n style={{\n ...sizeStyle(inlineSize, 'horizontal'),\n ...sizeStyle(blockSize, 'vertical'),\n }}\n {...resizeAttributes}\n >\n {children}\n <ResizeHandle\n side='inline-end'\n fallbackSize={DEFAULT_INLINE_SIZE}\n minSize={MIN_INLINE_SIZE}\n size={inlineSize}\n onSizeChange={setInlineSize}\n />\n <ResizeHandle\n side='block-end'\n fallbackSize={DEFAULT_BLOCK_SIZE}\n minSize={MIN_BLOCK_SIZE}\n size={blockSize}\n onSizeChange={setBlockSize}\n />\n </div>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport React, { type PropsWithChildren } from 'react';\n\nimport { ResizeHandle, type Size, resizeAttributes, sizeStyle } from '@dxos/react-ui-dnd';\n\n// Default size in rem\nconst DEFAULT_SIZE = 24;\nconst MIN_SIZE = 8;\n\nexport type IntrinsicCardContainerProps = PropsWithChildren<{\n defaultSize?: Size;\n size?: Size;\n onSizeChange?: (size: Size, commit?: boolean) => void;\n}>;\n\nexport const IntrinsicCardContainer = ({\n children,\n defaultSize,\n size: propSize,\n onSizeChange,\n}: IntrinsicCardContainerProps) => {\n const [size = DEFAULT_SIZE, setSize] = useControllableState<Size>({\n prop: propSize,\n defaultProp: defaultSize,\n onChange: onSizeChange,\n });\n\n return (\n <div\n className='relative border border-dashed border-subduedSeparator p-4 rounded-lg'\n style={sizeStyle(size, 'horizontal')}\n {...resizeAttributes}\n >\n {children}\n <ResizeHandle\n side='inline-end'\n fallbackSize={DEFAULT_SIZE}\n minSize={MIN_SIZE}\n size={size}\n onSizeChange={setSize}\n />\n </div>\n );\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { type PropsWithChildren } from 'react';\n\nimport { Icon, Popover } from '@dxos/react-ui';\n\nexport const PopoverCardContainer = ({\n children,\n icon = 'ph--placeholder--regular',\n}: PropsWithChildren<{ icon: string }>) => {\n return (\n <Popover.Root open>\n <Popover.Content onOpenAutoFocus={(event) => event.preventDefault()}>\n <Popover.Viewport>{children}</Popover.Viewport>\n <Popover.Arrow />\n </Popover.Content>\n <Popover.Trigger>\n <Icon icon={icon} size={5} />\n </Popover.Trigger>\n </Popover.Root>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport React, { type FC, type JSX, type PropsWithChildren } from 'react';\n\nimport { type Density, DensityProvider, type ThemedClassName } from '@dxos/react-ui';\nimport { mx } from '@dxos/react-ui-theme';\n\ntype ProviderOptions = {\n fullscreen?: boolean;\n density?: Density;\n};\n\nconst defaultOptions: ProviderOptions = {\n density: 'fine',\n};\n\ntype Provider = (children: JSX.Element, options: ProviderOptions) => JSX.Element;\n\nconst providers: Provider[] = [\n (children, options) => {\n return options?.density ? <DensityProvider density={options.density}>{children}</DensityProvider> : children;\n },\n];\n\nexport type ContainerProps = ThemedClassName<PropsWithChildren<Pick<ProviderOptions, 'fullscreen'>>>;\n\nexport type WithLayoutProps = ThemedClassName<ProviderOptions & { Container?: FC<ContainerProps> }>;\n\n/**\n * Decorator to layout the story container, adding optional providers.\n */\nexport const withLayout = ({\n classNames,\n fullscreen,\n Container = fullscreen ? FullscreenContainer : DefaultContainer,\n ...providedOptions\n}: WithLayoutProps = {}): Decorator => {\n // TODO(burdon): Inspect \"fullscreen\" parameter in context.\n return (Story, _context) => {\n const children = (\n <Container classNames={classNames} fullscreen={fullscreen}>\n <Story />\n </Container>\n );\n\n const options = defaultsDeep({}, providedOptions, defaultOptions);\n return providers.reduceRight((acc, provider) => provider(acc, options), children);\n };\n};\n\n// TODO(burdon): Use consistently.\nexport const layoutCentered = 'bg-deckSurface justify-center overflow-y-auto';\n\nexport const DefaultContainer = ({ children, classNames }: ContainerProps) => {\n return (\n <div role='none' className={mx(classNames)}>\n {children}\n </div>\n );\n};\n\nexport const FullscreenContainer = ({ children, classNames }: ContainerProps) => {\n return (\n <div role='none' className={mx('fixed inset-0 flex overflow-hidden', classNames)}>\n {children}\n </div>\n );\n};\n\nexport const ColumnContainer = ({ children, classNames = 'w-[30rem]', ...props }: ContainerProps) => {\n return (\n <FullscreenContainer classNames='justify-center bg-modalSurface' {...props}>\n <div role='none' className={mx('flex flex-col h-full overflow-y-auto bg-baseSurface', classNames)}>\n {children}\n </div>\n </FullscreenContainer>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React, { memo } from 'react';\n\nimport { type ThemeMode, ThemeProvider, Tooltip } from '@dxos/react-ui';\nimport { defaultTx } from '@dxos/react-ui-theme';\n\n/**\n * Adds theme decorator.\n */\nexport const withTheme: Decorator = (Story, context) => {\n const {\n globals: { theme },\n parameters: { translations },\n } = context;\n\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n\n return (\n <ThemeProvider tx={defaultTx} themeMode={theme as ThemeMode} resourceExtensions={translations} noCache>\n <Tooltip.Provider>\n <MemoizedStory />\n </Tooltip.Provider>\n </ThemeProvider>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React, { memo } from 'react';\n\nimport { ThemeEditor } from '../components';\n\n/**\n * Show theme editor.\n */\n// TODO(burdon): Ideally move to storybook-addon-theme, but this has a build issue since the addon would depend on the vite theme plugin.\nexport const withThemeEditor: Decorator = (Story, context) => {\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n\n return (\n <>\n <MemoizedStory />\n <div className='absolute top-4 bottom-4 right-4 z-10'>\n <div className='h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded'>\n <ThemeEditor />\n </div>\n </div>\n </>\n );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React, { type FC } from 'react';\n\n/**\n * Story renderer wrapper.\n */\nexport const render =\n <T,>(r: FC<T>) =>\n (args: T) => <>{r(args) ?? <div />}</>;\n"],
5
- "mappings": "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",
6
- "names": ["registerSignalsRuntime", "React", "memo", "DxThemeEditor", "NaturalDxThemeEditor", "createComponent", "DxThemeEditor", "createComponent", "tagName", "elementClass", "NaturalDxThemeEditor", "react", "React", "ThemeEditor", "memo", "useControllableState", "React", "ResizeHandle", "resizeAttributes", "sizeStyle", "DEFAULT_INLINE_SIZE", "MIN_INLINE_SIZE", "DEFAULT_BLOCK_SIZE", "MIN_BLOCK_SIZE", "ExtrinsicCardContainer", "children", "defaultInlineSize", "inlineSize", "propInlineSize", "defaultBlockSize", "blockSize", "propBlockSize", "onInlineSizeChange", "onBlockSizeChange", "setInlineSize", "useControllableState", "prop", "defaultProp", "onChange", "setBlockSize", "React", "div", "className", "style", "sizeStyle", "resizeAttributes", "ResizeHandle", "side", "fallbackSize", "minSize", "size", "onSizeChange", "useControllableState", "React", "ResizeHandle", "resizeAttributes", "sizeStyle", "DEFAULT_SIZE", "MIN_SIZE", "IntrinsicCardContainer", "children", "defaultSize", "size", "propSize", "onSizeChange", "setSize", "useControllableState", "prop", "defaultProp", "onChange", "React", "div", "className", "style", "sizeStyle", "resizeAttributes", "ResizeHandle", "side", "fallbackSize", "minSize", "React", "Icon", "Popover", "PopoverCardContainer", "children", "icon", "React", "Popover", "Root", "open", "Content", "onOpenAutoFocus", "event", "preventDefault", "Viewport", "Arrow", "Trigger", "Icon", "size", "defaultsDeep", "React", "DensityProvider", "mx", "defaultOptions", "density", "providers", "children", "options", "React", "DensityProvider", "withLayout", "classNames", "fullscreen", "Container", "FullscreenContainer", "DefaultContainer", "providedOptions", "Story", "_context", "defaultsDeep", "reduceRight", "acc", "provider", "layoutCentered", "div", "role", "className", "mx", "ColumnContainer", "props", "React", "memo", "ThemeProvider", "Tooltip", "defaultTx", "withTheme", "Story", "context", "globals", "theme", "parameters", "translations", "MemoizedStory", "memo", "React", "ThemeProvider", "tx", "defaultTx", "themeMode", "resourceExtensions", "noCache", "Tooltip", "Provider", "React", "memo", "withThemeEditor", "Story", "context", "MemoizedStory", "memo", "React", "div", "className", "ThemeEditor", "React", "render", "r", "args", "React", "div", "registerSignalsRuntime"]
3
+ "sources": ["../../../src/decorators/withLayout.tsx", "../../../src/decorators/withRegistry.tsx"],
4
+ "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React from 'react';\n\nexport const withLayout: Decorator = (Story, context) => {\n switch (context.parameters.layout) {\n case 'fullscreen':\n return (\n <div role='none' className='fixed inset-0 flex flex-col overflow-hidden bg-base-surface'>\n <Story />\n </div>\n );\n\n default:\n return <Story />;\n }\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { Registry, RegistryContext } from '@effect-atom/atom-react';\nimport { type Decorator } from '@storybook/react';\nimport React, { memo, useMemo } from 'react';\n\n/**\n * Adds Effect Atom registry context for storybook.\n */\nexport const withRegistry: Decorator = (Story) => {\n const registry = useMemo(() => Registry.make(), []);\n\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n\n return (\n <RegistryContext.Provider value={registry}>\n <MemoizedStory />\n </RegistryContext.Provider>\n );\n};\n"],
5
+ "mappings": ";;;AAKA,OAAOA,WAAW;AAEX,IAAMC,aAAwB,CAACC,OAAOC,YAAAA;AAC3C,UAAQA,QAAQC,WAAWC,QAAM;IAC/B,KAAK;AACH,aACE,sBAAA,cAACC,OAAAA;QAAIC,MAAK;QAAOC,WAAU;SACzB,sBAAA,cAACN,OAAAA,IAAAA,CAAAA;IAIP;AACE,aAAO,sBAAA,cAACA,OAAAA,IAAAA;EACZ;AACF;;;ACfA,SAASO,UAAUC,uBAAuB;AAE1C,OAAOC,UAASC,MAAMC,eAAe;AAK9B,IAAMC,eAA0B,CAACC,UAAAA;AACtC,QAAMC,WAAWH,QAAQ,MAAMJ,SAASQ,KAAI,GAAI,CAAA,CAAE;AAGlD,QAAMC,gBAAgBN,qBAAKG,KAAAA;AAE3B,SACE,gBAAAJ,OAAA,cAACD,gBAAgBS,UAAQ;IAACC,OAAOJ;KAC/B,gBAAAL,OAAA,cAACO,eAAAA,IAAAA,CAAAA;AAGP;",
6
+ "names": ["React", "withLayout", "Story", "context", "parameters", "layout", "div", "role", "className", "Registry", "RegistryContext", "React", "memo", "useMemo", "withRegistry", "Story", "registry", "make", "MemoizedStory", "Provider", "value"]
7
7
  }
@@ -1 +1 @@
1
- {"inputs":{"src/components/ThemeEditor.tsx":{"bytes":1828,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor","kind":"import-statement","external":true},{"path":"@dxos/lit-ui/react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor/dx-theme-editor.pcss","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/ExtrinsicCardContainer.tsx":{"bytes":6610,"imports":[{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/IntrinsicCardContainer.tsx":{"bytes":4021,"imports":[{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/PopoverCardContainer.tsx":{"bytes":2566,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true}],"format":"esm"},"src/components/CardContainers/index.ts":{"bytes":764,"imports":[{"path":"src/components/CardContainers/ExtrinsicCardContainer.tsx","kind":"import-statement","original":"./ExtrinsicCardContainer"},{"path":"src/components/CardContainers/IntrinsicCardContainer.tsx","kind":"import-statement","original":"./IntrinsicCardContainer"},{"path":"src/components/CardContainers/PopoverCardContainer.tsx","kind":"import-statement","original":"./PopoverCardContainer"}],"format":"esm"},"src/components/index.ts":{"bytes":686,"imports":[{"path":"src/components/ThemeEditor.tsx","kind":"import-statement","original":"./ThemeEditor"},{"path":"src/components/CardContainers/index.ts","kind":"import-statement","original":"./CardContainers"}],"format":"esm"},"src/decorators/withLayout.tsx":{"bytes":7744,"imports":[{"path":"lodash.defaultsdeep","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withTheme.tsx":{"bytes":2822,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withThemeEditor.tsx":{"bytes":2713,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"src/components/index.ts","kind":"import-statement","original":"../components"}],"format":"esm"},"src/decorators/index.ts":{"bytes":671,"imports":[{"path":"src/decorators/withLayout.tsx","kind":"import-statement","original":"./withLayout"},{"path":"src/decorators/withTheme.tsx","kind":"import-statement","original":"./withTheme"},{"path":"src/decorators/withThemeEditor.tsx","kind":"import-statement","original":"./withThemeEditor"}],"format":"esm"},"src/util.tsx":{"bytes":999,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":943,"imports":[{"path":"@dxos/echo-signals/react","kind":"import-statement","external":true},{"path":"src/components/index.ts","kind":"import-statement","original":"./components"},{"path":"src/decorators/index.ts","kind":"import-statement","original":"./decorators"},{"path":"src/util.tsx","kind":"import-statement","original":"./util"}],"format":"esm"}},"outputs":{"dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":15642},"dist/lib/node-esm/index.mjs":{"imports":[{"path":"@dxos/echo-signals/react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor","kind":"import-statement","external":true},{"path":"@dxos/lit-ui/react","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor/dx-theme-editor.pcss","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true},{"path":"@radix-ui/react-use-controllable-state","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui-dnd","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"lodash.defaultsdeep","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/react-ui","kind":"import-statement","external":true},{"path":"@dxos/react-ui-theme","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["ColumnContainer","DefaultContainer","ExtrinsicCardContainer","FullscreenContainer","IntrinsicCardContainer","PopoverCardContainer","ThemeEditor","layoutCentered","render","withLayout","withTheme","withThemeEditor"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":93},"src/components/ThemeEditor.tsx":{"bytesInOutput":405},"src/components/index.ts":{"bytesInOutput":0},"src/components/CardContainers/ExtrinsicCardContainer.tsx":{"bytesInOutput":1572},"src/components/CardContainers/index.ts":{"bytesInOutput":0},"src/components/CardContainers/IntrinsicCardContainer.tsx":{"bytesInOutput":949},"src/components/CardContainers/PopoverCardContainer.tsx":{"bytesInOutput":626},"src/decorators/withLayout.tsx":{"bytesInOutput":1764},"src/decorators/index.ts":{"bytesInOutput":0},"src/decorators/withTheme.tsx":{"bytesInOutput":608},"src/decorators/withThemeEditor.tsx":{"bytesInOutput":588},"src/util.tsx":{"bytesInOutput":181}},"bytes":7524}}}
1
+ {"inputs":{"src/decorators/withLayout.tsx":{"bytes":1705,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withRegistry.tsx":{"bytes":2112,"imports":[{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/index.ts":{"bytes":482,"imports":[{"path":"src/decorators/withLayout.tsx","kind":"import-statement","original":"./withLayout"},{"path":"src/decorators/withRegistry.tsx","kind":"import-statement","original":"./withRegistry"}],"format":"esm"},"src/index.ts":{"bytes":382,"imports":[{"path":"src/decorators/index.ts","kind":"import-statement","original":"./decorators"}],"format":"esm"}},"outputs":{"dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":1970},"dist/lib/node-esm/index.mjs":{"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@effect-atom/atom-react","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["withLayout","withRegistry"],"entryPoint":"src/index.ts","inputs":{"src/decorators/withLayout.tsx":{"bytesInOutput":432},"src/decorators/index.ts":{"bytesInOutput":0},"src/decorators/withRegistry.tsx":{"bytesInOutput":418},"src/index.ts":{"bytesInOutput":0}},"bytes":1088}}}
@@ -1,3 +1 @@
1
- export * from './ThemeEditor';
2
- export * from './CardContainers';
3
1
  //# sourceMappingURL=index.d.ts.map