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

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