@dxos/plugin-masonry 0.8.4-main.406dc2a → 0.8.4-main.72ec0f3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-masonry",
-  "version": "0.8.4-main.406dc2a",
+  "version": "0.8.4-main.72ec0f3",
   "description": "Masonry DXOS Surface plugin",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -25,38 +25,40 @@
     "@preact-signals/safe-react": "^0.9.0",
     "@preact/signals-core": "^1.12.1",
     "@preact/signals-react": "^3.3.0",
-    "@dxos/app-framework": "0.8.4-main.406dc2a",
-    "@dxos/echo": "0.8.4-main.406dc2a",
-    "@dxos/effect": "0.8.4-main.406dc2a",
-    "@dxos/plugin-client": "0.8.4-main.406dc2a",
-    "@dxos/plugin-search": "0.8.4-main.406dc2a",
-    "@dxos/react-client": "0.8.4-main.406dc2a",
-    "@dxos/plugin-space": "0.8.4-main.406dc2a",
-    "@dxos/react-ui": "0.8.4-main.406dc2a",
-    "@dxos/react-ui-form": "0.8.4-main.406dc2a",
-    "@dxos/react-ui-masonry": "0.8.4-main.406dc2a",
-    "@dxos/react-ui-stack": "0.8.4-main.406dc2a",
-    "@dxos/schema": "0.8.4-main.406dc2a"
+    "@dxos/app-framework": "0.8.4-main.72ec0f3",
+    "@dxos/echo": "0.8.4-main.72ec0f3",
+    "@dxos/plugin-space": "0.8.4-main.72ec0f3",
+    "@dxos/plugin-search": "0.8.4-main.72ec0f3",
+    "@dxos/plugin-client": "0.8.4-main.72ec0f3",
+    "@dxos/effect": "0.8.4-main.72ec0f3",
+    "@dxos/react-client": "0.8.4-main.72ec0f3",
+    "@dxos/react-ui": "0.8.4-main.72ec0f3",
+    "@dxos/react-ui-form": "0.8.4-main.72ec0f3",
+    "@dxos/react-ui-masonry": "0.8.4-main.72ec0f3",
+    "@dxos/react-ui-stack": "0.8.4-main.72ec0f3",
+    "@dxos/schema": "0.8.4-main.72ec0f3",
+    "@dxos/types": "0.8.4-main.72ec0f3",
+    "@dxos/util": "0.8.4-main.72ec0f3"
   },
   "devDependencies": {
     "@types/react": "~19.2.2",
-    "@types/react-dom": "~19.2.1",
+    "@types/react-dom": "~19.2.2",
     "effect": "3.18.3",
     "react": "~19.2.0",
     "react-dom": "~19.2.0",
     "vite": "7.1.9",
-    "@dxos/plugin-preview": "0.8.4-main.406dc2a",
-    "@dxos/random": "0.8.4-main.406dc2a",
-    "@dxos/react-ui-theme": "0.8.4-main.406dc2a",
-    "@dxos/plugin-theme": "0.8.4-main.406dc2a",
-    "@dxos/storybook-utils": "0.8.4-main.406dc2a"
+    "@dxos/plugin-preview": "0.8.4-main.72ec0f3",
+    "@dxos/plugin-theme": "0.8.4-main.72ec0f3",
+    "@dxos/random": "0.8.4-main.72ec0f3",
+    "@dxos/react-ui-theme": "0.8.4-main.72ec0f3",
+    "@dxos/storybook-utils": "0.8.4-main.72ec0f3"
   },
   "peerDependencies": {
     "effect": "^3.13.3",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "@dxos/react-ui-theme": "0.8.4-main.406dc2a",
-    "@dxos/react-ui": "0.8.4-main.406dc2a"
+    "@dxos/react-ui": "0.8.4-main.72ec0f3",
+    "@dxos/react-ui-theme": "0.8.4-main.72ec0f3"
   },
   "publishConfig": {
     "access": "public"

package/src/MasonryPlugin.tsx

@@ -31,6 +31,7 @@ export const MasonryPlugin = definePlugin(meta, () => [
         id: Masonry.Masonry.typename,
         metadata: {
           icon: 'ph--wall--regular',
+          iconHue: 'green',
         },
       }),
   }),

package/src/capabilities/react-surface.tsx

@@ -6,7 +6,7 @@ import React from 'react';
 
 import { Capabilities, contributes, createSurface } from '@dxos/app-framework';
 import { Obj } from '@dxos/echo';
-import { DataType } from '@dxos/schema';
+import { View } from '@dxos/schema';
 
 import { MasonryContainer } from '../components/MasonryContainer';
 import { meta } from '../meta';
@@ -17,9 +17,8 @@ export default () =>
     createSurface({
       id: meta.id,
       role: ['article', 'section'],
-      filter: (data): data is { subject: DataType.View } =>
-        Obj.instanceOf(DataType.View, data.subject) &&
-        Obj.instanceOf(Masonry.Masonry, data.subject.presentation?.target),
+      filter: (data): data is { subject: View.View } =>
+        Obj.instanceOf(View.View, data.subject) && Obj.instanceOf(Masonry.Masonry, data.subject.presentation?.target),
       component: ({ data, role }) => <MasonryContainer view={data.subject} role={role} />,
     }),
   ]);

package/src/components/MasonryContainer.stories.tsx

@@ -16,8 +16,9 @@ import { faker } from '@dxos/random';
 import { Filter, useQuery, useSpaces } from '@dxos/react-client/echo';
 import { withTheme } from '@dxos/react-ui/testing';
 import { defaultTx } from '@dxos/react-ui-theme';
-import { DataType } from '@dxos/schema';
+import { View } from '@dxos/schema';
 import { createObjectFactory } from '@dxos/schema/testing';
+import { Organization } from '@dxos/types';
 
 import { Masonry } from '../types';
 
@@ -28,8 +29,8 @@ faker.seed(0);
 const StorybookMasonry = () => {
   const spaces = useSpaces();
   const space = spaces[spaces.length - 1];
-  const views = useQuery(space, Filter.type(DataType.View));
-  const [view, setView] = useState<DataType.View>();
+  const views = useQuery(space, Filter.type(View.View));
+  const [view, setView] = useState<View.View>();
   useEffect(() => {
     if (views.length && !view) {
       const view = views[0];
@@ -49,17 +50,21 @@ const meta = {
     withPluginManager({
       plugins: [
         ClientPlugin({
-          types: [DataType.Organization, DataType.View, Masonry.Masonry],
+          types: [Organization.Organization, View.View, Masonry.Masonry],
           onClientInitialized: async ({ client }) => {
             await client.halo.createIdentity();
             const space = await client.spaces.create();
             await space.waitUntilReady();
 
-            const { view } = await Masonry.makeView({ space, client, typename: DataType.Organization.typename });
+            const { view } = await Masonry.makeView({
+              space,
+              client,
+              typename: Organization.Organization.typename,
+            });
             space.db.add(view);
 
             const factory = createObjectFactory(space.db, faker as any);
-            await factory([{ type: DataType.Organization, count: 64 }]);
+            await factory([{ type: Organization.Organization, count: 64 }]);
           },
         }),
         SpacePlugin({}),

package/src/components/MasonryContainer.tsx

@@ -4,20 +4,20 @@
 
 import React, { useEffect, useMemo, useState } from 'react';
 
-import { Surface } from '@dxos/app-framework';
+import { Surface } from '@dxos/app-framework/react';
 import { Filter, Type } from '@dxos/echo';
 import { EchoSchema, type TypedObject } from '@dxos/echo/internal';
 import { useGlobalFilteredObjects } from '@dxos/plugin-search';
 import { useClient } from '@dxos/react-client';
 import { getSpace, useQuery } from '@dxos/react-client/echo';
 import { Masonry } from '@dxos/react-ui-masonry';
-import { type DataType, ProjectionModel, getTypenameFromQuery } from '@dxos/schema';
+import { ProjectionModel, type View, getTypenameFromQuery } from '@dxos/schema';
 
 const Item = ({ data }: { data: any }) => {
   return <Surface role='card' limit={1} data={{ subject: data }} />;
 };
 
-export const MasonryContainer = ({ view, role }: { view: DataType.View; role: string }) => {
+export const MasonryContainer = ({ view, role }: { view: View.View; role: string }) => {
   const client = useClient();
   const space = getSpace(view);
   const typename = view.query ? getTypenameFromQuery(view.query.ast) : undefined;

package/src/meta.ts

@@ -3,12 +3,17 @@
 //
 
 import { type PluginMeta } from '@dxos/app-framework';
+import { trim } from '@dxos/util';
 
 export const meta: PluginMeta = {
   id: 'dxos.org/plugin/masonry',
   name: 'Masonry',
-  description: 'Masonry displays items from a View query in a responsive grid.',
+  description: trim`
+    Responsive grid layout that displays query results in an adaptive masonry pattern.
+    Visualize collections of cards, images, or mixed content that automatically adjusts to available screen space.
+  `,
   icon: 'ph--wall--regular',
+  iconHue: 'green',
   source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-masonry',
   screenshots: [],
 };

package/src/types/Masonry.ts

@@ -6,7 +6,7 @@ import * as Schema from 'effect/Schema';
 
 import { Obj, Type } from '@dxos/echo';
 import { type JsonSchemaType, ViewAnnotation, toEffectSchema } from '@dxos/echo/internal';
-import { type CreateViewFromSpaceProps, type DataType, createViewFromSpace } from '@dxos/schema';
+import { View } from '@dxos/schema';
 
 export const Masonry = Schema.Struct({
   arrangement: Schema.Array(
@@ -31,17 +31,17 @@ export type Masonry = Schema.Schema.Type<typeof Masonry>;
  */
 export const make = (props: Obj.MakeProps<typeof Masonry> = {}) => Obj.make(Masonry, props);
 
-export type MakeViewProps = Omit<CreateViewFromSpaceProps, 'presentation'>;
+export type MakeViewProps = Omit<View.MakeFromSpaceProps, 'presentation'>;
 
 export const makeView = async ({
   ...props
 }: MakeViewProps): Promise<{
   jsonSchema: JsonSchemaType;
-  view: DataType.View;
+  view: View.View;
   schema: ReturnType<typeof toEffectSchema>;
 }> => {
   const masonry = Obj.make(Masonry, {});
-  const { jsonSchema, view } = await createViewFromSpace({ ...props, presentation: masonry });
+  const { jsonSchema, view } = await View.makeFromSpace({ ...props, presentation: masonry });
 
   // Preset sizes.
   const schema = toEffectSchema(jsonSchema);

package/src/types/MasonryAction.ts

@@ -5,7 +5,7 @@
 import * as Schema from 'effect/Schema';
 
 import { SpaceSchema } from '@dxos/react-client/echo';
-import { DataType, TypenameAnnotationId } from '@dxos/schema';
+import { TypenameAnnotationId, View } from '@dxos/schema';
 
 import { meta } from '../meta';
 
@@ -13,6 +13,7 @@ const MASONRY_ACTION = `${meta.id}/action`;
 
 export const MasonryProps = Schema.Struct({
   name: Schema.optional(Schema.String),
+  // TODO(wittjosiah): This should be a query input instead.
   typename: Schema.optional(
     Schema.String.annotations({
       [TypenameAnnotationId]: ['used-static', 'dynamic'],
@@ -24,6 +25,6 @@ export const MasonryProps = Schema.Struct({
 export class CreateMasonry extends Schema.TaggedClass<CreateMasonry>()(`${MASONRY_ACTION}/create`, {
   input: Schema.extend(Schema.Struct({ space: SpaceSchema }), MasonryProps),
   output: Schema.Struct({
-    object: DataType.View,
+    object: View.View,
   }),
 }) {}

package/dist/lib/browser/chunk-VRZWIUS7.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/meta.ts", "../../../src/types/Masonry.ts", "../../../src/types/MasonryAction.ts"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const meta: PluginMeta = {\n  id: 'dxos.org/plugin/masonry',\n  name: 'Masonry',\n  description: 'Masonry displays items from a View query in a responsive grid.',\n  icon: 'ph--wall--regular',\n  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-masonry',\n  screenshots: [],\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { Obj, Type } from '@dxos/echo';\nimport { type JsonSchemaType, ViewAnnotation, toEffectSchema } from '@dxos/echo/internal';\nimport { type CreateViewFromSpaceProps, type DataType, createViewFromSpace } from '@dxos/schema';\n\nexport const Masonry = Schema.Struct({\n  arrangement: Schema.Array(\n    Schema.Struct({\n      ids: Schema.Array(Type.ObjectId),\n      hidden: Schema.optional(Schema.Boolean),\n    }).pipe(Schema.mutable),\n  ).pipe(Schema.mutable, Schema.optional),\n  // TODO(wittjosiah): Consider Masonry supporting not being just a view but referencing arbitrary data directly.\n}).pipe(\n  Type.Obj({\n    typename: 'dxos.org/type/Masonry',\n    version: '0.1.0',\n  }),\n  ViewAnnotation.set(true),\n);\n\nexport type Masonry = Schema.Schema.Type<typeof Masonry>;\n\n/**\n * Make a masonry object.\n */\nexport const make = (props: Obj.MakeProps<typeof Masonry> = {}) => Obj.make(Masonry, props);\n\nexport type MakeViewProps = Omit<CreateViewFromSpaceProps, 'presentation'>;\n\nexport const makeView = async ({\n  ...props\n}: MakeViewProps): Promise<{\n  jsonSchema: JsonSchemaType;\n  view: DataType.View;\n  schema: ReturnType<typeof toEffectSchema>;\n}> => {\n  const masonry = Obj.make(Masonry, {});\n  const { jsonSchema, view } = await createViewFromSpace({ ...props, presentation: masonry });\n\n  // Preset sizes.\n  const schema = toEffectSchema(jsonSchema);\n\n  return { jsonSchema, schema, view };\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { SpaceSchema } from '@dxos/react-client/echo';\nimport { DataType, TypenameAnnotationId } from '@dxos/schema';\n\nimport { meta } from '../meta';\n\nconst MASONRY_ACTION = `${meta.id}/action`;\n\nexport const MasonryProps = Schema.Struct({\n  name: Schema.optional(Schema.String),\n  typename: Schema.optional(\n    Schema.String.annotations({\n      [TypenameAnnotationId]: ['used-static', 'dynamic'],\n      title: 'Select card record type (leave empty to start fresh)',\n    }),\n  ),\n});\n\nexport class CreateMasonry extends Schema.TaggedClass<CreateMasonry>()(`${MASONRY_ACTION}/create`, {\n  input: Schema.extend(Schema.Struct({ space: SpaceSchema }), MasonryProps),\n  output: Schema.Struct({\n    object: DataType.View,\n  }),\n}) {}\n"],
-  "mappings": ";;;;;;;AAMO,IAAMA,OAAmB;EAC9BC,IAAI;EACJC,MAAM;EACNC,aAAa;EACbC,MAAM;EACNC,QAAQ;EACRC,aAAa,CAAA;AACf;;;ACbA;;;;;;AAIA,YAAYC,YAAY;AAExB,SAASC,KAAKC,YAAY;AAC1B,SAA8BC,gBAAgBC,sBAAsB;AACpE,SAAuDC,2BAA2B;AAE3E,IAAMC,UAAiBC,cAAO;EACnCC,aAAoBC,aACXF,cAAO;IACZG,KAAYD,aAAME,KAAKC,QAAQ;IAC/BC,QAAeC,gBAAgBC,cAAO;EACxC,CAAA,EAAGC,KAAYC,cAAO,CAAA,EACtBD,KAAYC,gBAAgBH,eAAQ;AAExC,CAAA,EAAGE,KACDL,KAAKO,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,GACAC,eAAeC,IAAI,IAAA,CAAA;AAQd,IAAMC,OAAO,CAACC,QAAuC,CAAC,MAAMN,IAAIK,KAAKjB,SAASkB,KAAAA;AAI9E,IAAMC,WAAW,OAAO,EAC7B,GAAGD,MAAAA,MACW;AAKd,QAAME,UAAUR,IAAIK,KAAKjB,SAAS,CAAC,CAAA;AACnC,QAAM,EAAEqB,YAAYC,KAAI,IAAK,MAAMC,oBAAoB;IAAE,GAAGL;IAAOM,cAAcJ;EAAQ,CAAA;AAGzF,QAAMK,SAASC,eAAeL,UAAAA;AAE9B,SAAO;IAAEA;IAAYI;IAAQH;EAAK;AACpC;;;ACjDA;;;;;AAIA,YAAYK,aAAY;AAExB,SAASC,mBAAmB;AAC5B,SAASC,UAAUC,4BAA4B;AAI/C,IAAMC,iBAAiB,GAAGC,KAAKC,EAAE;AAE1B,IAAMC,eAAsBC,eAAO;EACxCC,MAAaC,iBAAgBC,cAAM;EACnCC,UAAiBF,iBACRC,eAAOE,YAAY;IACxB,CAACC,oBAAAA,GAAuB;MAAC;MAAe;;IACxCC,OAAO;EACT,CAAA,CAAA;AAEJ,CAAA;AAEO,IAAMC,gBAAN,cAAmCC,oBAAW,EAAkB,GAAGb,cAAAA,WAAyB;EACjGc,OAAcC,eAAcX,eAAO;IAAEY,OAAOC;EAAY,CAAA,GAAId,YAAAA;EAC5De,QAAed,eAAO;IACpBe,QAAQC,SAASC;EACnB,CAAA;AACF,CAAA,EAAA;AAAI;",
-  "names": ["meta", "id", "name", "description", "icon", "source", "screenshots", "Schema", "Obj", "Type", "ViewAnnotation", "toEffectSchema", "createViewFromSpace", "Masonry", "Struct", "arrangement", "Array", "ids", "Type", "ObjectId", "hidden", "optional", "Boolean", "pipe", "mutable", "Obj", "typename", "version", "ViewAnnotation", "set", "make", "props", "makeView", "masonry", "jsonSchema", "view", "createViewFromSpace", "presentation", "schema", "toEffectSchema", "Schema", "SpaceSchema", "DataType", "TypenameAnnotationId", "MASONRY_ACTION", "meta", "id", "MasonryProps", "Struct", "name", "optional", "String", "typename", "annotations", "TypenameAnnotationId", "title", "CreateMasonry", "TaggedClass", "input", "extend", "space", "SpaceSchema", "output", "object", "DataType", "View"]
-}

package/dist/lib/browser/react-surface-R2TDTTUL.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/capabilities/react-surface.tsx", "../../../src/components/MasonryContainer.tsx"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { Capabilities, contributes, createSurface } from '@dxos/app-framework';\nimport { Obj } from '@dxos/echo';\nimport { DataType } from '@dxos/schema';\n\nimport { MasonryContainer } from '../components/MasonryContainer';\nimport { meta } from '../meta';\nimport { Masonry } from '../types';\n\nexport default () =>\n  contributes(Capabilities.ReactSurface, [\n    createSurface({\n      id: meta.id,\n      role: ['article', 'section'],\n      filter: (data): data is { subject: DataType.View } =>\n        Obj.instanceOf(DataType.View, data.subject) &&\n        Obj.instanceOf(Masonry.Masonry, data.subject.presentation?.target),\n      component: ({ data, role }) => <MasonryContainer view={data.subject} role={role} />,\n    }),\n  ]);\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework';\nimport { Filter, Type } from '@dxos/echo';\nimport { EchoSchema, type TypedObject } from '@dxos/echo/internal';\nimport { useGlobalFilteredObjects } from '@dxos/plugin-search';\nimport { useClient } from '@dxos/react-client';\nimport { getSpace, useQuery } from '@dxos/react-client/echo';\nimport { Masonry } from '@dxos/react-ui-masonry';\nimport { type DataType, ProjectionModel, getTypenameFromQuery } from '@dxos/schema';\n\nconst Item = ({ data }: { data: any }) => {\n  return <Surface role='card' limit={1} data={{ subject: data }} />;\n};\n\nexport const MasonryContainer = ({ view, role }: { view: DataType.View; role: string }) => {\n  const client = useClient();\n  const space = getSpace(view);\n  const typename = view.query ? getTypenameFromQuery(view.query.ast) : undefined;\n\n  const [cardSchema, setCardSchema] = useState<TypedObject<any, any>>();\n  const [projection, setProjection] = useState<ProjectionModel>();\n\n  const jsonSchema = useMemo(() => {\n    if (!cardSchema) return undefined;\n    return cardSchema instanceof EchoSchema ? cardSchema.jsonSchema : Type.toJsonSchema(cardSchema);\n  }, [cardSchema]);\n\n  useEffect(() => {\n    const staticSchema = client.graph.schemaRegistry.schemas.find((schema) => Type.getTypename(schema) === typename);\n    if (staticSchema) {\n      setCardSchema(() => staticSchema as TypedObject<any, any>);\n    }\n    if (!staticSchema && typename && space) {\n      const query = space.db.schemaRegistry.query({ typename });\n      const unsubscribe = query.subscribe(\n        () => {\n          const [schema] = query.results;\n          if (schema) {\n            setCardSchema(schema);\n          }\n        },\n        { fire: true },\n      );\n      return unsubscribe;\n    }\n  }, [typename, space]);\n\n  useEffect(() => {\n    if (jsonSchema) {\n      setProjection(new ProjectionModel(jsonSchema, view.projection));\n    }\n  }, [view.projection, JSON.stringify(jsonSchema)]);\n\n  const objects = useQuery(space, cardSchema ? Filter.type(cardSchema) : Filter.nothing());\n  const filteredObjects = useGlobalFilteredObjects(objects);\n\n  return (\n    <Masonry.Root\n      items={filteredObjects}\n      render={Item as any}\n      classNames='is-full max-is-full bs-full max-bs-full overflow-y-auto p-4'\n    />\n  );\n};\n"],
-  "mappings": ";;;;;;AAIA,OAAOA,YAAW;AAElB,SAASC,cAAcC,aAAaC,qBAAqB;AACzD,SAASC,WAAW;AACpB,SAASC,gBAAgB;;;;ACJzB,OAAOC,SAASC,WAAWC,SAASC,gBAAgB;AAEpD,SAASC,eAAe;AACxB,SAASC,QAAQC,YAAY;AAC7B,SAASC,kBAAoC;AAC7C,SAASC,gCAAgC;AACzC,SAASC,iBAAiB;AAC1B,SAASC,UAAUC,gBAAgB;AACnC,SAASC,eAAe;AACxB,SAAwBC,iBAAiBC,4BAA4B;AAErE,IAAMC,OAAO,CAAC,EAAEC,KAAI,MAAiB;;;AACnC,WAAO,sBAAA,cAACC,SAAAA;MAAQC,MAAK;MAAOC,OAAO;MAAGH,MAAM;QAAEI,SAASJ;MAAK;;;;;AAC9D;AAEO,IAAMK,mBAAmB,CAAC,EAAEC,MAAMJ,KAAI,MAAyC;;;AACpF,UAAMK,SAASC,UAAAA;AACf,UAAMC,QAAQC,SAASJ,IAAAA;AACvB,UAAMK,WAAWL,KAAKM,QAAQC,qBAAqBP,KAAKM,MAAME,GAAG,IAAIC;AAErE,UAAM,CAACC,YAAYC,aAAAA,IAAiBC,SAAAA;AACpC,UAAM,CAACC,YAAYC,aAAAA,IAAiBF,SAAAA;AAEpC,UAAMG,aAAaC,QAAQ,MAAA;AACzB,UAAI,CAACN,WAAY,QAAOD;AACxB,aAAOC,sBAAsBO,aAAaP,WAAWK,aAAaG,KAAKC,aAAaT,UAAAA;IACtF,GAAG;MAACA;KAAW;AAEfU,cAAU,MAAA;AACR,YAAMC,eAAepB,OAAOqB,MAAMC,eAAeC,QAAQC,KAAK,CAACC,WAAWR,KAAKS,YAAYD,MAAAA,MAAYrB,QAAAA;AACvG,UAAIgB,cAAc;AAChBV,sBAAc,MAAMU,YAAAA;MACtB;AACA,UAAI,CAACA,gBAAgBhB,YAAYF,OAAO;AACtC,cAAMG,QAAQH,MAAMyB,GAAGL,eAAejB,MAAM;UAAED;QAAS,CAAA;AACvD,cAAMwB,cAAcvB,MAAMwB,UACxB,MAAA;AACE,gBAAM,CAACJ,MAAAA,IAAUpB,MAAMyB;AACvB,cAAIL,QAAQ;AACVf,0BAAce,MAAAA;UAChB;QACF,GACA;UAAEM,MAAM;QAAK,CAAA;AAEf,eAAOH;MACT;IACF,GAAG;MAACxB;MAAUF;KAAM;AAEpBiB,cAAU,MAAA;AACR,UAAIL,YAAY;AACdD,sBAAc,IAAImB,gBAAgBlB,YAAYf,KAAKa,UAAU,CAAA;MAC/D;IACF,GAAG;MAACb,KAAKa;MAAYqB,KAAKC,UAAUpB,UAAAA;KAAY;AAEhD,UAAMqB,UAAUC,SAASlC,OAAOO,aAAa4B,OAAOC,KAAK7B,UAAAA,IAAc4B,OAAOE,QAAO,CAAA;AACrF,UAAMC,kBAAkBC,yBAAyBN,OAAAA;AAEjD,WACE,sBAAA,cAACO,QAAQC,MAAI;MACXC,OAAOJ;MACPK,QAAQrD;MACRsD,YAAW;;;;;AAGjB;;;ADtDA,IAAA,yBAAe,MACbC,YAAYC,aAAaC,cAAc;EACrCC,cAAc;IACZC,IAAIC,KAAKD;IACTE,MAAM;MAAC;MAAW;;IAClBC,QAAQ,CAACC,SACPC,IAAIC,WAAWC,SAASC,MAAMJ,KAAKK,OAAO,KAC1CJ,IAAIC,WAAWI,gBAAQA,SAASN,KAAKK,QAAQE,cAAcC,MAAAA;IAC7DC,WAAW,CAAC,EAAET,MAAMF,KAAI,MAAO,gBAAAY,OAAA,cAACC,kBAAAA;MAAiBC,MAAMZ,KAAKK;MAASP;;EACvE,CAAA;CACD;",
-  "names": ["React", "Capabilities", "contributes", "createSurface", "Obj", "DataType", "React", "useEffect", "useMemo", "useState", "Surface", "Filter", "Type", "EchoSchema", "useGlobalFilteredObjects", "useClient", "getSpace", "useQuery", "Masonry", "ProjectionModel", "getTypenameFromQuery", "Item", "data", "Surface", "role", "limit", "subject", "MasonryContainer", "view", "client", "useClient", "space", "getSpace", "typename", "query", "getTypenameFromQuery", "ast", "undefined", "cardSchema", "setCardSchema", "useState", "projection", "setProjection", "jsonSchema", "useMemo", "EchoSchema", "Type", "toJsonSchema", "useEffect", "staticSchema", "graph", "schemaRegistry", "schemas", "find", "schema", "getTypename", "db", "unsubscribe", "subscribe", "results", "fire", "ProjectionModel", "JSON", "stringify", "objects", "useQuery", "Filter", "type", "nothing", "filteredObjects", "useGlobalFilteredObjects", "Masonry", "Root", "items", "render", "classNames", "contributes", "Capabilities", "ReactSurface", "createSurface", "id", "meta", "role", "filter", "data", "Obj", "instanceOf", "DataType", "View", "subject", "Masonry", "presentation", "target", "component", "React", "MasonryContainer", "view"]
-}

package/dist/lib/node-esm/chunk-Z4PPM6OA.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/meta.ts", "../../../src/types/Masonry.ts", "../../../src/types/MasonryAction.ts"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const meta: PluginMeta = {\n  id: 'dxos.org/plugin/masonry',\n  name: 'Masonry',\n  description: 'Masonry displays items from a View query in a responsive grid.',\n  icon: 'ph--wall--regular',\n  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-masonry',\n  screenshots: [],\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { Obj, Type } from '@dxos/echo';\nimport { type JsonSchemaType, ViewAnnotation, toEffectSchema } from '@dxos/echo/internal';\nimport { type CreateViewFromSpaceProps, type DataType, createViewFromSpace } from '@dxos/schema';\n\nexport const Masonry = Schema.Struct({\n  arrangement: Schema.Array(\n    Schema.Struct({\n      ids: Schema.Array(Type.ObjectId),\n      hidden: Schema.optional(Schema.Boolean),\n    }).pipe(Schema.mutable),\n  ).pipe(Schema.mutable, Schema.optional),\n  // TODO(wittjosiah): Consider Masonry supporting not being just a view but referencing arbitrary data directly.\n}).pipe(\n  Type.Obj({\n    typename: 'dxos.org/type/Masonry',\n    version: '0.1.0',\n  }),\n  ViewAnnotation.set(true),\n);\n\nexport type Masonry = Schema.Schema.Type<typeof Masonry>;\n\n/**\n * Make a masonry object.\n */\nexport const make = (props: Obj.MakeProps<typeof Masonry> = {}) => Obj.make(Masonry, props);\n\nexport type MakeViewProps = Omit<CreateViewFromSpaceProps, 'presentation'>;\n\nexport const makeView = async ({\n  ...props\n}: MakeViewProps): Promise<{\n  jsonSchema: JsonSchemaType;\n  view: DataType.View;\n  schema: ReturnType<typeof toEffectSchema>;\n}> => {\n  const masonry = Obj.make(Masonry, {});\n  const { jsonSchema, view } = await createViewFromSpace({ ...props, presentation: masonry });\n\n  // Preset sizes.\n  const schema = toEffectSchema(jsonSchema);\n\n  return { jsonSchema, schema, view };\n};\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport * as Schema from 'effect/Schema';\n\nimport { SpaceSchema } from '@dxos/react-client/echo';\nimport { DataType, TypenameAnnotationId } from '@dxos/schema';\n\nimport { meta } from '../meta';\n\nconst MASONRY_ACTION = `${meta.id}/action`;\n\nexport const MasonryProps = Schema.Struct({\n  name: Schema.optional(Schema.String),\n  typename: Schema.optional(\n    Schema.String.annotations({\n      [TypenameAnnotationId]: ['used-static', 'dynamic'],\n      title: 'Select card record type (leave empty to start fresh)',\n    }),\n  ),\n});\n\nexport class CreateMasonry extends Schema.TaggedClass<CreateMasonry>()(`${MASONRY_ACTION}/create`, {\n  input: Schema.extend(Schema.Struct({ space: SpaceSchema }), MasonryProps),\n  output: Schema.Struct({\n    object: DataType.View,\n  }),\n}) {}\n"],
-  "mappings": ";;;;;;;;AAMO,IAAMA,OAAmB;EAC9BC,IAAI;EACJC,MAAM;EACNC,aAAa;EACbC,MAAM;EACNC,QAAQ;EACRC,aAAa,CAAA;AACf;;;ACbA;;;;;;AAIA,YAAYC,YAAY;AAExB,SAASC,KAAKC,YAAY;AAC1B,SAA8BC,gBAAgBC,sBAAsB;AACpE,SAAuDC,2BAA2B;AAE3E,IAAMC,UAAiBC,cAAO;EACnCC,aAAoBC,aACXF,cAAO;IACZG,KAAYD,aAAME,KAAKC,QAAQ;IAC/BC,QAAeC,gBAAgBC,cAAO;EACxC,CAAA,EAAGC,KAAYC,cAAO,CAAA,EACtBD,KAAYC,gBAAgBH,eAAQ;AAExC,CAAA,EAAGE,KACDL,KAAKO,IAAI;EACPC,UAAU;EACVC,SAAS;AACX,CAAA,GACAC,eAAeC,IAAI,IAAA,CAAA;AAQd,IAAMC,OAAO,CAACC,QAAuC,CAAC,MAAMN,IAAIK,KAAKjB,SAASkB,KAAAA;AAI9E,IAAMC,WAAW,OAAO,EAC7B,GAAGD,MAAAA,MACW;AAKd,QAAME,UAAUR,IAAIK,KAAKjB,SAAS,CAAC,CAAA;AACnC,QAAM,EAAEqB,YAAYC,KAAI,IAAK,MAAMC,oBAAoB;IAAE,GAAGL;IAAOM,cAAcJ;EAAQ,CAAA;AAGzF,QAAMK,SAASC,eAAeL,UAAAA;AAE9B,SAAO;IAAEA;IAAYI;IAAQH;EAAK;AACpC;;;ACjDA;;;;;AAIA,YAAYK,aAAY;AAExB,SAASC,mBAAmB;AAC5B,SAASC,UAAUC,4BAA4B;AAI/C,IAAMC,iBAAiB,GAAGC,KAAKC,EAAE;AAE1B,IAAMC,eAAsBC,eAAO;EACxCC,MAAaC,iBAAgBC,cAAM;EACnCC,UAAiBF,iBACRC,eAAOE,YAAY;IACxB,CAACC,oBAAAA,GAAuB;MAAC;MAAe;;IACxCC,OAAO;EACT,CAAA,CAAA;AAEJ,CAAA;AAEO,IAAMC,gBAAN,cAAmCC,oBAAW,EAAkB,GAAGb,cAAAA,WAAyB;EACjGc,OAAcC,eAAcX,eAAO;IAAEY,OAAOC;EAAY,CAAA,GAAId,YAAAA;EAC5De,QAAed,eAAO;IACpBe,QAAQC,SAASC;EACnB,CAAA;AACF,CAAA,EAAA;AAAI;",
-  "names": ["meta", "id", "name", "description", "icon", "source", "screenshots", "Schema", "Obj", "Type", "ViewAnnotation", "toEffectSchema", "createViewFromSpace", "Masonry", "Struct", "arrangement", "Array", "ids", "Type", "ObjectId", "hidden", "optional", "Boolean", "pipe", "mutable", "Obj", "typename", "version", "ViewAnnotation", "set", "make", "props", "makeView", "masonry", "jsonSchema", "view", "createViewFromSpace", "presentation", "schema", "toEffectSchema", "Schema", "SpaceSchema", "DataType", "TypenameAnnotationId", "MASONRY_ACTION", "meta", "id", "MasonryProps", "Struct", "name", "optional", "String", "typename", "annotations", "TypenameAnnotationId", "title", "CreateMasonry", "TaggedClass", "input", "extend", "space", "SpaceSchema", "output", "object", "DataType", "View"]
-}

package/dist/lib/node-esm/react-surface-YTC42VZ3.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/capabilities/react-surface.tsx", "../../../src/components/MasonryContainer.tsx"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport React from 'react';\n\nimport { Capabilities, contributes, createSurface } from '@dxos/app-framework';\nimport { Obj } from '@dxos/echo';\nimport { DataType } from '@dxos/schema';\n\nimport { MasonryContainer } from '../components/MasonryContainer';\nimport { meta } from '../meta';\nimport { Masonry } from '../types';\n\nexport default () =>\n  contributes(Capabilities.ReactSurface, [\n    createSurface({\n      id: meta.id,\n      role: ['article', 'section'],\n      filter: (data): data is { subject: DataType.View } =>\n        Obj.instanceOf(DataType.View, data.subject) &&\n        Obj.instanceOf(Masonry.Masonry, data.subject.presentation?.target),\n      component: ({ data, role }) => <MasonryContainer view={data.subject} role={role} />,\n    }),\n  ]);\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { Surface } from '@dxos/app-framework';\nimport { Filter, Type } from '@dxos/echo';\nimport { EchoSchema, type TypedObject } from '@dxos/echo/internal';\nimport { useGlobalFilteredObjects } from '@dxos/plugin-search';\nimport { useClient } from '@dxos/react-client';\nimport { getSpace, useQuery } from '@dxos/react-client/echo';\nimport { Masonry } from '@dxos/react-ui-masonry';\nimport { type DataType, ProjectionModel, getTypenameFromQuery } from '@dxos/schema';\n\nconst Item = ({ data }: { data: any }) => {\n  return <Surface role='card' limit={1} data={{ subject: data }} />;\n};\n\nexport const MasonryContainer = ({ view, role }: { view: DataType.View; role: string }) => {\n  const client = useClient();\n  const space = getSpace(view);\n  const typename = view.query ? getTypenameFromQuery(view.query.ast) : undefined;\n\n  const [cardSchema, setCardSchema] = useState<TypedObject<any, any>>();\n  const [projection, setProjection] = useState<ProjectionModel>();\n\n  const jsonSchema = useMemo(() => {\n    if (!cardSchema) return undefined;\n    return cardSchema instanceof EchoSchema ? cardSchema.jsonSchema : Type.toJsonSchema(cardSchema);\n  }, [cardSchema]);\n\n  useEffect(() => {\n    const staticSchema = client.graph.schemaRegistry.schemas.find((schema) => Type.getTypename(schema) === typename);\n    if (staticSchema) {\n      setCardSchema(() => staticSchema as TypedObject<any, any>);\n    }\n    if (!staticSchema && typename && space) {\n      const query = space.db.schemaRegistry.query({ typename });\n      const unsubscribe = query.subscribe(\n        () => {\n          const [schema] = query.results;\n          if (schema) {\n            setCardSchema(schema);\n          }\n        },\n        { fire: true },\n      );\n      return unsubscribe;\n    }\n  }, [typename, space]);\n\n  useEffect(() => {\n    if (jsonSchema) {\n      setProjection(new ProjectionModel(jsonSchema, view.projection));\n    }\n  }, [view.projection, JSON.stringify(jsonSchema)]);\n\n  const objects = useQuery(space, cardSchema ? Filter.type(cardSchema) : Filter.nothing());\n  const filteredObjects = useGlobalFilteredObjects(objects);\n\n  return (\n    <Masonry.Root\n      items={filteredObjects}\n      render={Item as any}\n      classNames='is-full max-is-full bs-full max-bs-full overflow-y-auto p-4'\n    />\n  );\n};\n"],
-  "mappings": ";;;;;;;AAIA,OAAOA,YAAW;AAElB,SAASC,cAAcC,aAAaC,qBAAqB;AACzD,SAASC,WAAW;AACpB,SAASC,gBAAgB;;;;ACJzB,OAAOC,SAASC,WAAWC,SAASC,gBAAgB;AAEpD,SAASC,eAAe;AACxB,SAASC,QAAQC,YAAY;AAC7B,SAASC,kBAAoC;AAC7C,SAASC,gCAAgC;AACzC,SAASC,iBAAiB;AAC1B,SAASC,UAAUC,gBAAgB;AACnC,SAASC,eAAe;AACxB,SAAwBC,iBAAiBC,4BAA4B;AAErE,IAAMC,OAAO,CAAC,EAAEC,KAAI,MAAiB;;;AACnC,WAAO,sBAAA,cAACC,SAAAA;MAAQC,MAAK;MAAOC,OAAO;MAAGH,MAAM;QAAEI,SAASJ;MAAK;;;;;AAC9D;AAEO,IAAMK,mBAAmB,CAAC,EAAEC,MAAMJ,KAAI,MAAyC;;;AACpF,UAAMK,SAASC,UAAAA;AACf,UAAMC,QAAQC,SAASJ,IAAAA;AACvB,UAAMK,WAAWL,KAAKM,QAAQC,qBAAqBP,KAAKM,MAAME,GAAG,IAAIC;AAErE,UAAM,CAACC,YAAYC,aAAAA,IAAiBC,SAAAA;AACpC,UAAM,CAACC,YAAYC,aAAAA,IAAiBF,SAAAA;AAEpC,UAAMG,aAAaC,QAAQ,MAAA;AACzB,UAAI,CAACN,WAAY,QAAOD;AACxB,aAAOC,sBAAsBO,aAAaP,WAAWK,aAAaG,KAAKC,aAAaT,UAAAA;IACtF,GAAG;MAACA;KAAW;AAEfU,cAAU,MAAA;AACR,YAAMC,eAAepB,OAAOqB,MAAMC,eAAeC,QAAQC,KAAK,CAACC,WAAWR,KAAKS,YAAYD,MAAAA,MAAYrB,QAAAA;AACvG,UAAIgB,cAAc;AAChBV,sBAAc,MAAMU,YAAAA;MACtB;AACA,UAAI,CAACA,gBAAgBhB,YAAYF,OAAO;AACtC,cAAMG,QAAQH,MAAMyB,GAAGL,eAAejB,MAAM;UAAED;QAAS,CAAA;AACvD,cAAMwB,cAAcvB,MAAMwB,UACxB,MAAA;AACE,gBAAM,CAACJ,MAAAA,IAAUpB,MAAMyB;AACvB,cAAIL,QAAQ;AACVf,0BAAce,MAAAA;UAChB;QACF,GACA;UAAEM,MAAM;QAAK,CAAA;AAEf,eAAOH;MACT;IACF,GAAG;MAACxB;MAAUF;KAAM;AAEpBiB,cAAU,MAAA;AACR,UAAIL,YAAY;AACdD,sBAAc,IAAImB,gBAAgBlB,YAAYf,KAAKa,UAAU,CAAA;MAC/D;IACF,GAAG;MAACb,KAAKa;MAAYqB,KAAKC,UAAUpB,UAAAA;KAAY;AAEhD,UAAMqB,UAAUC,SAASlC,OAAOO,aAAa4B,OAAOC,KAAK7B,UAAAA,IAAc4B,OAAOE,QAAO,CAAA;AACrF,UAAMC,kBAAkBC,yBAAyBN,OAAAA;AAEjD,WACE,sBAAA,cAACO,QAAQC,MAAI;MACXC,OAAOJ;MACPK,QAAQrD;MACRsD,YAAW;;;;;AAGjB;;;ADtDA,IAAA,yBAAe,MACbC,YAAYC,aAAaC,cAAc;EACrCC,cAAc;IACZC,IAAIC,KAAKD;IACTE,MAAM;MAAC;MAAW;;IAClBC,QAAQ,CAACC,SACPC,IAAIC,WAAWC,SAASC,MAAMJ,KAAKK,OAAO,KAC1CJ,IAAIC,WAAWI,gBAAQA,SAASN,KAAKK,QAAQE,cAAcC,MAAAA;IAC7DC,WAAW,CAAC,EAAET,MAAMF,KAAI,MAAO,gBAAAY,OAAA,cAACC,kBAAAA;MAAiBC,MAAMZ,KAAKK;MAASP;;EACvE,CAAA;CACD;",
-  "names": ["React", "Capabilities", "contributes", "createSurface", "Obj", "DataType", "React", "useEffect", "useMemo", "useState", "Surface", "Filter", "Type", "EchoSchema", "useGlobalFilteredObjects", "useClient", "getSpace", "useQuery", "Masonry", "ProjectionModel", "getTypenameFromQuery", "Item", "data", "Surface", "role", "limit", "subject", "MasonryContainer", "view", "client", "useClient", "space", "getSpace", "typename", "query", "getTypenameFromQuery", "ast", "undefined", "cardSchema", "setCardSchema", "useState", "projection", "setProjection", "jsonSchema", "useMemo", "EchoSchema", "Type", "toJsonSchema", "useEffect", "staticSchema", "graph", "schemaRegistry", "schemas", "find", "schema", "getTypename", "db", "unsubscribe", "subscribe", "results", "fire", "ProjectionModel", "JSON", "stringify", "objects", "useQuery", "Filter", "type", "nothing", "filteredObjects", "useGlobalFilteredObjects", "Masonry", "Root", "items", "render", "classNames", "contributes", "Capabilities", "ReactSurface", "createSurface", "id", "meta", "role", "filter", "data", "Obj", "instanceOf", "DataType", "View", "subject", "Masonry", "presentation", "target", "component", "React", "MasonryContainer", "view"]
-}