@dxos/react-ui-mosaic 0.3.9-main.cea1d3b → 0.3.9-main.d4ef8aa

package/src/mosaic/util/props.ts

@@ -0,0 +1,14 @@
+//
+// Copyright 2023 DXOS.org
+//
+
+import { MosaicOperations } from '../Container';
+import { type MosaicTileComponentProps, type MosaicTileProps } from '../Tile';
+
+export const isTileProps = (props: Record<string, unknown>): props is MosaicTileProps =>
+  typeof props.path === 'string' && typeof props.item === 'object' && props.item
+    ? 'id' in props.item && typeof props.item.id === 'string'
+    : false;
+
+export const isTileComponentProps = (props: Record<string, unknown>): props is MosaicTileComponentProps =>
+  isTileProps(props) && typeof props.operation === 'string' && MosaicOperations.includes(props.operation);

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/testing/Cards.tsx

@@ -4,7 +4,7 @@
 
 import React, { forwardRef } from 'react';
 
-import { Card } from '@dxos/react-ui';
+import { Card } from '@dxos/react-ui-card';
 import { mx } from '@dxos/react-ui-theme';
 
 import { Mosaic, type MosaicTileComponent } from '../mosaic';

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/Kanban/Kanban.tsx

@@ -4,7 +4,7 @@
 
 import React, { forwardRef, useMemo } from 'react';
 
-import { Card } from '@dxos/react-ui';
+import { Card } from '@dxos/react-ui-card';
 import { groupSurface, mx } from '@dxos/react-ui-theme';
 
 import {

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',
   },

package/src/views/Tree/Tree.tsx

@@ -4,7 +4,8 @@
 
 import React, { forwardRef } from 'react';
 
-import { Card, Tree as TreeComponent, TreeItem as TreeItemComponent } from '@dxos/react-ui';
+import { Tree as TreeComponent, TreeItem as TreeItemComponent } from '@dxos/react-ui';
+import { Card } from '@dxos/react-ui-card';
 import { dropRing, mx } from '@dxos/react-ui-theme';
 
 import {