@dxos/storybook-utils 0.8.3 → 0.8.4-main.2e9d522

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 (65) hide show
  1. package/dist/lib/browser/index.mjs +139 -90
  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 +139 -90
  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/CardContainers/ExtrinsicCardContainer.d.ts +12 -0
  8. package/dist/types/src/components/CardContainers/ExtrinsicCardContainer.d.ts.map +1 -0
  9. package/dist/types/src/components/CardContainers/IntrinsicCardContainer.d.ts +9 -0
  10. package/dist/types/src/components/CardContainers/IntrinsicCardContainer.d.ts.map +1 -0
  11. package/dist/types/src/components/CardContainers/PopoverCardContainer.d.ts +5 -0
  12. package/dist/types/src/components/CardContainers/PopoverCardContainer.d.ts.map +1 -0
  13. package/dist/types/src/components/CardContainers/index.d.ts +4 -0
  14. package/dist/types/src/components/CardContainers/index.d.ts.map +1 -0
  15. package/dist/types/src/components/DocsContainer.d.ts +4 -0
  16. package/dist/types/src/components/DocsContainer.d.ts.map +1 -0
  17. package/dist/types/src/components/ThemeEditor.d.ts +5 -0
  18. package/dist/types/src/components/ThemeEditor.d.ts.map +1 -0
  19. package/dist/types/src/components/index.d.ts +3 -0
  20. package/dist/types/src/components/index.d.ts.map +1 -0
  21. package/dist/types/src/decorators/index.d.ts +1 -1
  22. package/dist/types/src/decorators/index.d.ts.map +1 -1
  23. package/dist/types/src/decorators/withLayout.d.ts +5 -4
  24. package/dist/types/src/decorators/withLayout.d.ts.map +1 -1
  25. package/dist/types/src/decorators/withTheme.d.ts +1 -2
  26. package/dist/types/src/decorators/withTheme.d.ts.map +1 -1
  27. package/dist/types/src/decorators/withThemeEditor.d.ts +6 -0
  28. package/dist/types/src/decorators/withThemeEditor.d.ts.map +1 -0
  29. package/dist/types/src/index.d.ts +1 -0
  30. package/dist/types/src/index.d.ts.map +1 -1
  31. package/dist/types/src/stories/test/Test.d.ts +6 -0
  32. package/dist/types/src/stories/test/Test.d.ts.map +1 -0
  33. package/dist/types/src/stories/test/Test.stories.d.ts +12 -0
  34. package/dist/types/src/stories/test/Test.stories.d.ts.map +1 -0
  35. package/dist/types/src/stories/test/Test.test.d.ts +2 -0
  36. package/dist/types/src/stories/test/Test.test.d.ts.map +1 -0
  37. package/dist/types/src/vitest-setup.d.ts +2 -0
  38. package/dist/types/src/vitest-setup.d.ts.map +1 -0
  39. package/dist/types/tsconfig.tsbuildinfo +1 -1
  40. package/package.json +15 -14
  41. package/src/components/CardContainers/ExtrinsicCardContainer.tsx +72 -0
  42. package/src/components/CardContainers/IntrinsicCardContainer.tsx +48 -0
  43. package/src/components/CardContainers/PopoverCardContainer.tsx +24 -0
  44. package/src/components/CardContainers/index.ts +7 -0
  45. package/src/components/DocsContainer.tsx +18 -0
  46. package/src/components/ThemeEditor.tsx +18 -0
  47. package/src/components/index.ts +7 -0
  48. package/src/decorators/index.ts +1 -1
  49. package/src/decorators/withLayout.tsx +9 -6
  50. package/src/decorators/withTheme.tsx +9 -63
  51. package/src/decorators/withThemeEditor.tsx +28 -0
  52. package/src/index.ts +1 -0
  53. package/src/stories/test/Test.stories.tsx +62 -0
  54. package/src/stories/test/Test.test.tsx +40 -0
  55. package/src/stories/test/Test.tsx +15 -0
  56. package/src/stories/test/__snapshots__/Test.test.tsx.snap +3 -0
  57. package/src/stories/test/index.mdx +14 -0
  58. package/src/vitest-setup.ts +11 -0
  59. package/README.yml +0 -1
  60. package/dist/lib/node/index.cjs +0 -170
  61. package/dist/lib/node/index.cjs.map +0 -7
  62. package/dist/lib/node/meta.json +0 -1
  63. package/dist/types/src/decorators/withSignals.d.ts +0 -6
  64. package/dist/types/src/decorators/withSignals.d.ts.map +0 -1
  65. package/src/decorators/withSignals.tsx +0 -16
@@ -1,170 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var node_exports = {};
30
- __export(node_exports, {
31
- ColumnContainer: () => ColumnContainer,
32
- DefaultContainer: () => DefaultContainer,
33
- FixedContainer: () => FixedContainer,
34
- render: () => render,
35
- withLayout: () => withLayout,
36
- withSignals: () => withSignals,
37
- withTheme: () => withTheme
38
- });
39
- module.exports = __toCommonJS(node_exports);
40
- var import_react = require("@dxos/echo-signals/react");
41
- var import_lodash = __toESM(require("lodash.defaultsdeep"));
42
- var import_react2 = __toESM(require("react"));
43
- var import_react_ui = require("@dxos/react-ui");
44
- var import_react_ui_theme = require("@dxos/react-ui-theme");
45
- var import_react3 = __toESM(require("react"));
46
- var import_react4 = require("@dxos/echo-signals/react");
47
- var import_preview_api = require("@storybook/preview-api");
48
- var import_react5 = __toESM(require("react"));
49
- var import_storybook_dark_mode = require("storybook-dark-mode");
50
- var import_lit_theme_editor = require("@dxos/lit-theme-editor");
51
- var import_dx_theme_editor = require("@dxos/lit-theme-editor/dx-theme-editor.pcss");
52
- var import_react6 = require("@dxos/lit-ui/react");
53
- var import_react_ui2 = require("@dxos/react-ui");
54
- var import_react_ui_theme2 = require("@dxos/react-ui-theme");
55
- var import_theme_editor_addon = require("@dxos/theme-editor-addon");
56
- var import_react7 = __toESM(require("react"));
57
- var defaultOptions = {
58
- density: "fine"
59
- };
60
- var providers = [
61
- (children, options) => {
62
- return options?.density ? /* @__PURE__ */ import_react2.default.createElement(import_react_ui.DensityProvider, {
63
- density: options.density
64
- }, children) : children;
65
- }
66
- ];
67
- var withLayout = ({ classNames, fullscreen, Container = fullscreen ? FixedContainer : DefaultContainer, ...providedOptions } = {}) => {
68
- return (Story, _context) => {
69
- const children = /* @__PURE__ */ import_react2.default.createElement(Container, {
70
- classNames,
71
- fullscreen
72
- }, /* @__PURE__ */ import_react2.default.createElement(Story, null));
73
- const options = (0, import_lodash.default)({}, providedOptions, defaultOptions);
74
- return providers.reduceRight((acc, provider) => provider(acc, options), children);
75
- };
76
- };
77
- var DefaultContainer = ({ children, classNames }) => {
78
- return /* @__PURE__ */ import_react2.default.createElement("div", {
79
- role: "none",
80
- className: (0, import_react_ui_theme.mx)(classNames)
81
- }, children);
82
- };
83
- var FixedContainer = ({ children, classNames }) => {
84
- return /* @__PURE__ */ import_react2.default.createElement("div", {
85
- role: "none",
86
- className: (0, import_react_ui_theme.mx)("fixed inset-0 flex overflow-hidden", classNames)
87
- }, children);
88
- };
89
- var ColumnContainer = ({ children, classNames = "w-[30rem]", ...props }) => {
90
- return /* @__PURE__ */ import_react2.default.createElement(FixedContainer, {
91
- classNames: "justify-center bg-modalSurface",
92
- ...props
93
- }, /* @__PURE__ */ import_react2.default.createElement("div", {
94
- role: "none",
95
- className: (0, import_react_ui_theme.mx)("flex flex-col h-full overflow-y-auto bg-baseSurface", classNames)
96
- }, children));
97
- };
98
- var withSignals = (Story) => {
99
- (0, import_react4.registerSignalsRuntime)();
100
- return /* @__PURE__ */ import_react3.default.createElement(Story, null);
101
- };
102
- var DxThemeEditor = (0, import_react6.createComponent)({
103
- tagName: "dx-theme-editor",
104
- elementClass: import_lit_theme_editor.DxThemeEditor,
105
- react: import_react5.default
106
- });
107
- var withTheme = (Story, context) => {
108
- const MemoizedStory = /* @__PURE__ */ (0, import_react5.memo)(Story);
109
- const [themeMode, setThemeMode] = (0, import_react5.useState)("dark");
110
- const [editorOpen, setEditorOpen] = (0, import_react5.useState)(false);
111
- const handleOpenChange = (0, import_react5.useCallback)((nextOpen) => {
112
- setEditorOpen(nextOpen);
113
- }, []);
114
- (0, import_react5.useEffect)(() => {
115
- const handleDarkModeUpdate = (darkMode) => setThemeMode(darkMode ? "dark" : "light");
116
- import_preview_api.addons.getChannel().on(import_storybook_dark_mode.DARK_MODE_EVENT_NAME, handleDarkModeUpdate);
117
- return () => import_preview_api.addons.getChannel().off(import_storybook_dark_mode.DARK_MODE_EVENT_NAME, handleDarkModeUpdate);
118
- }, []);
119
- (0, import_react5.useEffect)(() => {
120
- const openEditor = () => {
121
- handleOpenChange(true);
122
- };
123
- import_preview_api.addons.getChannel().on(import_theme_editor_addon.PARAM_KEY, openEditor);
124
- return () => import_preview_api.addons.getChannel().off(import_theme_editor_addon.PARAM_KEY, openEditor);
125
- }, []);
126
- return /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.ThemeProvider, {
127
- tx: import_react_ui_theme2.defaultTx,
128
- themeMode,
129
- resourceExtensions: context?.parameters?.translations,
130
- noCache: true
131
- }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.Tooltip.Provider, null, /* @__PURE__ */ import_react5.default.createElement(MemoizedStory, null), /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.Dialog.Root, {
132
- open: editorOpen,
133
- onOpenChange: handleOpenChange,
134
- modal: false
135
- }, /* @__PURE__ */ import_react5.default.createElement("div", {
136
- role: "none",
137
- className: "dx-dialog__overlay bg-transparent pointer-events-none",
138
- style: {
139
- placeContent: "end"
140
- }
141
- }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.Dialog.Content, {
142
- classNames: "relative box-content py-0 px-2 md:is-[35rem] md:max-is-none overflow-y-auto layout-contain pointer-events-auto",
143
- style: {
144
- maxBlockSize: "50dvh"
145
- },
146
- onInteractOutside: (event) => event.preventDefault()
147
- }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.Dialog.Title, {
148
- srOnly: true
149
- }, "Theme Editor"), editorOpen && /* @__PURE__ */ import_react5.default.createElement(DxThemeEditor, null), /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.Dialog.Close, {
150
- asChild: true
151
- }, /* @__PURE__ */ import_react5.default.createElement(import_react_ui2.IconButton, {
152
- iconOnly: true,
153
- icon: "ph--x--regular",
154
- label: "Close",
155
- classNames: "absolute block-start-2 inline-end-2"
156
- })))))));
157
- };
158
- var render = (r) => (args) => /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, r(args) ?? /* @__PURE__ */ import_react7.default.createElement("div", null));
159
- (0, import_react.registerSignalsRuntime)();
160
- // Annotate the CommonJS export names for ESM import in node:
161
- 0 && (module.exports = {
162
- ColumnContainer,
163
- DefaultContainer,
164
- FixedContainer,
165
- render,
166
- withLayout,
167
- withSignals,
168
- withTheme
169
- });
170
- //# sourceMappingURL=index.cjs.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/index.ts", "../../../src/decorators/withLayout.tsx", "../../../src/decorators/withSignals.tsx", "../../../src/decorators/withTheme.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 './decorators';\nexport * from './util';\n\nregisterSignalsRuntime();\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 ? FixedContainer : 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\nexport const DefaultContainer: FC<ContainerProps> = ({ children, classNames }) => {\n return (\n <div role='none' className={mx(classNames)}>\n {children}\n </div>\n );\n};\n\nexport const FixedContainer: FC<ContainerProps> = ({ children, classNames }) => {\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: FC<ContainerProps> = ({ children, classNames = 'w-[30rem]', ...props }) => {\n return (\n <FixedContainer 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 </FixedContainer>\n );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Decorator } from '@storybook/react';\nimport React from 'react';\n\nimport { registerSignalsRuntime } from '@dxos/echo-signals/react';\n\n/**\n * Make objects created using @dxos/echo-schema `create` reactive.\n */\nexport const withSignals: Decorator = (Story) => {\n registerSignalsRuntime();\n return <Story />;\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { addons } from '@storybook/preview-api';\nimport { type Decorator } from '@storybook/react';\nimport React, { memo, useCallback, useEffect, useState } from 'react';\nimport { DARK_MODE_EVENT_NAME } from 'storybook-dark-mode';\n\nimport { DxThemeEditor as NaturalDxThemeEditor } from '@dxos/lit-theme-editor';\nimport '@dxos/lit-theme-editor/dx-theme-editor.pcss';\nimport { createComponent } from '@dxos/lit-ui/react';\nimport { type ThemeMode, ThemeProvider, Tooltip, Dialog, IconButton } from '@dxos/react-ui';\nimport { defaultTx } from '@dxos/react-ui-theme';\nimport { PARAM_KEY } from '@dxos/theme-editor-addon';\n\nconst DxThemeEditor = createComponent({\n tagName: 'dx-theme-editor',\n elementClass: NaturalDxThemeEditor,\n react: React,\n});\n\n/**\n * Changes theme based on storybook toolbar toggle.\n */\nexport const withTheme: Decorator = (Story, context) => {\n // Prevent re-rendering of the story.\n const MemoizedStory = memo(Story);\n const [themeMode, setThemeMode] = useState<ThemeMode>('dark');\n const [editorOpen, setEditorOpen] = useState(false);\n\n const handleOpenChange = useCallback((nextOpen: boolean) => {\n setEditorOpen(nextOpen);\n }, []);\n\n // https://www.npmjs.com/package/storybook-dark-mode\n // NOTE: The `useDarkMode` hook causes the story to continually re-render.\n // NOTE: Changing the theme will cause the story to remount.\n useEffect(() => {\n const handleDarkModeUpdate = (darkMode: boolean) => setThemeMode(darkMode ? 'dark' : 'light');\n addons.getChannel().on(DARK_MODE_EVENT_NAME, handleDarkModeUpdate);\n return () => addons.getChannel().off(DARK_MODE_EVENT_NAME, handleDarkModeUpdate);\n }, []);\n\n useEffect(() => {\n const openEditor = () => {\n handleOpenChange(true);\n };\n addons.getChannel().on(PARAM_KEY, openEditor);\n return () => addons.getChannel().off(PARAM_KEY, openEditor);\n }, []);\n\n return (\n <ThemeProvider tx={defaultTx} themeMode={themeMode} resourceExtensions={context?.parameters?.translations} noCache>\n <Tooltip.Provider>\n <MemoizedStory />\n <Dialog.Root open={editorOpen} onOpenChange={handleOpenChange} modal={false}>\n <div\n role='none'\n className='dx-dialog__overlay bg-transparent pointer-events-none'\n style={{ placeContent: 'end' }}\n >\n <Dialog.Content\n classNames='relative box-content py-0 px-2 md:is-[35rem] md:max-is-none overflow-y-auto layout-contain pointer-events-auto'\n style={{ maxBlockSize: '50dvh' }}\n onInteractOutside={(event) => event.preventDefault()}\n >\n <Dialog.Title srOnly>Theme Editor</Dialog.Title>\n {editorOpen && <DxThemeEditor />}\n <Dialog.Close asChild>\n <IconButton\n iconOnly\n icon='ph--x--regular'\n label='Close'\n classNames='absolute block-start-2 inline-end-2'\n />\n </Dialog.Close>\n </Dialog.Content>\n </div>\n </Dialog.Root>\n </Tooltip.Provider>\n </ThemeProvider>\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": ["import_react", "import_react_ui", "import_react_ui_theme", "defaultOptions", "density", "providers", "children", "options", "React", "DensityProvider", "withLayout", "classNames", "fullscreen", "Container", "FixedContainer", "DefaultContainer", "providedOptions", "Story", "_context", "defaultsDeep", "reduceRight", "acc", "provider", "div", "role", "className", "mx", "ColumnContainer", "props", "withSignals", "registerSignalsRuntime", "DxThemeEditor", "createComponent", "tagName", "elementClass", "NaturalDxThemeEditor", "react", "withTheme", "context", "MemoizedStory", "memo", "themeMode", "setThemeMode", "useState", "editorOpen", "setEditorOpen", "handleOpenChange", "useCallback", "nextOpen", "useEffect", "handleDarkModeUpdate", "darkMode", "addons", "getChannel", "on", "DARK_MODE_EVENT_NAME", "off", "openEditor", "PARAM_KEY", "ThemeProvider", "tx", "defaultTx", "resourceExtensions", "parameters", "translations", "noCache", "Tooltip", "Provider", "Dialog", "Root", "open", "onOpenChange", "modal", "style", "placeContent", "Content", "maxBlockSize", "onInteractOutside", "event", "preventDefault", "Title", "srOnly", "Close", "asChild", "IconButton", "iconOnly", "icon", "label", "render", "r", "args"]
7
- }
@@ -1 +0,0 @@
1
- {"inputs":{"packages/common/storybook-utils/src/decorators/withLayout.tsx":{"bytes":7364,"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"},"packages/common/storybook-utils/src/decorators/withSignals.tsx":{"bytes":1400,"imports":[{"path":"react","kind":"import-statement","external":true},{"path":"@dxos/echo-signals/react","kind":"import-statement","external":true}],"format":"esm"},"packages/common/storybook-utils/src/decorators/withTheme.tsx":{"bytes":10989,"imports":[{"path":"@storybook/preview-api","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"storybook-dark-mode","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor/dx-theme-editor.pcss","kind":"import-statement","external":true},{"path":"@dxos/lit-ui/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":"@dxos/theme-editor-addon","kind":"import-statement","external":true}],"format":"esm"},"packages/common/storybook-utils/src/decorators/index.ts":{"bytes":676,"imports":[{"path":"packages/common/storybook-utils/src/decorators/withLayout.tsx","kind":"import-statement","original":"./withLayout"},{"path":"packages/common/storybook-utils/src/decorators/withSignals.tsx","kind":"import-statement","original":"./withSignals"},{"path":"packages/common/storybook-utils/src/decorators/withTheme.tsx","kind":"import-statement","original":"./withTheme"}],"format":"esm"},"packages/common/storybook-utils/src/util.tsx":{"bytes":1012,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/common/storybook-utils/src/index.ts":{"bytes":930,"imports":[{"path":"@dxos/echo-signals/react","kind":"import-statement","external":true},{"path":"packages/common/storybook-utils/src/decorators/index.ts","kind":"import-statement","original":"./decorators"},{"path":"packages/common/storybook-utils/src/util.tsx","kind":"import-statement","original":"./util"}],"format":"esm"}},"outputs":{"packages/common/storybook-utils/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":11326},"packages/common/storybook-utils/dist/lib/node/index.cjs":{"imports":[{"path":"@dxos/echo-signals/react","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/echo-signals/react","kind":"import-statement","external":true},{"path":"@storybook/preview-api","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true},{"path":"storybook-dark-mode","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor","kind":"import-statement","external":true},{"path":"@dxos/lit-theme-editor/dx-theme-editor.pcss","kind":"import-statement","external":true},{"path":"@dxos/lit-ui/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":"@dxos/theme-editor-addon","kind":"import-statement","external":true},{"path":"react","kind":"import-statement","external":true}],"exports":["ColumnContainer","DefaultContainer","FixedContainer","render","withLayout","withSignals","withTheme"],"entryPoint":"packages/common/storybook-utils/src/index.ts","inputs":{"packages/common/storybook-utils/src/index.ts":{"bytesInOutput":121},"packages/common/storybook-utils/src/decorators/withLayout.tsx":{"bytesInOutput":1671},"packages/common/storybook-utils/src/decorators/index.ts":{"bytesInOutput":0},"packages/common/storybook-utils/src/decorators/withSignals.tsx":{"bytesInOutput":217},"packages/common/storybook-utils/src/decorators/withTheme.tsx":{"bytesInOutput":2803},"packages/common/storybook-utils/src/util.tsx":{"bytesInOutput":181}},"bytes":5492}}}
@@ -1,6 +0,0 @@
1
- import { type Decorator } from '@storybook/react';
2
- /**
3
- * Make objects created using @dxos/echo-schema `create` reactive.
4
- */
5
- export declare const withSignals: Decorator;
6
- //# sourceMappingURL=withSignals.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"withSignals.d.ts","sourceRoot":"","sources":["../../../../src/decorators/withSignals.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAKlD;;GAEG;AACH,eAAO,MAAM,WAAW,EAAE,SAGzB,CAAC"}
@@ -1,16 +0,0 @@
1
- //
2
- // Copyright 2023 DXOS.org
3
- //
4
-
5
- import { type Decorator } from '@storybook/react';
6
- import React from 'react';
7
-
8
- import { registerSignalsRuntime } from '@dxos/echo-signals/react';
9
-
10
- /**
11
- * Make objects created using @dxos/echo-schema `create` reactive.
12
- */
13
- export const withSignals: Decorator = (Story) => {
14
- registerSignalsRuntime();
15
- return <Story />;
16
- };