@cratis/scene.blueprint.components 0.1.0

package/dist/cjs/templates/dataElements.js

@@ -0,0 +1,131 @@
+'use strict';
+
+var scene_blueprint_default = require('@cratis/scene.blueprint.default');
+var BorrowedComponentName = require('../BorrowedComponentName.js');
+var CompositeName = require('../CompositeName.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The Arc-bound data elements this blueprint's templates are built from.
+ *
+ * Each one is a single `ExternalComponent` carrying a query *name* in its property bag, which is the whole
+ * contract: `resolveElementBinding` in `@cratis/scene.components` reads that name out at render time and
+ * looks it up in the binding registry, and a name nothing is registered under renders as a placeholder
+ * naming what it wanted. Nothing here invents a second way to reach a backend, because there is only one
+ * and it belongs to the component library.
+ */ /**
+ * The columns of a data table, as the `content` slot children the library's tables take.
+ *
+ * The name is PrimeReact's rather than `Cratis.Components`' - see {@link BorrowedComponentName.Column} for
+ * why - and `sortable` is set on every column because a table that performs a real query can sort against
+ * the server, and a column that quietly cannot is the more surprising default.
+ */ function columns(id, definitions) {
+    return definitions.map((definition)=>scene_blueprint_default.externalComponent(`${id}-${definition.field}`, BorrowedComponentName.BorrowedComponentName.Column, {
+            field: definition.field,
+            header: definition.header,
+            sortable: true
+        }));
+}
+/**
+ * A `dataPage` - the library's whole list-screen composite, driven from one query.
+ *
+ * This is the archetype the package exists for. Reproducing it out of a table, a toolbar and a filter in a
+ * screen would be pages of modeling for a worse result, and every one of those pages would then be an
+ * application's to maintain. Here it is one element with a name in it.
+ *
+ * Its own `title` is deliberately empty. Every template in this package opens with an `arcPageHeader`, and
+ * that header already states the page's name, its trail and what it is bound to; letting the composite
+ * print the same word again directly underneath would be two sources for one fact, and they would
+ * disagree the first time either changed.
+ */ function dataPage(id, query, options, definitions) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.DataPage, {
+        query,
+        title: '',
+        ...options
+    }, {
+        content: columns(`${id}-column`, definitions)
+    });
+}
+/**
+ * A `dataTable` - the same server-side querying without the page chrome around it.
+ *
+ * Used where a template already has a header of its own and only needs the rows, which is most places a
+ * table appears inside a larger page.
+ */ function dataTable(id, query, options, definitions) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.DataTable, {
+        query,
+        ...options
+    }, {
+        content: columns(`${id}-column`, definitions)
+    });
+}
+/**
+ * An `observableDataTable` - the live variant.
+ *
+ * A separate element rather than a flag, because the difference is in the *proxy* a host registers: an
+ * observable query opens a subscription and re-renders when the read model changes, and a plain one does
+ * not. A template that names an observable query is stating that its data is live, which is a design
+ * decision worth being able to read off the page.
+ */ function observableDataTable(id, query, options, definitions) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.ObservableDataTable, {
+        query,
+        ...options
+    }, {
+        content: columns(`${id}-column`, definitions)
+    });
+}
+/** The columns of the invoice list every list-shaped template in this package shows. */ const invoiceColumns = [
+    {
+        field: 'number',
+        header: 'Number'
+    },
+    {
+        field: 'customer',
+        header: 'Customer'
+    },
+    {
+        field: 'issued',
+        header: 'Issued'
+    },
+    {
+        field: 'amount',
+        header: 'Amount'
+    },
+    {
+        field: 'status',
+        header: 'Status'
+    }
+];
+/** The columns of the adjustment list, for the templates that show one. */ const adjustmentColumns = [
+    {
+        field: 'recorded',
+        header: 'Recorded'
+    },
+    {
+        field: 'reason',
+        header: 'Reason'
+    },
+    {
+        field: 'amount',
+        header: 'Amount'
+    }
+];
+/** The table options an invoice list uses, so eight templates cannot disagree about the empty message. */ const invoiceTableOptions = {
+    emptyMessage: 'No invoices yet',
+    dataKey: 'invoiceId',
+    globalFilterFields: [
+        'number',
+        'customer',
+        'status'
+    ]
+};
+
+exports.adjustmentColumns = adjustmentColumns;
+exports.columns = columns;
+exports.dataPage = dataPage;
+exports.dataTable = dataTable;
+exports.invoiceColumns = invoiceColumns;
+exports.invoiceTableOptions = invoiceTableOptions;
+exports.observableDataTable = observableDataTable;
+//# sourceMappingURL=dataElements.js.map

package/dist/cjs/templates/dataElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dataElements.js","sources":["../../../templates/dataElements.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { SceneElement } from '@cratis/scene.model';\nimport { externalComponent } from '@cratis/scene.blueprint.default';\nimport { BorrowedComponentName } from '../BorrowedComponentName';\nimport { CompositeName } from '../CompositeName';\nimport { ColumnDefinition } from './ColumnDefinition';\nimport { TableOptions } from './TableOptions';\n\n/**\n * The Arc-bound data elements this blueprint's templates are built from.\n *\n * Each one is a single `ExternalComponent` carrying a query *name* in its property bag, which is the whole\n * contract: `resolveElementBinding` in `@cratis/scene.components` reads that name out at render time and\n * looks it up in the binding registry, and a name nothing is registered under renders as a placeholder\n * naming what it wanted. Nothing here invents a second way to reach a backend, because there is only one\n * and it belongs to the component library.\n */\n\n/**\n * The columns of a data table, as the `content` slot children the library's tables take.\n *\n * The name is PrimeReact's rather than `Cratis.Components`' - see {@link BorrowedComponentName.Column} for\n * why - and `sortable` is set on every column because a table that performs a real query can sort against\n * the server, and a column that quietly cannot is the more surprising default.\n */\nexport function columns(id: string, definitions: ColumnDefinition[]): SceneElement[] {\n    return definitions.map(definition =>\n        externalComponent(`${id}-${definition.field}`, BorrowedComponentName.Column, {\n            field: definition.field,\n            header: definition.header,\n            sortable: true,\n        }),\n    );\n}\n\n/**\n * A `dataPage` - the library's whole list-screen composite, driven from one query.\n *\n * This is the archetype the package exists for. Reproducing it out of a table, a toolbar and a filter in a\n * screen would be pages of modeling for a worse result, and every one of those pages would then be an\n * application's to maintain. Here it is one element with a name in it.\n *\n * Its own `title` is deliberately empty. Every template in this package opens with an `arcPageHeader`, and\n * that header already states the page's name, its trail and what it is bound to; letting the composite\n * print the same word again directly underneath would be two sources for one fact, and they would\n * disagree the first time either changed.\n */\nexport function dataPage(id: string, query: string, options: TableOptions, definitions: ColumnDefinition[]): SceneElement {\n    return externalComponent(id, CompositeName.DataPage, { query, title: '', ...options }, { content: columns(`${id}-column`, definitions) });\n}\n\n/**\n * A `dataTable` - the same server-side querying without the page chrome around it.\n *\n * Used where a template already has a header of its own and only needs the rows, which is most places a\n * table appears inside a larger page.\n */\nexport function dataTable(id: string, query: string, options: TableOptions, definitions: ColumnDefinition[]): SceneElement {\n    return externalComponent(id, CompositeName.DataTable, { query, ...options }, { content: columns(`${id}-column`, definitions) });\n}\n\n/**\n * An `observableDataTable` - the live variant.\n *\n * A separate element rather than a flag, because the difference is in the *proxy* a host registers: an\n * observable query opens a subscription and re-renders when the read model changes, and a plain one does\n * not. A template that names an observable query is stating that its data is live, which is a design\n * decision worth being able to read off the page.\n */\nexport function observableDataTable(id: string, query: string, options: TableOptions, definitions: ColumnDefinition[]): SceneElement {\n    return externalComponent(id, CompositeName.ObservableDataTable, { query, ...options }, { content: columns(`${id}-column`, definitions) });\n}\n\n/** The columns of the invoice list every list-shaped template in this package shows. */\nexport const invoiceColumns: ColumnDefinition[] = [\n    { field: 'number', header: 'Number' },\n    { field: 'customer', header: 'Customer' },\n    { field: 'issued', header: 'Issued' },\n    { field: 'amount', header: 'Amount' },\n    { field: 'status', header: 'Status' },\n];\n\n/** The columns of the adjustment list, for the templates that show one. */\nexport const adjustmentColumns: ColumnDefinition[] = [\n    { field: 'recorded', header: 'Recorded' },\n    { field: 'reason', header: 'Reason' },\n    { field: 'amount', header: 'Amount' },\n];\n\n/** The table options an invoice list uses, so eight templates cannot disagree about the empty message. */\nexport const invoiceTableOptions: TableOptions = {\n    emptyMessage: 'No invoices yet',\n    dataKey: 'invoiceId',\n    globalFilterFields: ['number', 'customer', 'status'],\n};\n"],"names":["columns","id","definitions","map","definition","externalComponent","field","BorrowedComponentName","Column","header","sortable","dataPage","query","options","CompositeName","DataPage","title","content","dataTable","DataTable","observableDataTable","ObservableDataTable","invoiceColumns","adjustmentColumns","invoiceTableOptions","emptyMessage","dataKey","globalFilterFields"],"mappings":";;;;;;AAAA;AACA;AASA;;;;;;;;;;;;;;AAgBC,IACM,SAASA,OAAAA,CAAQC,EAAU,EAAEC,WAA+B,EAAA;AAC/D,IAAA,OAAOA,YAAYC,GAAG,CAACC,CAAAA,UAAAA,GACnBC,0CAAkB,CAAA,EAAGJ,EAAAA,CAAG,CAAC,EAAEG,WAAWE,KAAK,CAAA,CAAE,EAAEC,2CAAAA,CAAsBC,MAAM,EAAE;AACzEF,YAAAA,KAAAA,EAAOF,WAAWE,KAAK;AACvBG,YAAAA,MAAAA,EAAQL,WAAWK,MAAM;YACzBC,QAAAA,EAAU;AACd,SAAA,CAAA,CAAA;AAER;AAEA;;;;;;;;;;;IAYO,SAASC,QAAAA,CAASV,EAAU,EAAEW,KAAa,EAAEC,OAAqB,EAAEX,WAA+B,EAAA;AACtG,IAAA,OAAOG,yCAAAA,CAAkBJ,EAAAA,EAAIa,2BAAAA,CAAcC,QAAQ,EAAE;AAAEH,QAAAA,KAAAA;QAAOI,KAAAA,EAAO,EAAA;AAAI,QAAA,GAAGH;KAAQ,EAAG;AAAEI,QAAAA,OAAAA,EAASjB,OAAAA,CAAQ,CAAA,EAAGC,EAAAA,CAAG,OAAO,CAAC,EAAEC,WAAAA;AAAa,KAAA,CAAA;AAC3I;AAEA;;;;;IAMO,SAASgB,SAAAA,CAAUjB,EAAU,EAAEW,KAAa,EAAEC,OAAqB,EAAEX,WAA+B,EAAA;AACvG,IAAA,OAAOG,yCAAAA,CAAkBJ,EAAAA,EAAIa,2BAAAA,CAAcK,SAAS,EAAE;AAAEP,QAAAA,KAAAA;AAAO,QAAA,GAAGC;KAAQ,EAAG;AAAEI,QAAAA,OAAAA,EAASjB,OAAAA,CAAQ,CAAA,EAAGC,EAAAA,CAAG,OAAO,CAAC,EAAEC,WAAAA;AAAa,KAAA,CAAA;AACjI;AAEA;;;;;;;IAQO,SAASkB,mBAAAA,CAAoBnB,EAAU,EAAEW,KAAa,EAAEC,OAAqB,EAAEX,WAA+B,EAAA;AACjH,IAAA,OAAOG,yCAAAA,CAAkBJ,EAAAA,EAAIa,2BAAAA,CAAcO,mBAAmB,EAAE;AAAET,QAAAA,KAAAA;AAAO,QAAA,GAAGC;KAAQ,EAAG;AAAEI,QAAAA,OAAAA,EAASjB,OAAAA,CAAQ,CAAA,EAAGC,EAAAA,CAAG,OAAO,CAAC,EAAEC,WAAAA;AAAa,KAAA,CAAA;AAC3I;AAEA,yFACO,MAAMoB,cAAAA,GAAqC;AAC9C,IAAA;QAAEhB,KAAAA,EAAO,QAAA;QAAUG,MAAAA,EAAQ;AAAS,KAAA;AACpC,IAAA;QAAEH,KAAAA,EAAO,UAAA;QAAYG,MAAAA,EAAQ;AAAW,KAAA;AACxC,IAAA;QAAEH,KAAAA,EAAO,QAAA;QAAUG,MAAAA,EAAQ;AAAS,KAAA;AACpC,IAAA;QAAEH,KAAAA,EAAO,QAAA;QAAUG,MAAAA,EAAQ;AAAS,KAAA;AACpC,IAAA;QAAEH,KAAAA,EAAO,QAAA;QAAUG,MAAAA,EAAQ;AAAS;;AAGxC,4EACO,MAAMc,iBAAAA,GAAwC;AACjD,IAAA;QAAEjB,KAAAA,EAAO,UAAA;QAAYG,MAAAA,EAAQ;AAAW,KAAA;AACxC,IAAA;QAAEH,KAAAA,EAAO,QAAA;QAAUG,MAAAA,EAAQ;AAAS,KAAA;AACpC,IAAA;QAAEH,KAAAA,EAAO,QAAA;QAAUG,MAAAA,EAAQ;AAAS;;AAGxC,2GACO,MAAMe,mBAAAA,GAAoC;IAC7CC,YAAAA,EAAc,iBAAA;IACdC,OAAAA,EAAS,WAAA;IACTC,kBAAAA,EAAoB;AAAC,QAAA,QAAA;AAAU,QAAA,UAAA;AAAY,QAAA;AAAS;AACxD;;;;;;;;;;"}

package/dist/cjs/templates/dialogElements.js

@@ -0,0 +1,69 @@
+'use strict';
+
+var scene_blueprint_default = require('@cratis/scene.blueprint.default');
+var CompositeName = require('../CompositeName.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The dialog elements this blueprint's dialog templates are built from.
+ *
+ * Each is a whole dialog rather than a piece of one, and that is why this package's dialog templates look
+ * so different from the default blueprint's. The default blueprint composes a dialog out of primitives - a
+ * title, a message, a row of buttons - because it has nothing better available. Here the library ships
+ * dialogs that resolve their result through Arc's dialog context, so the frame, the buttons and the
+ * protocol behind them all belong to the composite. A template's job is to configure one, not to rebuild it.
+ */ /**
+ * The Arc-aware dialog: a frame whose result resolves through Arc's dialog context.
+ *
+ * Worth shadowing PrimeReact's `dialog` for. PrimeReact's is a modal frame and nothing more; this one lets
+ * a caller `await` a `DialogResult` instead of threading `visible` state and callbacks by hand, which is
+ * the difference between a dialog you can call and a dialog you have to wire.
+ *
+ * `visible` is left at the adapter's default of `true`, because a dialog placed in a template is placed to
+ * be seen; a host that drives visibility sets the property itself.
+ */ function dialog(id, title, okLabel, cancelLabel, content) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.Dialog, {
+        title,
+        okLabel,
+        cancelLabel,
+        width: '28rem'
+    }, {
+        content
+    });
+}
+/**
+ * A dialog whose confirm button *is* the command's execution.
+ *
+ * Worth using instead of composing `dialog` with `commandForm`, because a hand-composed pair has no way to
+ * keep the dialog open on a rejected command without reimplementing the protocol: this one submits, feeds
+ * the backend's validation results back onto the fields, and only closes when the command succeeded.
+ */ function commandDialog(id, command, title, okLabel, fields) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.CommandDialog, {
+        command,
+        title,
+        okLabel,
+        cancelLabel: 'Cancel',
+        width: '32rem'
+    }, {
+        content: fields
+    });
+}
+/**
+ * The blocking spinner shown while a long-running command is in flight.
+ *
+ * In a running application it is the Arc dialog host that renders this, threading its own title and
+ * message through. Shipping it as a template is what lets its wording and placement be *designed* rather
+ * than discovered the first time an operation takes a while - which is the only moment anyone ever sees it,
+ * and the worst moment to be reading a sentence nobody wrote on purpose.
+ */ function busyIndicatorDialog(id, title, message) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.BusyIndicatorDialog, {
+        title,
+        message
+    });
+}
+
+exports.busyIndicatorDialog = busyIndicatorDialog;
+exports.commandDialog = commandDialog;
+exports.dialog = dialog;
+//# sourceMappingURL=dialogElements.js.map

package/dist/cjs/templates/dialogElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialogElements.js","sources":["../../../templates/dialogElements.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { SceneElement } from '@cratis/scene.model';\nimport { externalComponent } from '@cratis/scene.blueprint.default';\nimport { CompositeName } from '../CompositeName';\n\n/**\n * The dialog elements this blueprint's dialog templates are built from.\n *\n * Each is a whole dialog rather than a piece of one, and that is why this package's dialog templates look\n * so different from the default blueprint's. The default blueprint composes a dialog out of primitives - a\n * title, a message, a row of buttons - because it has nothing better available. Here the library ships\n * dialogs that resolve their result through Arc's dialog context, so the frame, the buttons and the\n * protocol behind them all belong to the composite. A template's job is to configure one, not to rebuild it.\n */\n\n/**\n * The Arc-aware dialog: a frame whose result resolves through Arc's dialog context.\n *\n * Worth shadowing PrimeReact's `dialog` for. PrimeReact's is a modal frame and nothing more; this one lets\n * a caller `await` a `DialogResult` instead of threading `visible` state and callbacks by hand, which is\n * the difference between a dialog you can call and a dialog you have to wire.\n *\n * `visible` is left at the adapter's default of `true`, because a dialog placed in a template is placed to\n * be seen; a host that drives visibility sets the property itself.\n */\nexport function dialog(id: string, title: string, okLabel: string, cancelLabel: string, content: SceneElement[]): SceneElement {\n    return externalComponent(id, CompositeName.Dialog, { title, okLabel, cancelLabel, width: '28rem' }, { content });\n}\n\n/**\n * A dialog whose confirm button *is* the command's execution.\n *\n * Worth using instead of composing `dialog` with `commandForm`, because a hand-composed pair has no way to\n * keep the dialog open on a rejected command without reimplementing the protocol: this one submits, feeds\n * the backend's validation results back onto the fields, and only closes when the command succeeded.\n */\nexport function commandDialog(id: string, command: string, title: string, okLabel: string, fields: SceneElement[]): SceneElement {\n    return externalComponent(id, CompositeName.CommandDialog, { command, title, okLabel, cancelLabel: 'Cancel', width: '32rem' }, { content: fields });\n}\n\n/**\n * The blocking spinner shown while a long-running command is in flight.\n *\n * In a running application it is the Arc dialog host that renders this, threading its own title and\n * message through. Shipping it as a template is what lets its wording and placement be *designed* rather\n * than discovered the first time an operation takes a while - which is the only moment anyone ever sees it,\n * and the worst moment to be reading a sentence nobody wrote on purpose.\n */\nexport function busyIndicatorDialog(id: string, title: string, message: string): SceneElement {\n    return externalComponent(id, CompositeName.BusyIndicatorDialog, { title, message });\n}\n"],"names":["dialog","id","title","okLabel","cancelLabel","content","externalComponent","CompositeName","Dialog","width","commandDialog","command","fields","CommandDialog","busyIndicatorDialog","message","BusyIndicatorDialog"],"mappings":";;;;;AAAA;AACA;AAMA;;;;;;;;;;;;;;;;;IAoBO,SAASA,MAAAA,CAAOC,EAAU,EAAEC,KAAa,EAAEC,OAAe,EAAEC,WAAmB,EAAEC,OAAuB,EAAA;AAC3G,IAAA,OAAOC,yCAAAA,CAAkBL,EAAAA,EAAIM,2BAAAA,CAAcC,MAAM,EAAE;AAAEN,QAAAA,KAAAA;AAAOC,QAAAA,OAAAA;AAASC,QAAAA,WAAAA;QAAaK,KAAAA,EAAO;KAAQ,EAAG;AAAEJ,QAAAA;AAAQ,KAAA,CAAA;AAClH;AAEA;;;;;;IAOO,SAASK,aAAAA,CAAcT,EAAU,EAAEU,OAAe,EAAET,KAAa,EAAEC,OAAe,EAAES,MAAsB,EAAA;AAC7G,IAAA,OAAON,yCAAAA,CAAkBL,EAAAA,EAAIM,2BAAAA,CAAcM,aAAa,EAAE;AAAEF,QAAAA,OAAAA;AAAST,QAAAA,KAAAA;AAAOC,QAAAA,OAAAA;QAASC,WAAAA,EAAa,QAAA;QAAUK,KAAAA,EAAO;KAAQ,EAAG;QAAEJ,OAAAA,EAASO;AAAO,KAAA,CAAA;AACpJ;AAEA;;;;;;;AAOC,IACM,SAASE,mBAAAA,CAAoBb,EAAU,EAAEC,KAAa,EAAEa,OAAe,EAAA;AAC1E,IAAA,OAAOT,yCAAAA,CAAkBL,EAAAA,EAAIM,2BAAAA,CAAcS,mBAAmB,EAAE;AAAEd,QAAAA,KAAAA;AAAOa,QAAAA;AAAQ,KAAA,CAAA;AACrF;;;;;;"}

package/dist/cjs/templates/dialogTemplates.js

@@ -0,0 +1,118 @@
+'use strict';
+
+var scene_blueprint_default = require('@cratis/scene.blueprint.default');
+var dialogElements = require('./dialogElements.js');
+var elements = require('./elements.js');
+var formElements = require('./formElements.js');
+var SampleBindingName = require('./SampleBindingName.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The three dialog shapes an Arc application repeats: submit a command, confirm something destructive, and
+ * say that something long-running is in flight.
+ *
+ * A dialog template has no `fitsSlot`, and that absence is the whole distinction from a screen template. A
+ * screen template is *placed* - it fills a slot on whatever contains it, and the containment chain decides
+ * where it appears. A dialog is *summoned*: it opens over the application from wherever the code that
+ * opened it happens to be, so there is no parent slot for it to name.
+ *
+ * Every one of these declares exactly one slot, which is a real departure from how the default blueprint
+ * builds its dialogs, and the reason is worth stating. The default blueprint composes a dialog out of
+ * primitives - a title, a message, a row of buttons - because primitives are all it has. Here the library
+ * ships whole dialogs that resolve their result through Arc's dialog context, so the frame, the title bar
+ * and the buttons all belong to the composite. A template that declared `header` and `actions` slots would
+ * be offering regions that render *outside* the modal, which is worse than not offering them: a screen
+ * would fill them, and the content would appear somewhere nobody expected.
+ */ /**
+ * A command dialog: a short capture whose confirm button is the command's execution.
+ *
+ * Worth reaching for instead of composing `dialog` with `commandForm`, because a hand-composed pair has no
+ * way to keep the dialog open on a rejected command without reimplementing the protocol. This one submits,
+ * feeds the backend's validation results back onto the fields, and only closes when the command succeeded.
+ *
+ * The fields are placed by hand rather than generated, which is the opposite choice from `CommandFormPage`
+ * and deliberate. A dialog is a *short* capture: three or four properties chosen because they are the ones
+ * a person can answer in an overlay. Generating every property of the command would turn an overlay into a
+ * page, which is precisely the decision a dialog is supposed to have already made.
+ */ const commandDialogTemplate = {
+    name: 'CommandDialog',
+    slots: [
+        {
+            name: scene_blueprint_default.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [scene_blueprint_default.TemplateSlotName.Body]: [
+            dialogElements.commandDialog('command-dialog', SampleBindingName.SampleBindingName.RecordAdjustment, 'Record an adjustment', 'Record', [
+                formElements.numberField('command-dialog-amount', 'amount', 'Amount'),
+                formElements.inputTextField('command-dialog-reason', 'reason', 'Reason', 'Damaged goods'),
+                formElements.calendarField('command-dialog-effective', 'effective', 'Effective from'),
+                formElements.textAreaField('command-dialog-note', 'note', 'Note', 3)
+            ])
+        ]
+    },
+    displayName: 'Command dialog',
+    description: 'A short capture whose confirm button submits the command and only closes when it succeeded.'
+};
+/**
+ * A confirmation dialog: one question, the consequence spelled out, and a way back.
+ *
+ * The Arc-aware `dialog` rather than PrimeReact's, because a caller `await`s a `DialogResult` from it
+ * instead of threading `visible` state and callbacks by hand - which is the difference between a
+ * confirmation you can call from a handler and one you have to wire into a component's state.
+ *
+ * The confirm label says what will happen rather than `OK`. A confirmation whose buttons are `OK` and
+ * `Cancel` makes the reader map the question onto the answer under time pressure, which is exactly when
+ * they will get it wrong.
+ */ const confirmDialogTemplate = {
+    name: 'ConfirmDialog',
+    slots: [
+        {
+            name: scene_blueprint_default.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [scene_blueprint_default.TemplateSlotName.Body]: [
+            dialogElements.dialog('confirm-dialog', 'Void this invoice?', 'Void it', 'Keep it', [
+                elements.icon('confirm-dialog-icon', 'pi pi-exclamation-triangle'),
+                formElements.inputTextField('confirm-dialog-reason', 'reason', 'Why is it being voided?', 'Duplicate of INV-2041')
+            ])
+        ]
+    },
+    displayName: 'Confirmation dialog',
+    description: 'One question with the consequence spelled out, answered through Arc dialog context.'
+};
+/**
+ * A busy dialog: the blocking spinner shown while a long-running command is in flight.
+ *
+ * In a running application the Arc dialog host renders this, threading its own title and message through.
+ * Shipping it as a template is what lets its wording be *designed* rather than discovered the first time an
+ * operation takes a while - which is the only moment anyone ever sees it, and the worst possible moment to
+ * be reading a sentence nobody wrote on purpose.
+ */ const busyDialogTemplate = {
+    name: 'BusyDialog',
+    slots: [
+        {
+            name: scene_blueprint_default.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [scene_blueprint_default.TemplateSlotName.Body]: [
+            dialogElements.busyIndicatorDialog('busy-dialog', 'Recording the adjustment', 'The invoice will reappear as soon as the read model catches up.')
+        ]
+    },
+    displayName: 'Busy dialog',
+    description: 'The blocking spinner shown while a long-running command is in flight, with wording chosen up front.'
+};
+/** The dialog templates this blueprint provides. */ const componentsDialogTemplates = [
+    commandDialogTemplate,
+    confirmDialogTemplate,
+    busyDialogTemplate
+];
+
+exports.busyDialogTemplate = busyDialogTemplate;
+exports.commandDialogTemplate = commandDialogTemplate;
+exports.componentsDialogTemplates = componentsDialogTemplates;
+exports.confirmDialogTemplate = confirmDialogTemplate;
+//# sourceMappingURL=dialogTemplates.js.map

package/dist/cjs/templates/dialogTemplates.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialogTemplates.js","sources":["../../../templates/dialogTemplates.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { DialogTemplate } from '@cratis/scene.model';\nimport { TemplateSlotName } from '@cratis/scene.blueprint.default';\nimport { busyIndicatorDialog, commandDialog, dialog } from './dialogElements';\nimport { icon } from './elements';\nimport { calendarField, inputTextField, numberField, textAreaField } from './formElements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The three dialog shapes an Arc application repeats: submit a command, confirm something destructive, and\n * say that something long-running is in flight.\n *\n * A dialog template has no `fitsSlot`, and that absence is the whole distinction from a screen template. A\n * screen template is *placed* - it fills a slot on whatever contains it, and the containment chain decides\n * where it appears. A dialog is *summoned*: it opens over the application from wherever the code that\n * opened it happens to be, so there is no parent slot for it to name.\n *\n * Every one of these declares exactly one slot, which is a real departure from how the default blueprint\n * builds its dialogs, and the reason is worth stating. The default blueprint composes a dialog out of\n * primitives - a title, a message, a row of buttons - because primitives are all it has. Here the library\n * ships whole dialogs that resolve their result through Arc's dialog context, so the frame, the title bar\n * and the buttons all belong to the composite. A template that declared `header` and `actions` slots would\n * be offering regions that render *outside* the modal, which is worse than not offering them: a screen\n * would fill them, and the content would appear somewhere nobody expected.\n */\n\n/**\n * A command dialog: a short capture whose confirm button is the command's execution.\n *\n * Worth reaching for instead of composing `dialog` with `commandForm`, because a hand-composed pair has no\n * way to keep the dialog open on a rejected command without reimplementing the protocol. This one submits,\n * feeds the backend's validation results back onto the fields, and only closes when the command succeeded.\n *\n * The fields are placed by hand rather than generated, which is the opposite choice from `CommandFormPage`\n * and deliberate. A dialog is a *short* capture: three or four properties chosen because they are the ones\n * a person can answer in an overlay. Generating every property of the command would turn an overlay into a\n * page, which is precisely the decision a dialog is supposed to have already made.\n */\nexport const commandDialogTemplate: DialogTemplate = {\n    name: 'CommandDialog',\n    slots: [{ name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Body]: [\n            commandDialog('command-dialog', SampleBindingName.RecordAdjustment, 'Record an adjustment', 'Record', [\n                numberField('command-dialog-amount', 'amount', 'Amount'),\n                inputTextField('command-dialog-reason', 'reason', 'Reason', 'Damaged goods'),\n                calendarField('command-dialog-effective', 'effective', 'Effective from'),\n                textAreaField('command-dialog-note', 'note', 'Note', 3),\n            ]),\n        ],\n    },\n    displayName: 'Command dialog',\n    description: 'A short capture whose confirm button submits the command and only closes when it succeeded.',\n};\n\n/**\n * A confirmation dialog: one question, the consequence spelled out, and a way back.\n *\n * The Arc-aware `dialog` rather than PrimeReact's, because a caller `await`s a `DialogResult` from it\n * instead of threading `visible` state and callbacks by hand - which is the difference between a\n * confirmation you can call from a handler and one you have to wire into a component's state.\n *\n * The confirm label says what will happen rather than `OK`. A confirmation whose buttons are `OK` and\n * `Cancel` makes the reader map the question onto the answer under time pressure, which is exactly when\n * they will get it wrong.\n */\nexport const confirmDialogTemplate: DialogTemplate = {\n    name: 'ConfirmDialog',\n    slots: [{ name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Body]: [\n            dialog('confirm-dialog', 'Void this invoice?', 'Void it', 'Keep it', [\n                icon('confirm-dialog-icon', 'pi pi-exclamation-triangle'),\n                inputTextField('confirm-dialog-reason', 'reason', 'Why is it being voided?', 'Duplicate of INV-2041'),\n            ]),\n        ],\n    },\n    displayName: 'Confirmation dialog',\n    description: 'One question with the consequence spelled out, answered through Arc dialog context.',\n};\n\n/**\n * A busy dialog: the blocking spinner shown while a long-running command is in flight.\n *\n * In a running application the Arc dialog host renders this, threading its own title and message through.\n * Shipping it as a template is what lets its wording be *designed* rather than discovered the first time an\n * operation takes a while - which is the only moment anyone ever sees it, and the worst possible moment to\n * be reading a sentence nobody wrote on purpose.\n */\nexport const busyDialogTemplate: DialogTemplate = {\n    name: 'BusyDialog',\n    slots: [{ name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Body]: [\n            busyIndicatorDialog('busy-dialog', 'Recording the adjustment', 'The invoice will reappear as soon as the read model catches up.'),\n        ],\n    },\n    displayName: 'Busy dialog',\n    description: 'The blocking spinner shown while a long-running command is in flight, with wording chosen up front.',\n};\n\n/** The dialog templates this blueprint provides. */\nexport const componentsDialogTemplates: DialogTemplate[] = [commandDialogTemplate, confirmDialogTemplate, busyDialogTemplate];\n"],"names":["commandDialogTemplate","name","slots","TemplateSlotName","Body","content","commandDialog","SampleBindingName","RecordAdjustment","numberField","inputTextField","calendarField","textAreaField","displayName","description","confirmDialogTemplate","dialog","icon","busyDialogTemplate","busyIndicatorDialog","componentsDialogTemplates"],"mappings":";;;;;;;;AAAA;AACA;AASA;;;;;;;;;;;;;;;;;;;;;;;;;;;UA8BaA,qBAAAA,GAAwC;IACjDC,IAAAA,EAAM,eAAA;IACNC,KAAAA,EAAO;AAAC,QAAA;AAAED,YAAAA,IAAAA,EAAME,yCAAiBC;AAAK;AAAE,KAAA;IACxCC,OAAAA,EAAS;QACL,CAACF,wCAAAA,CAAiBC,IAAI,GAAG;AACrBE,YAAAA,4BAAAA,CAAc,gBAAA,EAAkBC,mCAAAA,CAAkBC,gBAAgB,EAAE,wBAAwB,QAAA,EAAU;AAClGC,gBAAAA,wBAAAA,CAAY,yBAAyB,QAAA,EAAU,QAAA,CAAA;gBAC/CC,2BAAAA,CAAe,uBAAA,EAAyB,UAAU,QAAA,EAAU,eAAA,CAAA;AAC5DC,gBAAAA,0BAAAA,CAAc,4BAA4B,WAAA,EAAa,gBAAA,CAAA;gBACvDC,0BAAAA,CAAc,qBAAA,EAAuB,QAAQ,MAAA,EAAQ,CAAA;AACxD,aAAA;AACJ;AACL,KAAA;IACAC,WAAAA,EAAa,gBAAA;IACbC,WAAAA,EAAa;AACjB;AAEA;;;;;;;;;;UAWaC,qBAAAA,GAAwC;IACjDd,IAAAA,EAAM,eAAA;IACNC,KAAAA,EAAO;AAAC,QAAA;AAAED,YAAAA,IAAAA,EAAME,yCAAiBC;AAAK;AAAE,KAAA;IACxCC,OAAAA,EAAS;QACL,CAACF,wCAAAA,CAAiBC,IAAI,GAAG;YACrBY,qBAAAA,CAAO,gBAAA,EAAkB,oBAAA,EAAsB,SAAA,EAAW,SAAA,EAAW;AACjEC,gBAAAA,aAAAA,CAAK,qBAAA,EAAuB,4BAAA,CAAA;gBAC5BP,2BAAAA,CAAe,uBAAA,EAAyB,UAAU,yBAAA,EAA2B,uBAAA;AAChF,aAAA;AACJ;AACL,KAAA;IACAG,WAAAA,EAAa,qBAAA;IACbC,WAAAA,EAAa;AACjB;AAEA;;;;;;;UAQaI,kBAAAA,GAAqC;IAC9CjB,IAAAA,EAAM,YAAA;IACNC,KAAAA,EAAO;AAAC,QAAA;AAAED,YAAAA,IAAAA,EAAME,yCAAiBC;AAAK;AAAE,KAAA;IACxCC,OAAAA,EAAS;QACL,CAACF,wCAAAA,CAAiBC,IAAI,GAAG;AACrBe,YAAAA,kCAAAA,CAAoB,eAAe,0BAAA,EAA4B,iEAAA;AAClE;AACL,KAAA;IACAN,WAAAA,EAAa,aAAA;IACbC,WAAAA,EAAa;AACjB;AAEA,qDACO,MAAMM,yBAAAA,GAA8C;AAACpB,IAAAA,qBAAAA;AAAuBe,IAAAA,qBAAAA;AAAuBG,IAAAA;;;;;;;;"}

package/dist/cjs/templates/editorElements.js

@@ -0,0 +1,81 @@
+'use strict';
+
+var scene_blueprint_default = require('@cratis/scene.blueprint.default');
+var CompositeName = require('../CompositeName.js');
+var sampleData = require('./sampleData.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The Arc-free editing and inspection elements this blueprint's templates are built from.
+ *
+ * Unlike everything else in this package these need no binding at all - they take their content straight
+ * out of the property bag - so a template built from them renders as a working page with no host, no
+ * proxies and no backend. That is what makes the editor templates the ones to open first when looking at
+ * this blueprint.
+ */ /**
+ * A JSON schema edited as a typed property tree rather than as text.
+ *
+ * `canEdit` and `canNotEditReason` belong together: in an event-sourced application a schema is very often
+ * deliberately read-only, and saying *why* in the same place is what keeps that from looking like a bug.
+ */ function schemaEditor(id, eventTypeName, canEdit, canNotEditReason) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.SchemaEditor, {
+        schema: sampleData.invoiceSchema,
+        eventTypeName,
+        canEdit,
+        canNotEditReason,
+        editMode: canEdit
+    });
+}
+/** A document rendered against its schema, so nested values are navigable and each is edited by its declared type. */ function objectContentEditor(id, editMode) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.ObjectContentEditor, {
+        object: sampleData.invoiceDocument,
+        schema: sampleData.invoiceSchema,
+        editMode
+    });
+}
+/** The trail saying where you are inside a nested document, and the way back out. */ function objectNavigationalBar(id) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.ObjectNavigationalBar, {
+        navigationPath: sampleData.invoiceNavigationPath
+    });
+}
+/**
+ * The timeline of successive versions.
+ *
+ * Worth a place on a detail page in a way it would not be in a CRUD application: in an event-sourced
+ * system everything *has* a history rather than only a current value, so scrubbing through it is the
+ * natural way to look at a record rather than a special feature.
+ */ function timeMachine(id) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.TimeMachine, {
+        versions: sampleData.invoiceVersions,
+        currentVersionIndex: 0
+    });
+}
+/**
+ * The filter toggle and the panel it anchors, as one element.
+ *
+ * One element rather than two because `FilterPanel` is a portal anchored to a button - it renders next to
+ * whatever opened it, so it cannot be placed on its own, and the element tree has no way to express an
+ * anchor relationship. The adapter owns both halves, and a template places one thing.
+ */ function filterPanel(id, label) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.FilterPanel, {
+        label,
+        filters: sampleData.invoiceFilters,
+        searchPlaceholder: 'Search filters'
+    });
+}
+/** A standalone selection control, not bound to a command property. */ function dropdown(id, placeholder, options) {
+    return scene_blueprint_default.externalComponent(id, CompositeName.CompositeName.Dropdown, {
+        placeholder,
+        options,
+        showClear: true
+    });
+}
+
+exports.dropdown = dropdown;
+exports.filterPanel = filterPanel;
+exports.objectContentEditor = objectContentEditor;
+exports.objectNavigationalBar = objectNavigationalBar;
+exports.schemaEditor = schemaEditor;
+exports.timeMachine = timeMachine;
+//# sourceMappingURL=editorElements.js.map

package/dist/cjs/templates/editorElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"editorElements.js","sources":["../../../templates/editorElements.ts"],"sourcesContent":["// Copyright (c) Cratis. All rights reserved.\n// Licensed under the MIT license. See LICENSE file in the project root for full license information.\n\nimport { SceneElement } from '@cratis/scene.model';\nimport { externalComponent } from '@cratis/scene.blueprint.default';\nimport { CompositeName } from '../CompositeName';\nimport { invoiceDocument, invoiceFilters, invoiceNavigationPath, invoiceSchema, invoiceVersions } from './sampleData';\n\n/**\n * The Arc-free editing and inspection elements this blueprint's templates are built from.\n *\n * Unlike everything else in this package these need no binding at all - they take their content straight\n * out of the property bag - so a template built from them renders as a working page with no host, no\n * proxies and no backend. That is what makes the editor templates the ones to open first when looking at\n * this blueprint.\n */\n\n/**\n * A JSON schema edited as a typed property tree rather than as text.\n *\n * `canEdit` and `canNotEditReason` belong together: in an event-sourced application a schema is very often\n * deliberately read-only, and saying *why* in the same place is what keeps that from looking like a bug.\n */\nexport function schemaEditor(id: string, eventTypeName: string, canEdit: boolean, canNotEditReason?: string): SceneElement {\n    return externalComponent(id, CompositeName.SchemaEditor, {\n        schema: invoiceSchema,\n        eventTypeName,\n        canEdit,\n        canNotEditReason,\n        editMode: canEdit,\n    });\n}\n\n/** A document rendered against its schema, so nested values are navigable and each is edited by its declared type. */\nexport function objectContentEditor(id: string, editMode: boolean): SceneElement {\n    return externalComponent(id, CompositeName.ObjectContentEditor, { object: invoiceDocument, schema: invoiceSchema, editMode });\n}\n\n/** The trail saying where you are inside a nested document, and the way back out. */\nexport function objectNavigationalBar(id: string): SceneElement {\n    return externalComponent(id, CompositeName.ObjectNavigationalBar, { navigationPath: invoiceNavigationPath });\n}\n\n/**\n * The timeline of successive versions.\n *\n * Worth a place on a detail page in a way it would not be in a CRUD application: in an event-sourced\n * system everything *has* a history rather than only a current value, so scrubbing through it is the\n * natural way to look at a record rather than a special feature.\n */\nexport function timeMachine(id: string): SceneElement {\n    return externalComponent(id, CompositeName.TimeMachine, { versions: invoiceVersions, currentVersionIndex: 0 });\n}\n\n/**\n * The filter toggle and the panel it anchors, as one element.\n *\n * One element rather than two because `FilterPanel` is a portal anchored to a button - it renders next to\n * whatever opened it, so it cannot be placed on its own, and the element tree has no way to express an\n * anchor relationship. The adapter owns both halves, and a template places one thing.\n */\nexport function filterPanel(id: string, label: string): SceneElement {\n    return externalComponent(id, CompositeName.FilterPanel, { label, filters: invoiceFilters, searchPlaceholder: 'Search filters' });\n}\n\n/** A standalone selection control, not bound to a command property. */\nexport function dropdown(id: string, placeholder: string, options: { label: string; value: string }[]): SceneElement {\n    return externalComponent(id, CompositeName.Dropdown, { placeholder, options, showClear: true });\n}\n"],"names":["schemaEditor","id","eventTypeName","canEdit","canNotEditReason","externalComponent","CompositeName","SchemaEditor","schema","invoiceSchema","editMode","objectContentEditor","ObjectContentEditor","object","invoiceDocument","objectNavigationalBar","ObjectNavigationalBar","navigationPath","invoiceNavigationPath","timeMachine","TimeMachine","versions","invoiceVersions","currentVersionIndex","filterPanel","label","FilterPanel","filters","invoiceFilters","searchPlaceholder","dropdown","placeholder","options","Dropdown","showClear"],"mappings":";;;;;;AAAA;AACA;AAOA;;;;;;;;;;;;IAeO,SAASA,YAAAA,CAAaC,EAAU,EAAEC,aAAqB,EAAEC,OAAgB,EAAEC,gBAAyB,EAAA;AACvG,IAAA,OAAOC,yCAAAA,CAAkBJ,EAAAA,EAAIK,2BAAAA,CAAcC,YAAY,EAAE;QACrDC,MAAAA,EAAQC,wBAAAA;AACRP,QAAAA,aAAAA;AACAC,QAAAA,OAAAA;AACAC,QAAAA,gBAAAA;QACAM,QAAAA,EAAUP;AACd,KAAA,CAAA;AACJ;AAEA,uHACO,SAASQ,mBAAAA,CAAoBV,EAAU,EAAES,QAAiB,EAAA;AAC7D,IAAA,OAAOL,yCAAAA,CAAkBJ,EAAAA,EAAIK,2BAAAA,CAAcM,mBAAmB,EAAE;QAAEC,MAAAA,EAAQC,0BAAAA;QAAiBN,MAAAA,EAAQC,wBAAAA;AAAeC,QAAAA;AAAS,KAAA,CAAA;AAC/H;AAEA,sFACO,SAASK,qBAAAA,CAAsBd,EAAU,EAAA;AAC5C,IAAA,OAAOI,yCAAAA,CAAkBJ,EAAAA,EAAIK,2BAAAA,CAAcU,qBAAqB,EAAE;QAAEC,cAAAA,EAAgBC;AAAsB,KAAA,CAAA;AAC9G;AAEA;;;;;;IAOO,SAASC,WAAAA,CAAYlB,EAAU,EAAA;AAClC,IAAA,OAAOI,yCAAAA,CAAkBJ,EAAAA,EAAIK,2BAAAA,CAAcc,WAAW,EAAE;QAAEC,QAAAA,EAAUC,0BAAAA;QAAiBC,mBAAAA,EAAqB;AAAE,KAAA,CAAA;AAChH;AAEA;;;;;;AAMC,IACM,SAASC,WAAAA,CAAYvB,EAAU,EAAEwB,KAAa,EAAA;AACjD,IAAA,OAAOpB,yCAAAA,CAAkBJ,EAAAA,EAAIK,2BAAAA,CAAcoB,WAAW,EAAE;AAAED,QAAAA,KAAAA;QAAOE,OAAAA,EAASC,yBAAAA;QAAgBC,iBAAAA,EAAmB;AAAiB,KAAA,CAAA;AAClI;AAEA,wEACO,SAASC,QAAAA,CAAS7B,EAAU,EAAE8B,WAAmB,EAAEC,OAA2C,EAAA;AACjG,IAAA,OAAO3B,yCAAAA,CAAkBJ,EAAAA,EAAIK,2BAAAA,CAAc2B,QAAQ,EAAE;AAAEF,QAAAA,WAAAA;AAAaC,QAAAA,OAAAA;QAASE,SAAAA,EAAW;AAAK,KAAA,CAAA;AACjG;;;;;;;;;"}

package/dist/cjs/templates/editorTemplates.js

@@ -0,0 +1,172 @@
+'use strict';
+
+var scene_model = require('@cratis/scene.model');
+var scene_blueprint_default = require('@cratis/scene.blueprint.default');
+var editorElements = require('./editorElements.js');
+var elements = require('./elements.js');
+var SampleBindingName = require('./SampleBindingName.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The two inspection pages: one for a type's shape, one for an instance's content.
+ *
+ * These are the templates to open first when looking at this blueprint, because they are the two that
+ * render completely with nothing registered. The schema editor, the document editor, the navigational bar
+ * and the time machine all read their content out of the property bag rather than from a query, so a
+ * preview of either page is a working page rather than a page of placeholders.
+ *
+ * That is not a trick to make a demo look better. It is the honest shape of the library: most of
+ * `@cratis/components` is Arc-bound and needs a host, and a meaningful part of it is not. A blueprint built
+ * on it should make both halves visible.
+ */ /**
+ * The schema editor page: an event type's shape, edited as a typed property tree.
+ *
+ * Its header names no binding, and that is correct rather than an omission. A schema is design-time
+ * metadata about an event type, not a read model anyone queries, so there is nothing for the header to be
+ * bound to - and the header says `No binding` instead of implying a wiring step that does not exist. It is
+ * the one page in this package where the unbound state is the finished state.
+ *
+ * `canEdit` is paired with `canNotEditReason` deliberately: in an event-sourced application a stored event
+ * type's schema is very often deliberately locked, and saying why in the same place is what stops that
+ * from reading as a bug.
+ */ const schemaEditorPageTemplate = {
+    name: 'SchemaEditorPage',
+    fitsSlot: scene_blueprint_default.SlotName.Content,
+    slots: [
+        {
+            name: scene_blueprint_default.TemplateSlotName.Header
+        },
+        {
+            name: scene_blueprint_default.TemplateSlotName.Toolbar
+        },
+        {
+            name: scene_blueprint_default.TemplateSlotName.Body
+        }
+    ],
+    arrangement: {
+        root: scene_blueprint_default.column([
+            scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Header),
+            scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Toolbar),
+            scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Body, {
+                grow: 1
+            })
+        ], 16)
+    },
+    content: {
+        [scene_blueprint_default.TemplateSlotName.Header]: [
+            elements.arcPageHeader('schema-header', {
+                title: 'InvoiceRegistered',
+                subtitle: 'The shape of the event, and what a new generation would be allowed to change',
+                section: 'Event types'
+            })
+        ],
+        [scene_blueprint_default.TemplateSlotName.Toolbar]: [
+            elements.toolbar('schema-toolbar', [
+                elements.toolbarButton('schema-edit', 'Edit the schema', 'pi pi-pencil', 'Edit'),
+                elements.toolbarButton('schema-generation', 'Start a new generation', 'pi pi-clone', 'New generation'),
+                elements.toolbarSeparator('schema-separator'),
+                elements.toolbarButton('schema-download', 'Download as JSON Schema', 'pi pi-download')
+            ])
+        ],
+        [scene_blueprint_default.TemplateSlotName.Body]: [
+            elements.page('schema-body', 'InvoiceRegistered', [
+                editorElements.schemaEditor('schema-editor', 'InvoiceRegistered', true)
+            ])
+        ]
+    },
+    displayName: 'Schema editor page',
+    description: "An event type's schema edited as a typed property tree, with the actions that evolve it."
+};
+/**
+ * The object editor page: one document, its trail, and its history beside it.
+ *
+ * Bound to `InvoiceById`, because that is what a real page like this is: you arrive with an id, the query
+ * fetches the record, and the editor renders it against its schema. The editors themselves take their
+ * content from the property bag, so the page is fully legible before the query is wired - and the header
+ * still says which query it is waiting for.
+ *
+ * The document is wrapped in an `errorBoundary` and the history is not, which is the decision this element
+ * exists to let a template make. A malformed document should cost the document region; it should not take
+ * the trail and the timeline down with it, and the timeline is the thing you would reach for to find out
+ * *when* the document became malformed.
+ */ const objectEditorPageTemplate = {
+    name: 'ObjectEditorPage',
+    fitsSlot: scene_blueprint_default.SlotName.Content,
+    slots: [
+        {
+            name: scene_blueprint_default.TemplateSlotName.Header
+        },
+        {
+            name: scene_blueprint_default.TemplateSlotName.Toolbar
+        },
+        {
+            name: scene_blueprint_default.TemplateSlotName.Body
+        },
+        {
+            name: scene_blueprint_default.TemplateSlotName.SidePanel
+        }
+    ],
+    arrangement: {
+        root: scene_blueprint_default.column([
+            scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Header),
+            scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Toolbar),
+            scene_blueprint_default.row([
+                scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Body, {
+                    grow: 2
+                }),
+                scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.SidePanel, {
+                    grow: 1
+                })
+            ], 16)
+        ]),
+        overrides: [
+            {
+                width: scene_model.WidthSizeClass.Compact,
+                root: scene_blueprint_default.column([
+                    scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Header),
+                    scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Toolbar),
+                    scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.Body),
+                    scene_blueprint_default.slotLeaf(scene_blueprint_default.TemplateSlotName.SidePanel)
+                ], 16)
+            }
+        ]
+    },
+    content: {
+        [scene_blueprint_default.TemplateSlotName.Header]: [
+            elements.arcPageHeader('object-header', {
+                title: 'INV-2043',
+                subtitle: 'The document as it stands, and every version it has been',
+                section: 'Billing',
+                query: SampleBindingName.SampleBindingName.InvoiceById
+            })
+        ],
+        [scene_blueprint_default.TemplateSlotName.Toolbar]: [
+            editorElements.objectNavigationalBar('object-trail'),
+            editorElements.filterPanel('object-filters', 'Filters')
+        ],
+        [scene_blueprint_default.TemplateSlotName.Body]: [
+            elements.errorBoundary('object-guard', [
+                elements.page('object-body', 'Document', [
+                    editorElements.objectContentEditor('object-editor', true)
+                ])
+            ])
+        ],
+        [scene_blueprint_default.TemplateSlotName.SidePanel]: [
+            elements.page('object-history', 'History', [
+                editorElements.timeMachine('object-time-machine')
+            ])
+        ]
+    },
+    displayName: 'Object editor page',
+    description: 'One document edited against its schema, with its navigation trail and its version history.'
+};
+/** The two editor-shaped templates. */ const editorTemplates = [
+    schemaEditorPageTemplate,
+    objectEditorPageTemplate
+];
+
+exports.editorTemplates = editorTemplates;
+exports.objectEditorPageTemplate = objectEditorPageTemplate;
+exports.schemaEditorPageTemplate = schemaEditorPageTemplate;
+//# sourceMappingURL=editorTemplates.js.map