@cratis/scene.blueprint.default 0.1.0

package/dist/cjs/gallery/statusTemplates.js

@@ -0,0 +1,190 @@
+'use strict';
+
+var ComponentName = require('../ComponentName.js');
+var SlotName = require('../layouts/SlotName.js');
+require('@cratis/scene.model');
+require('../layouts/shellComponents.js');
+require('../layouts/appShell.js');
+require('../layouts/fullPage.js');
+var TemplateSlotName = require('./TemplateSlotName.js');
+var elements = require('./elements.js');
+var widgets = require('./widgets.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The four screens that are not part of anyone's plan: a server error, a refusal, a wrong address, and the
+ * page that has to sell the product before any of the others exist.
+ *
+ * They use the full-page layout for the same reason the sign-in screens do - none of them has navigation
+ * to render - and they matter more than their frequency suggests. An error page is the screen most likely
+ * to be someone's first impression of how carefully an application was built.
+ */ /** Something broke on our side. */ const errorTemplate = {
+    name: 'Error',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.card('error-card', [
+                elements.externalComponent('error-tag', 'tag', {
+                    value: '500',
+                    severity: 'danger'
+                }),
+                elements.text('error-title', 'Something went wrong on our side'),
+                elements.text('error-message', 'The team has been told. Try again in a moment - nothing you were working on was lost.'),
+                elements.panel('error-actions', [
+                    elements.button('error-retry', 'Try again', {
+                        severity: 'primary'
+                    }),
+                    elements.button('error-home', 'Back to the dashboard', {
+                        severity: 'secondary',
+                        targetScreen: 'Dashboard'
+                    })
+                ])
+            ])
+        ]
+    },
+    displayName: 'Error',
+    description: 'A server-side failure, said plainly, with a way onward.'
+};
+/** Signed in, and still not allowed. */ const accessDeniedTemplate = {
+    name: 'AccessDenied',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.card('denied-card', [
+                elements.externalComponent('denied-tag', 'tag', {
+                    value: '403',
+                    severity: 'warning'
+                }),
+                elements.text('denied-title', 'You do not have access to this'),
+                elements.text('denied-message', 'Your account is signed in, but it is not allowed here. An administrator can change that.'),
+                elements.panel('denied-actions', [
+                    elements.button('denied-request', 'Request access', {
+                        severity: 'primary'
+                    }),
+                    elements.button('denied-home', 'Back to the dashboard', {
+                        severity: 'secondary',
+                        targetScreen: 'Dashboard'
+                    })
+                ])
+            ])
+        ]
+    },
+    displayName: 'Access denied',
+    description: 'A refusal that distinguishes "not signed in" from "not allowed".'
+};
+/** No such address. */ const notFoundTemplate = {
+    name: 'NotFound',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.card('not-found-card', [
+                elements.externalComponent('not-found-tag', 'tag', {
+                    value: '404',
+                    severity: 'info'
+                }),
+                elements.text('not-found-title', 'That page is not here'),
+                elements.text('not-found-message', 'The link may be old, or the thing it pointed at may have been removed.'),
+                elements.externalComponent('not-found-search', 'inputText', {
+                    placeholder: 'Search instead'
+                }),
+                elements.button('not-found-home', 'Back to the dashboard', {
+                    severity: 'secondary',
+                    targetScreen: 'Dashboard'
+                })
+            ])
+        ]
+    },
+    displayName: 'Not found',
+    description: 'A wrong address, with a search box rather than a dead end.'
+};
+/** The page that has to do the selling. */ const landingTemplate = {
+    name: 'Landing',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Header
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Actions
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Header]: [
+            elements.panel('landing-nav', [
+                elements.externalComponent('landing-logo', ComponentName.ComponentName.Logo, {
+                    label: 'Contoso',
+                    initials: 'C'
+                }),
+                elements.button('landing-signin', 'Sign in', {
+                    severity: 'secondary',
+                    targetScreen: 'Login'
+                }),
+                elements.button('landing-start', 'Start free', {
+                    severity: 'primary',
+                    targetScreen: 'Register'
+                })
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.card('landing-hero', [
+                elements.text('landing-headline', 'Ship the shell on day one'),
+                elements.text('landing-subhead', 'Eight menu modes, twenty screen templates and two themes, in one blueprint an application picks once.'),
+                elements.button('landing-cta', 'Start free', {
+                    severity: 'primary',
+                    targetScreen: 'Register'
+                })
+            ]),
+            widgets.widget('landing-feature-modes', 'Every mode people expect', [
+                elements.text('landing-modes-text', 'Static, overlay, slim, slim+, compact, horizontal, reveal and drawer.')
+            ]),
+            widgets.widget('landing-feature-themes', 'Themeable to the token', [
+                elements.text('landing-themes-text', 'Ten semantic tokens define the whole shell. Swap them and everything follows.')
+            ]),
+            widgets.widget('landing-feature-templates', 'The pages you were going to build anyway', [
+                elements.text('landing-templates-text', 'Dashboard, list, detail, form, invoice, settings, help - and every screen around signing in.')
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Actions]: [
+            elements.panel('landing-footer', [
+                elements.text('landing-copyright', '© Contoso'),
+                elements.button('landing-contact', 'Talk to us', {
+                    severity: 'secondary'
+                })
+            ])
+        ]
+    },
+    displayName: 'Landing',
+    description: 'The marketing front door, with its own navigation because it has no application chrome.'
+};
+/** The four status and marketing templates. */ const statusTemplates = [
+    errorTemplate,
+    accessDeniedTemplate,
+    notFoundTemplate,
+    landingTemplate
+];
+
+exports.accessDeniedTemplate = accessDeniedTemplate;
+exports.errorTemplate = errorTemplate;
+exports.landingTemplate = landingTemplate;
+exports.notFoundTemplate = notFoundTemplate;
+exports.statusTemplates = statusTemplates;
+//# sourceMappingURL=statusTemplates.js.map

package/dist/cjs/gallery/statusTemplates.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"statusTemplates.js","sources":["../../../gallery/statusTemplates.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 { ComponentName } from '../ComponentName';\nimport { SlotName } from '../layouts';\nimport { TemplateSlotName } from './TemplateSlotName';\nimport { button, card, externalComponent, panel, text } from './elements';\nimport { widget } from './widgets';\n\n/**\n * The four screens that are not part of anyone's plan: a server error, a refusal, a wrong address, and the\n * page that has to sell the product before any of the others exist.\n *\n * They use the full-page layout for the same reason the sign-in screens do - none of them has navigation\n * to render - and they matter more than their frequency suggests. An error page is the screen most likely\n * to be someone's first impression of how carefully an application was built.\n */\n\n/** Something broke on our side. */\nexport const errorTemplate: ScreenTemplate = {\n    name: 'Error',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Body]: [\n            card('error-card', [\n                externalComponent('error-tag', 'tag', { value: '500', severity: 'danger' }),\n                text('error-title', 'Something went wrong on our side'),\n                text('error-message', 'The team has been told. Try again in a moment - nothing you were working on was lost.'),\n                panel('error-actions', [\n                    button('error-retry', 'Try again', { severity: 'primary' }),\n                    button('error-home', 'Back to the dashboard', { severity: 'secondary', targetScreen: 'Dashboard' }),\n                ]),\n            ]),\n        ],\n    },\n    displayName: 'Error',\n    description: 'A server-side failure, said plainly, with a way onward.',\n};\n\n/** Signed in, and still not allowed. */\nexport const accessDeniedTemplate: ScreenTemplate = {\n    name: 'AccessDenied',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Body]: [\n            card('denied-card', [\n                externalComponent('denied-tag', 'tag', { value: '403', severity: 'warning' }),\n                text('denied-title', 'You do not have access to this'),\n                text('denied-message', 'Your account is signed in, but it is not allowed here. An administrator can change that.'),\n                panel('denied-actions', [\n                    button('denied-request', 'Request access', { severity: 'primary' }),\n                    button('denied-home', 'Back to the dashboard', { severity: 'secondary', targetScreen: 'Dashboard' }),\n                ]),\n            ]),\n        ],\n    },\n    displayName: 'Access denied',\n    description: 'A refusal that distinguishes \"not signed in\" from \"not allowed\".',\n};\n\n/** No such address. */\nexport const notFoundTemplate: ScreenTemplate = {\n    name: 'NotFound',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Body]: [\n            card('not-found-card', [\n                externalComponent('not-found-tag', 'tag', { value: '404', severity: 'info' }),\n                text('not-found-title', 'That page is not here'),\n                text('not-found-message', 'The link may be old, or the thing it pointed at may have been removed.'),\n                externalComponent('not-found-search', 'inputText', { placeholder: 'Search instead' }),\n                button('not-found-home', 'Back to the dashboard', { severity: 'secondary', targetScreen: 'Dashboard' }),\n            ]),\n        ],\n    },\n    displayName: 'Not found',\n    description: 'A wrong address, with a search box rather than a dead end.',\n};\n\n/** The page that has to do the selling. */\nexport const landingTemplate: ScreenTemplate = {\n    name: 'Landing',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n    content: {\n        [TemplateSlotName.Header]: [\n            panel('landing-nav', [\n                externalComponent('landing-logo', ComponentName.Logo, { label: 'Contoso', initials: 'C' }),\n                button('landing-signin', 'Sign in', { severity: 'secondary', targetScreen: 'Login' }),\n                button('landing-start', 'Start free', { severity: 'primary', targetScreen: 'Register' }),\n            ]),\n        ],\n        [TemplateSlotName.Body]: [\n            card('landing-hero', [\n                text('landing-headline', 'Ship the shell on day one'),\n                text('landing-subhead', 'Eight menu modes, twenty screen templates and two themes, in one blueprint an application picks once.'),\n                button('landing-cta', 'Start free', { severity: 'primary', targetScreen: 'Register' }),\n            ]),\n            widget('landing-feature-modes', 'Every mode people expect', [text('landing-modes-text', 'Static, overlay, slim, slim+, compact, horizontal, reveal and drawer.')]),\n            widget('landing-feature-themes', 'Themeable to the token', [text('landing-themes-text', 'Ten semantic tokens define the whole shell. Swap them and everything follows.')]),\n            widget('landing-feature-templates', 'The pages you were going to build anyway', [\n                text('landing-templates-text', 'Dashboard, list, detail, form, invoice, settings, help - and every screen around signing in.'),\n            ]),\n        ],\n        [TemplateSlotName.Actions]: [\n            panel('landing-footer', [text('landing-copyright', '© Contoso'), button('landing-contact', 'Talk to us', { severity: 'secondary' })]),\n        ],\n    },\n    displayName: 'Landing',\n    description: 'The marketing front door, with its own navigation because it has no application chrome.',\n};\n\n/** The four status and marketing templates. */\nexport const statusTemplates: ScreenTemplate[] = [errorTemplate, accessDeniedTemplate, notFoundTemplate, landingTemplate];\n"],"names":["errorTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","Body","content","card","externalComponent","value","severity","text","panel","button","targetScreen","displayName","description","accessDeniedTemplate","notFoundTemplate","placeholder","landingTemplate","Header","Actions","ComponentName","Logo","label","initials","widget","statusTemplates"],"mappings":"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"}

package/dist/cjs/gallery/supportTemplates.js

@@ -0,0 +1,319 @@
+'use strict';
+
+var SlotName = require('../layouts/SlotName.js');
+require('@cratis/scene.model');
+require('../layouts/shellComponents.js');
+require('../layouts/appShell.js');
+require('../layouts/fullPage.js');
+var TemplateSlotName = require('./TemplateSlotName.js');
+var elements = require('./elements.js');
+var widgets = require('./widgets.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The five shapes an application needs that are not the CRUD loop: documentation, the signed-in user's own
+ * settings, user administration, a printable document, and help.
+ *
+ * They are in the set because leaving them out is what makes a template line feel thin. Every real
+ * application grows all five, and the ones that were never designed are the ones that end up looking like
+ * a different product.
+ */ /** Documentation: a table of contents beside prose. */ const documentationTemplate = {
+    name: 'Documentation',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.SidePanel
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.SidePanel]: [
+            widgets.widget('docs-toc', 'On this page', [
+                elements.text('docs-toc-1', 'Getting started'),
+                elements.text('docs-toc-2', 'Configuring the shell'),
+                elements.text('docs-toc-3', 'Themes'),
+                elements.text('docs-toc-4', 'Publishing a blueprint')
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            widgets.pageHeader('docs-header', 'Getting started', 'Everything you need to run the blueprint locally'),
+            elements.card('docs-body', [
+                elements.text('docs-intro', 'Install the blueprint, add it to a ui profile, and pick a layout. The shell reads its mode from the configurator and remembers it.'),
+                elements.externalComponent('docs-note', 'message', {
+                    severity: 'info',
+                    text: 'The shell needs its stylesheet imported once, at the host.'
+                })
+            ])
+        ]
+    },
+    displayName: 'Documentation',
+    description: 'Prose with a table of contents beside it.'
+};
+/** Profile settings: the signed-in user editing their own account. */ const profileSettingsTemplate = {
+    name: 'ProfileSettings',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Header
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Actions
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Header]: [
+            widgets.pageHeader('profile-header', 'Your profile', 'How you appear to everyone else in the workspace')
+        ],
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.card('profile-identity', [
+                elements.externalComponent('profile-avatar', 'avatar', {
+                    label: 'AN',
+                    size: 'large',
+                    shape: 'circle'
+                }),
+                widgets.field('profile-name', 'Display name', 'inputText', {
+                    value: 'Amelia Nyquist'
+                }),
+                widgets.field('profile-email', 'Email', 'inputText', {
+                    value: 'amelia@contoso.com'
+                }),
+                elements.externalComponent('profile-photo', 'image', {
+                    alt: 'Your current photo'
+                }),
+                elements.button('profile-photo-change', 'Change photo', {
+                    severity: 'secondary'
+                })
+            ]),
+            elements.card('profile-security', [
+                widgets.field('profile-current', 'Current password', 'password', {}),
+                widgets.field('profile-new', 'New password', 'password', {
+                    feedback: true
+                }),
+                widgets.field('profile-notify', 'Email me about mentions', 'checkbox', {
+                    checked: true
+                })
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Actions]: [
+            widgets.formActions('profile-actions', 'Save changes')
+        ]
+    },
+    displayName: 'Profile settings',
+    description: 'The signed-in user editing their own name, photo, password and notifications.'
+};
+/** User management: administering everybody else. */ const userManagementTemplate = {
+    name: 'UserManagement',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Toolbar
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Toolbar]: [
+            widgets.pageHeader('users-header', 'Users', '34 people, 3 pending invitations', [
+                elements.button('users-invite', 'Invite people', {
+                    severity: 'primary',
+                    icon: 'pi pi-user-plus'
+                })
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            widgets.table('users-table', [
+                {
+                    field: 'name',
+                    header: 'Name'
+                },
+                {
+                    field: 'email',
+                    header: 'Email'
+                },
+                {
+                    field: 'role',
+                    header: 'Role'
+                },
+                {
+                    field: 'status',
+                    header: 'Status'
+                },
+                {
+                    field: 'lastSeen',
+                    header: 'Last seen'
+                }
+            ], [
+                {
+                    name: 'Amelia Nyquist',
+                    email: 'amelia@contoso.com',
+                    role: 'Owner',
+                    status: 'Active',
+                    lastSeen: '2 minutes ago'
+                },
+                {
+                    name: 'Bjørn Holt',
+                    email: 'bjorn@contoso.com',
+                    role: 'Administrator',
+                    status: 'Active',
+                    lastSeen: 'Yesterday'
+                },
+                {
+                    name: 'Chidi Okafor',
+                    email: 'chidi@contoso.com',
+                    role: 'Editor',
+                    status: 'Active',
+                    lastSeen: '3 days ago'
+                },
+                {
+                    name: 'Dana Whitfield',
+                    email: 'dana@contoso.com',
+                    role: 'Viewer',
+                    status: 'Invited',
+                    lastSeen: 'Never'
+                }
+            ])
+        ]
+    },
+    displayName: 'User management',
+    description: 'The people table, with roles, status and an invitation action.'
+};
+/** Invoice: a printable document, which is a different shape from a screen. */ const invoiceTemplate = {
+    name: 'Invoice',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Header
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Actions
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Header]: [
+            widgets.pageHeader('invoice-header', 'Invoice INV-2043', 'Issued 4 March · Due 3 April', [
+                elements.button('invoice-print', 'Print', {
+                    severity: 'secondary',
+                    icon: 'pi pi-print'
+                })
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.card('invoice-parties', [
+                elements.text('invoice-from', 'From: Contoso Ltd, 4 Chandler Street, Dublin'),
+                elements.text('invoice-to', 'To: Northwind Traders, 18 Quay Road, Cork')
+            ]),
+            widgets.table('invoice-lines', [
+                {
+                    field: 'description',
+                    header: 'Description'
+                },
+                {
+                    field: 'quantity',
+                    header: 'Quantity'
+                },
+                {
+                    field: 'unitPrice',
+                    header: 'Unit price'
+                },
+                {
+                    field: 'amount',
+                    header: 'Amount'
+                }
+            ], [
+                {
+                    description: 'Bamboo Watch',
+                    quantity: 12,
+                    unitPrice: '$65.00',
+                    amount: '$780.00'
+                },
+                {
+                    description: 'Blue Band',
+                    quantity: 4,
+                    unitPrice: '$79.00',
+                    amount: '$316.00'
+                },
+                {
+                    description: 'Expedited shipping',
+                    quantity: 1,
+                    unitPrice: '$144.00',
+                    amount: '$144.00'
+                }
+            ]),
+            elements.card('invoice-total', [
+                elements.text('invoice-subtotal', 'Subtotal: $1,240.00'),
+                elements.text('invoice-vat', 'VAT (23%): $285.20'),
+                elements.text('invoice-due', 'Total due: $1,525.20')
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.Actions]: [
+            widgets.formActions('invoice-actions', 'Mark as paid', 'Send reminder')
+        ]
+    },
+    displayName: 'Invoice',
+    description: 'A printable document: parties, line items and totals.'
+};
+/** Help: the answers, and a way to ask when they are not there. */ const helpTemplate = {
+    name: 'Help',
+    fitsSlot: SlotName.SlotName.Content,
+    slots: [
+        {
+            name: TemplateSlotName.TemplateSlotName.Header
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.Body
+        },
+        {
+            name: TemplateSlotName.TemplateSlotName.SidePanel
+        }
+    ],
+    content: {
+        [TemplateSlotName.TemplateSlotName.Header]: [
+            widgets.pageHeader('help-header', 'Help', 'Search the answers, or ask us directly')
+        ],
+        [TemplateSlotName.TemplateSlotName.Body]: [
+            elements.externalComponent('help-search', 'inputText', {
+                placeholder: 'Search help'
+            }),
+            widgets.widget('help-popular', 'Popular answers', [
+                elements.text('help-1', 'How do I invite someone to the workspace?'),
+                elements.text('help-2', 'Why can I not see the sidebar on my phone?'),
+                elements.text('help-3', 'How do I change the theme?')
+            ])
+        ],
+        [TemplateSlotName.TemplateSlotName.SidePanel]: [
+            widgets.widget('help-contact', 'Still stuck?', [
+                elements.text('help-contact-text', 'We answer within one working day.'),
+                elements.button('help-contact-button', 'Contact support', {
+                    severity: 'primary'
+                })
+            ])
+        ]
+    },
+    displayName: 'Help',
+    description: 'Searchable answers with a route to a human.'
+};
+/** The five support templates. */ const supportTemplates = [
+    documentationTemplate,
+    profileSettingsTemplate,
+    userManagementTemplate,
+    invoiceTemplate,
+    helpTemplate
+];
+
+exports.documentationTemplate = documentationTemplate;
+exports.helpTemplate = helpTemplate;
+exports.invoiceTemplate = invoiceTemplate;
+exports.profileSettingsTemplate = profileSettingsTemplate;
+exports.supportTemplates = supportTemplates;
+exports.userManagementTemplate = userManagementTemplate;
+//# sourceMappingURL=supportTemplates.js.map

package/dist/cjs/gallery/supportTemplates.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"supportTemplates.js","sources":["../../../gallery/supportTemplates.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 } from '../layouts';\nimport { TemplateSlotName } from './TemplateSlotName';\nimport { button, card, externalComponent, text } from './elements';\nimport { field, formActions, pageHeader, table, widget } from './widgets';\n\n/**\n * The five shapes an application needs that are not the CRUD loop: documentation, the signed-in user's own\n * settings, user administration, a printable document, and help.\n *\n * They are in the set because leaving them out is what makes a template line feel thin. Every real\n * application grows all five, and the ones that were never designed are the ones that end up looking like\n * a different product.\n */\n\n/** Documentation: a table of contents beside prose. */\nexport const documentationTemplate: ScreenTemplate = {\n    name: 'Documentation',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.SidePanel }, { name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.SidePanel]: [\n            widget('docs-toc', 'On this page', [\n                text('docs-toc-1', 'Getting started'),\n                text('docs-toc-2', 'Configuring the shell'),\n                text('docs-toc-3', 'Themes'),\n                text('docs-toc-4', 'Publishing a blueprint'),\n            ]),\n        ],\n        [TemplateSlotName.Body]: [\n            pageHeader('docs-header', 'Getting started', 'Everything you need to run the blueprint locally'),\n            card('docs-body', [\n                text('docs-intro', 'Install the blueprint, add it to a ui profile, and pick a layout. The shell reads its mode from the configurator and remembers it.'),\n                externalComponent('docs-note', 'message', { severity: 'info', text: 'The shell needs its stylesheet imported once, at the host.' }),\n            ]),\n        ],\n    },\n    displayName: 'Documentation',\n    description: 'Prose with a table of contents beside it.',\n};\n\n/** Profile settings: the signed-in user editing their own account. */\nexport const profileSettingsTemplate: ScreenTemplate = {\n    name: 'ProfileSettings',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n    content: {\n        [TemplateSlotName.Header]: [pageHeader('profile-header', 'Your profile', 'How you appear to everyone else in the workspace')],\n        [TemplateSlotName.Body]: [\n            card('profile-identity', [\n                externalComponent('profile-avatar', 'avatar', { label: 'AN', size: 'large', shape: 'circle' }),\n                field('profile-name', 'Display name', 'inputText', { value: 'Amelia Nyquist' }),\n                field('profile-email', 'Email', 'inputText', { value: 'amelia@contoso.com' }),\n                externalComponent('profile-photo', 'image', { alt: 'Your current photo' }),\n                button('profile-photo-change', 'Change photo', { severity: 'secondary' }),\n            ]),\n            card('profile-security', [\n                field('profile-current', 'Current password', 'password', {}),\n                field('profile-new', 'New password', 'password', { feedback: true }),\n                field('profile-notify', 'Email me about mentions', 'checkbox', { checked: true }),\n            ]),\n        ],\n        [TemplateSlotName.Actions]: [formActions('profile-actions', 'Save changes')],\n    },\n    displayName: 'Profile settings',\n    description: 'The signed-in user editing their own name, photo, password and notifications.',\n};\n\n/** User management: administering everybody else. */\nexport const userManagementTemplate: ScreenTemplate = {\n    name: 'UserManagement',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Toolbar }, { name: TemplateSlotName.Body }],\n    content: {\n        [TemplateSlotName.Toolbar]: [\n            pageHeader('users-header', 'Users', '34 people, 3 pending invitations', [button('users-invite', 'Invite people', { severity: 'primary', icon: 'pi pi-user-plus' })]),\n        ],\n        [TemplateSlotName.Body]: [\n            table(\n                'users-table',\n                [\n                    { field: 'name', header: 'Name' },\n                    { field: 'email', header: 'Email' },\n                    { field: 'role', header: 'Role' },\n                    { field: 'status', header: 'Status' },\n                    { field: 'lastSeen', header: 'Last seen' },\n                ],\n                [\n                    { name: 'Amelia Nyquist', email: 'amelia@contoso.com', role: 'Owner', status: 'Active', lastSeen: '2 minutes ago' },\n                    { name: 'Bjørn Holt', email: 'bjorn@contoso.com', role: 'Administrator', status: 'Active', lastSeen: 'Yesterday' },\n                    { name: 'Chidi Okafor', email: 'chidi@contoso.com', role: 'Editor', status: 'Active', lastSeen: '3 days ago' },\n                    { name: 'Dana Whitfield', email: 'dana@contoso.com', role: 'Viewer', status: 'Invited', lastSeen: 'Never' },\n                ],\n            ),\n        ],\n    },\n    displayName: 'User management',\n    description: 'The people table, with roles, status and an invitation action.',\n};\n\n/** Invoice: a printable document, which is a different shape from a screen. */\nexport const invoiceTemplate: ScreenTemplate = {\n    name: 'Invoice',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.Actions }],\n    content: {\n        [TemplateSlotName.Header]: [\n            pageHeader('invoice-header', 'Invoice INV-2043', 'Issued 4 March · Due 3 April', [button('invoice-print', 'Print', { severity: 'secondary', icon: 'pi pi-print' })]),\n        ],\n        [TemplateSlotName.Body]: [\n            card('invoice-parties', [\n                text('invoice-from', 'From: Contoso Ltd, 4 Chandler Street, Dublin'),\n                text('invoice-to', 'To: Northwind Traders, 18 Quay Road, Cork'),\n            ]),\n            table(\n                'invoice-lines',\n                [\n                    { field: 'description', header: 'Description' },\n                    { field: 'quantity', header: 'Quantity' },\n                    { field: 'unitPrice', header: 'Unit price' },\n                    { field: 'amount', header: 'Amount' },\n                ],\n                [\n                    { description: 'Bamboo Watch', quantity: 12, unitPrice: '$65.00', amount: '$780.00' },\n                    { description: 'Blue Band', quantity: 4, unitPrice: '$79.00', amount: '$316.00' },\n                    { description: 'Expedited shipping', quantity: 1, unitPrice: '$144.00', amount: '$144.00' },\n                ],\n            ),\n            card('invoice-total', [text('invoice-subtotal', 'Subtotal: $1,240.00'), text('invoice-vat', 'VAT (23%): $285.20'), text('invoice-due', 'Total due: $1,525.20')]),\n        ],\n        [TemplateSlotName.Actions]: [formActions('invoice-actions', 'Mark as paid', 'Send reminder')],\n    },\n    displayName: 'Invoice',\n    description: 'A printable document: parties, line items and totals.',\n};\n\n/** Help: the answers, and a way to ask when they are not there. */\nexport const helpTemplate: ScreenTemplate = {\n    name: 'Help',\n    fitsSlot: SlotName.Content,\n    slots: [{ name: TemplateSlotName.Header }, { name: TemplateSlotName.Body }, { name: TemplateSlotName.SidePanel }],\n    content: {\n        [TemplateSlotName.Header]: [pageHeader('help-header', 'Help', 'Search the answers, or ask us directly')],\n        [TemplateSlotName.Body]: [\n            externalComponent('help-search', 'inputText', { placeholder: 'Search help' }),\n            widget('help-popular', 'Popular answers', [\n                text('help-1', 'How do I invite someone to the workspace?'),\n                text('help-2', 'Why can I not see the sidebar on my phone?'),\n                text('help-3', 'How do I change the theme?'),\n            ]),\n        ],\n        [TemplateSlotName.SidePanel]: [\n            widget('help-contact', 'Still stuck?', [text('help-contact-text', 'We answer within one working day.'), button('help-contact-button', 'Contact support', { severity: 'primary' })]),\n        ],\n    },\n    displayName: 'Help',\n    description: 'Searchable answers with a route to a human.',\n};\n\n/** The five support templates. */\nexport const supportTemplates: ScreenTemplate[] = [documentationTemplate, profileSettingsTemplate, userManagementTemplate, invoiceTemplate, helpTemplate];\n"],"names":["documentationTemplate","name","fitsSlot","SlotName","Content","slots","TemplateSlotName","SidePanel","Body","content","widget","text","pageHeader","card","externalComponent","severity","displayName","description","profileSettingsTemplate","Header","Actions","label","size","shape","field","value","alt","button","feedback","checked","formActions","userManagementTemplate","Toolbar","icon","table","header","email","role","status","lastSeen","invoiceTemplate","quantity","unitPrice","amount","helpTemplate","placeholder","supportTemplates"],"mappings":"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"}

package/dist/cjs/gallery/widgets.js

@@ -0,0 +1,94 @@
+'use strict';
+
+var ComponentName = require('../ComponentName.js');
+var elements = require('./elements.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The repeated pieces the gallery's screen templates are built from.
+ *
+ * The gallery only earns its place if a preview shows something that looks like an application - a
+ * dashboard with four stat cards over two columns of larger widgets, a list with real columns and real
+ * rows. Seeded content that says "Lorem ipsum" proves the renderer runs and nothing else. These builders
+ * are what keep twenty templates' worth of realistic content from becoming twenty pages of literals.
+ */ /** A screen's title, subtitle and actions - the furniture every template starts with. */ function pageHeader(id, title, subtitle, actions = []) {
+    return elements.externalComponent(id, ComponentName.ComponentName.PageHeader, {
+        title,
+        subtitle
+    }, {
+        actions
+    });
+}
+/**
+ * One of the four figures across the top of a dashboard - the composition Sakai's dashboard opens with,
+ * and the one every template in the line has copied since.
+ */ function statCard(id, label, value, delta, icon) {
+    return elements.card(id, [
+        elements.text(`${id}-label`, label),
+        elements.text(`${id}-value`, value),
+        elements.text(`${id}-delta`, delta)
+    ], {
+        icon,
+        variant: 'stat'
+    });
+}
+/** A titled surface holding a widget's content. */ function widget(id, title, content) {
+    return elements.card(id, [
+        elements.text(`${id}-title`, title),
+        ...content
+    ], {
+        title
+    });
+}
+/** A table with real columns and real rows, so a list template looks like a list. */ function table(id, columns, rows) {
+    return elements.externalComponent(id, 'dataTable', {
+        value: rows,
+        dataKey: columns[0]?.field ?? 'id',
+        paginator: rows.length > 8,
+        rows: 8
+    }, {
+        columns: columns.map((column)=>elements.externalComponent(`${id}-${column.field}`, 'column', {
+                field: column.field,
+                header: column.header,
+                sortable: true
+            }))
+    });
+}
+/** One labeled input in a form template. */ function field(id, label, componentName, properties = {}) {
+    return elements.panel(id, [
+        elements.text(`${id}-label`, label),
+        elements.externalComponent(`${id}-input`, componentName, properties)
+    ]);
+}
+/** A row of buttons closing a form. */ function formActions(id, confirmLabel, cancelLabel = 'Cancel') {
+    return elements.panel(id, [
+        elements.button(`${id}-confirm`, confirmLabel, {
+            severity: 'primary'
+        }),
+        elements.button(`${id}-cancel`, cancelLabel, {
+            severity: 'secondary'
+        })
+    ]);
+}
+/** The empty state a list shows before anything exists - the designed one, never a build-time apology. */ function emptyState(id, title, message, actionLabel) {
+    return elements.card(id, [
+        elements.externalComponent(`${id}-icon`, 'image', {
+            alt: title
+        }),
+        elements.text(`${id}-title`, title),
+        elements.text(`${id}-message`, message),
+        elements.button(`${id}-action`, actionLabel, {
+            severity: 'primary'
+        })
+    ]);
+}
+
+exports.emptyState = emptyState;
+exports.field = field;
+exports.formActions = formActions;
+exports.pageHeader = pageHeader;
+exports.statCard = statCard;
+exports.table = table;
+exports.widget = widget;
+//# sourceMappingURL=widgets.js.map