feat(types): TypeScript node types for the authored properties-bag carriers (flex and the eight object-* blocks), by reference, joined into AuthoringNode (objectui#11468)

.changeset/11468-bag-carrier-node-types.md

@@ -0,0 +1,37 @@
+---
+'@object-ui/types': minor
+---
+
+The authored `properties`-bag carriers outside the spec's public blocks have a
+TypeScript authoring type, and `AuthoringNode` includes them, so
+`SchemaRenderer`'s `schema` prop accepts them (objectui#11468).
+
+`@object-ui/types` exports, each derived by reference from its zod arm and none
+restated:
+
+- `ObjectQLPublicBlockNode`: one member per arm of the zod face's
+  `ObjectQLPublicBlockComponentSchema`, each the arm's own input, derived the
+  way `PublicBlockNode` is. The eight members are also exported by name:
+  `ObjectMetricBlockNode`, `ObjectMasterDetailFormBlockNode`,
+  `ObjectTimelineBlockNode`, `ObjectFormBlockNode`, `ObjectMapBlockNode`,
+  `ObjectChartBlockNode`, `ObjectGanttBlockNode` and `ObjectGridBlockNode`.
+  Each is the authored node, its props in the `properties` bag. The flat
+  `ObjectFormSchema`, `ObjectMapSchema`, `ObjectGanttSchema`,
+  `ObjectChartSchema` and `ObjectGridSchema` stay the node as its renderer
+  reads it after the hoist.
+- `FlexBlockNode`: the `FlexBlockSchema` arm's input, its props and its child
+  list in the `properties` bag. `FlexSchema` stays the node as the `flex`
+  renderer reads it.
+
+The derivation now reads a bag's shape the way it reads the arm's. `flex` and
+`object-chart` have no `ComponentPropsMap` row, so each bag is its flat
+mirror's own members, kept open for the tolerant zod face; on these node types
+the bag is closed, as the strict authoring face closes it, so a misspelled bag
+key does not compile. A spec-row bag is already closed: `PublicBlockNode` is
+unchanged, which `authoring-nodes-bag-carriers-11468.test.ts` pins.
+
+Adding members to `AuthoringNode` widens what the prop accepts; every value it
+accepted before is still accepted. Reading is a different matter: on a union, a
+key that one closed member does not declare is TS2339, so code that reads a key
+off `SchemaRendererProps['schema']` or off `toRenderableSchema`'s return needs
+to narrow first.

README.md

@@ -327,7 +327,7 @@ declare class MyCustomDataSource<T = unknown> implements DataSource<T> {
 **Stop writing repetitive UI code.** A form is a schema, not a component:
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectFormBlockNode } from '@object-ui/types';
 
 // Traditional React: useState, validation, handlers, JSX — per form
 function UserForm() {
@@ -336,7 +336,7 @@ function UserForm() {
 
 // Object UI: declare it — the block's props go in its `properties` bag,
 // as `@objectstack/spec` declares them
-const schema: BaseSchema = {
+const schema: ObjectFormBlockNode = {
   type: "object-form",
   properties: {
     objectName: "user",

content/docs/guide/objectos-integration.mdx

@@ -259,7 +259,7 @@ const sysUserView: ObjectViewSchema = {
 
 ```typescript
 import { ObjectStackAdapter } from '@object-ui/data-objectstack';
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGridBlockNode } from '@object-ui/types';
 import type { ObjectGridProps } from '@objectstack/spec/ui';
 
 const dataSource = new ObjectStackAdapter({
@@ -272,7 +272,7 @@ const dataSource = new ObjectStackAdapter({
 // (`{ object, view?, filter?, sort?, limit? }`), not the adapter, and
 // `SchemaRenderer` strips it from the props it spreads. The grid's own props go
 // in its `properties` bag — the spec's `ComponentPropsMap['object-grid']` row.
-const schema: BaseSchema = {
+const schema: ObjectGridBlockNode = {
   type: 'object-grid',
   properties: {
     objectName: 'contact',

content/docs/plugins/plugin-gantt.mdx

@@ -71,9 +71,9 @@ renderer reads it, and as code composes it.
 
 ```tsx
 import '@object-ui/plugin-gantt'
-import type { BaseSchema } from '@object-ui/types'
+import type { ObjectGanttBlockNode } from '@object-ui/types'
 
-const schema: BaseSchema = {
+const schema: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'tasks',  // Your ObjectQL object
@@ -91,9 +91,9 @@ const schema: BaseSchema = {
 ### With Static Data
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const schema: BaseSchema = {
+const schema: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     staticData: [
@@ -215,9 +215,9 @@ with a time part is an instant, and the bar ends exactly there. The timeline's
 Map your database fields to Gantt properties:
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const fieldMappedGantt: BaseSchema = {
+const fieldMappedGantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'project_tasks',
@@ -283,9 +283,9 @@ The dependencies field should contain an array of task IDs that this task depend
 ### Object Provider (Database)
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const objectProviderGantt: BaseSchema = {
+const objectProviderGantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'project_tasks',
@@ -302,9 +302,9 @@ const objectProviderGantt: BaseSchema = {
 ### Value Provider (Static)
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const valueProviderGantt: BaseSchema = {
+const valueProviderGantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     staticData: [
@@ -323,9 +323,9 @@ const valueProviderGantt: BaseSchema = {
 ### API Provider
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const apiProviderGantt: BaseSchema = {
+const apiProviderGantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     data: {
@@ -422,9 +422,9 @@ no object (no `objectName`, no object `data` provider), no mode opens anything.
 ### Software Project
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const softwareProject: BaseSchema = {
+const softwareProject: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'sprint_tasks',
@@ -442,9 +442,9 @@ const softwareProject: BaseSchema = {
 ### Construction Project
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const constructionGantt: BaseSchema = {
+const constructionGantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'construction_phases',
@@ -461,9 +461,9 @@ const constructionGantt: BaseSchema = {
 ### Marketing Campaign
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const campaignGantt: BaseSchema = {
+const campaignGantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     staticData: [
@@ -544,7 +544,7 @@ const campaignGantt: BaseSchema = {
 ## TypeScript Support
 
 ```ts
-import type { BaseSchema, GanttConfig } from '@object-ui/types'
+import type { ObjectGanttBlockNode, GanttConfig } from '@object-ui/types'
 
 const ganttConfig: GanttConfig = {
   startDateField: 'startDate',
@@ -554,7 +554,7 @@ const ganttConfig: GanttConfig = {
   dependenciesField: 'dependencies'
 }
 
-const ganttSchema: BaseSchema = {
+const ganttSchema: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'project_tasks',

content/docs/plugins/plugin-map.mdx

@@ -61,9 +61,9 @@ the renderer reads it, and as code composes it.
 
 ```tsx
 import '@object-ui/plugin-map'
-import type { BaseSchema } from '@object-ui/types'
+import type { ObjectMapBlockNode } from '@object-ui/types'
 
-const schema: BaseSchema = {
+const schema: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     objectName: 'locations',  // Your ObjectQL object
@@ -80,9 +80,9 @@ const schema: BaseSchema = {
 ### With Static Data
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types'
+import type { ObjectMapBlockNode } from '@object-ui/types'
 
-const schema: BaseSchema = {
+const schema: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     staticData: [
@@ -198,9 +198,9 @@ the way in. Both are gone. Declare the binding:
 When your data has separate latitude and longitude fields:
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectMapBlockNode } from '@object-ui/types';
 
-const storeMap: BaseSchema = {
+const storeMap: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     objectName: 'stores',
@@ -219,9 +219,9 @@ const storeMap: BaseSchema = {
 When your data has a combined location field:
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectMapBlockNode } from '@object-ui/types';
 
-const placeMap: BaseSchema = {
+const placeMap: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     objectName: 'places',
@@ -254,9 +254,9 @@ Two cases sit outside the fit:
 Declare either one to take the camera over and opt this view out of the auto-fit:
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectMapBlockNode } from '@object-ui/types';
 
-const cameraMap: BaseSchema = {
+const cameraMap: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     objectName: 'locations',
@@ -279,9 +279,9 @@ the centre of the records, `center` on its own at a continental zoom.
 ### Object Provider (Database)
 
 ```tsx
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectMapBlockNode } from '@object-ui/types';
 
-const retailStores: BaseSchema = {
+const retailStores: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     objectName: 'retail_stores',
@@ -609,7 +609,7 @@ code hands it to the component directly (`<ObjectMap schema={…} />`); an
 authored node writes its props in the bag.
 
 ```ts
-import type { BaseSchema, ObjectMapSchema, ObjectMapConfig } from '@object-ui/types'
+import type { ObjectMapBlockNode, ObjectMapSchema, ObjectMapConfig } from '@object-ui/types'
 
 const mapConfig: ObjectMapConfig = {
   latitudeField: 'lat',
@@ -621,7 +621,7 @@ const mapConfig: ObjectMapConfig = {
 }
 
 // The authored node: its props in the `properties` bag.
-const mapNode: BaseSchema = {
+const mapNode: ObjectMapBlockNode = {
   type: 'object-map',
   properties: {
     objectName: 'locations',

content/docs/utilities/data-objectstack.mdx

@@ -64,14 +64,14 @@ React wiring lives in `@object-ui/react`, not here. Wrap your tree in
 ```tsx
 import { SchemaRenderer, SchemaRendererProvider } from '@object-ui/react';
 import { createObjectStackAdapter } from '@object-ui/data-objectstack';
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGridBlockNode } from '@object-ui/types';
 
 const dataSource = createObjectStackAdapter({
   baseUrl: 'https://api.example.com',
 });
 
 // The block's props go in its `properties` bag, as `@objectstack/spec` declares them.
-const mySchema: BaseSchema = { type: 'object-grid', properties: { objectName: 'user' } };
+const mySchema: ObjectGridBlockNode = { type: 'object-grid', properties: { objectName: 'user' } };
 
 function App() {
   return (

content/docs/utilities/index.md

@@ -165,15 +165,15 @@ through `@object-ui/react`'s `SchemaRendererProvider`:
 ```tsx
 import { createObjectStackAdapter } from '@object-ui/data-objectstack';
 import { SchemaRenderer, SchemaRendererProvider } from '@object-ui/react';
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGridBlockNode } from '@object-ui/types';
 
 const dataSource = createObjectStackAdapter({
   baseUrl: 'https://api.example.com',
   token: 'your-api-token', // optional when auth is handled elsewhere
 });
 
 // The block's props go in its `properties` bag, as `@objectstack/spec` declares them.
-const schema: BaseSchema = {
+const schema: ObjectGridBlockNode = {
   type: 'object-grid',
   properties: {
     objectName: 'account',

packages/plugin-form/README.md

@@ -722,11 +722,11 @@ steps are its `sections` — one step per section. There is no
 unknown-component placeholder and the fields inside `steps` are never read.
 
 ```typescript
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectFormBlockNode } from '@object-ui/types';
 
 // The props go in the node's `properties` bag — the members of
 // `@objectstack/spec`'s `ComponentPropsMap['object-form']` row.
-const schema: BaseSchema = {
+const schema: ObjectFormBlockNode = {
   type: 'object-form',
   properties: {
     objectName: 'contacts',        // the object whose fields the steps list
@@ -972,14 +972,14 @@ context, which `ObjectFormRenderer` reads at `src/index.tsx` before handing
 import { SchemaRendererProvider, SchemaRenderer } from '@object-ui/react';
 import { createObjectStackAdapter } from '@object-ui/data-objectstack';
 import '@object-ui/plugin-form';
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectFormBlockNode } from '@object-ui/types';
 
 const dataSource = createObjectStackAdapter({
   baseUrl: 'https://api.example.com',
   token: 'your-auth-token',
 });
 
-const schema: BaseSchema = {
+const schema: ObjectFormBlockNode = {
   type: 'object-form',
   properties: {
     objectName: 'users',

packages/plugin-gantt/README.md

@@ -894,9 +894,9 @@ a task array. There is no `GanttSchema`. `ObjectGanttSchema` in `@object-ui/type
 yourself.
 
 ```typescript
-import type { BaseSchema } from '@object-ui/types';
+import type { ObjectGanttBlockNode } from '@object-ui/types';
 
-const gantt: BaseSchema = {
+const gantt: ObjectGanttBlockNode = {
   type: 'object-gantt',
   properties: {
     objectName: 'project_tasks',