@dxos/storybook-utils 0.8.4-main.c4373fc → 0.8.4-main.c85a9c8dae
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.
- package/dist/lib/browser/index.mjs +26 -113
- package/dist/lib/browser/index.mjs.map +4 -4
- package/dist/lib/browser/meta.json +1 -1
- package/dist/lib/node-esm/index.mjs +26 -113
- package/dist/lib/node-esm/index.mjs.map +4 -4
- package/dist/lib/node-esm/meta.json +1 -1
- package/dist/types/src/components/index.d.ts +0 -2
- package/dist/types/src/components/index.d.ts.map +1 -1
- package/dist/types/src/decorators/index.d.ts +2 -1
- package/dist/types/src/decorators/index.d.ts.map +1 -1
- package/dist/types/src/decorators/withLayout.d.ts +3 -0
- package/dist/types/src/decorators/withLayout.d.ts.map +1 -0
- package/dist/types/src/decorators/withRegistry.d.ts +6 -0
- package/dist/types/src/decorators/withRegistry.d.ts.map +1 -0
- package/dist/types/src/index.d.ts +0 -1
- package/dist/types/src/index.d.ts.map +1 -1
- package/dist/types/src/stories/test/Test.stories.d.ts +3 -17
- package/dist/types/src/stories/test/Test.stories.d.ts.map +1 -1
- package/dist/types/tsconfig.tsbuildinfo +1 -1
- package/package.json +20 -18
- package/src/components/index.ts +0 -4
- package/src/decorators/index.ts +2 -1
- package/src/decorators/withLayout.tsx +20 -0
- package/src/decorators/withRegistry.tsx +23 -0
- package/src/index.ts +0 -5
- package/src/stories/test/Test.stories.tsx +3 -3
- package/src/stories/test/Test.tsx +1 -1
- package/dist/types/src/components/CardContainers/ExtrinsicCardContainer.d.ts +0 -12
- package/dist/types/src/components/CardContainers/ExtrinsicCardContainer.d.ts.map +0 -1
- package/dist/types/src/components/CardContainers/IntrinsicCardContainer.d.ts +0 -9
- package/dist/types/src/components/CardContainers/IntrinsicCardContainer.d.ts.map +0 -1
- package/dist/types/src/components/CardContainers/PopoverCardContainer.d.ts +0 -5
- package/dist/types/src/components/CardContainers/PopoverCardContainer.d.ts.map +0 -1
- package/dist/types/src/components/CardContainers/index.d.ts +0 -4
- package/dist/types/src/components/CardContainers/index.d.ts.map +0 -1
- package/dist/types/src/components/ThemeEditor.d.ts +0 -5
- package/dist/types/src/components/ThemeEditor.d.ts.map +0 -1
- package/dist/types/src/decorators/withThemeEditor.d.ts +0 -6
- package/dist/types/src/decorators/withThemeEditor.d.ts.map +0 -1
- package/src/components/CardContainers/ExtrinsicCardContainer.tsx +0 -72
- package/src/components/CardContainers/IntrinsicCardContainer.tsx +0 -48
- package/src/components/CardContainers/PopoverCardContainer.tsx +0 -24
- package/src/components/CardContainers/index.ts +0 -7
- package/src/components/ThemeEditor.tsx +0 -18
- package/src/decorators/withThemeEditor.tsx +0 -28
|
@@ -1,124 +1,37 @@
|
|
|
1
|
-
// src/
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
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
|
-
}));
|
|
1
|
+
// src/decorators/withLayout.tsx
|
|
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);
|
|
12
|
+
}
|
|
80
13
|
};
|
|
81
14
|
|
|
82
|
-
// src/
|
|
83
|
-
import
|
|
84
|
-
import {
|
|
85
|
-
var
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
}, /* @__PURE__ */
|
|
91
|
-
icon,
|
|
92
|
-
size: 5
|
|
93
|
-
})));
|
|
94
|
-
};
|
|
95
|
-
|
|
96
|
-
// src/decorators/withThemeEditor.tsx
|
|
97
|
-
import React5, { memo as memo2 } from "react";
|
|
98
|
-
var withThemeEditor = (Story, context) => {
|
|
99
|
-
const MemoizedStory = /* @__PURE__ */ memo2(Story);
|
|
100
|
-
return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(MemoizedStory, null), /* @__PURE__ */ React5.createElement("div", {
|
|
101
|
-
className: "absolute top-4 bottom-4 right-4 z-10"
|
|
102
|
-
}, /* @__PURE__ */ React5.createElement("div", {
|
|
103
|
-
className: "h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded"
|
|
104
|
-
}, /* @__PURE__ */ React5.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));
|
|
105
24
|
};
|
|
106
25
|
|
|
107
26
|
// src/util.tsx
|
|
108
|
-
import
|
|
27
|
+
import React3 from "react";
|
|
109
28
|
var render = (Story) => (args) => {
|
|
110
|
-
const result = /* @__PURE__ */
|
|
111
|
-
return result ?? /* @__PURE__ */
|
|
29
|
+
const result = /* @__PURE__ */ React3.createElement(Story, args);
|
|
30
|
+
return result ?? /* @__PURE__ */ React3.createElement("div", null);
|
|
112
31
|
};
|
|
113
|
-
|
|
114
|
-
// src/index.ts
|
|
115
|
-
registerSignalsRuntime();
|
|
116
32
|
export {
|
|
117
|
-
ExtrinsicCardContainer,
|
|
118
|
-
IntrinsicCardContainer,
|
|
119
|
-
PopoverCardContainer,
|
|
120
|
-
ThemeEditor,
|
|
121
33
|
render,
|
|
122
|
-
|
|
34
|
+
withLayout,
|
|
35
|
+
withRegistry
|
|
123
36
|
};
|
|
124
37
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/
|
|
4
|
-
"sourcesContent": ["//\n// Copyright
|
|
5
|
-
"mappings": ";
|
|
6
|
-
"names": ["
|
|
3
|
+
"sources": ["../../../src/decorators/withLayout.tsx", "../../../src/decorators/withRegistry.tsx", "../../../src/util.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", "//\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 extends Record<string, any>>(Story: FC<T>) =>\n (args: unknown) => {\n const result = <Story {...(args as T)} />;\n return result ?? <div />;\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;;;AClBA,OAAOM,YAAwB;AAKxB,IAAMC,SACX,CAAgCC,UAChC,CAACC,SAAAA;AACC,QAAMC,SAAS,gBAAAC,OAAA,cAACH,OAAWC,IAAAA;AAC3B,SAAOC,UAAU,gBAAAC,OAAA,cAACC,OAAAA,IAAAA;AACpB;",
|
|
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", "React", "render", "Story", "args", "result", "React", "div"]
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/
|
|
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/util.tsx":{"bytes":1228,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":544,"imports":[{"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":2582},"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},{"path":"react","kind":"import-statement","external":true}],"exports":["render","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},"src/util.tsx":{"bytesInOutput":205}},"bytes":1227}}}
|
|
@@ -1,126 +1,39 @@
|
|
|
1
1
|
import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
|
|
2
2
|
|
|
3
|
-
// src/
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
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
|
-
}));
|
|
3
|
+
// src/decorators/withLayout.tsx
|
|
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);
|
|
14
|
+
}
|
|
82
15
|
};
|
|
83
16
|
|
|
84
|
-
// src/
|
|
85
|
-
import
|
|
86
|
-
import {
|
|
87
|
-
var
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
}, /* @__PURE__ */
|
|
93
|
-
icon,
|
|
94
|
-
size: 5
|
|
95
|
-
})));
|
|
96
|
-
};
|
|
97
|
-
|
|
98
|
-
// src/decorators/withThemeEditor.tsx
|
|
99
|
-
import React5, { memo as memo2 } from "react";
|
|
100
|
-
var withThemeEditor = (Story, context) => {
|
|
101
|
-
const MemoizedStory = /* @__PURE__ */ memo2(Story);
|
|
102
|
-
return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(MemoizedStory, null), /* @__PURE__ */ React5.createElement("div", {
|
|
103
|
-
className: "absolute top-4 bottom-4 right-4 z-10"
|
|
104
|
-
}, /* @__PURE__ */ React5.createElement("div", {
|
|
105
|
-
className: "h-full is-[35rem] overflow-auto bg-baseSurface border border-separator rounded"
|
|
106
|
-
}, /* @__PURE__ */ React5.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));
|
|
107
26
|
};
|
|
108
27
|
|
|
109
28
|
// src/util.tsx
|
|
110
|
-
import
|
|
29
|
+
import React3 from "react";
|
|
111
30
|
var render = (Story) => (args) => {
|
|
112
|
-
const result = /* @__PURE__ */
|
|
113
|
-
return result ?? /* @__PURE__ */
|
|
31
|
+
const result = /* @__PURE__ */ React3.createElement(Story, args);
|
|
32
|
+
return result ?? /* @__PURE__ */ React3.createElement("div", null);
|
|
114
33
|
};
|
|
115
|
-
|
|
116
|
-
// src/index.ts
|
|
117
|
-
registerSignalsRuntime();
|
|
118
34
|
export {
|
|
119
|
-
ExtrinsicCardContainer,
|
|
120
|
-
IntrinsicCardContainer,
|
|
121
|
-
PopoverCardContainer,
|
|
122
|
-
ThemeEditor,
|
|
123
35
|
render,
|
|
124
|
-
|
|
36
|
+
withLayout,
|
|
37
|
+
withRegistry
|
|
125
38
|
};
|
|
126
39
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["../../../src/
|
|
4
|
-
"sourcesContent": ["//\n// Copyright
|
|
5
|
-
"mappings": ";;;
|
|
6
|
-
"names": ["
|
|
3
|
+
"sources": ["../../../src/decorators/withLayout.tsx", "../../../src/decorators/withRegistry.tsx", "../../../src/util.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", "//\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 extends Record<string, any>>(Story: FC<T>) =>\n (args: unknown) => {\n const result = <Story {...(args as T)} />;\n return result ?? <div />;\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;;;AClBA,OAAOM,YAAwB;AAKxB,IAAMC,SACX,CAAgCC,UAChC,CAACC,SAAAA;AACC,QAAMC,SAAS,gBAAAC,OAAA,cAACH,OAAWC,IAAAA;AAC3B,SAAOC,UAAU,gBAAAC,OAAA,cAACC,OAAAA,IAAAA;AACpB;",
|
|
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", "React", "render", "Story", "args", "result", "React", "div"]
|
|
7
7
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"inputs":{"src/
|
|
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/util.tsx":{"bytes":1228,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"src/index.ts":{"bytes":544,"imports":[{"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":2584},"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},{"path":"react","kind":"import-statement","external":true}],"exports":["render","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},"src/util.tsx":{"bytesInOutput":205}},"bytes":1320}}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/decorators/index.ts"],"names":[],"mappings":"AAIA,cAAc,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/decorators/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC"}
|
|
@@ -0,0 +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;AAGlD,eAAO,MAAM,UAAU,EAAE,SAYxB,CAAC"}
|
|
@@ -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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC"}
|
|
@@ -1,23 +1,9 @@
|
|
|
1
|
-
import { type StoryObj } from '@storybook/react-vite';
|
|
2
|
-
import
|
|
1
|
+
import { type Meta, type StoryObj } from '@storybook/react-vite';
|
|
2
|
+
import { Test } from './Test';
|
|
3
3
|
/**
|
|
4
4
|
* Storybook sanity test.
|
|
5
5
|
*/
|
|
6
|
-
declare const meta:
|
|
7
|
-
title: string;
|
|
8
|
-
component: (props: import("./Test").TestProps) => React.JSX.Element;
|
|
9
|
-
render: (args: Omit<import("@dxos/react-ui").ButtonProps, "children"> & Partial<Pick<import("@dxos/react-ui").IconProps, "size" | "icon">> & {
|
|
10
|
-
label: string;
|
|
11
|
-
iconOnly?: boolean;
|
|
12
|
-
noTooltip?: boolean;
|
|
13
|
-
caretDown?: boolean;
|
|
14
|
-
iconClassNames?: import("@dxos/react-ui").ThemedClassName<any>["classNames"];
|
|
15
|
-
tooltipPortal?: boolean;
|
|
16
|
-
tooltipSide?: import("@dxos/react-ui").TooltipSide;
|
|
17
|
-
}) => React.JSX.Element;
|
|
18
|
-
decorators: import("@storybook/react").Decorator[];
|
|
19
|
-
tags: string[];
|
|
20
|
-
};
|
|
6
|
+
declare const meta: Meta<typeof Test>;
|
|
21
7
|
export default meta;
|
|
22
8
|
type Story = StoryObj<typeof meta>;
|
|
23
9
|
export declare const Default: Story;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Test.stories.d.ts","sourceRoot":"","sources":["../../../../../src/stories/test/Test.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,
|
|
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"}
|