docs(plugin-grid): make the two "Interactive Examples" real object-grid nodes

.changeset/5856-plugin-grid-catalog-entries.md

@@ -0,0 +1,26 @@
+---
+---
+
+Docs and catalog fixtures only, no shipped code touched: the two `plugin-grid` catalog
+entries are now real `object-grid` nodes instead of hand-built static card layouts.
+`content/docs/plugins/plugin-grid.mdx` mounted `product-inventory-grid` and
+`team-members-grid` under `PluginLoader plugins={['grid']}` while both authored only
+`badge button card flex stack text` — pictures of a grid, not a grid. They are replaced
+by `object-grid-columns` (a `ListColumn` set with `sort`, `searchableFields` and
+`pagination`) and `object-grid-selection-summaries` (multi-row `selection`, named
+`rowActions` / `bulkActions`, per-column footer `summary` roll-ups), both querying the
+docs gallery's demo data source the same way the `plugin-view` entries have since
+objectui#5113.
+
+The two mock-ups are legitimate static layouts filed under the wrong plugin, so they are
+re-seated into `components-layout-card` as `inventory-table-card` and `team-roster-card`
+rather than deleted — deleting a catalog entry moves three corpus-wide counters
+(`NODE_CENSUS` in `layout-dom-leak-5574.test.tsx`, and the `className`-carrying layout
+node and `stack` node floors in `layout-props-conversion.test.tsx`), and a floor that
+moves because a fixture was deleted is indistinguishable later from one that moved
+because coverage regressed. All three are unchanged, with no floor edited.
+
+objectui#5113's pin in `catalog-gallery-render.test.tsx` is extended to cover
+`plugin-grid` through an explicit two-entry category/type map, keeping both of its halves
+— every entry authors the type its own package registers, and the rendered tile shows a
+record that exists only in the gallery's data source.

content/docs/plugins/plugin-grid.mdx

@@ -17,9 +17,23 @@ npm install @object-ui/plugin-grid
 
 ## Interactive Examples
 
-<SchemaExample id="plugin-grid/product-inventory-grid" />
+Each preview below **is** an `object-grid` node drawn by this plugin — the JSON
+in the Code tab is the whole example, and the rows on screen came out of a
+`find()` call, not out of that JSON. The records are served by the docs site's
+demo data source, because `dataSource` is not a schema key: it is the prop the
+registered renderer pulls off `SchemaRendererProvider` context (see
+[ObjectQL Integration](#objectql-integration) below), so in your own app these
+same nodes read whatever object your data source serves. That fixture answers
+search and sort but not filters, which is the only reason no `filter` is
+authored here.
 
-<SchemaExample id="plugin-grid/team-members-grid" />
+### Columns, sort and search
+
+<SchemaExample id="plugin-grid/object-grid-columns" />
+
+### Selection, row actions and column summaries
+
+<SchemaExample id="plugin-grid/object-grid-selection-summaries" />
 
 ## Features
 

examples/schema-catalog/src/catalog-meta.json

@@ -36,6 +36,16 @@
  "verification"
  ]
  },
+ "components-layout-card/inventory-table-card": {
+ "title": "Inventory Table Card",
+ "description": "A card that draws a product inventory table by hand — toolbar buttons, header row, stock-status badges. For a table bound to an object, see the `plugin-grid` examples.",
+ "tags": [
+ "card",
+ "table",
+ "badge",
+ "layout"
+ ]
+ },
  "components-layout-card/profile-detail-card": {
  "title": "Profile Detail Card",
  "description": "A card that draws one record by hand — avatar header, label/value rows, edit and delete footer. For a record surface bound to an object, see the `plugin-view` examples.",
@@ -46,6 +56,16 @@
  "avatar"
  ]
  },
+ "components-layout-card/team-roster-card": {
+ "title": "Team Roster Card",
+ "description": "A card that draws a team roster table by hand — invite action, header row, presence badges. For a table bound to an object, see the `plugin-grid` examples.",
+ "tags": [
+ "card",
+ "table",
+ "badge",
+ "roster"
+ ]
+ },
  "components-layout-card/user-list-card": {
  "title": "User List Card",
  "description": "A card that draws a directory table by hand — header row, striped rows, status badges. For a table bound to an object, see the `plugin-view` / `plugin-grid` examples.",
@@ -89,6 +109,26 @@
  "title": "Filtered Dashboard — Target Widgets Allow-list",
  "description": "Legacy targetWidgets allow-list: only listed widgets get the default binding; an explicit filterBindings entry still wins"
  },
+ "plugin-grid/object-grid-columns": {
+ "title": "Object Grid — Column Definitions",
+ "description": "object-grid rendering the users object: `ListColumn` objects carrying label, width, align, cell `type` and `link`, with `sort`, `searchableFields` and `pagination` shaping the query the host's data source answers.",
+ "tags": [
+ "object-grid",
+ "columns",
+ "sort",
+ "objectql"
+ ]
+ },
+ "plugin-grid/object-grid-selection-summaries": {
+ "title": "Object Grid — Selection, Row Actions and Summaries",
+ "description": "The same object with multi-row `selection`, named `rowActions` / `bulkActions`, and per-column footer `summary` roll-ups computed over the rows the data source returns.",
+ "tags": [
+ "object-grid",
+ "selection",
+ "rowActions",
+ "summary"
+ ]
+ },
  "plugin-view/object-view-list": {
  "title": "Object View — List Surface",
  "description": "object-view rendering the users object: the columns declared in `table`, with search and sort served by the host's data source.",

examples/schema-catalog/src/index.ts

@@ -253,7 +253,9 @@ import components_layout_aspect_ratio_square from './schemas/components-layout-a
 import components_layout_aspect_ratio_ultrawide from './schemas/components-layout-aspect-ratio/ultrawide.json' with { type: 'json' };
 import components_layout_aspect_ratio_video_aspect_ratio from './schemas/components-layout-aspect-ratio/video-aspect-ratio.json' with { type: 'json' };
 import components_layout_card_basic_card from './schemas/components-layout-card/basic-card.json' with { type: 'json' };
+import components_layout_card_inventory_table_card from './schemas/components-layout-card/inventory-table-card.json' with { type: 'json' };
 import components_layout_card_profile_detail_card from './schemas/components-layout-card/profile-detail-card.json' with { type: 'json' };
+import components_layout_card_team_roster_card from './schemas/components-layout-card/team-roster-card.json' with { type: 'json' };
 import components_layout_card_user_list_card from './schemas/components-layout-card/user-list-card.json' with { type: 'json' };
 import components_layout_card_with_footer from './schemas/components-layout-card/with-footer.json' with { type: 'json' };
 import components_layout_container_basic_container from './schemas/components-layout-container/basic-container.json' with { type: 'json' };
@@ -417,8 +419,8 @@ import plugin_form_contact_form from './schemas/plugin-form/contact-form.json' w
 import plugin_gantt_construction_project_phases from './schemas/plugin-gantt/construction-project-phases.json' with { type: 'json' };
 import plugin_gantt_project_timeline_with_dependencies from './schemas/plugin-gantt/project-timeline-with-dependencies.json' with { type: 'json' };
 import plugin_gantt_sprint_development_timeline from './schemas/plugin-gantt/sprint-development-timeline.json' with { type: 'json' };
-import plugin_grid_product_inventory_grid from './schemas/plugin-grid/product-inventory-grid.json' with { type: 'json' };
-import plugin_grid_team_members_grid from './schemas/plugin-grid/team-members-grid.json' with { type: 'json' };
+import plugin_grid_object_grid_columns from './schemas/plugin-grid/object-grid-columns.json' with { type: 'json' };
+import plugin_grid_object_grid_selection_summaries from './schemas/plugin-grid/object-grid-selection-summaries.json' with { type: 'json' };
 import plugin_kanban_advanced_kanban_with_badges_and_limits from './schemas/plugin-kanban/advanced-kanban-with-badges-and-limits.json' with { type: 'json' };
 import plugin_kanban_basic_kanban_board from './schemas/plugin-kanban/basic-kanban-board.json' with { type: 'json' };
 import plugin_map_event_venue_finder from './schemas/plugin-map/event-venue-finder.json' with { type: 'json' };
@@ -2623,6 +2625,16 @@ const REGISTRY: Record<string, Example> = {
  },
  schema: components_layout_card_basic_card,
  },
+ 'components-layout-card/inventory-table-card': {
+ id: 'components-layout-card/inventory-table-card',
+ meta: {
+ title: "Inventory Table Card",
+ description: "A card that draws a product inventory table by hand — toolbar buttons, header row, stock-status badges. For a table bound to an object, see the `plugin-grid` examples.",
+ category: 'components-layout-card',
+ tags: ["card", "table", "badge", "layout"],
+ },
+ schema: components_layout_card_inventory_table_card,
+ },
  'components-layout-card/profile-detail-card': {
  id: 'components-layout-card/profile-detail-card',
  meta: {
@@ -2633,6 +2645,16 @@ const REGISTRY: Record<string, Example> = {
  },
  schema: components_layout_card_profile_detail_card,
  },
+ 'components-layout-card/team-roster-card': {
+ id: 'components-layout-card/team-roster-card',
+ meta: {
+ title: "Team Roster Card",
+ description: "A card that draws a team roster table by hand — invite action, header row, presence badges. For a table bound to an object, see the `plugin-grid` examples.",
+ category: 'components-layout-card',
+ tags: ["card", "table", "badge", "roster"],
+ },
+ schema: components_layout_card_team_roster_card,
+ },
  'components-layout-card/user-list-card': {
  id: 'components-layout-card/user-list-card',
  meta: {
@@ -4102,23 +4124,25 @@ const REGISTRY: Record<string, Example> = {
  },
  schema: plugin_gantt_sprint_development_timeline,
  },
- 'plugin-grid/product-inventory-grid': {
- id: 'plugin-grid/product-inventory-grid',
+ 'plugin-grid/object-grid-columns': {
+ id: 'plugin-grid/object-grid-columns',
  meta: {
- title: "Product Inventory Grid",
- description: "",
+ title: "Object Grid — Column Definitions",
+ description: "object-grid rendering the users object: `ListColumn` objects carrying label, width, align, cell `type` and `link`, with `sort`, `searchableFields` and `pagination` shaping the query the host's data source answers.",
  category: 'plugin-grid',
+ tags: ["object-grid", "columns", "sort", "objectql"],
  },
- schema: plugin_grid_product_inventory_grid,
+ schema: plugin_grid_object_grid_columns,
  },
- 'plugin-grid/team-members-grid': {
- id: 'plugin-grid/team-members-grid',
+ 'plugin-grid/object-grid-selection-summaries': {
+ id: 'plugin-grid/object-grid-selection-summaries',
  meta: {
- title: "Team Members Grid",
- description: "",
+ title: "Object Grid — Selection, Row Actions and Summaries",
+ description: "The same object with multi-row `selection`, named `rowActions` / `bulkActions`, and per-column footer `summary` roll-ups computed over the rows the data source returns.",
  category: 'plugin-grid',
+ tags: ["object-grid", "selection", "rowActions", "summary"],
  },
- schema: plugin_grid_team_members_grid,
+ schema: plugin_grid_object_grid_selection_summaries,
  },
  'plugin-kanban/advanced-kanban-with-badges-and-limits': {
  id: 'plugin-kanban/advanced-kanban-with-badges-and-limits',

examples/schema-catalog/src/schemas/plugin-grid/object-grid-columns.json

@@ -0,0 +1,15 @@
+{
+ "type": "object-grid",
+ "objectName": "users",
+ "label": "User Directory",
+ "columns": [
+ { "field": "name", "label": "Full Name", "width": 200, "link": true },
+ { "field": "email", "label": "Email" },
+ { "field": "role", "type": "select" },
+ { "field": "department", "label": "Department" },
+ { "field": "status", "type": "select", "align": "right" }
+ ],
+ "sort": [{ "field": "name", "order": "asc" }],
+ "searchableFields": ["name", "email", "department"],
+ "pagination": { "pageSize": 5 }
+}

examples/schema-catalog/src/schemas/plugin-grid/object-grid-selection-summaries.json

@@ -0,0 +1,16 @@
+{
+ "type": "object-grid",
+ "objectName": "users",
+ "label": "User Directory",
+ "columns": [
+ { "field": "name", "label": "Full Name", "summary": "count_filled" },
+ { "field": "email", "label": "Email" },
+ { "field": "department", "label": "Department", "summary": { "type": "count_unique" } },
+ { "field": "role", "type": "select" },
+ { "field": "status", "type": "select" }
+ ],
+ "selection": { "type": "multiple" },
+ "rowActions": ["view", "edit"],
+ "bulkActions": ["export"],
+ "pagination": { "pageSize": 5 }
+}