@dxos/storybook-utils 0.8.4-main.f9ba587 → 0.8.4-main.fcfe5033a5

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 (41) hide show
  1. package/dist/lib/browser/index.mjs +20 -98
  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 -98
  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 -1
  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 -3
  16. package/dist/types/src/index.d.ts.map +1 -1
  17. package/dist/types/src/stories/test/Test.stories.d.ts +3 -4
  18. package/dist/types/src/stories/test/Test.stories.d.ts.map +1 -1
  19. package/dist/types/tsconfig.tsbuildinfo +1 -1
  20. package/package.json +21 -16
  21. package/src/components/index.ts +0 -3
  22. package/src/decorators/index.ts +1 -2
  23. package/src/decorators/withLayout.tsx +15 -77
  24. package/src/decorators/withRegistry.tsx +23 -0
  25. package/src/index.ts +0 -8
  26. package/src/stories/test/Test.stories.tsx +7 -8
  27. package/src/stories/test/Test.test.tsx +2 -12
  28. package/src/stories/test/Test.tsx +1 -1
  29. package/src/stories/test/{index.mdx → index.mdx__} +3 -0
  30. package/dist/types/src/components/ThemeEditor.d.ts +0 -5
  31. package/dist/types/src/components/ThemeEditor.d.ts.map +0 -1
  32. package/dist/types/src/decorators/withTheme.d.ts +0 -6
  33. package/dist/types/src/decorators/withTheme.d.ts.map +0 -1
  34. package/dist/types/src/decorators/withThemeEditor.d.ts +0 -6
  35. package/dist/types/src/decorators/withThemeEditor.d.ts.map +0 -1
  36. package/dist/types/src/util.d.ts +0 -6
  37. package/dist/types/src/util.d.ts.map +0 -1
  38. package/src/components/ThemeEditor.tsx +0 -18
  39. package/src/decorators/withTheme.tsx +0 -30
  40. package/src/decorators/withThemeEditor.tsx +0 -28
  41. package/src/util.tsx +0 -12
@@ -1,107 +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
1
  // src/decorators/withLayout.tsx
17
- import defaultsDeep from "lodash.defaultsdeep";
18
- import React2 from "react";
19
- import { DensityProvider } from "@dxos/react-ui";
20
- import { mx } from "@dxos/react-ui-theme";
21
- var defaultOptions = {
22
- density: "fine"
23
- };
24
- var providers = [
25
- (children, options) => {
26
- return options?.density ? /* @__PURE__ */ React2.createElement(DensityProvider, {
27
- density: options.density
28
- }, 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);
29
12
  }
30
- ];
31
- var withLayout = ({ classNames, fullscreen, Container = fullscreen ? FullscreenContainer : DefaultContainer, ...providedOptions } = {}) => {
32
- return (Story, _context) => {
33
- const children = /* @__PURE__ */ React2.createElement(Container, {
34
- classNames,
35
- fullscreen
36
- }, /* @__PURE__ */ React2.createElement(Story, null));
37
- const options = defaultsDeep({}, providedOptions, defaultOptions);
38
- return providers.reduceRight((acc, provider) => provider(acc, options), children);
39
- };
40
- };
41
- var layoutCentered = "bg-deckSurface justify-center overflow-y-auto";
42
- var DefaultContainer = ({ children, classNames }) => {
43
- return /* @__PURE__ */ React2.createElement("div", {
44
- role: "none",
45
- className: mx(classNames)
46
- }, children);
47
- };
48
- var FullscreenContainer = ({ children, classNames }) => {
49
- return /* @__PURE__ */ React2.createElement("div", {
50
- role: "none",
51
- className: mx("fixed inset-0 flex overflow-hidden", classNames)
52
- }, children);
53
- };
54
- var ColumnContainer = ({ children, classNames = "w-[30rem]", ...props }) => {
55
- return /* @__PURE__ */ React2.createElement(FullscreenContainer, {
56
- classNames: "justify-center bg-modalSurface",
57
- ...props
58
- }, /* @__PURE__ */ React2.createElement("div", {
59
- role: "none",
60
- className: mx("flex flex-col h-full overflow-y-auto bg-baseSurface", classNames)
61
- }, children));
62
- };
63
-
64
- // src/decorators/withTheme.tsx
65
- import React3, { memo as memo2 } from "react";
66
- import { ThemeProvider, Tooltip } from "@dxos/react-ui";
67
- import { defaultTx } from "@dxos/react-ui-theme";
68
- var withTheme = (Story, context) => {
69
- const { globals: { theme }, parameters: { translations } } = context;
70
- const MemoizedStory = /* @__PURE__ */ memo2(Story);
71
- return /* @__PURE__ */ React3.createElement(ThemeProvider, {
72
- tx: defaultTx,
73
- themeMode: theme,
74
- resourceExtensions: translations,
75
- noCache: true
76
- }, /* @__PURE__ */ React3.createElement(Tooltip.Provider, null, /* @__PURE__ */ React3.createElement(MemoizedStory, null)));
77
13
  };
78
14
 
79
- // src/decorators/withThemeEditor.tsx
80
- import React4, { memo as memo3 } from "react";
81
- var withThemeEditor = (Story, context) => {
82
- const MemoizedStory = /* @__PURE__ */ memo3(Story);
83
- return /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(MemoizedStory, null), /* @__PURE__ */ React4.createElement("div", {
84
- className: "absolute top-4 bottom-4 right-4 z-10"
85
- }, /* @__PURE__ */ React4.createElement("div", {
86
- className: "h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded"
87
- }, /* @__PURE__ */ React4.createElement(ThemeEditor, 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));
88
24
  };
89
-
90
- // src/util.tsx
91
- import React5 from "react";
92
- var render = (r) => (args) => /* @__PURE__ */ React5.createElement(React5.Fragment, null, r(args) ?? /* @__PURE__ */ React5.createElement("div", null));
93
-
94
- // src/index.ts
95
- registerSignalsRuntime();
96
25
  export {
97
- ColumnContainer,
98
- DefaultContainer,
99
- FullscreenContainer,
100
- ThemeEditor,
101
- layoutCentered,
102
- render,
103
26
  withLayout,
104
- withTheme,
105
- withThemeEditor
27
+ withRegistry
106
28
  };
107
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/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 { type Meta } from '@storybook/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 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport React, { type PropsWithChildren, type JSX, type FC } 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", "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,WAAWC,QAAQ,MAAMC,SAASC,KAAI,GAAI,CAAA,CAAE;AAGlD,QAAMC,gBAAgBC,qBAAKN,KAAAA;AAE3B,SACE,gBAAAO,OAAA,cAACC,gBAAgBC,UAAQ;IAACC,OAAOT;KAC/B,gBAAAM,OAAA,cAACF,eAAAA,IAAAA,CAAAA;AAGP;",
6
+ "names": ["React", "withLayout", "Story", "context", "parameters", "layout", "div", "role", "className", "Registry", "RegistryContext", "React", "memo", "useMemo", "withRegistry", "Story", "registry", "useMemo", "Registry", "make", "MemoizedStory", "memo", "React", "RegistryContext", "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/index.ts":{"bytes":584,"imports":[{"path":"src/components/ThemeEditor.tsx","kind":"import-statement","original":"./ThemeEditor"}],"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":1007,"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":8694},"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":"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","FullscreenContainer","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/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":4027}}}
1
+ {"inputs":{"src/decorators/withLayout.tsx":{"bytes":1804,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withRegistry.tsx":{"bytes":2217,"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":575,"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":464,"imports":[{"path":"src/decorators/index.ts","kind":"import-statement","original":"./decorators"}],"format":"esm"}},"outputs":{"dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":2027},"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,109 +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
3
  // src/decorators/withLayout.tsx
19
- import defaultsDeep from "lodash.defaultsdeep";
20
- import React2 from "react";
21
- import { DensityProvider } from "@dxos/react-ui";
22
- import { mx } from "@dxos/react-ui-theme";
23
- var defaultOptions = {
24
- density: "fine"
25
- };
26
- var providers = [
27
- (children, options) => {
28
- return options?.density ? /* @__PURE__ */ React2.createElement(DensityProvider, {
29
- density: options.density
30
- }, 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);
31
14
  }
32
- ];
33
- var withLayout = ({ classNames, fullscreen, Container = fullscreen ? FullscreenContainer : DefaultContainer, ...providedOptions } = {}) => {
34
- return (Story, _context) => {
35
- const children = /* @__PURE__ */ React2.createElement(Container, {
36
- classNames,
37
- fullscreen
38
- }, /* @__PURE__ */ React2.createElement(Story, null));
39
- const options = defaultsDeep({}, providedOptions, defaultOptions);
40
- return providers.reduceRight((acc, provider) => provider(acc, options), children);
41
- };
42
- };
43
- var layoutCentered = "bg-deckSurface justify-center overflow-y-auto";
44
- var DefaultContainer = ({ children, classNames }) => {
45
- return /* @__PURE__ */ React2.createElement("div", {
46
- role: "none",
47
- className: mx(classNames)
48
- }, children);
49
- };
50
- var FullscreenContainer = ({ children, classNames }) => {
51
- return /* @__PURE__ */ React2.createElement("div", {
52
- role: "none",
53
- className: mx("fixed inset-0 flex overflow-hidden", classNames)
54
- }, children);
55
- };
56
- var ColumnContainer = ({ children, classNames = "w-[30rem]", ...props }) => {
57
- return /* @__PURE__ */ React2.createElement(FullscreenContainer, {
58
- classNames: "justify-center bg-modalSurface",
59
- ...props
60
- }, /* @__PURE__ */ React2.createElement("div", {
61
- role: "none",
62
- className: mx("flex flex-col h-full overflow-y-auto bg-baseSurface", classNames)
63
- }, children));
64
- };
65
-
66
- // src/decorators/withTheme.tsx
67
- import React3, { memo as memo2 } from "react";
68
- import { ThemeProvider, Tooltip } from "@dxos/react-ui";
69
- import { defaultTx } from "@dxos/react-ui-theme";
70
- var withTheme = (Story, context) => {
71
- const { globals: { theme }, parameters: { translations } } = context;
72
- const MemoizedStory = /* @__PURE__ */ memo2(Story);
73
- return /* @__PURE__ */ React3.createElement(ThemeProvider, {
74
- tx: defaultTx,
75
- themeMode: theme,
76
- resourceExtensions: translations,
77
- noCache: true
78
- }, /* @__PURE__ */ React3.createElement(Tooltip.Provider, null, /* @__PURE__ */ React3.createElement(MemoizedStory, null)));
79
15
  };
80
16
 
81
- // src/decorators/withThemeEditor.tsx
82
- import React4, { memo as memo3 } from "react";
83
- var withThemeEditor = (Story, context) => {
84
- const MemoizedStory = /* @__PURE__ */ memo3(Story);
85
- return /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(MemoizedStory, null), /* @__PURE__ */ React4.createElement("div", {
86
- className: "absolute top-4 bottom-4 right-4 z-10"
87
- }, /* @__PURE__ */ React4.createElement("div", {
88
- className: "h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded"
89
- }, /* @__PURE__ */ React4.createElement(ThemeEditor, 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));
90
26
  };
91
-
92
- // src/util.tsx
93
- import React5 from "react";
94
- var render = (r) => (args) => /* @__PURE__ */ React5.createElement(React5.Fragment, null, r(args) ?? /* @__PURE__ */ React5.createElement("div", null));
95
-
96
- // src/index.ts
97
- registerSignalsRuntime();
98
27
  export {
99
- ColumnContainer,
100
- DefaultContainer,
101
- FullscreenContainer,
102
- ThemeEditor,
103
- layoutCentered,
104
- render,
105
28
  withLayout,
106
- withTheme,
107
- withThemeEditor
29
+ withRegistry
108
30
  };
109
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/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 { type Meta } from '@storybook/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 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport React, { type PropsWithChildren, type JSX, type FC } 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", "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,WAAWC,QAAQ,MAAMC,SAASC,KAAI,GAAI,CAAA,CAAE;AAGlD,QAAMC,gBAAgBC,qBAAKN,KAAAA;AAE3B,SACE,gBAAAO,OAAA,cAACC,gBAAgBC,UAAQ;IAACC,OAAOT;KAC/B,gBAAAM,OAAA,cAACF,eAAAA,IAAAA,CAAAA;AAGP;",
6
+ "names": ["React", "withLayout", "Story", "context", "parameters", "layout", "div", "role", "className", "Registry", "RegistryContext", "React", "memo", "useMemo", "withRegistry", "Story", "registry", "useMemo", "Registry", "make", "MemoizedStory", "memo", "React", "RegistryContext", "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/index.ts":{"bytes":584,"imports":[{"path":"src/components/ThemeEditor.tsx","kind":"import-statement","original":"./ThemeEditor"}],"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":1007,"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":8696},"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":"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","FullscreenContainer","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/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":4120}}}
1
+ {"inputs":{"src/decorators/withLayout.tsx":{"bytes":1804,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/decorators/withRegistry.tsx":{"bytes":2217,"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":575,"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":464,"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":2029},"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,2 +1 @@
1
- export * from './ThemeEditor';
2
1
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAKA,cAAc,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":""}
@@ -1,4 +1,3 @@
1
1
  export * from './withLayout';
2
- export * from './withTheme';
3
- export * from './withThemeEditor';
2
+ export * from './withRegistry';
4
3
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/decorators/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/decorators/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC"}
@@ -1,21 +1,3 @@
1
1
  import { type Decorator } from '@storybook/react';
2
- import { type PropsWithChildren, type JSX, type FC } from 'react';
3
- import { type Density, type ThemedClassName } from '@dxos/react-ui';
4
- type ProviderOptions = {
5
- fullscreen?: boolean;
6
- density?: Density;
7
- };
8
- export type ContainerProps = ThemedClassName<PropsWithChildren<Pick<ProviderOptions, 'fullscreen'>>>;
9
- export type WithLayoutProps = ThemedClassName<ProviderOptions & {
10
- Container?: FC<ContainerProps>;
11
- }>;
12
- /**
13
- * Decorator to layout the story container, adding optional providers.
14
- */
15
- export declare const withLayout: ({ classNames, fullscreen, Container, ...providedOptions }?: WithLayoutProps) => Decorator;
16
- export declare const layoutCentered = "bg-deckSurface justify-center overflow-y-auto";
17
- export declare const DefaultContainer: ({ children, classNames }: ContainerProps) => JSX.Element;
18
- export declare const FullscreenContainer: ({ children, classNames }: ContainerProps) => JSX.Element;
19
- export declare const ColumnContainer: ({ children, classNames, ...props }: ContainerProps) => JSX.Element;
20
- export {};
2
+ export declare const withLayout: Decorator;
21
3
  //# sourceMappingURL=withLayout.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"withLayout.d.ts","sourceRoot":"","sources":["../../../../src/decorators/withLayout.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAc,EAAE,KAAK,iBAAiB,EAAE,KAAK,GAAG,EAAE,KAAK,EAAE,EAAE,MAAM,OAAO,CAAC;AAEzE,OAAO,EAAE,KAAK,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGrF,KAAK,eAAe,GAAG;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAcF,MAAM,MAAM,cAAc,GAAG,eAAe,CAAC,iBAAiB,CAAC,IAAI,CAAC,eAAe,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;AAErG,MAAM,MAAM,eAAe,GAAG,eAAe,CAAC,eAAe,GAAG;IAAE,SAAS,CAAC,EAAE,EAAE,CAAC,cAAc,CAAC,CAAA;CAAE,CAAC,CAAC;AAEpG;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,4DAKxB,eAAoB,KAAG,SAYzB,CAAC;AAGF,eAAO,MAAM,cAAc,kDAAkD,CAAC;AAE9E,eAAO,MAAM,gBAAgB,GAAI,0BAA0B,cAAc,gBAMxE,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,0BAA0B,cAAc,gBAM3E,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,oCAAkD,cAAc,gBAQ/F,CAAC"}
1
+ {"version":3,"file":"withLayout.d.ts","sourceRoot":"","sources":["../../../../src/decorators/withLayout.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAGlD,eAAO,MAAM,UAAU,EAAE,SAYxB,CAAC"}
@@ -0,0 +1,6 @@
1
+ import { type Decorator } from '@storybook/react';
2
+ /**
3
+ * Adds Effect Atom registry context for storybook.
4
+ */
5
+ export declare const withRegistry: Decorator;
6
+ //# sourceMappingURL=withRegistry.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"withRegistry.d.ts","sourceRoot":"","sources":["../../../../src/decorators/withRegistry.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAGlD;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,SAW1B,CAAC"}
@@ -1,5 +1,2 @@
1
- export { type Meta } from '@storybook/react';
2
- export * from './components';
3
1
  export * from './decorators';
4
- export * from './util';
5
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AAE7C,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC"}
@@ -1,12 +1,11 @@
1
- import '@dxos-theme';
2
1
  import { type Meta, type StoryObj } from '@storybook/react-vite';
3
- import { type TestProps } from './Test';
2
+ import { Test } from './Test';
4
3
  /**
5
4
  * Storybook sanity test.
6
5
  */
7
- declare const meta: Meta<TestProps>;
6
+ declare const meta: Meta<typeof Test>;
8
7
  export default meta;
9
- type Story = StoryObj<TestProps>;
8
+ type Story = StoryObj<typeof meta>;
10
9
  export declare const Default: Story;
11
10
  export declare const WithLog: Story;
12
11
  //# sourceMappingURL=Test.stories.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Test.stories.d.ts","sourceRoot":"","sources":["../../../../../src/stories/test/Test.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAOjE,OAAO,EAAiB,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAC;AAEvD;;GAEG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,SAAS,CAKzB,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,SAAS,CAAC,CAAC;AAEjC,eAAO,MAAM,OAAO,EAAE,KAsBrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC"}
1
+ {"version":3,"file":"Test.stories.d.ts","sourceRoot":"","sources":["../../../../../src/stories/test/Test.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAOjE,OAAO,EAAW,IAAI,EAAE,MAAM,QAAQ,CAAC;AAEvC;;GAEG;AACH,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CAM3B,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAEnC,eAAO,MAAM,OAAO,EAAE,KAsBrB,CAAC;AAEF,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC"}