@dxos/react-ui-mosaic 0.3.9-main.2b2db7f → 0.3.9-main.2dc53cf

package/dist/types/src/stories/Home.stories.d.ts

@@ -1,7 +1,7 @@
 import '@dxosTheme';
 declare const _default: {
     component: () => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/stories/Home.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Home.stories.d.ts","sourceRoot":"","sources":["../../../../src/stories/Home.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;;;;;;;;AA0EpB,wBAME;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}
+{"version":3,"file":"Home.stories.d.ts","sourceRoot":"","sources":["../../../../src/stories/Home.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;;;;;;;;AA4EpB,wBAME;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}

package/dist/types/src/views/Demo/Demo.stories.d.ts

@@ -1,7 +1,7 @@
 import '@dxosTheme';
 declare const _default: {
     title: string;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Demo/Demo.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Demo.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Demo/Demo.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;;;;;;;;AAcpB,wBAME;AAKF,eAAO,MAAM,OAAO,mBAenB,CAAC;AAEF,eAAO,MAAM,IAAI,mBAehB,CAAC;AAEF,eAAO,MAAM,MAAM,mBAelB,CAAC"}
+{"version":3,"file":"Demo.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Demo/Demo.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,YAAY,CAAC;;;;;;;;AAgBpB,wBAME;AAKF,eAAO,MAAM,OAAO,mBAenB,CAAC;AAEF,eAAO,MAAM,IAAI,mBAehB,CAAC;AAEF,eAAO,MAAM,MAAM,mBAelB,CAAC"}

package/dist/types/src/views/Demo/Echo.stories.d.ts

@@ -5,7 +5,7 @@ declare const _default: {
     render: React.FC<{
         spaceKey: PublicKey;
     }>;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
 };
 export default _default;
 export declare const ECHO: {};

package/dist/types/src/views/Demo/Echo.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Echo.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Demo/Echo.stories.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;;;;;;;;AAmCpD,wBA2BE;AAIF,eAAO,MAAM,IAAI,IAAK,CAAC"}
+{"version":3,"file":"Echo.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Demo/Echo.stories.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;;;;;;;;AAoCpD,wBA4BE;AAIF,eAAO,MAAM,IAAI,IAAK,CAAC"}

package/dist/types/src/views/Grid/Grid.stories.d.ts

@@ -3,7 +3,7 @@ import '@dxosTheme';
 declare const _default: {
     component: ({ id, items, layout, options: opts, margin, square, debug, selected: controlledSelected, Component, className, onDrop, onOver, onSelect, onCreate, onAction, }: import("./Grid").GridProps<import("../../mosaic").MosaicDataItem>) => JSX.Element;
     render: () => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Grid/Grid.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Grid.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Grid/Grid.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;;;;;;;;;AA2BpB,wBAcE;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}
+{"version":3,"file":"Grid.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Grid/Grid.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;;;;;;;;;AA6BpB,wBAcE;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}

package/dist/types/src/views/Kanban/Echo.stories.d.ts

@@ -8,7 +8,7 @@ declare const _default: {
         spaceKey: PublicKey;
         debug: boolean;
     }) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Kanban/Echo.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Echo.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Kanban/Echo.stories.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;;;;;kBAoBtC,MAAM;kBACN,SAAS;eACZ,OAAO;;;;;;;AAXlB,wBA+CE;AAEF,eAAO,MAAM,IAAI,IAAK,CAAC"}
+{"version":3,"file":"Echo.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Kanban/Echo.stories.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;;;;;kBAqBtC,MAAM;kBACN,SAAS;eACZ,OAAO;;;;;;;AAXlB,wBAgDE;AAEF,eAAO,MAAM,IAAI,IAAK,CAAC"}

package/dist/types/src/views/Kanban/Kanban.stories.d.ts

@@ -4,7 +4,7 @@ import { type DemoKanbanProps } from './testing';
 declare const _default: {
     component: ({ id, columns, Component: TileComponent, debug, onDrop, }: import("./Kanban").KanbanProps<import("../../mosaic").MosaicDataItem>) => JSX.Element;
     render: (args: DemoKanbanProps) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Kanban/Kanban.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Kanban.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Kanban/Kanban.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAMpB,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,WAAW,CAAC;;;mBAQ5C,eAAe;;;;;;AAFhC,wBAcE;AAEF,eAAO,MAAM,OAAO;;;;;;CAMnB,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC"}
+{"version":3,"file":"Kanban.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Kanban/Kanban.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAQpB,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,WAAW,CAAC;;;mBAQ5C,eAAe;;;;;;AAFhC,wBAcE;AAEF,eAAO,MAAM,OAAO;;;;;;CAMnB,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC"}

package/dist/types/src/views/Stack/Columns.stories.d.ts

@@ -5,7 +5,7 @@ declare const _default: {
     title: string;
     component: ({ id, Component, onOver, onDrop, items, direction, debug, }: import("./Stack").StackProps<import("../../mosaic").MosaicDataItem>) => JSX.Element;
     render: (args: DemoStackProps) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Stack/Columns.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Columns.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Stack/Columns.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAMpB,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,WAAW,CAAC;;;;mBAS1C,cAAc;;;;;;AAH/B,wBAoBE;AAEF,eAAO,MAAM,QAAQ;;;;;CAKpB,CAAC;AAGF,eAAO,MAAM,IAAI;;;;;;CAMhB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;CAMlB,CAAC"}
+{"version":3,"file":"Columns.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Stack/Columns.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAQpB,OAAO,EAAa,KAAK,cAAc,EAAE,MAAM,WAAW,CAAC;;;;mBAS1C,cAAc;;;;;;AAH/B,wBAoBE;AAEF,eAAO,MAAM,QAAQ;;;;;CAKpB,CAAC;AAGF,eAAO,MAAM,IAAI;;;;;;CAMhB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;CAMlB,CAAC"}

package/dist/types/src/views/Stack/Stack.stories.d.ts

@@ -7,7 +7,7 @@ declare const _default: {
         types: string[];
         count: number;
     }) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Stack/Stack.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Stack/Stack.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAKpB,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;;;mBAUvC,UAAU,GAAG;QACjB,KAAK,EAAE,MAAM,EAAE,CAAC;QAChB,KAAK,EAAE,MAAM,CAAC;KACf;;;;;;AANL,wBAmBE;AAEF,eAAO,MAAM,OAAO;;;;;;CAMnB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;CAOtB,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC"}
+{"version":3,"file":"Stack.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Stack/Stack.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAOpB,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;;;mBAUvC,UAAU,GAAG;QACjB,KAAK,EAAE,MAAM,EAAE,CAAC;QAChB,KAAK,EAAE,MAAM,CAAC;KACf;;;;;;AANL,wBAmBE;AAEF,eAAO,MAAM,OAAO;;;;;;CAMnB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;CAOtB,CAAC;AAEF,eAAO,MAAM,OAAO;;;;;;;CAOnB,CAAC"}

package/dist/types/src/views/Tree/Graph.stories.d.ts

@@ -7,7 +7,7 @@ declare const _default: {
         id: string;
         debug: boolean;
     }) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Tree/Graph.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Graph.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Tree/Graph.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;;;;;YAeqB,MAAM;eAAS,OAAO;;;;;;;AAH/D,wBAeE;AAEF,eAAO,MAAM,KAAK;;;;CAEjB,CAAC"}
+{"version":3,"file":"Graph.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Tree/Graph.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;;;;;YAiBqB,MAAM;eAAS,OAAO;;;;;;;AAH/D,wBAeE;AAEF,eAAO,MAAM,KAAK;;;;CAEjB,CAAC"}

package/dist/types/src/views/Tree/Tree.stories.d.ts

@@ -4,7 +4,7 @@ import { type DemoTreeProps } from './testing';
 declare const _default: {
     component: ({ id, Component, onOver, onDrop, items, debug }: import("./Tree").TreeProps<import("./Tree").TreeData>) => JSX.Element;
     render: (args: DemoTreeProps) => JSX.Element;
-    decorators: import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0a347bb9").R>[];
+    decorators: (import("@storybook/csf").DecoratorFunction<import("@storybook/react/dist/types-0fc72a6d").R> | import("@storybook/react").Decorator)[];
     parameters: {
         layout: string;
     };

package/dist/types/src/views/Tree/Tree.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Tree/Tree.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAMpB,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,WAAW,CAAC;;;mBA6DxC,aAAa;;;;;;AAF9B,wBAcE;AAEF,eAAO,MAAM,OAAO;;;;;;;;;;;;;CAEnB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;CAEhB,CAAC"}
+{"version":3,"file":"Tree.stories.d.ts","sourceRoot":"","sources":["../../../../../src/views/Tree/Tree.stories.tsx"],"names":[],"mappings":";AAIA,OAAO,YAAY,CAAC;AAQpB,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,WAAW,CAAC;;;mBA6DxC,aAAa;;;;;;AAF9B,wBAcE;AAEF,eAAO,MAAM,OAAO;;;;;;;;;;;;;CAEnB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;;CAEhB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-mosaic",
-  "version": "0.3.9-main.2b2db7f",
+  "version": "0.3.9-main.2dc53cf",
   "description": "An intermediate interface for drag-and-drop interactions.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -25,14 +25,15 @@
     "lodash.defaultsdeep": "^4.6.1",
     "lodash.pick": "^4.4.0",
     "react-resize-detector": "^7.1.2",
-    "@dxos/debug": "0.3.9-main.2b2db7f",
-    "@dxos/invariant": "0.3.9-main.2b2db7f",
-    "@dxos/react-ui": "0.3.9-main.2b2db7f",
-    "@dxos/keys": "0.3.9-main.2b2db7f",
-    "@dxos/react-ui-theme": "0.3.9-main.2b2db7f",
-    "@dxos/react-ui-card": "0.3.9-main.2b2db7f",
-    "@dxos/react-ui-types": "0.3.9-main.2b2db7f",
-    "@dxos/util": "0.3.9-main.2b2db7f"
+    "@dxos/debug": "0.3.9-main.2dc53cf",
+    "@dxos/keys": "0.3.9-main.2dc53cf",
+    "@dxos/invariant": "0.3.9-main.2dc53cf",
+    "@dxos/react-ui": "0.3.9-main.2dc53cf",
+    "@dxos/react-ui-card": "0.3.9-main.2dc53cf",
+    "@dxos/react-ui-types": "0.3.9-main.2dc53cf",
+    "@dxos/react-ui-theme": "0.3.9-main.2dc53cf",
+    "@dxos/storybook-utils": "0.3.9-main.2dc53cf",
+    "@dxos/util": "0.3.9-main.2dc53cf"
   },
   "devDependencies": {
     "@faker-js/faker": "^8.0.2",
@@ -42,16 +43,15 @@
     "@types/lodash.pick": "^4.4.7",
     "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
-    "chromatic": "^7.5.0",
     "d3": "^7.8.5",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "vite": "^4.3.9",
     "vite-plugin-turbosnap": "^1.0.2",
-    "@dxos/app-graph": "0.3.9-main.2b2db7f",
-    "@dxos/gem-core": "0.3.9-main.2b2db7f",
-    "@dxos/echo-schema": "0.3.9-main.2b2db7f",
-    "@dxos/react-client": "0.3.9-main.2b2db7f"
+    "@dxos/app-graph": "0.3.9-main.2dc53cf",
+    "@dxos/gem-core": "0.3.9-main.2dc53cf",
+    "@dxos/echo-schema": "0.3.9-main.2dc53cf",
+    "@dxos/react-client": "0.3.9-main.2dc53cf"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.0.5",
@@ -60,8 +60,5 @@
   },
   "publishConfig": {
     "access": "public"
-  },
-  "scripts": {
-    "chromatic": "true"
   }
 }

package/src/stories/Home.stories.tsx

@@ -6,6 +6,8 @@ import '@dxosTheme';
 
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { FullscreenDecorator } from '../testing';
 
 const org = '@dxos-mosaic';
@@ -78,7 +80,7 @@ const Home = () => {
 
 export default {
   component: Home,
-  decorators: [FullscreenDecorator('flex justify-center bg-[url(/images/bg-mosaic.png)]')],
+  decorators: [withTheme, FullscreenDecorator('flex justify-center bg-[url(/images/bg-mosaic.png)]')],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Demo/Demo.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Mosaic } from '../../mosaic';
 import { ComplexCard, FullscreenDecorator, SimpleCard } from '../../testing';
 import { DemoGrid } from '../Grid/testing';
@@ -18,7 +20,7 @@ faker.seed(5);
 
 export default {
   title: 'Views/Demo',
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Demo/Echo.stories.tsx

@@ -8,6 +8,7 @@ import React, { type FC } from 'react';
 import { type PublicKey } from '@dxos/react-client';
 import { Expando } from '@dxos/react-client/echo';
 import { ClientSpaceDecorator } from '@dxos/react-client/testing';
+import { withTheme } from '@dxos/storybook-utils';
 
 import { Mosaic } from '../../mosaic';
 import { FullscreenDecorator, TestObjectGenerator, range, Status, Priority } from '../../testing';
@@ -44,6 +45,7 @@ export default {
   title: 'Views/Demo',
   render: Story,
   decorators: [
+    withTheme,
     FullscreenDecorator(),
     ClientSpaceDecorator({
       onCreateSpace: async (space) => {

package/src/views/Grid/Grid.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Grid, type GridLayout } from './Grid';
 import { DemoGrid } from './testing';
 import { Mosaic } from '../../mosaic';
@@ -39,7 +41,7 @@ export default {
       </Mosaic.Root>
     );
   },
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Kanban/Echo.stories.tsx

@@ -7,6 +7,7 @@ import React from 'react';
 import { type PublicKey } from '@dxos/react-client';
 import { Expando } from '@dxos/react-client/echo';
 import { ClientSpaceDecorator } from '@dxos/react-client/testing';
+import { withTheme } from '@dxos/storybook-utils';
 
 import { Kanban } from './Kanban';
 import { EchoKanban, columnValues } from './testing';
@@ -36,6 +37,7 @@ export default {
     );
   },
   decorators: [
+    withTheme,
     FullscreenDecorator(),
     ClientSpaceDecorator({
       onCreateSpace: async (space) => {

package/src/views/Kanban/Kanban.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Kanban } from './Kanban';
 import { DemoKanban, type DemoKanbanProps } from './testing';
 import { Mosaic } from '../../mosaic';
@@ -24,7 +26,7 @@ export default {
       </Mosaic.Root>
     );
   },
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Stack/Columns.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Stack } from './Stack';
 import { DemoStack, type DemoStackProps } from './testing';
 import { Mosaic } from '../../mosaic';
@@ -30,7 +32,7 @@ export default {
       </Mosaic.Root>
     );
   },
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Stack/Stack.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Stack, type StackProps } from './Stack';
 import { DemoStack } from './testing';
 import { Mosaic } from '../../mosaic';
@@ -29,7 +31,7 @@ export default {
       </Mosaic.Root>
     );
   },
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Tree/Graph.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Tree } from './Tree';
 import { GraphTree } from './testing';
 import { Mosaic } from '../../mosaic';
@@ -25,7 +27,7 @@ export default {
       </Mosaic.Root>
     );
   },
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },

package/src/views/Tree/Tree.stories.tsx

@@ -7,6 +7,8 @@ import '@dxosTheme';
 import { faker } from '@faker-js/faker';
 import React from 'react';
 
+import { withTheme } from '@dxos/storybook-utils';
+
 import { Tree } from './Tree';
 import { DemoTree, type DemoTreeProps } from './testing';
 import { Mosaic } from '../../mosaic';
@@ -77,7 +79,7 @@ export default {
       </Mosaic.Root>
     );
   },
-  decorators: [FullscreenDecorator()],
+  decorators: [withTheme, FullscreenDecorator()],
   parameters: {
     layout: 'fullscreen',
   },