@cratis/scene.blueprint.components 4.9.0 → 4.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,6 @@
1
1
  'use strict';
2
2
 
3
+ var scene_model = require('@cratis/scene.model');
3
4
  var scene_blueprint_default = require('@cratis/scene.blueprint.default');
4
5
  var elements = require('./elements.js');
5
6
  var formElements = require('./formElements.js');
@@ -70,6 +71,13 @@ var SampleBindingName = require('./SampleBindingName.js');
70
71
  ])
71
72
  ]
72
73
  },
74
+ metadata: {
75
+ type: 'Form',
76
+ category: 'Business / Command',
77
+ scopes: [
78
+ scene_model.TemplateScope.Slice
79
+ ]
80
+ },
73
81
  displayName: 'Command form page',
74
82
  description: 'A generated command form under a header that states the command, with its own action bar.'
75
83
  };
@@ -1 +1 @@
1
- {"version":3,"file":"commandTemplates.js","sources":["../../../templates/commandTemplates.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 { ScreenTemplate } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarSeparator } from './elements';\nimport { commandForm } from './formElements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The write side: a page whose body is one command, and whose action bar submits it.\n */\n\n/**\n * A command form page - a header, the generated form, and the bar that closes it.\n *\n * The form is `commandForm`, which is `AutoCommandForm`: it reads the command's own property descriptors\n * and picks a field component per property type. That is the whole reason a *template* can ship a form at\n * all. A template that listed fields by hand would be a snapshot of a command as it looked the day the\n * template was written, and would go quietly wrong the first time a property was added on the backend.\n * This one follows the command, which is the same guarantee Arc's generated proxies give everywhere else.\n *\n * `exclude` names the properties the form should not generate. `invoiceId` is excluded because it is the\n * event-source identity - Arc resolves it, and a form offering to type it in is offering to break it.\n *\n * The action bar is the template's rather than the form's, and it declares its own slot for that reason: a\n * screen replacing \"Register\" with \"Register and approve\" should not have to replace the form.\n */\nexport const commandFormPageTemplate: ScreenTemplate = {\n name: 'CommandFormPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body, { grow: 1 }), slotLeaf(TemplateSlotName.Actions)], 16),\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('command-form-header', {\n title: 'Register an invoice',\n subtitle: 'The form follows the command, so a property added on the backend shows up here',\n section: 'Billing',\n command: SampleBindingName.RegisterInvoice,\n }),\n ],\n [TemplateSlotName.Body]: [page('command-form-body', '', [commandForm('command-form', SampleBindingName.RegisterInvoice, ['invoiceId'])])],\n [TemplateSlotName.Actions]: [\n toolbar('command-form-actions', [\n toolbarButton('command-form-submit', 'Register the invoice', 'pi pi-check', 'Register'),\n toolbarSeparator('command-form-separator'),\n toolbarButton('command-form-cancel', 'Discard and go back', 'pi pi-times', 'Cancel'),\n ]),\n ],\n },\n displayName: 'Command form page',\n description: 'A generated command form under a header that states the command, with its own action bar.',\n};\n\n/** The command-shaped templates. */\nexport const commandTemplates: ScreenTemplate[] = [commandFormPageTemplate];\n"],"names":["commandFormPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","Actions","arrangement","root","column","slotLeaf","grow","content","arcPageHeader","title","subtitle","section","command","SampleBindingName","RegisterInvoice","page","commandForm","toolbar","toolbarButton","toolbarSeparator","displayName","description","commandTemplates"],"mappings":";;;;;;;AAAA;AACA;AAQA;;;;;;;;;;;;;;;;UAmBaA,uBAAAA,GAA0C;IACnDC,IAAAA,EAAM,iBAAA;AACNC,IAAAA,QAAAA,EAAUC,iCAASC,OAAO;IAC1BC,KAAAA,EAAO;AAAC,QAAA;AAAEJ,YAAAA,IAAAA,EAAMK,yCAAiBC;AAAO,SAAA;AAAG,QAAA;AAAEN,YAAAA,IAAAA,EAAMK,yCAAiBE;AAAK,SAAA;AAAG,QAAA;AAAEP,YAAAA,IAAAA,EAAMK,yCAAiBG;AAAQ;AAAE,KAAA;IAC/GC,WAAAA,EAAa;AACTC,QAAAA,IAAAA,EAAMC,8BAAAA,CAAO;AAACC,YAAAA,gCAAAA,CAASP,yCAAiBC,MAAM,CAAA;YAAGM,gCAAAA,CAASP,wCAAAA,CAAiBE,IAAI,EAAE;gBAAEM,IAAAA,EAAM;AAAE,aAAA,CAAA;AAAID,YAAAA,gCAAAA,CAASP,yCAAiBG,OAAO;SAAE,EAAE,EAAA;AACxI,KAAA;IACAM,OAAAA,EAAS;QACL,CAACT,wCAAAA,CAAiBC,MAAM,GAAG;AACvBS,YAAAA,sBAAAA,CAAc,qBAAA,EAAuB;gBACjCC,KAAAA,EAAO,qBAAA;gBACPC,QAAAA,EAAU,gFAAA;gBACVC,OAAAA,EAAS,SAAA;AACTC,gBAAAA,OAAAA,EAASC,oCAAkBC;AAC/B,aAAA;AACH,SAAA;QACD,CAAChB,wCAAAA,CAAiBE,IAAI,GAAG;AAACe,YAAAA,aAAAA,CAAK,qBAAqB,EAAA,EAAI;gBAACC,wBAAAA,CAAY,cAAA,EAAgBH,mCAAAA,CAAkBC,eAAe,EAAE;AAAC,oBAAA;AAAY,iBAAA;AAAE,aAAA;AAAE,SAAA;QACzI,CAAChB,wCAAAA,CAAiBG,OAAO,GAAG;AACxBgB,YAAAA,gBAAAA,CAAQ,sBAAA,EAAwB;gBAC5BC,sBAAAA,CAAc,qBAAA,EAAuB,wBAAwB,aAAA,EAAe,UAAA,CAAA;gBAC5EC,yBAAAA,CAAiB,wBAAA,CAAA;gBACjBD,sBAAAA,CAAc,qBAAA,EAAuB,uBAAuB,aAAA,EAAe,QAAA;AAC9E,aAAA;AACJ;AACL,KAAA;IACAE,WAAAA,EAAa,mBAAA;IACbC,WAAAA,EAAa;AACjB;AAEA,qCACO,MAAMC,gBAAAA,GAAqC;AAAC9B,IAAAA;;;;"}
1
+ {"version":3,"file":"commandTemplates.js","sources":["../../../templates/commandTemplates.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 { ScreenTemplate, TemplateScope } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarSeparator } from './elements';\nimport { commandForm } from './formElements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The write side: a page whose body is one command, and whose action bar submits it.\n */\n\n/**\n * A command form page - a header, the generated form, and the bar that closes it.\n *\n * The form is `commandForm`, which is `AutoCommandForm`: it reads the command's own property descriptors\n * and picks a field component per property type. That is the whole reason a *template* can ship a form at\n * all. A template that listed fields by hand would be a snapshot of a command as it looked the day the\n * template was written, and would go quietly wrong the first time a property was added on the backend.\n * This one follows the command, which is the same guarantee Arc's generated proxies give everywhere else.\n *\n * `exclude` names the properties the form should not generate. `invoiceId` is excluded because it is the\n * event-source identity - Arc resolves it, and a form offering to type it in is offering to break it.\n *\n * The action bar is the template's rather than the form's, and it declares its own slot for that reason: a\n * screen replacing \"Register\" with \"Register and approve\" should not have to replace the form.\n */\nexport const commandFormPageTemplate: ScreenTemplate = {\n name: 'CommandFormPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body, { grow: 1 }), slotLeaf(TemplateSlotName.Actions)], 16),\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('command-form-header', {\n title: 'Register an invoice',\n subtitle: 'The form follows the command, so a property added on the backend shows up here',\n section: 'Billing',\n command: SampleBindingName.RegisterInvoice,\n }),\n ],\n [TemplateSlotName.Body]: [page('command-form-body', '', [commandForm('command-form', SampleBindingName.RegisterInvoice, ['invoiceId'])])],\n [TemplateSlotName.Actions]: [\n toolbar('command-form-actions', [\n toolbarButton('command-form-submit', 'Register the invoice', 'pi pi-check', 'Register'),\n toolbarSeparator('command-form-separator'),\n toolbarButton('command-form-cancel', 'Discard and go back', 'pi pi-times', 'Cancel'),\n ]),\n ],\n },\n metadata: { type: 'Form', category: 'Business / Command', scopes: [TemplateScope.Slice] },\n displayName: 'Command form page',\n description: 'A generated command form under a header that states the command, with its own action bar.',\n};\n\n/** The command-shaped templates. */\nexport const commandTemplates: ScreenTemplate[] = [commandFormPageTemplate];\n"],"names":["commandFormPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","Actions","arrangement","root","column","slotLeaf","grow","content","arcPageHeader","title","subtitle","section","command","SampleBindingName","RegisterInvoice","page","commandForm","toolbar","toolbarButton","toolbarSeparator","metadata","type","category","scopes","TemplateScope","Slice","displayName","description","commandTemplates"],"mappings":";;;;;;;;AAAA;AACA;AAQA;;;;;;;;;;;;;;;;UAmBaA,uBAAAA,GAA0C;IACnDC,IAAAA,EAAM,iBAAA;AACNC,IAAAA,QAAAA,EAAUC,iCAASC,OAAO;IAC1BC,KAAAA,EAAO;AAAC,QAAA;AAAEJ,YAAAA,IAAAA,EAAMK,yCAAiBC;AAAO,SAAA;AAAG,QAAA;AAAEN,YAAAA,IAAAA,EAAMK,yCAAiBE;AAAK,SAAA;AAAG,QAAA;AAAEP,YAAAA,IAAAA,EAAMK,yCAAiBG;AAAQ;AAAE,KAAA;IAC/GC,WAAAA,EAAa;AACTC,QAAAA,IAAAA,EAAMC,8BAAAA,CAAO;AAACC,YAAAA,gCAAAA,CAASP,yCAAiBC,MAAM,CAAA;YAAGM,gCAAAA,CAASP,wCAAAA,CAAiBE,IAAI,EAAE;gBAAEM,IAAAA,EAAM;AAAE,aAAA,CAAA;AAAID,YAAAA,gCAAAA,CAASP,yCAAiBG,OAAO;SAAE,EAAE,EAAA;AACxI,KAAA;IACAM,OAAAA,EAAS;QACL,CAACT,wCAAAA,CAAiBC,MAAM,GAAG;AACvBS,YAAAA,sBAAAA,CAAc,qBAAA,EAAuB;gBACjCC,KAAAA,EAAO,qBAAA;gBACPC,QAAAA,EAAU,gFAAA;gBACVC,OAAAA,EAAS,SAAA;AACTC,gBAAAA,OAAAA,EAASC,oCAAkBC;AAC/B,aAAA;AACH,SAAA;QACD,CAAChB,wCAAAA,CAAiBE,IAAI,GAAG;AAACe,YAAAA,aAAAA,CAAK,qBAAqB,EAAA,EAAI;gBAACC,wBAAAA,CAAY,cAAA,EAAgBH,mCAAAA,CAAkBC,eAAe,EAAE;AAAC,oBAAA;AAAY,iBAAA;AAAE,aAAA;AAAE,SAAA;QACzI,CAAChB,wCAAAA,CAAiBG,OAAO,GAAG;AACxBgB,YAAAA,gBAAAA,CAAQ,sBAAA,EAAwB;gBAC5BC,sBAAAA,CAAc,qBAAA,EAAuB,wBAAwB,aAAA,EAAe,UAAA,CAAA;gBAC5EC,yBAAAA,CAAiB,wBAAA,CAAA;gBACjBD,sBAAAA,CAAc,qBAAA,EAAuB,uBAAuB,aAAA,EAAe,QAAA;AAC9E,aAAA;AACJ;AACL,KAAA;IACAE,QAAAA,EAAU;QAAEC,IAAAA,EAAM,MAAA;QAAQC,QAAAA,EAAU,oBAAA;QAAsBC,MAAAA,EAAQ;AAACC,YAAAA,yBAAAA,CAAcC;AAAM;AAAC,KAAA;IACxFC,WAAAA,EAAa,mBAAA;IACbC,WAAAA,EAAa;AACjB;AAEA,qCACO,MAAMC,gBAAAA,GAAqC;AAACpC,IAAAA;;;;"}
@@ -63,6 +63,13 @@ var SampleBindingName = require('./SampleBindingName.js');
63
63
  dataElements.dataPage('data-list-body', SampleBindingName.SampleBindingName.AllInvoices, dataElements.invoiceTableOptions, dataElements.invoiceColumns)
64
64
  ]
65
65
  },
66
+ metadata: {
67
+ type: 'List',
68
+ category: 'Business / List',
69
+ scopes: [
70
+ scene_model.TemplateScope.Slice
71
+ ]
72
+ },
66
73
  displayName: 'Data list page',
67
74
  description: 'A dataPage bound to one query, under a header that states the binding - the whole list screen in two elements.'
68
75
  };
@@ -100,6 +107,13 @@ var SampleBindingName = require('./SampleBindingName.js');
100
107
  ])
101
108
  ]
102
109
  },
110
+ metadata: {
111
+ type: 'List',
112
+ category: 'Business / Live operations',
113
+ scopes: [
114
+ scene_model.TemplateScope.Slice
115
+ ]
116
+ },
103
117
  displayName: 'Observable data list page',
104
118
  description: 'A live list over an observable query, which re-renders when the read model changes on the server.'
105
119
  };
@@ -171,6 +185,13 @@ var SampleBindingName = require('./SampleBindingName.js');
171
185
  ])
172
186
  ]
173
187
  },
188
+ metadata: {
189
+ type: 'Detail',
190
+ category: 'Business / Master detail',
191
+ scopes: [
192
+ scene_model.TemplateScope.Slice
193
+ ]
194
+ },
174
195
  displayName: 'Data list with detail page',
175
196
  description: 'A dataPage beside a detail region showing the selected record document and its history.'
176
197
  };
@@ -1 +1 @@
1
- {"version":3,"file":"listTemplates.js","sources":["../../../templates/listTemplates.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 { ScreenTemplate, WidthSizeClass } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, row, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { dataPage, invoiceColumns, invoiceTableOptions, observableDataTable } from './dataElements';\nimport { objectContentEditor, objectNavigationalBar, timeMachine } from './editorElements';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarGroup, toolbarSeparator } from './elements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The three list shapes an Arc application repeats: a list, a live list, and a list with the selected\n * record beside it.\n *\n * All three fill the application shell's `content` slot, which is the only slot the default blueprint's\n * `AppShell` layout declares for a screen - so an application that has picked the default blueprint can\n * drop any of these in without arranging anything.\n *\n * What makes them worth shipping is what is *already wired*. A list page is not \"a table in a slot\"; it is\n * a query name, a set of columns, an empty message, a data key, a filter field list, a header that states\n * what the page is bound to, and an action bar. Every one of those is a decision, and repeating all seven\n * per screen is how a list page ends up subtly different on every screen of an application.\n */\n\n/**\n * The archetype: a `dataPage` filling the body, under a header that says what it is bound to.\n *\n * `dataPage` is the single highest-leverage name `Cratis.Components` exposes - the library's whole\n * list-screen composite, with its title bar, menubar, filterable table and optional details pane driven\n * from one query. Building the same thing out of a `table` and a `toolbar` in a screen is pages of\n * modeling for a worse result, and this template is the answer to that: an application supplies a query\n * name and has a working list page.\n */\nexport const dataListPageTemplate: ScreenTemplate = {\n name: 'DataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader(\n 'data-list-header',\n { title: 'Invoices', subtitle: 'Every invoice, filterable and paged against the server', section: 'Billing', query: SampleBindingName.AllInvoices },\n [\n toolbar('data-list-actions', [\n toolbarButton('data-list-new', 'Register an invoice', 'pi pi-plus', 'New'),\n toolbarButton('data-list-refresh', 'Refresh', 'pi pi-refresh'),\n toolbarSeparator('data-list-separator'),\n toolbarGroup('data-list-export', [\n toolbarButton('data-list-download', 'Download as CSV', 'pi pi-download'),\n toolbarButton('data-list-print', 'Print', 'pi pi-print'),\n ]),\n ]),\n ],\n ),\n ],\n [TemplateSlotName.Body]: [dataPage('data-list-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n },\n displayName: 'Data list page',\n description: 'A dataPage bound to one query, under a header that states the binding - the whole list screen in two elements.',\n};\n\n/**\n * The live variant: the same page shape over an observable query.\n *\n * A separate template rather than a flag, for the same reason `observableDataTable` is a separate name\n * from `dataTable`: the difference lives in the *proxy* a host registers, not in how the page is\n * configured. An observable query opens a subscription and the page re-renders when the read model\n * changes on the server. Choosing this template is an application saying its data is live, and that is a\n * decision worth being able to read off the screen rather than infer from a property.\n */\nexport const observableDataListPageTemplate: ScreenTemplate = {\n name: 'ObservableDataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('observable-list-header', {\n title: 'Invoices in flight',\n subtitle: 'Updates as the read model changes - no refresh button, because there is nothing to refresh',\n section: 'Billing',\n query: SampleBindingName.InvoicesInFlight,\n }),\n ],\n [TemplateSlotName.Body]: [\n page('observable-list-body', 'In flight', [\n observableDataTable('observable-list-table', SampleBindingName.InvoicesInFlight, invoiceTableOptions, invoiceColumns),\n ]),\n ],\n },\n displayName: 'Observable data list page',\n description: 'A live list over an observable query, which re-renders when the read model changes on the server.',\n};\n\n/**\n * List plus detail: the whole list screen, with the selected record's document and history beside it.\n *\n * The detail region is built from the library's Arc-free editors, which is the interesting part. They read\n * their content out of the property bag rather than from a query, so this half of the page renders fully\n * at design time while the list half is still a placeholder - and in an event-sourced application the\n * record's *history* is as natural a thing to show as its current values, which is why the time machine is\n * here rather than in some optional extra.\n *\n * Its arrangement drops the detail column below the list at a compact width, because a document editor and\n * a paged table side by side on a phone are two unreadable slivers.\n */\nexport const dataListWithDetailPageTemplate: ScreenTemplate = {\n name: 'DataListWithDetailPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.SidePanel }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), row([slotLeaf(TemplateSlotName.Body, { grow: 2 }), slotLeaf(TemplateSlotName.SidePanel, { grow: 1 })], 16)]),\n overrides: [\n {\n width: WidthSizeClass.Compact,\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body), slotLeaf(TemplateSlotName.SidePanel)], 16),\n },\n ],\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('list-detail-header', {\n title: 'Invoices',\n subtitle: 'The list, with the selected invoice beside it',\n section: 'Billing',\n query: SampleBindingName.AllInvoices,\n }),\n ],\n [TemplateSlotName.Body]: [dataPage('list-detail-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n [TemplateSlotName.SidePanel]: [\n page('list-detail-panel', 'Selected invoice', [\n objectNavigationalBar('list-detail-trail'),\n objectContentEditor('list-detail-document', false),\n timeMachine('list-detail-history'),\n ]),\n ],\n },\n displayName: 'Data list with detail page',\n description: 'A dataPage beside a detail region showing the selected record document and its history.',\n};\n\n/** The three list-shaped templates. */\nexport const listTemplates: ScreenTemplate[] = [dataListPageTemplate, observableDataListPageTemplate, dataListWithDetailPageTemplate];\n"],"names":["dataListPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","content","arcPageHeader","title","subtitle","section","query","SampleBindingName","AllInvoices","toolbar","toolbarButton","toolbarSeparator","toolbarGroup","dataPage","invoiceTableOptions","invoiceColumns","displayName","description","observableDataListPageTemplate","InvoicesInFlight","page","observableDataTable","dataListWithDetailPageTemplate","SidePanel","arrangement","root","column","slotLeaf","row","grow","overrides","width","WidthSizeClass","Compact","objectNavigationalBar","objectContentEditor","timeMachine","listTemplates"],"mappings":"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"}
1
+ {"version":3,"file":"listTemplates.js","sources":["../../../templates/listTemplates.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 { ScreenTemplate, TemplateScope, WidthSizeClass } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, row, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { dataPage, invoiceColumns, invoiceTableOptions, observableDataTable } from './dataElements';\nimport { objectContentEditor, objectNavigationalBar, timeMachine } from './editorElements';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarGroup, toolbarSeparator } from './elements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The three list shapes an Arc application repeats: a list, a live list, and a list with the selected\n * record beside it.\n *\n * All three fill the application shell's `content` slot, which is the only slot the default blueprint's\n * `AppShell` layout declares for a screen - so an application that has picked the default blueprint can\n * drop any of these in without arranging anything.\n *\n * What makes them worth shipping is what is *already wired*. A list page is not \"a table in a slot\"; it is\n * a query name, a set of columns, an empty message, a data key, a filter field list, a header that states\n * what the page is bound to, and an action bar. Every one of those is a decision, and repeating all seven\n * per screen is how a list page ends up subtly different on every screen of an application.\n */\n\n/**\n * The archetype: a `dataPage` filling the body, under a header that says what it is bound to.\n *\n * `dataPage` is the single highest-leverage name `Cratis.Components` exposes - the library's whole\n * list-screen composite, with its title bar, menubar, filterable table and optional details pane driven\n * from one query. Building the same thing out of a `table` and a `toolbar` in a screen is pages of\n * modeling for a worse result, and this template is the answer to that: an application supplies a query\n * name and has a working list page.\n */\nexport const dataListPageTemplate: ScreenTemplate = {\n name: 'DataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader(\n 'data-list-header',\n { title: 'Invoices', subtitle: 'Every invoice, filterable and paged against the server', section: 'Billing', query: SampleBindingName.AllInvoices },\n [\n toolbar('data-list-actions', [\n toolbarButton('data-list-new', 'Register an invoice', 'pi pi-plus', 'New'),\n toolbarButton('data-list-refresh', 'Refresh', 'pi pi-refresh'),\n toolbarSeparator('data-list-separator'),\n toolbarGroup('data-list-export', [\n toolbarButton('data-list-download', 'Download as CSV', 'pi pi-download'),\n toolbarButton('data-list-print', 'Print', 'pi pi-print'),\n ]),\n ]),\n ],\n ),\n ],\n [TemplateSlotName.Body]: [dataPage('data-list-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n },\n metadata: { type: 'List', category: 'Business / List', scopes: [TemplateScope.Slice] },\n displayName: 'Data list page',\n description: 'A dataPage bound to one query, under a header that states the binding - the whole list screen in two elements.',\n};\n\n/**\n * The live variant: the same page shape over an observable query.\n *\n * A separate template rather than a flag, for the same reason `observableDataTable` is a separate name\n * from `dataTable`: the difference lives in the *proxy* a host registers, not in how the page is\n * configured. An observable query opens a subscription and the page re-renders when the read model\n * changes on the server. Choosing this template is an application saying its data is live, and that is a\n * decision worth being able to read off the screen rather than infer from a property.\n */\nexport const observableDataListPageTemplate: ScreenTemplate = {\n name: 'ObservableDataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('observable-list-header', {\n title: 'Invoices in flight',\n subtitle: 'Updates as the read model changes - no refresh button, because there is nothing to refresh',\n section: 'Billing',\n query: SampleBindingName.InvoicesInFlight,\n }),\n ],\n [TemplateSlotName.Body]: [\n page('observable-list-body', 'In flight', [\n observableDataTable('observable-list-table', SampleBindingName.InvoicesInFlight, invoiceTableOptions, invoiceColumns),\n ]),\n ],\n },\n metadata: { type: 'List', category: 'Business / Live operations', scopes: [TemplateScope.Slice] },\n displayName: 'Observable data list page',\n description: 'A live list over an observable query, which re-renders when the read model changes on the server.',\n};\n\n/**\n * List plus detail: the whole list screen, with the selected record's document and history beside it.\n *\n * The detail region is built from the library's Arc-free editors, which is the interesting part. They read\n * their content out of the property bag rather than from a query, so this half of the page renders fully\n * at design time while the list half is still a placeholder - and in an event-sourced application the\n * record's *history* is as natural a thing to show as its current values, which is why the time machine is\n * here rather than in some optional extra.\n *\n * Its arrangement drops the detail column below the list at a compact width, because a document editor and\n * a paged table side by side on a phone are two unreadable slivers.\n */\nexport const dataListWithDetailPageTemplate: ScreenTemplate = {\n name: 'DataListWithDetailPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.SidePanel }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), row([slotLeaf(TemplateSlotName.Body, { grow: 2 }), slotLeaf(TemplateSlotName.SidePanel, { grow: 1 })], 16)]),\n overrides: [\n {\n width: WidthSizeClass.Compact,\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body), slotLeaf(TemplateSlotName.SidePanel)], 16),\n },\n ],\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('list-detail-header', {\n title: 'Invoices',\n subtitle: 'The list, with the selected invoice beside it',\n section: 'Billing',\n query: SampleBindingName.AllInvoices,\n }),\n ],\n [TemplateSlotName.Body]: [dataPage('list-detail-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n [TemplateSlotName.SidePanel]: [\n page('list-detail-panel', 'Selected invoice', [\n objectNavigationalBar('list-detail-trail'),\n objectContentEditor('list-detail-document', false),\n timeMachine('list-detail-history'),\n ]),\n ],\n },\n metadata: { type: 'Detail', category: 'Business / Master detail', scopes: [TemplateScope.Slice] },\n displayName: 'Data list with detail page',\n description: 'A dataPage beside a detail region showing the selected record document and its history.',\n};\n\n/** The three list-shaped templates. */\nexport const listTemplates: ScreenTemplate[] = [dataListPageTemplate, observableDataListPageTemplate, dataListWithDetailPageTemplate];\n"],"names":["dataListPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","content","arcPageHeader","title","subtitle","section","query","SampleBindingName","AllInvoices","toolbar","toolbarButton","toolbarSeparator","toolbarGroup","dataPage","invoiceTableOptions","invoiceColumns","metadata","type","category","scopes","TemplateScope","Slice","displayName","description","observableDataListPageTemplate","InvoicesInFlight","page","observableDataTable","dataListWithDetailPageTemplate","SidePanel","arrangement","root","column","slotLeaf","row","grow","overrides","width","WidthSizeClass","Compact","objectNavigationalBar","objectContentEditor","timeMachine","listTemplates"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"commandTemplates.d.ts","sourceRoot":"","sources":["../../../templates/commandTemplates.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAyBrD,eAAO,MAAM,uBAAuB,EAAE,cA2BrC,CAAC;AAGF,eAAO,MAAM,gBAAgB,EAAE,cAAc,EAA8B,CAAC"}
1
+ {"version":3,"file":"commandTemplates.d.ts","sourceRoot":"","sources":["../../../templates/commandTemplates.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAiB,MAAM,qBAAqB,CAAC;AAyBpE,eAAO,MAAM,uBAAuB,EAAE,cA4BrC,CAAC;AAGF,eAAO,MAAM,gBAAgB,EAAE,cAAc,EAA8B,CAAC"}
@@ -1,3 +1,4 @@
1
+ import { TemplateScope } from '@cratis/scene.model';
1
2
  import { TemplateSlotName, column, slotLeaf, SlotName } from '@cratis/scene.blueprint.default';
2
3
  import { toolbar, toolbarButton, toolbarSeparator, page, arcPageHeader } from './elements.js';
3
4
  import { commandForm } from './formElements.js';
@@ -68,6 +69,13 @@ import { SampleBindingName } from './SampleBindingName.js';
68
69
  ])
69
70
  ]
70
71
  },
72
+ metadata: {
73
+ type: 'Form',
74
+ category: 'Business / Command',
75
+ scopes: [
76
+ TemplateScope.Slice
77
+ ]
78
+ },
71
79
  displayName: 'Command form page',
72
80
  description: 'A generated command form under a header that states the command, with its own action bar.'
73
81
  };
@@ -1 +1 @@
1
- {"version":3,"file":"commandTemplates.js","sources":["../../../templates/commandTemplates.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 { ScreenTemplate } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarSeparator } from './elements';\nimport { commandForm } from './formElements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The write side: a page whose body is one command, and whose action bar submits it.\n */\n\n/**\n * A command form page - a header, the generated form, and the bar that closes it.\n *\n * The form is `commandForm`, which is `AutoCommandForm`: it reads the command's own property descriptors\n * and picks a field component per property type. That is the whole reason a *template* can ship a form at\n * all. A template that listed fields by hand would be a snapshot of a command as it looked the day the\n * template was written, and would go quietly wrong the first time a property was added on the backend.\n * This one follows the command, which is the same guarantee Arc's generated proxies give everywhere else.\n *\n * `exclude` names the properties the form should not generate. `invoiceId` is excluded because it is the\n * event-source identity - Arc resolves it, and a form offering to type it in is offering to break it.\n *\n * The action bar is the template's rather than the form's, and it declares its own slot for that reason: a\n * screen replacing \"Register\" with \"Register and approve\" should not have to replace the form.\n */\nexport const commandFormPageTemplate: ScreenTemplate = {\n name: 'CommandFormPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body, { grow: 1 }), slotLeaf(TemplateSlotName.Actions)], 16),\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('command-form-header', {\n title: 'Register an invoice',\n subtitle: 'The form follows the command, so a property added on the backend shows up here',\n section: 'Billing',\n command: SampleBindingName.RegisterInvoice,\n }),\n ],\n [TemplateSlotName.Body]: [page('command-form-body', '', [commandForm('command-form', SampleBindingName.RegisterInvoice, ['invoiceId'])])],\n [TemplateSlotName.Actions]: [\n toolbar('command-form-actions', [\n toolbarButton('command-form-submit', 'Register the invoice', 'pi pi-check', 'Register'),\n toolbarSeparator('command-form-separator'),\n toolbarButton('command-form-cancel', 'Discard and go back', 'pi pi-times', 'Cancel'),\n ]),\n ],\n },\n displayName: 'Command form page',\n description: 'A generated command form under a header that states the command, with its own action bar.',\n};\n\n/** The command-shaped templates. */\nexport const commandTemplates: ScreenTemplate[] = [commandFormPageTemplate];\n"],"names":["commandFormPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","Actions","arrangement","root","column","slotLeaf","grow","content","arcPageHeader","title","subtitle","section","command","SampleBindingName","RegisterInvoice","page","commandForm","toolbar","toolbarButton","toolbarSeparator","displayName","description","commandTemplates"],"mappings":";;;;;AAAA;AACA;AAQA;;;;;;;;;;;;;;;;UAmBaA,uBAAAA,GAA0C;IACnDC,IAAAA,EAAM,iBAAA;AACNC,IAAAA,QAAAA,EAAUC,SAASC,OAAO;IAC1BC,KAAAA,EAAO;AAAC,QAAA;AAAEJ,YAAAA,IAAAA,EAAMK,iBAAiBC;AAAO,SAAA;AAAG,QAAA;AAAEN,YAAAA,IAAAA,EAAMK,iBAAiBE;AAAK,SAAA;AAAG,QAAA;AAAEP,YAAAA,IAAAA,EAAMK,iBAAiBG;AAAQ;AAAE,KAAA;IAC/GC,WAAAA,EAAa;AACTC,QAAAA,IAAAA,EAAMC,MAAAA,CAAO;AAACC,YAAAA,QAAAA,CAASP,iBAAiBC,MAAM,CAAA;YAAGM,QAAAA,CAASP,gBAAAA,CAAiBE,IAAI,EAAE;gBAAEM,IAAAA,EAAM;AAAE,aAAA,CAAA;AAAID,YAAAA,QAAAA,CAASP,iBAAiBG,OAAO;SAAE,EAAE,EAAA;AACxI,KAAA;IACAM,OAAAA,EAAS;QACL,CAACT,gBAAAA,CAAiBC,MAAM,GAAG;AACvBS,YAAAA,aAAAA,CAAc,qBAAA,EAAuB;gBACjCC,KAAAA,EAAO,qBAAA;gBACPC,QAAAA,EAAU,gFAAA;gBACVC,OAAAA,EAAS,SAAA;AACTC,gBAAAA,OAAAA,EAASC,kBAAkBC;AAC/B,aAAA;AACH,SAAA;QACD,CAAChB,gBAAAA,CAAiBE,IAAI,GAAG;AAACe,YAAAA,IAAAA,CAAK,qBAAqB,EAAA,EAAI;gBAACC,WAAAA,CAAY,cAAA,EAAgBH,iBAAAA,CAAkBC,eAAe,EAAE;AAAC,oBAAA;AAAY,iBAAA;AAAE,aAAA;AAAE,SAAA;QACzI,CAAChB,gBAAAA,CAAiBG,OAAO,GAAG;AACxBgB,YAAAA,OAAAA,CAAQ,sBAAA,EAAwB;gBAC5BC,aAAAA,CAAc,qBAAA,EAAuB,wBAAwB,aAAA,EAAe,UAAA,CAAA;gBAC5EC,gBAAAA,CAAiB,wBAAA,CAAA;gBACjBD,aAAAA,CAAc,qBAAA,EAAuB,uBAAuB,aAAA,EAAe,QAAA;AAC9E,aAAA;AACJ;AACL,KAAA;IACAE,WAAAA,EAAa,mBAAA;IACbC,WAAAA,EAAa;AACjB;AAEA,qCACO,MAAMC,gBAAAA,GAAqC;AAAC9B,IAAAA;;;"}
1
+ {"version":3,"file":"commandTemplates.js","sources":["../../../templates/commandTemplates.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 { ScreenTemplate, TemplateScope } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarSeparator } from './elements';\nimport { commandForm } from './formElements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The write side: a page whose body is one command, and whose action bar submits it.\n */\n\n/**\n * A command form page - a header, the generated form, and the bar that closes it.\n *\n * The form is `commandForm`, which is `AutoCommandForm`: it reads the command's own property descriptors\n * and picks a field component per property type. That is the whole reason a *template* can ship a form at\n * all. A template that listed fields by hand would be a snapshot of a command as it looked the day the\n * template was written, and would go quietly wrong the first time a property was added on the backend.\n * This one follows the command, which is the same guarantee Arc's generated proxies give everywhere else.\n *\n * `exclude` names the properties the form should not generate. `invoiceId` is excluded because it is the\n * event-source identity - Arc resolves it, and a form offering to type it in is offering to break it.\n *\n * The action bar is the template's rather than the form's, and it declares its own slot for that reason: a\n * screen replacing \"Register\" with \"Register and approve\" should not have to replace the form.\n */\nexport const commandFormPageTemplate: ScreenTemplate = {\n name: 'CommandFormPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body, { grow: 1 }), slotLeaf(TemplateSlotName.Actions)], 16),\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('command-form-header', {\n title: 'Register an invoice',\n subtitle: 'The form follows the command, so a property added on the backend shows up here',\n section: 'Billing',\n command: SampleBindingName.RegisterInvoice,\n }),\n ],\n [TemplateSlotName.Body]: [page('command-form-body', '', [commandForm('command-form', SampleBindingName.RegisterInvoice, ['invoiceId'])])],\n [TemplateSlotName.Actions]: [\n toolbar('command-form-actions', [\n toolbarButton('command-form-submit', 'Register the invoice', 'pi pi-check', 'Register'),\n toolbarSeparator('command-form-separator'),\n toolbarButton('command-form-cancel', 'Discard and go back', 'pi pi-times', 'Cancel'),\n ]),\n ],\n },\n metadata: { type: 'Form', category: 'Business / Command', scopes: [TemplateScope.Slice] },\n displayName: 'Command form page',\n description: 'A generated command form under a header that states the command, with its own action bar.',\n};\n\n/** The command-shaped templates. */\nexport const commandTemplates: ScreenTemplate[] = [commandFormPageTemplate];\n"],"names":["commandFormPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","Actions","arrangement","root","column","slotLeaf","grow","content","arcPageHeader","title","subtitle","section","command","SampleBindingName","RegisterInvoice","page","commandForm","toolbar","toolbarButton","toolbarSeparator","metadata","type","category","scopes","TemplateScope","Slice","displayName","description","commandTemplates"],"mappings":";;;;;;AAAA;AACA;AAQA;;;;;;;;;;;;;;;;UAmBaA,uBAAAA,GAA0C;IACnDC,IAAAA,EAAM,iBAAA;AACNC,IAAAA,QAAAA,EAAUC,SAASC,OAAO;IAC1BC,KAAAA,EAAO;AAAC,QAAA;AAAEJ,YAAAA,IAAAA,EAAMK,iBAAiBC;AAAO,SAAA;AAAG,QAAA;AAAEN,YAAAA,IAAAA,EAAMK,iBAAiBE;AAAK,SAAA;AAAG,QAAA;AAAEP,YAAAA,IAAAA,EAAMK,iBAAiBG;AAAQ;AAAE,KAAA;IAC/GC,WAAAA,EAAa;AACTC,QAAAA,IAAAA,EAAMC,MAAAA,CAAO;AAACC,YAAAA,QAAAA,CAASP,iBAAiBC,MAAM,CAAA;YAAGM,QAAAA,CAASP,gBAAAA,CAAiBE,IAAI,EAAE;gBAAEM,IAAAA,EAAM;AAAE,aAAA,CAAA;AAAID,YAAAA,QAAAA,CAASP,iBAAiBG,OAAO;SAAE,EAAE,EAAA;AACxI,KAAA;IACAM,OAAAA,EAAS;QACL,CAACT,gBAAAA,CAAiBC,MAAM,GAAG;AACvBS,YAAAA,aAAAA,CAAc,qBAAA,EAAuB;gBACjCC,KAAAA,EAAO,qBAAA;gBACPC,QAAAA,EAAU,gFAAA;gBACVC,OAAAA,EAAS,SAAA;AACTC,gBAAAA,OAAAA,EAASC,kBAAkBC;AAC/B,aAAA;AACH,SAAA;QACD,CAAChB,gBAAAA,CAAiBE,IAAI,GAAG;AAACe,YAAAA,IAAAA,CAAK,qBAAqB,EAAA,EAAI;gBAACC,WAAAA,CAAY,cAAA,EAAgBH,iBAAAA,CAAkBC,eAAe,EAAE;AAAC,oBAAA;AAAY,iBAAA;AAAE,aAAA;AAAE,SAAA;QACzI,CAAChB,gBAAAA,CAAiBG,OAAO,GAAG;AACxBgB,YAAAA,OAAAA,CAAQ,sBAAA,EAAwB;gBAC5BC,aAAAA,CAAc,qBAAA,EAAuB,wBAAwB,aAAA,EAAe,UAAA,CAAA;gBAC5EC,gBAAAA,CAAiB,wBAAA,CAAA;gBACjBD,aAAAA,CAAc,qBAAA,EAAuB,uBAAuB,aAAA,EAAe,QAAA;AAC9E,aAAA;AACJ;AACL,KAAA;IACAE,QAAAA,EAAU;QAAEC,IAAAA,EAAM,MAAA;QAAQC,QAAAA,EAAU,oBAAA;QAAsBC,MAAAA,EAAQ;AAACC,YAAAA,aAAAA,CAAcC;AAAM;AAAC,KAAA;IACxFC,WAAAA,EAAa,mBAAA;IACbC,WAAAA,EAAa;AACjB;AAEA,qCACO,MAAMC,gBAAAA,GAAqC;AAACpC,IAAAA;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"listTemplates.d.ts","sourceRoot":"","sources":["../../../templates/listTemplates.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAkB,MAAM,qBAAqB,CAAC;AA8BrE,eAAO,MAAM,oBAAoB,EAAE,cA0BlC,CAAC;AAWF,eAAO,MAAM,8BAA8B,EAAE,cAqB5C,CAAC;AAcF,eAAO,MAAM,8BAA8B,EAAE,cAiC5C,CAAC;AAGF,eAAO,MAAM,aAAa,EAAE,cAAc,EAA2F,CAAC"}
1
+ {"version":3,"file":"listTemplates.d.ts","sourceRoot":"","sources":["../../../templates/listTemplates.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAiC,MAAM,qBAAqB,CAAC;AA8BpF,eAAO,MAAM,oBAAoB,EAAE,cA2BlC,CAAC;AAWF,eAAO,MAAM,8BAA8B,EAAE,cAsB5C,CAAC;AAcF,eAAO,MAAM,8BAA8B,EAAE,cAkC5C,CAAC;AAGF,eAAO,MAAM,aAAa,EAAE,cAAc,EAA2F,CAAC"}
@@ -1,4 +1,4 @@
1
- import { WidthSizeClass } from '@cratis/scene.model';
1
+ import { TemplateScope, WidthSizeClass } from '@cratis/scene.model';
2
2
  import { TemplateSlotName, SlotName, column, slotLeaf, row } from '@cratis/scene.blueprint.default';
3
3
  import { dataPage, observableDataTable, invoiceTableOptions, invoiceColumns } from './dataElements.js';
4
4
  import { objectNavigationalBar, objectContentEditor, timeMachine } from './editorElements.js';
@@ -61,6 +61,13 @@ import { SampleBindingName } from './SampleBindingName.js';
61
61
  dataPage('data-list-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)
62
62
  ]
63
63
  },
64
+ metadata: {
65
+ type: 'List',
66
+ category: 'Business / List',
67
+ scopes: [
68
+ TemplateScope.Slice
69
+ ]
70
+ },
64
71
  displayName: 'Data list page',
65
72
  description: 'A dataPage bound to one query, under a header that states the binding - the whole list screen in two elements.'
66
73
  };
@@ -98,6 +105,13 @@ import { SampleBindingName } from './SampleBindingName.js';
98
105
  ])
99
106
  ]
100
107
  },
108
+ metadata: {
109
+ type: 'List',
110
+ category: 'Business / Live operations',
111
+ scopes: [
112
+ TemplateScope.Slice
113
+ ]
114
+ },
101
115
  displayName: 'Observable data list page',
102
116
  description: 'A live list over an observable query, which re-renders when the read model changes on the server.'
103
117
  };
@@ -169,6 +183,13 @@ import { SampleBindingName } from './SampleBindingName.js';
169
183
  ])
170
184
  ]
171
185
  },
186
+ metadata: {
187
+ type: 'Detail',
188
+ category: 'Business / Master detail',
189
+ scopes: [
190
+ TemplateScope.Slice
191
+ ]
192
+ },
172
193
  displayName: 'Data list with detail page',
173
194
  description: 'A dataPage beside a detail region showing the selected record document and its history.'
174
195
  };
@@ -1 +1 @@
1
- {"version":3,"file":"listTemplates.js","sources":["../../../templates/listTemplates.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 { ScreenTemplate, WidthSizeClass } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, row, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { dataPage, invoiceColumns, invoiceTableOptions, observableDataTable } from './dataElements';\nimport { objectContentEditor, objectNavigationalBar, timeMachine } from './editorElements';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarGroup, toolbarSeparator } from './elements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The three list shapes an Arc application repeats: a list, a live list, and a list with the selected\n * record beside it.\n *\n * All three fill the application shell's `content` slot, which is the only slot the default blueprint's\n * `AppShell` layout declares for a screen - so an application that has picked the default blueprint can\n * drop any of these in without arranging anything.\n *\n * What makes them worth shipping is what is *already wired*. A list page is not \"a table in a slot\"; it is\n * a query name, a set of columns, an empty message, a data key, a filter field list, a header that states\n * what the page is bound to, and an action bar. Every one of those is a decision, and repeating all seven\n * per screen is how a list page ends up subtly different on every screen of an application.\n */\n\n/**\n * The archetype: a `dataPage` filling the body, under a header that says what it is bound to.\n *\n * `dataPage` is the single highest-leverage name `Cratis.Components` exposes - the library's whole\n * list-screen composite, with its title bar, menubar, filterable table and optional details pane driven\n * from one query. Building the same thing out of a `table` and a `toolbar` in a screen is pages of\n * modeling for a worse result, and this template is the answer to that: an application supplies a query\n * name and has a working list page.\n */\nexport const dataListPageTemplate: ScreenTemplate = {\n name: 'DataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader(\n 'data-list-header',\n { title: 'Invoices', subtitle: 'Every invoice, filterable and paged against the server', section: 'Billing', query: SampleBindingName.AllInvoices },\n [\n toolbar('data-list-actions', [\n toolbarButton('data-list-new', 'Register an invoice', 'pi pi-plus', 'New'),\n toolbarButton('data-list-refresh', 'Refresh', 'pi pi-refresh'),\n toolbarSeparator('data-list-separator'),\n toolbarGroup('data-list-export', [\n toolbarButton('data-list-download', 'Download as CSV', 'pi pi-download'),\n toolbarButton('data-list-print', 'Print', 'pi pi-print'),\n ]),\n ]),\n ],\n ),\n ],\n [TemplateSlotName.Body]: [dataPage('data-list-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n },\n displayName: 'Data list page',\n description: 'A dataPage bound to one query, under a header that states the binding - the whole list screen in two elements.',\n};\n\n/**\n * The live variant: the same page shape over an observable query.\n *\n * A separate template rather than a flag, for the same reason `observableDataTable` is a separate name\n * from `dataTable`: the difference lives in the *proxy* a host registers, not in how the page is\n * configured. An observable query opens a subscription and the page re-renders when the read model\n * changes on the server. Choosing this template is an application saying its data is live, and that is a\n * decision worth being able to read off the screen rather than infer from a property.\n */\nexport const observableDataListPageTemplate: ScreenTemplate = {\n name: 'ObservableDataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('observable-list-header', {\n title: 'Invoices in flight',\n subtitle: 'Updates as the read model changes - no refresh button, because there is nothing to refresh',\n section: 'Billing',\n query: SampleBindingName.InvoicesInFlight,\n }),\n ],\n [TemplateSlotName.Body]: [\n page('observable-list-body', 'In flight', [\n observableDataTable('observable-list-table', SampleBindingName.InvoicesInFlight, invoiceTableOptions, invoiceColumns),\n ]),\n ],\n },\n displayName: 'Observable data list page',\n description: 'A live list over an observable query, which re-renders when the read model changes on the server.',\n};\n\n/**\n * List plus detail: the whole list screen, with the selected record's document and history beside it.\n *\n * The detail region is built from the library's Arc-free editors, which is the interesting part. They read\n * their content out of the property bag rather than from a query, so this half of the page renders fully\n * at design time while the list half is still a placeholder - and in an event-sourced application the\n * record's *history* is as natural a thing to show as its current values, which is why the time machine is\n * here rather than in some optional extra.\n *\n * Its arrangement drops the detail column below the list at a compact width, because a document editor and\n * a paged table side by side on a phone are two unreadable slivers.\n */\nexport const dataListWithDetailPageTemplate: ScreenTemplate = {\n name: 'DataListWithDetailPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.SidePanel }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), row([slotLeaf(TemplateSlotName.Body, { grow: 2 }), slotLeaf(TemplateSlotName.SidePanel, { grow: 1 })], 16)]),\n overrides: [\n {\n width: WidthSizeClass.Compact,\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body), slotLeaf(TemplateSlotName.SidePanel)], 16),\n },\n ],\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('list-detail-header', {\n title: 'Invoices',\n subtitle: 'The list, with the selected invoice beside it',\n section: 'Billing',\n query: SampleBindingName.AllInvoices,\n }),\n ],\n [TemplateSlotName.Body]: [dataPage('list-detail-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n [TemplateSlotName.SidePanel]: [\n page('list-detail-panel', 'Selected invoice', [\n objectNavigationalBar('list-detail-trail'),\n objectContentEditor('list-detail-document', false),\n timeMachine('list-detail-history'),\n ]),\n ],\n },\n displayName: 'Data list with detail page',\n description: 'A dataPage beside a detail region showing the selected record document and its history.',\n};\n\n/** The three list-shaped templates. */\nexport const listTemplates: ScreenTemplate[] = [dataListPageTemplate, observableDataListPageTemplate, dataListWithDetailPageTemplate];\n"],"names":["dataListPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","content","arcPageHeader","title","subtitle","section","query","SampleBindingName","AllInvoices","toolbar","toolbarButton","toolbarSeparator","toolbarGroup","dataPage","invoiceTableOptions","invoiceColumns","displayName","description","observableDataListPageTemplate","InvoicesInFlight","page","observableDataTable","dataListWithDetailPageTemplate","SidePanel","arrangement","root","column","slotLeaf","row","grow","overrides","width","WidthSizeClass","Compact","objectNavigationalBar","objectContentEditor","timeMachine","listTemplates"],"mappings":"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"}
1
+ {"version":3,"file":"listTemplates.js","sources":["../../../templates/listTemplates.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 { ScreenTemplate, TemplateScope, WidthSizeClass } from '@cratis/scene.model';\nimport { SlotName, TemplateSlotName, column, row, slotLeaf } from '@cratis/scene.blueprint.default';\nimport { dataPage, invoiceColumns, invoiceTableOptions, observableDataTable } from './dataElements';\nimport { objectContentEditor, objectNavigationalBar, timeMachine } from './editorElements';\nimport { arcPageHeader, page, toolbar, toolbarButton, toolbarGroup, toolbarSeparator } from './elements';\nimport { SampleBindingName } from './SampleBindingName';\n\n/**\n * The three list shapes an Arc application repeats: a list, a live list, and a list with the selected\n * record beside it.\n *\n * All three fill the application shell's `content` slot, which is the only slot the default blueprint's\n * `AppShell` layout declares for a screen - so an application that has picked the default blueprint can\n * drop any of these in without arranging anything.\n *\n * What makes them worth shipping is what is *already wired*. A list page is not \"a table in a slot\"; it is\n * a query name, a set of columns, an empty message, a data key, a filter field list, a header that states\n * what the page is bound to, and an action bar. Every one of those is a decision, and repeating all seven\n * per screen is how a list page ends up subtly different on every screen of an application.\n */\n\n/**\n * The archetype: a `dataPage` filling the body, under a header that says what it is bound to.\n *\n * `dataPage` is the single highest-leverage name `Cratis.Components` exposes - the library's whole\n * list-screen composite, with its title bar, menubar, filterable table and optional details pane driven\n * from one query. Building the same thing out of a `table` and a `toolbar` in a screen is pages of\n * modeling for a worse result, and this template is the answer to that: an application supplies a query\n * name and has a working list page.\n */\nexport const dataListPageTemplate: ScreenTemplate = {\n name: 'DataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader(\n 'data-list-header',\n { title: 'Invoices', subtitle: 'Every invoice, filterable and paged against the server', section: 'Billing', query: SampleBindingName.AllInvoices },\n [\n toolbar('data-list-actions', [\n toolbarButton('data-list-new', 'Register an invoice', 'pi pi-plus', 'New'),\n toolbarButton('data-list-refresh', 'Refresh', 'pi pi-refresh'),\n toolbarSeparator('data-list-separator'),\n toolbarGroup('data-list-export', [\n toolbarButton('data-list-download', 'Download as CSV', 'pi pi-download'),\n toolbarButton('data-list-print', 'Print', 'pi pi-print'),\n ]),\n ]),\n ],\n ),\n ],\n [TemplateSlotName.Body]: [dataPage('data-list-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n },\n metadata: { type: 'List', category: 'Business / List', scopes: [TemplateScope.Slice] },\n displayName: 'Data list page',\n description: 'A dataPage bound to one query, under a header that states the binding - the whole list screen in two elements.',\n};\n\n/**\n * The live variant: the same page shape over an observable query.\n *\n * A separate template rather than a flag, for the same reason `observableDataTable` is a separate name\n * from `dataTable`: the difference lives in the *proxy* a host registers, not in how the page is\n * configured. An observable query opens a subscription and the page re-renders when the read model\n * changes on the server. Choosing this template is an application saying its data is live, and that is a\n * decision worth being able to read off the screen rather than infer from a property.\n */\nexport const observableDataListPageTemplate: ScreenTemplate = {\n name: 'ObservableDataListPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }],\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('observable-list-header', {\n title: 'Invoices in flight',\n subtitle: 'Updates as the read model changes - no refresh button, because there is nothing to refresh',\n section: 'Billing',\n query: SampleBindingName.InvoicesInFlight,\n }),\n ],\n [TemplateSlotName.Body]: [\n page('observable-list-body', 'In flight', [\n observableDataTable('observable-list-table', SampleBindingName.InvoicesInFlight, invoiceTableOptions, invoiceColumns),\n ]),\n ],\n },\n metadata: { type: 'List', category: 'Business / Live operations', scopes: [TemplateScope.Slice] },\n displayName: 'Observable data list page',\n description: 'A live list over an observable query, which re-renders when the read model changes on the server.',\n};\n\n/**\n * List plus detail: the whole list screen, with the selected record's document and history beside it.\n *\n * The detail region is built from the library's Arc-free editors, which is the interesting part. They read\n * their content out of the property bag rather than from a query, so this half of the page renders fully\n * at design time while the list half is still a placeholder - and in an event-sourced application the\n * record's *history* is as natural a thing to show as its current values, which is why the time machine is\n * here rather than in some optional extra.\n *\n * Its arrangement drops the detail column below the list at a compact width, because a document editor and\n * a paged table side by side on a phone are two unreadable slivers.\n */\nexport const dataListWithDetailPageTemplate: ScreenTemplate = {\n name: 'DataListWithDetailPage',\n fitsSlot: SlotName.Content,\n slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.SidePanel }],\n arrangement: {\n root: column([slotLeaf(TemplateSlotName.Header), row([slotLeaf(TemplateSlotName.Body, { grow: 2 }), slotLeaf(TemplateSlotName.SidePanel, { grow: 1 })], 16)]),\n overrides: [\n {\n width: WidthSizeClass.Compact,\n root: column([slotLeaf(TemplateSlotName.Header), slotLeaf(TemplateSlotName.Body), slotLeaf(TemplateSlotName.SidePanel)], 16),\n },\n ],\n },\n content: {\n [TemplateSlotName.Header]: [\n arcPageHeader('list-detail-header', {\n title: 'Invoices',\n subtitle: 'The list, with the selected invoice beside it',\n section: 'Billing',\n query: SampleBindingName.AllInvoices,\n }),\n ],\n [TemplateSlotName.Body]: [dataPage('list-detail-body', SampleBindingName.AllInvoices, invoiceTableOptions, invoiceColumns)],\n [TemplateSlotName.SidePanel]: [\n page('list-detail-panel', 'Selected invoice', [\n objectNavigationalBar('list-detail-trail'),\n objectContentEditor('list-detail-document', false),\n timeMachine('list-detail-history'),\n ]),\n ],\n },\n metadata: { type: 'Detail', category: 'Business / Master detail', scopes: [TemplateScope.Slice] },\n displayName: 'Data list with detail page',\n description: 'A dataPage beside a detail region showing the selected record document and its history.',\n};\n\n/** The three list-shaped templates. */\nexport const listTemplates: ScreenTemplate[] = [dataListPageTemplate, observableDataListPageTemplate, dataListWithDetailPageTemplate];\n"],"names":["dataListPageTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Header","Body","content","arcPageHeader","title","subtitle","section","query","SampleBindingName","AllInvoices","toolbar","toolbarButton","toolbarSeparator","toolbarGroup","dataPage","invoiceTableOptions","invoiceColumns","metadata","type","category","scopes","TemplateScope","Slice","displayName","description","observableDataListPageTemplate","InvoicesInFlight","page","observableDataTable","dataListWithDetailPageTemplate","SidePanel","arrangement","root","column","slotLeaf","row","grow","overrides","width","WidthSizeClass","Compact","objectNavigationalBar","objectContentEditor","timeMachine","listTemplates"],"mappings":"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"}