@cratis/scene.blueprint.default 4.35.0 → 4.37.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.
- package/ComponentName.ts +21 -0
- package/defaultBlueprintComponents.ts +8 -1
- package/dist/cjs/ComponentName.js +7 -0
- package/dist/cjs/ComponentName.js.map +1 -1
- package/dist/cjs/defaultBlueprint.js +2 -0
- package/dist/cjs/defaultBlueprint.js.map +1 -1
- package/dist/cjs/defaultBlueprintComponentMetadata.js +2 -0
- package/dist/cjs/defaultBlueprintComponentMetadata.js.map +1 -1
- package/dist/cjs/defaultBlueprintComponents.js +15 -1
- package/dist/cjs/defaultBlueprintComponents.js.map +1 -1
- package/dist/cjs/foundation/ActivityFeed.js +122 -0
- package/dist/cjs/foundation/ActivityFeed.js.map +1 -0
- package/dist/cjs/foundation/ApprovalChainStepper.js +130 -0
- package/dist/cjs/foundation/ApprovalChainStepper.js.map +1 -0
- package/dist/cjs/foundation/AvatarStack.js +73 -0
- package/dist/cjs/foundation/AvatarStack.js.map +1 -0
- package/dist/cjs/foundation/ChecklistSection.js +174 -0
- package/dist/cjs/foundation/ChecklistSection.js.map +1 -0
- package/dist/cjs/foundation/FileUploader.js +218 -0
- package/dist/cjs/foundation/FileUploader.js.map +1 -0
- package/dist/cjs/foundation/FileUploaderHandler.js +17 -0
- package/dist/cjs/foundation/FileUploaderHandler.js.map +1 -0
- package/dist/cjs/foundation/OrgTree.js +188 -0
- package/dist/cjs/foundation/OrgTree.js.map +1 -0
- package/dist/cjs/foundation/PermissionMatrix.js +136 -0
- package/dist/cjs/foundation/PermissionMatrix.js.map +1 -0
- package/dist/cjs/foundation/activityModel.js +63 -0
- package/dist/cjs/foundation/activityModel.js.map +1 -0
- package/dist/cjs/foundation/approvalModel.js +87 -0
- package/dist/cjs/foundation/approvalModel.js.map +1 -0
- package/dist/cjs/foundation/avatarModel.js +42 -0
- package/dist/cjs/foundation/avatarModel.js.map +1 -0
- package/dist/cjs/foundation/checklistModel.js +59 -0
- package/dist/cjs/foundation/checklistModel.js.map +1 -0
- package/dist/cjs/foundation/formatting.js +11 -0
- package/dist/cjs/foundation/formatting.js.map +1 -1
- package/dist/cjs/foundation/foundationComponentMetadata.js +47 -0
- package/dist/cjs/foundation/foundationComponentMetadata.js.map +1 -1
- package/dist/cjs/foundation/foundationDescriptors.js +246 -0
- package/dist/cjs/foundation/foundationDescriptors.js.map +1 -1
- package/dist/cjs/foundation/foundationSamples.js +230 -0
- package/dist/cjs/foundation/foundationSamples.js.map +1 -1
- package/dist/cjs/foundation/foundationStrings.js +27 -1
- package/dist/cjs/foundation/foundationStrings.js.map +1 -1
- package/dist/cjs/foundation/orgModel.js +106 -0
- package/dist/cjs/foundation/orgModel.js.map +1 -0
- package/dist/cjs/foundation/permissionModel.js +84 -0
- package/dist/cjs/foundation/permissionModel.js.map +1 -0
- package/dist/cjs/foundation/uploadModel.js +71 -0
- package/dist/cjs/foundation/uploadModel.js.map +1 -0
- package/dist/cjs/index.js +59 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/ComponentName.d.ts +8 -1
- package/dist/esm/ComponentName.d.ts.map +1 -1
- package/dist/esm/ComponentName.js +7 -0
- package/dist/esm/ComponentName.js.map +1 -1
- package/dist/esm/defaultBlueprint.js +2 -0
- package/dist/esm/defaultBlueprint.js.map +1 -1
- package/dist/esm/defaultBlueprintComponentMetadata.js +2 -0
- package/dist/esm/defaultBlueprintComponentMetadata.js.map +1 -1
- package/dist/esm/defaultBlueprintComponents.d.ts.map +1 -1
- package/dist/esm/defaultBlueprintComponents.js +15 -1
- package/dist/esm/defaultBlueprintComponents.js.map +1 -1
- package/dist/esm/foundation/ActivityFeed.d.ts +3 -0
- package/dist/esm/foundation/ActivityFeed.d.ts.map +1 -0
- package/dist/esm/foundation/ActivityFeed.js +120 -0
- package/dist/esm/foundation/ActivityFeed.js.map +1 -0
- package/dist/esm/foundation/ApprovalChainStepper.d.ts +3 -0
- package/dist/esm/foundation/ApprovalChainStepper.d.ts.map +1 -0
- package/dist/esm/foundation/ApprovalChainStepper.js +128 -0
- package/dist/esm/foundation/ApprovalChainStepper.js.map +1 -0
- package/dist/esm/foundation/AvatarStack.d.ts +3 -0
- package/dist/esm/foundation/AvatarStack.d.ts.map +1 -0
- package/dist/esm/foundation/AvatarStack.js +71 -0
- package/dist/esm/foundation/AvatarStack.js.map +1 -0
- package/dist/esm/foundation/ChecklistSection.d.ts +3 -0
- package/dist/esm/foundation/ChecklistSection.d.ts.map +1 -0
- package/dist/esm/foundation/ChecklistSection.js +172 -0
- package/dist/esm/foundation/ChecklistSection.js.map +1 -0
- package/dist/esm/foundation/FileUploader.d.ts +3 -0
- package/dist/esm/foundation/FileUploader.d.ts.map +1 -0
- package/dist/esm/foundation/FileUploader.js +216 -0
- package/dist/esm/foundation/FileUploader.js.map +1 -0
- package/dist/esm/foundation/FileUploaderHandler.d.ts +8 -0
- package/dist/esm/foundation/FileUploaderHandler.d.ts.map +1 -0
- package/dist/esm/foundation/FileUploaderHandler.js +14 -0
- package/dist/esm/foundation/FileUploaderHandler.js.map +1 -0
- package/dist/esm/foundation/Foundation.stories.d.ts +16 -0
- package/dist/esm/foundation/Foundation.stories.d.ts.map +1 -1
- package/dist/esm/foundation/Foundation.stories.js +16 -0
- package/dist/esm/foundation/Foundation.stories.js.map +1 -1
- package/dist/esm/foundation/OrgTree.d.ts +3 -0
- package/dist/esm/foundation/OrgTree.d.ts.map +1 -0
- package/dist/esm/foundation/OrgTree.js +186 -0
- package/dist/esm/foundation/OrgTree.js.map +1 -0
- package/dist/esm/foundation/PermissionMatrix.d.ts +3 -0
- package/dist/esm/foundation/PermissionMatrix.d.ts.map +1 -0
- package/dist/esm/foundation/PermissionMatrix.js +134 -0
- package/dist/esm/foundation/PermissionMatrix.js.map +1 -0
- package/dist/esm/foundation/activityModel.d.ts +22 -0
- package/dist/esm/foundation/activityModel.d.ts.map +1 -0
- package/dist/esm/foundation/activityModel.js +58 -0
- package/dist/esm/foundation/activityModel.js.map +1 -0
- package/dist/esm/foundation/approvalModel.d.ts +27 -0
- package/dist/esm/foundation/approvalModel.d.ts.map +1 -0
- package/dist/esm/foundation/approvalModel.js +81 -0
- package/dist/esm/foundation/approvalModel.js.map +1 -0
- package/dist/esm/foundation/avatarModel.d.ts +11 -0
- package/dist/esm/foundation/avatarModel.d.ts.map +1 -0
- package/dist/esm/foundation/avatarModel.js +38 -0
- package/dist/esm/foundation/avatarModel.js.map +1 -0
- package/dist/esm/foundation/checklistModel.d.ts +17 -0
- package/dist/esm/foundation/checklistModel.d.ts.map +1 -0
- package/dist/esm/foundation/checklistModel.js +53 -0
- package/dist/esm/foundation/checklistModel.js.map +1 -0
- package/dist/esm/foundation/formatting.d.ts +1 -0
- package/dist/esm/foundation/formatting.d.ts.map +1 -1
- package/dist/esm/foundation/formatting.js +11 -1
- package/dist/esm/foundation/formatting.js.map +1 -1
- package/dist/esm/foundation/foundationComponentMetadata.d.ts.map +1 -1
- package/dist/esm/foundation/foundationComponentMetadata.js +47 -0
- package/dist/esm/foundation/foundationComponentMetadata.js.map +1 -1
- package/dist/esm/foundation/foundationDescriptors.d.ts.map +1 -1
- package/dist/esm/foundation/foundationDescriptors.js +246 -0
- package/dist/esm/foundation/foundationDescriptors.js.map +1 -1
- package/dist/esm/foundation/foundationSamples.d.ts.map +1 -1
- package/dist/esm/foundation/foundationSamples.js +230 -0
- package/dist/esm/foundation/foundationSamples.js.map +1 -1
- package/dist/esm/foundation/foundationStrings.d.ts +26 -0
- package/dist/esm/foundation/foundationStrings.d.ts.map +1 -1
- package/dist/esm/foundation/foundationStrings.js +27 -1
- package/dist/esm/foundation/foundationStrings.js.map +1 -1
- package/dist/esm/foundation/index.d.ts +15 -0
- package/dist/esm/foundation/index.d.ts.map +1 -1
- package/dist/esm/foundation/index.js +15 -0
- package/dist/esm/foundation/index.js.map +1 -1
- package/dist/esm/foundation/orgModel.d.ts +20 -0
- package/dist/esm/foundation/orgModel.d.ts.map +1 -0
- package/dist/esm/foundation/orgModel.js +99 -0
- package/dist/esm/foundation/orgModel.js.map +1 -0
- package/dist/esm/foundation/permissionModel.d.ts +24 -0
- package/dist/esm/foundation/permissionModel.d.ts.map +1 -0
- package/dist/esm/foundation/permissionModel.js +77 -0
- package/dist/esm/foundation/permissionModel.js.map +1 -0
- package/dist/esm/foundation/uploadModel.d.ts +31 -0
- package/dist/esm/foundation/uploadModel.d.ts.map +1 -0
- package/dist/esm/foundation/uploadModel.js +65 -0
- package/dist/esm/foundation/uploadModel.js.map +1 -0
- package/dist/esm/index.js +16 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/tsconfig.tsbuildinfo +1 -1
- package/foundation/ActivityFeed.tsx +61 -0
- package/foundation/ApprovalChainStepper.tsx +66 -0
- package/foundation/AvatarStack.tsx +43 -0
- package/foundation/ChecklistSection.tsx +80 -0
- package/foundation/FileUploader.tsx +122 -0
- package/foundation/FileUploaderHandler.tsx +22 -0
- package/foundation/Foundation.stories.tsx +16 -0
- package/foundation/OrgTree.tsx +101 -0
- package/foundation/PermissionMatrix.tsx +82 -0
- package/foundation/activityModel.ts +65 -0
- package/foundation/approvalModel.ts +88 -0
- package/foundation/avatarModel.ts +36 -0
- package/foundation/checklistModel.ts +62 -0
- package/foundation/formatting.ts +9 -0
- package/foundation/foundationComponentMetadata.ts +7 -0
- package/foundation/foundationDescriptors.ts +153 -0
- package/foundation/foundationSamples.ts +59 -0
- package/foundation/foundationStrings.ts +26 -0
- package/foundation/index.ts +15 -0
- package/foundation/orgModel.ts +85 -0
- package/foundation/permissionModel.ts +85 -0
- package/foundation/uploadModel.ts +66 -0
- package/package.json +8 -8
- package/shell/layout.css +418 -0
package/ComponentName.ts
CHANGED
|
@@ -81,4 +81,25 @@ export enum ComponentName {
|
|
|
81
81
|
|
|
82
82
|
/** A list's saved views as a menu button. */
|
|
83
83
|
SavedViewsMenu = 'savedViewsMenu',
|
|
84
|
+
|
|
85
|
+
/** Sections of tasks with owner, due date and progress. */
|
|
86
|
+
ChecklistSection = 'checklistSection',
|
|
87
|
+
|
|
88
|
+
/** What happened to a record, grouped by day. */
|
|
89
|
+
ActivityFeed = 'activityFeed',
|
|
90
|
+
|
|
91
|
+
/** Overlapping avatars for the people on a record. */
|
|
92
|
+
AvatarStack = 'avatarStack',
|
|
93
|
+
|
|
94
|
+
/** A drop zone and file picker with type and size checks. */
|
|
95
|
+
FileUploader = 'fileUploader',
|
|
96
|
+
|
|
97
|
+
/** The steps a request goes through, who decides each, and where it stands. */
|
|
98
|
+
ApprovalChainStepper = 'approvalChainStepper',
|
|
99
|
+
|
|
100
|
+
/** An organization as an expandable tree. */
|
|
101
|
+
OrgTree = 'orgTree',
|
|
102
|
+
|
|
103
|
+
/** Roles across, permissions down, a checkbox where they meet. */
|
|
104
|
+
PermissionMatrix = 'permissionMatrix',
|
|
84
105
|
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { ComponentRegistry, componentRegistryKey } from '@cratis/scene.react';
|
|
5
5
|
import { ComponentName } from './ComponentName';
|
|
6
6
|
import { defaultBlueprintName } from './packageName';
|
|
7
|
-
import { ChartWrapper, ColumnChooser, EmptyState, FilterBuilder, SavedViewsMenu, StatCard, StatusChip, TrendChip } from './foundation';
|
|
7
|
+
import { ActivityFeed, ApprovalChainStepper, AvatarStack, ChartWrapper, ChecklistSection, ColumnChooser, FileUploader, EmptyState, FilterBuilder, OrgTree, PermissionMatrix, SavedViewsMenu, StatCard, StatusChip, TrendChip } from './foundation';
|
|
8
8
|
import {
|
|
9
9
|
AppShell,
|
|
10
10
|
Breadcrumb,
|
|
@@ -57,4 +57,11 @@ export const defaultBlueprintComponents: ComponentRegistry = {
|
|
|
57
57
|
[componentRegistryKey(defaultBlueprintName, ComponentName.FilterBuilder)]: FilterBuilder,
|
|
58
58
|
[componentRegistryKey(defaultBlueprintName, ComponentName.ColumnChooser)]: ColumnChooser,
|
|
59
59
|
[componentRegistryKey(defaultBlueprintName, ComponentName.SavedViewsMenu)]: SavedViewsMenu,
|
|
60
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.ChecklistSection)]: ChecklistSection,
|
|
61
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.ActivityFeed)]: ActivityFeed,
|
|
62
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.AvatarStack)]: AvatarStack,
|
|
63
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.FileUploader)]: FileUploader,
|
|
64
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.ApprovalChainStepper)]: ApprovalChainStepper,
|
|
65
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.OrgTree)]: OrgTree,
|
|
66
|
+
[componentRegistryKey(defaultBlueprintName, ComponentName.PermissionMatrix)]: PermissionMatrix,
|
|
60
67
|
};
|
|
@@ -34,6 +34,13 @@
|
|
|
34
34
|
/** Conditions on fields, joined by AND or OR in nested groups. */ ComponentName["FilterBuilder"] = "filterBuilder";
|
|
35
35
|
/** Which columns a table shows, and in what order. */ ComponentName["ColumnChooser"] = "columnChooser";
|
|
36
36
|
/** A list's saved views as a menu button. */ ComponentName["SavedViewsMenu"] = "savedViewsMenu";
|
|
37
|
+
/** Sections of tasks with owner, due date and progress. */ ComponentName["ChecklistSection"] = "checklistSection";
|
|
38
|
+
/** What happened to a record, grouped by day. */ ComponentName["ActivityFeed"] = "activityFeed";
|
|
39
|
+
/** Overlapping avatars for the people on a record. */ ComponentName["AvatarStack"] = "avatarStack";
|
|
40
|
+
/** A drop zone and file picker with type and size checks. */ ComponentName["FileUploader"] = "fileUploader";
|
|
41
|
+
/** The steps a request goes through, who decides each, and where it stands. */ ComponentName["ApprovalChainStepper"] = "approvalChainStepper";
|
|
42
|
+
/** An organization as an expandable tree. */ ComponentName["OrgTree"] = "orgTree";
|
|
43
|
+
/** Roles across, permissions down, a checkbox where they meet. */ ComponentName["PermissionMatrix"] = "permissionMatrix";
|
|
37
44
|
return ComponentName;
|
|
38
45
|
}({});
|
|
39
46
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentName.js","sources":["../../ComponentName.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\n/**\n * The bare names this package declares components under.\n *\n * A page template writes a bare name and `resolveComponentName` decides which active package wins it, so\n * these names are public API: renaming one breaks every template that referenced it, in this package and\n * in anyone else's. Keeping them in one enum means the manifest, the registry and every template\n * reference the same symbol, and the specs can prove all three agree rather than hoping they do.\n */\nexport enum ComponentName {\n /** The application shell - topbar, sidebar, breadcrumb, content, footer and an optional right panel. */\n AppShell = 'appShell',\n\n /** The chrome-less shell - content, an optional branding aside, and the configurator. */\n FullPageShell = 'fullPageShell',\n\n /** The fixed strip across the top of the application shell. */\n Topbar = 'topbar',\n\n /** The sidebar's own chrome, inside the shell-positioned panel. */\n Sidebar = 'sidebar',\n\n /** A navigation list. */\n Menu = 'menu',\n\n /** One entry in a navigation list, optionally with a submenu. */\n MenuItem = 'menuItem',\n\n /** The trail above the content. */\n Breadcrumb = 'breadcrumb',\n\n /** The strip below the content. */\n Footer = 'footer',\n\n /** The inspector panel down the right-hand edge. */\n RightPanel = 'rightPanel',\n\n /** The floating configurator: color scheme, layout mode, menu theme and theme. */\n ConfigPanel = 'configPanel',\n\n /** A screen's title, subtitle and actions. */\n PageHeader = 'pageHeader',\n\n /** The scrim behind a floating sidebar, which also closes it. */\n Mask = 'mask',\n\n /** The brand mark. */\n Logo = 'logo',\n\n /** The signed-in user's avatar and menu. */\n UserMenu = 'userMenu',\n\n /** Switches between the themes a host offers. */\n ThemeSwitcher = 'themeSwitcher',\n\n /** Switches between the layout modes. */\n LayoutModeSwitcher = 'layoutModeSwitcher',\n\n /** An icon, a headline, a hint and one primary action: what a region says when it has nothing to show. */\n EmptyState = 'emptyState',\n\n /** One key figure with its label, trend and comparison period. */\n StatCard = 'statCard',\n\n /** A change drawn as a direction, a magnitude and whether it is good. */\n TrendChip = 'trendChip',\n\n /** A status as a semantic color, an icon and its text. */\n StatusChip = 'statusChip',\n\n /** One chart - line, bar, stacked, donut or funnel - with its legend and a table of the same data. */\n ChartWrapper = 'chartWrapper',\n\n /** Conditions on fields, joined by AND or OR in nested groups. */\n FilterBuilder = 'filterBuilder',\n\n /** Which columns a table shows, and in what order. */\n ColumnChooser = 'columnChooser',\n\n /** A list's saved views as a menu button. */\n SavedViewsMenu = 'savedViewsMenu',\n}\n"],"names":["ComponentName"],"mappings":";;AAAA;AACA;AAEA;;;;;;;IAQO,IAAKA,aAAAA,iBAAAA,SAAAA,aAAAA,EAAAA;6GAC8F,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;8FAGf,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;oEAG1B,aAAA,CAAA,QAAA,CAAA,GAAA,QAAA;wEAGI,aAAA,CAAA,SAAA,CAAA,GAAA,SAAA;8BAG1C,aAAA,CAAA,MAAA,CAAA,GAAA,MAAA;sEAGwC,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;wCAG9B,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;wCAGA,aAAA,CAAA,QAAA,CAAA,GAAA,QAAA;yDAGiB,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;uFAG8B,aAAA,CAAA,aAAA,CAAA,GAAA,aAAA;mDAGpC,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;sEAGmB,aAAA,CAAA,MAAA,CAAA,GAAA,MAAA;2BAG3C,aAAA,CAAA,MAAA,CAAA,GAAA,MAAA;iDAGsB,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;sDAGK,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;8CAGR,aAAA,CAAA,oBAAA,CAAA,GAAA,oBAAA;+GAGiE,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;uEAGxC,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;8EAGO,aAAA,CAAA,WAAA,CAAA,GAAA,WAAA;+DAGf,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;2GAG4C,aAAA,CAAA,cAAA,CAAA,GAAA,cAAA;uEAGpC,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;2DAGZ,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;kDAGT,aAAA,CAAA,gBAAA,CAAA,GAAA,gBAAA;
|
|
1
|
+
{"version":3,"file":"ComponentName.js","sources":["../../ComponentName.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\n/**\n * The bare names this package declares components under.\n *\n * A page template writes a bare name and `resolveComponentName` decides which active package wins it, so\n * these names are public API: renaming one breaks every template that referenced it, in this package and\n * in anyone else's. Keeping them in one enum means the manifest, the registry and every template\n * reference the same symbol, and the specs can prove all three agree rather than hoping they do.\n */\nexport enum ComponentName {\n /** The application shell - topbar, sidebar, breadcrumb, content, footer and an optional right panel. */\n AppShell = 'appShell',\n\n /** The chrome-less shell - content, an optional branding aside, and the configurator. */\n FullPageShell = 'fullPageShell',\n\n /** The fixed strip across the top of the application shell. */\n Topbar = 'topbar',\n\n /** The sidebar's own chrome, inside the shell-positioned panel. */\n Sidebar = 'sidebar',\n\n /** A navigation list. */\n Menu = 'menu',\n\n /** One entry in a navigation list, optionally with a submenu. */\n MenuItem = 'menuItem',\n\n /** The trail above the content. */\n Breadcrumb = 'breadcrumb',\n\n /** The strip below the content. */\n Footer = 'footer',\n\n /** The inspector panel down the right-hand edge. */\n RightPanel = 'rightPanel',\n\n /** The floating configurator: color scheme, layout mode, menu theme and theme. */\n ConfigPanel = 'configPanel',\n\n /** A screen's title, subtitle and actions. */\n PageHeader = 'pageHeader',\n\n /** The scrim behind a floating sidebar, which also closes it. */\n Mask = 'mask',\n\n /** The brand mark. */\n Logo = 'logo',\n\n /** The signed-in user's avatar and menu. */\n UserMenu = 'userMenu',\n\n /** Switches between the themes a host offers. */\n ThemeSwitcher = 'themeSwitcher',\n\n /** Switches between the layout modes. */\n LayoutModeSwitcher = 'layoutModeSwitcher',\n\n /** An icon, a headline, a hint and one primary action: what a region says when it has nothing to show. */\n EmptyState = 'emptyState',\n\n /** One key figure with its label, trend and comparison period. */\n StatCard = 'statCard',\n\n /** A change drawn as a direction, a magnitude and whether it is good. */\n TrendChip = 'trendChip',\n\n /** A status as a semantic color, an icon and its text. */\n StatusChip = 'statusChip',\n\n /** One chart - line, bar, stacked, donut or funnel - with its legend and a table of the same data. */\n ChartWrapper = 'chartWrapper',\n\n /** Conditions on fields, joined by AND or OR in nested groups. */\n FilterBuilder = 'filterBuilder',\n\n /** Which columns a table shows, and in what order. */\n ColumnChooser = 'columnChooser',\n\n /** A list's saved views as a menu button. */\n SavedViewsMenu = 'savedViewsMenu',\n\n /** Sections of tasks with owner, due date and progress. */\n ChecklistSection = 'checklistSection',\n\n /** What happened to a record, grouped by day. */\n ActivityFeed = 'activityFeed',\n\n /** Overlapping avatars for the people on a record. */\n AvatarStack = 'avatarStack',\n\n /** A drop zone and file picker with type and size checks. */\n FileUploader = 'fileUploader',\n\n /** The steps a request goes through, who decides each, and where it stands. */\n ApprovalChainStepper = 'approvalChainStepper',\n\n /** An organization as an expandable tree. */\n OrgTree = 'orgTree',\n\n /** Roles across, permissions down, a checkbox where they meet. */\n PermissionMatrix = 'permissionMatrix',\n}\n"],"names":["ComponentName"],"mappings":";;AAAA;AACA;AAEA;;;;;;;IAQO,IAAKA,aAAAA,iBAAAA,SAAAA,aAAAA,EAAAA;6GAC8F,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;8FAGf,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;oEAG1B,aAAA,CAAA,QAAA,CAAA,GAAA,QAAA;wEAGI,aAAA,CAAA,SAAA,CAAA,GAAA,SAAA;8BAG1C,aAAA,CAAA,MAAA,CAAA,GAAA,MAAA;sEAGwC,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;wCAG9B,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;wCAGA,aAAA,CAAA,QAAA,CAAA,GAAA,QAAA;yDAGiB,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;uFAG8B,aAAA,CAAA,aAAA,CAAA,GAAA,aAAA;mDAGpC,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;sEAGmB,aAAA,CAAA,MAAA,CAAA,GAAA,MAAA;2BAG3C,aAAA,CAAA,MAAA,CAAA,GAAA,MAAA;iDAGsB,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;sDAGK,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;8CAGR,aAAA,CAAA,oBAAA,CAAA,GAAA,oBAAA;+GAGiE,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;uEAGxC,aAAA,CAAA,UAAA,CAAA,GAAA,UAAA;8EAGO,aAAA,CAAA,WAAA,CAAA,GAAA,WAAA;+DAGf,aAAA,CAAA,YAAA,CAAA,GAAA,YAAA;2GAG4C,aAAA,CAAA,cAAA,CAAA,GAAA,cAAA;uEAGpC,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;2DAGZ,aAAA,CAAA,eAAA,CAAA,GAAA,eAAA;kDAGT,aAAA,CAAA,gBAAA,CAAA,GAAA,gBAAA;gEAGc,aAAA,CAAA,kBAAA,CAAA,GAAA,kBAAA;sDAGV,aAAA,CAAA,cAAA,CAAA,GAAA,cAAA;2DAGK,aAAA,CAAA,aAAA,CAAA,GAAA,aAAA;kEAGO,aAAA,CAAA,cAAA,CAAA,GAAA,cAAA;oFAGkB,aAAA,CAAA,sBAAA,CAAA,GAAA,sBAAA;kDAGlC,aAAA,CAAA,SAAA,CAAA,GAAA,SAAA;uEAGqB,aAAA,CAAA,kBAAA,CAAA,GAAA,kBAAA;AA3FxDA,IAAAA,OAAAA,aAAAA;AA6FX,CAAA,CAAA,EAAA;;"}
|
|
@@ -7,6 +7,8 @@ var defaultBlueprintComponentMetadata = require('./defaultBlueprintComponentMeta
|
|
|
7
7
|
require('./foundation/ComponentState.js');
|
|
8
8
|
require('react/jsx-runtime');
|
|
9
9
|
require('react');
|
|
10
|
+
require('./foundation/ActivityFeed.js');
|
|
11
|
+
require('./foundation/ApprovalChainStepper.js');
|
|
10
12
|
var foundationDescriptors = require('./foundation/foundationDescriptors.js');
|
|
11
13
|
require('./foundation/foundationComponentMetadata.js');
|
|
12
14
|
require('./foundation/foundationSamples.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultBlueprint.js","sources":["../../defaultBlueprint.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 { PackageKind, ScenePackage } from '@cratis/scene.model';\nimport { ScenePackageBundle, describeComponents } from '@cratis/scene.react';\nimport { ComponentName } from './ComponentName';\nimport { defaultBlueprintComponentMetadata } from './defaultBlueprintComponentMetadata';\nimport { foundationDescriptors } from './foundation';\nimport { defaultBlueprintComponents } from './defaultBlueprintComponents';\nimport { galleryDialogTemplates, galleryScreenTemplates, galleryScreens } from './gallery';\nimport { LayoutName, defaultLayouts } from './layouts';\nimport { defaultBlueprintName } from './packageName';\nimport { defaultBlueprintThemes } from './themes';\n\n/**\n * The default blueprint's declaration.\n *\n * A blueprint is the package an application picks once to get a coherent shape: the {@link Layout}s that\n * are its base navigational look, the {@link ScreenTemplate}s and {@link DialogTemplate}s that go inside\n * them, the components that fill their slots, and the themes that color all of it. Picking the parts\n * separately is how an application ends up with a sidebar from one design language and a form from\n * another.\n *\n * The dependency list is what makes a blueprint honest about what it is built from. This one declares\n * PrimeReact - the shell's buttons, breadcrumb, overlay menu and drawer are PrimeReact 10 components - and\n * Cratis Components, which its screen templates fill their content with. A profile that activated this\n * blueprint without them would render a shell whose every control was a dashed red placeholder, and\n * `resolvePackageDependencies` exists to catch that when the profile is configured rather than when\n * someone opens the page.\n *\n * `layouts` lists only true application shells. A dashboard, a CRUD list or a sign-in screen is a screen\n * template, not a layout, and is listed as one.\n */\nexport const defaultBlueprintManifest: ScenePackage = {\n name: defaultBlueprintName,\n version: '1.0.0',\n kind: PackageKind.Blueprint,\n dependencies: [{ name: 'PrimeReact' }, { name: 'Cratis.Components' }],\n components: Object.values(ComponentName),\n layouts: Object.values(LayoutName),\n screenTemplates: galleryScreenTemplates.map(template => template.name),\n dialogTemplates: galleryDialogTemplates.map(template => template.name),\n themes: defaultBlueprintThemes.map(theme => theme.name),\n displayName: 'Cratis Default Blueprint',\n description: 'Application shells with eight menu modes, the components that fill their slots, and a full screen and dialog template set.',\n module: '@cratis/scene.blueprint.default',\n license: 'MIT',\n licenseUrl: 'https://github.com/Cratis/Scene/blob/main/LICENSE',\n};\n\n/**\n * The default blueprint as a loadable bundle.\n *\n * The manifest names things; this provides them. `validatePackageBundle` is what proves the two agree, and\n * this package's specs run it - a manifest promising a component the bundle never registered renders as a\n * dashed red placeholder somewhere deep inside a screen, a long way from the declaration that caused it.\n *\n * The screens are the gallery: real {@link Screen} instances naming a layout, a screen template and the\n * content that fills it, so a preview boots them through the real engine as a working miniature\n * application rather than a set of pictures.\n */\nexport const defaultBlueprint: ScenePackageBundle = {\n manifest: defaultBlueprintManifest,\n components: defaultBlueprintComponents,\n layouts: defaultLayouts,\n screenTemplates: galleryScreenTemplates,\n dialogTemplates: galleryDialogTemplates,\n screens: galleryScreens,\n themes: defaultBlueprintThemes,\n descriptors: describeComponents(defaultBlueprintManifest.name, foundationDescriptors, defaultBlueprintComponentMetadata),\n};\n"],"names":["defaultBlueprintManifest","name","defaultBlueprintName","version","kind","PackageKind","Blueprint","dependencies","components","Object","values","ComponentName","layouts","LayoutName","screenTemplates","galleryScreenTemplates","map","template","dialogTemplates","galleryDialogTemplates","themes","defaultBlueprintThemes","theme","displayName","description","module","license","licenseUrl","defaultBlueprint","manifest","defaultBlueprintComponents","defaultLayouts","screens","galleryScreens","descriptors","describeComponents","foundationDescriptors","defaultBlueprintComponentMetadata"],"mappings":"
|
|
1
|
+
{"version":3,"file":"defaultBlueprint.js","sources":["../../defaultBlueprint.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 { PackageKind, ScenePackage } from '@cratis/scene.model';\nimport { ScenePackageBundle, describeComponents } from '@cratis/scene.react';\nimport { ComponentName } from './ComponentName';\nimport { defaultBlueprintComponentMetadata } from './defaultBlueprintComponentMetadata';\nimport { foundationDescriptors } from './foundation';\nimport { defaultBlueprintComponents } from './defaultBlueprintComponents';\nimport { galleryDialogTemplates, galleryScreenTemplates, galleryScreens } from './gallery';\nimport { LayoutName, defaultLayouts } from './layouts';\nimport { defaultBlueprintName } from './packageName';\nimport { defaultBlueprintThemes } from './themes';\n\n/**\n * The default blueprint's declaration.\n *\n * A blueprint is the package an application picks once to get a coherent shape: the {@link Layout}s that\n * are its base navigational look, the {@link ScreenTemplate}s and {@link DialogTemplate}s that go inside\n * them, the components that fill their slots, and the themes that color all of it. Picking the parts\n * separately is how an application ends up with a sidebar from one design language and a form from\n * another.\n *\n * The dependency list is what makes a blueprint honest about what it is built from. This one declares\n * PrimeReact - the shell's buttons, breadcrumb, overlay menu and drawer are PrimeReact 10 components - and\n * Cratis Components, which its screen templates fill their content with. A profile that activated this\n * blueprint without them would render a shell whose every control was a dashed red placeholder, and\n * `resolvePackageDependencies` exists to catch that when the profile is configured rather than when\n * someone opens the page.\n *\n * `layouts` lists only true application shells. A dashboard, a CRUD list or a sign-in screen is a screen\n * template, not a layout, and is listed as one.\n */\nexport const defaultBlueprintManifest: ScenePackage = {\n name: defaultBlueprintName,\n version: '1.0.0',\n kind: PackageKind.Blueprint,\n dependencies: [{ name: 'PrimeReact' }, { name: 'Cratis.Components' }],\n components: Object.values(ComponentName),\n layouts: Object.values(LayoutName),\n screenTemplates: galleryScreenTemplates.map(template => template.name),\n dialogTemplates: galleryDialogTemplates.map(template => template.name),\n themes: defaultBlueprintThemes.map(theme => theme.name),\n displayName: 'Cratis Default Blueprint',\n description: 'Application shells with eight menu modes, the components that fill their slots, and a full screen and dialog template set.',\n module: '@cratis/scene.blueprint.default',\n license: 'MIT',\n licenseUrl: 'https://github.com/Cratis/Scene/blob/main/LICENSE',\n};\n\n/**\n * The default blueprint as a loadable bundle.\n *\n * The manifest names things; this provides them. `validatePackageBundle` is what proves the two agree, and\n * this package's specs run it - a manifest promising a component the bundle never registered renders as a\n * dashed red placeholder somewhere deep inside a screen, a long way from the declaration that caused it.\n *\n * The screens are the gallery: real {@link Screen} instances naming a layout, a screen template and the\n * content that fills it, so a preview boots them through the real engine as a working miniature\n * application rather than a set of pictures.\n */\nexport const defaultBlueprint: ScenePackageBundle = {\n manifest: defaultBlueprintManifest,\n components: defaultBlueprintComponents,\n layouts: defaultLayouts,\n screenTemplates: galleryScreenTemplates,\n dialogTemplates: galleryDialogTemplates,\n screens: galleryScreens,\n themes: defaultBlueprintThemes,\n descriptors: describeComponents(defaultBlueprintManifest.name, foundationDescriptors, defaultBlueprintComponentMetadata),\n};\n"],"names":["defaultBlueprintManifest","name","defaultBlueprintName","version","kind","PackageKind","Blueprint","dependencies","components","Object","values","ComponentName","layouts","LayoutName","screenTemplates","galleryScreenTemplates","map","template","dialogTemplates","galleryDialogTemplates","themes","defaultBlueprintThemes","theme","displayName","description","module","license","licenseUrl","defaultBlueprint","manifest","defaultBlueprintComponents","defaultLayouts","screens","galleryScreens","descriptors","describeComponents","foundationDescriptors","defaultBlueprintComponentMetadata"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAaA;;;;;;;;;;;;;;;;;;UAmBaA,wBAAAA,GAAyC;IAClDC,IAAAA,EAAMC,gCAAAA;IACNC,OAAAA,EAAS,OAAA;AACTC,IAAAA,IAAAA,EAAMC,wBAAYC,SAAS;IAC3BC,YAAAA,EAAc;AAAC,QAAA;YAAEN,IAAAA,EAAM;AAAa,SAAA;AAAG,QAAA;YAAEA,IAAAA,EAAM;AAAoB;AAAE,KAAA;IACrEO,UAAAA,EAAYC,MAAAA,CAAOC,MAAM,CAACC,2BAAAA,CAAAA;IAC1BC,OAAAA,EAASH,MAAAA,CAAOC,MAAM,CAACG,qBAAAA,CAAAA;AACvBC,IAAAA,eAAAA,EAAiBC,+BAAuBC,GAAG,CAACC,CAAAA,QAAAA,GAAYA,SAAShB,IAAI,CAAA;AACrEiB,IAAAA,eAAAA,EAAiBC,uCAAuBH,GAAG,CAACC,CAAAA,QAAAA,GAAYA,SAAShB,IAAI,CAAA;AACrEmB,IAAAA,MAAAA,EAAQC,8CAAuBL,GAAG,CAACM,CAAAA,KAAAA,GAASA,MAAMrB,IAAI,CAAA;IACtDsB,WAAAA,EAAa,0BAAA;IACbC,WAAAA,EAAa,4HAAA;IACbC,MAAAA,EAAQ,iCAAA;IACRC,OAAAA,EAAS,KAAA;IACTC,UAAAA,EAAY;AAChB;AAEA;;;;;;;;;;UAWaC,gBAAAA,GAAuC;IAChDC,QAAAA,EAAU7B,wBAAAA;IACVQ,UAAAA,EAAYsB,qDAAAA;IACZlB,OAAAA,EAASmB,6BAAAA;IACTjB,eAAAA,EAAiBC,8BAAAA;IACjBG,eAAAA,EAAiBC,sCAAAA;IACjBa,OAAAA,EAASC,sBAAAA;IACTb,MAAAA,EAAQC,6CAAAA;AACRa,IAAAA,WAAAA,EAAaC,8BAAAA,CAAmBnC,wBAAAA,CAAyBC,IAAI,EAAEmC,2CAAAA,EAAuBC,mEAAAA;AAC1F;;;"}
|
|
@@ -5,6 +5,8 @@ require('./foundation/ComponentState.js');
|
|
|
5
5
|
require('react/jsx-runtime');
|
|
6
6
|
require('react');
|
|
7
7
|
var scene_react = require('@cratis/scene.react');
|
|
8
|
+
require('./foundation/ActivityFeed.js');
|
|
9
|
+
require('./foundation/ApprovalChainStepper.js');
|
|
8
10
|
require('./foundation/foundationDescriptors.js');
|
|
9
11
|
var foundationComponentMetadata = require('./foundation/foundationComponentMetadata.js');
|
|
10
12
|
require('./foundation/foundationSamples.js');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultBlueprintComponentMetadata.js","sources":["../../defaultBlueprintComponentMetadata.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 { ComponentCategory } from '@cratis/scene.model';\nimport { foundationComponentMetadata } from './foundation';\nimport { ComponentMetadata, componentMetadata as m, navigationDesignMode } from '@cratis/scene.react';\n\n/** The category, icon, keywords and picker badge of every component of the package (CMP1), keyed by bare component name. */\nexport const defaultBlueprintComponentMetadata: Record<string, ComponentMetadata> = {\n ...foundationComponentMetadata,\n appShell: m('Application shell', ComponentCategory.Layout, 'app-window', ['layout', 'frame', 'chrome']),\n fullPageShell: m('Full page shell', ComponentCategory.Layout, 'maximize', ['layout', 'fullscreen', 'frame']),\n topbar: m('Topbar', ComponentCategory.Navigation, 'panel-top', ['header', 'top bar', 'navigation'], 'Tp', navigationDesignMode()),\n sidebar: m('Side bar', ComponentCategory.Navigation, 'panel-left', ['navigation', 'menu', 'side panel'], 'Sb', navigationDesignMode({ sidebar: true })),\n menu: m('Menu', ComponentCategory.Navigation, 'menu', ['navigation', 'list', 'links']),\n menuItem: m('Menu item', ComponentCategory.Navigation, 'minus', ['link', 'entry', 'navigation']),\n breadcrumb: m('Breadcrumbs', ComponentCategory.Navigation, 'chevron-right', ['trail', 'path', 'navigation']),\n footer: m('Footer', ComponentCategory.Layout, 'panel-bottom', ['bottom', 'page footer']),\n rightPanel: m('Right panel', ComponentCategory.Layout, 'panel-right', ['side panel', 'drawer', 'aside']),\n configPanel: m('Config panel', ComponentCategory.Layout, 'settings', ['settings', 'layout options', 'preferences']),\n pageHeader: m('Page header', ComponentCategory.Layout, 'heading', ['title', 'header', 'page title']),\n mask: m('Mask', ComponentCategory.Feedback, 'layers', ['overlay', 'scrim', 'backdrop']),\n logo: m('Logo', ComponentCategory.DataDisplay, 'badge', ['brand', 'identity', 'image']),\n userMenu: m('User menu', ComponentCategory.Actions, 'circle-user', ['account', 'profile', 'sign out']),\n themeSwitcher: m('Theme switcher', ComponentCategory.Actions, 'palette', ['theme', 'dark mode', 'colors']),\n layoutModeSwitcher: m('Layout mode switcher', ComponentCategory.Actions, 'layout-dashboard', ['layout', 'mode', 'navigation style']),\n};\n"],"names":["defaultBlueprintComponentMetadata","foundationComponentMetadata","appShell","m","ComponentCategory","Layout","fullPageShell","topbar","Navigation","navigationDesignMode","sidebar","menu","menuItem","breadcrumb","footer","rightPanel","configPanel","pageHeader","mask","Feedback","logo","DataDisplay","userMenu","Actions","themeSwitcher","layoutModeSwitcher"],"mappings":"
|
|
1
|
+
{"version":3,"file":"defaultBlueprintComponentMetadata.js","sources":["../../defaultBlueprintComponentMetadata.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 { ComponentCategory } from '@cratis/scene.model';\nimport { foundationComponentMetadata } from './foundation';\nimport { ComponentMetadata, componentMetadata as m, navigationDesignMode } from '@cratis/scene.react';\n\n/** The category, icon, keywords and picker badge of every component of the package (CMP1), keyed by bare component name. */\nexport const defaultBlueprintComponentMetadata: Record<string, ComponentMetadata> = {\n ...foundationComponentMetadata,\n appShell: m('Application shell', ComponentCategory.Layout, 'app-window', ['layout', 'frame', 'chrome']),\n fullPageShell: m('Full page shell', ComponentCategory.Layout, 'maximize', ['layout', 'fullscreen', 'frame']),\n topbar: m('Topbar', ComponentCategory.Navigation, 'panel-top', ['header', 'top bar', 'navigation'], 'Tp', navigationDesignMode()),\n sidebar: m('Side bar', ComponentCategory.Navigation, 'panel-left', ['navigation', 'menu', 'side panel'], 'Sb', navigationDesignMode({ sidebar: true })),\n menu: m('Menu', ComponentCategory.Navigation, 'menu', ['navigation', 'list', 'links']),\n menuItem: m('Menu item', ComponentCategory.Navigation, 'minus', ['link', 'entry', 'navigation']),\n breadcrumb: m('Breadcrumbs', ComponentCategory.Navigation, 'chevron-right', ['trail', 'path', 'navigation']),\n footer: m('Footer', ComponentCategory.Layout, 'panel-bottom', ['bottom', 'page footer']),\n rightPanel: m('Right panel', ComponentCategory.Layout, 'panel-right', ['side panel', 'drawer', 'aside']),\n configPanel: m('Config panel', ComponentCategory.Layout, 'settings', ['settings', 'layout options', 'preferences']),\n pageHeader: m('Page header', ComponentCategory.Layout, 'heading', ['title', 'header', 'page title']),\n mask: m('Mask', ComponentCategory.Feedback, 'layers', ['overlay', 'scrim', 'backdrop']),\n logo: m('Logo', ComponentCategory.DataDisplay, 'badge', ['brand', 'identity', 'image']),\n userMenu: m('User menu', ComponentCategory.Actions, 'circle-user', ['account', 'profile', 'sign out']),\n themeSwitcher: m('Theme switcher', ComponentCategory.Actions, 'palette', ['theme', 'dark mode', 'colors']),\n layoutModeSwitcher: m('Layout mode switcher', ComponentCategory.Actions, 'layout-dashboard', ['layout', 'mode', 'navigation style']),\n};\n"],"names":["defaultBlueprintComponentMetadata","foundationComponentMetadata","appShell","m","ComponentCategory","Layout","fullPageShell","topbar","Navigation","navigationDesignMode","sidebar","menu","menuItem","breadcrumb","footer","rightPanel","configPanel","pageHeader","mask","Feedback","logo","DataDisplay","userMenu","Actions","themeSwitcher","layoutModeSwitcher"],"mappings":"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"}
|
|
@@ -14,6 +14,13 @@ var ChartWrapper = require('./foundation/ChartWrapper.js');
|
|
|
14
14
|
var FilterBuilder = require('./foundation/FilterBuilder.js');
|
|
15
15
|
var ColumnChooser = require('./foundation/ColumnChooser.js');
|
|
16
16
|
var SavedViewsMenu = require('./foundation/SavedViewsMenu.js');
|
|
17
|
+
var ChecklistSection = require('./foundation/ChecklistSection.js');
|
|
18
|
+
var ActivityFeed = require('./foundation/ActivityFeed.js');
|
|
19
|
+
var AvatarStack = require('./foundation/AvatarStack.js');
|
|
20
|
+
var FileUploader = require('./foundation/FileUploader.js');
|
|
21
|
+
var ApprovalChainStepper = require('./foundation/ApprovalChainStepper.js');
|
|
22
|
+
var OrgTree = require('./foundation/OrgTree.js');
|
|
23
|
+
var PermissionMatrix = require('./foundation/PermissionMatrix.js');
|
|
17
24
|
require('./foundation/foundationDescriptors.js');
|
|
18
25
|
require('./foundation/foundationComponentMetadata.js');
|
|
19
26
|
require('./foundation/foundationSamples.js');
|
|
@@ -67,7 +74,14 @@ var LayoutModeSwitcher = require('./shell/LayoutModeSwitcher.js');
|
|
|
67
74
|
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ChartWrapper)]: ChartWrapper.ChartWrapper,
|
|
68
75
|
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.FilterBuilder)]: FilterBuilder.FilterBuilder,
|
|
69
76
|
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ColumnChooser)]: ColumnChooser.ColumnChooser,
|
|
70
|
-
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.SavedViewsMenu)]: SavedViewsMenu.SavedViewsMenu
|
|
77
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.SavedViewsMenu)]: SavedViewsMenu.SavedViewsMenu,
|
|
78
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ChecklistSection)]: ChecklistSection.ChecklistSection,
|
|
79
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ActivityFeed)]: ActivityFeed.ActivityFeed,
|
|
80
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.AvatarStack)]: AvatarStack.AvatarStack,
|
|
81
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.FileUploader)]: FileUploader.FileUploader,
|
|
82
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ApprovalChainStepper)]: ApprovalChainStepper.ApprovalChainStepper,
|
|
83
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.OrgTree)]: OrgTree.OrgTree,
|
|
84
|
+
[scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.PermissionMatrix)]: PermissionMatrix.PermissionMatrix
|
|
71
85
|
};
|
|
72
86
|
|
|
73
87
|
exports.defaultBlueprintComponents = defaultBlueprintComponents;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"defaultBlueprintComponents.js","sources":["../../defaultBlueprintComponents.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 { ComponentRegistry, componentRegistryKey } from '@cratis/scene.react';\nimport { ComponentName } from './ComponentName';\nimport { defaultBlueprintName } from './packageName';\nimport { ChartWrapper, ColumnChooser, EmptyState, FilterBuilder, SavedViewsMenu, StatCard, StatusChip, TrendChip } from './foundation';\nimport {\n AppShell,\n Breadcrumb,\n ConfigPanel,\n Footer,\n FullPageShell,\n LayoutModeSwitcher,\n Logo,\n Mask,\n Menu,\n MenuItem,\n PageHeader,\n RightPanel,\n Sidebar,\n ThemeSwitcher,\n Topbar,\n UserMenu,\n} from './shell';\n\n/**\n * The components this package registers, keyed the way the renderer looks them up.\n *\n * Every key is built with `componentRegistryKey` rather than written out, because the separator between\n * package and component name is the registry's own business - it is deliberately not the `.` a screen uses\n * to qualify a name, so that a package name containing dots stays unambiguous. Building a key by hand is\n * how a component ends up registered under something no lookup will ever produce.\n */\nexport const defaultBlueprintComponents: ComponentRegistry = {\n [componentRegistryKey(defaultBlueprintName, ComponentName.AppShell)]: AppShell,\n [componentRegistryKey(defaultBlueprintName, ComponentName.FullPageShell)]: FullPageShell,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Topbar)]: Topbar,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Sidebar)]: Sidebar,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Menu)]: Menu,\n [componentRegistryKey(defaultBlueprintName, ComponentName.MenuItem)]: MenuItem,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Breadcrumb)]: Breadcrumb,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Footer)]: Footer,\n [componentRegistryKey(defaultBlueprintName, ComponentName.RightPanel)]: RightPanel,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ConfigPanel)]: ConfigPanel,\n [componentRegistryKey(defaultBlueprintName, ComponentName.PageHeader)]: PageHeader,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Mask)]: Mask,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Logo)]: Logo,\n [componentRegistryKey(defaultBlueprintName, ComponentName.UserMenu)]: UserMenu,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ThemeSwitcher)]: ThemeSwitcher,\n [componentRegistryKey(defaultBlueprintName, ComponentName.LayoutModeSwitcher)]: LayoutModeSwitcher,\n [componentRegistryKey(defaultBlueprintName, ComponentName.EmptyState)]: EmptyState,\n [componentRegistryKey(defaultBlueprintName, ComponentName.StatCard)]: StatCard,\n [componentRegistryKey(defaultBlueprintName, ComponentName.TrendChip)]: TrendChip,\n [componentRegistryKey(defaultBlueprintName, ComponentName.StatusChip)]: StatusChip,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ChartWrapper)]: ChartWrapper,\n [componentRegistryKey(defaultBlueprintName, ComponentName.FilterBuilder)]: FilterBuilder,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ColumnChooser)]: ColumnChooser,\n [componentRegistryKey(defaultBlueprintName, ComponentName.SavedViewsMenu)]: SavedViewsMenu,\n};\n"],"names":["defaultBlueprintComponents","componentRegistryKey","defaultBlueprintName","ComponentName","AppShell","FullPageShell","Topbar","Sidebar","Menu","MenuItem","Breadcrumb","Footer","RightPanel","ConfigPanel","PageHeader","Mask","Logo","UserMenu","ThemeSwitcher","LayoutModeSwitcher","EmptyState","StatCard","TrendChip","StatusChip","ChartWrapper","FilterBuilder","ColumnChooser","SavedViewsMenu"],"mappings":"
|
|
1
|
+
{"version":3,"file":"defaultBlueprintComponents.js","sources":["../../defaultBlueprintComponents.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 { ComponentRegistry, componentRegistryKey } from '@cratis/scene.react';\nimport { ComponentName } from './ComponentName';\nimport { defaultBlueprintName } from './packageName';\nimport { ActivityFeed, ApprovalChainStepper, AvatarStack, ChartWrapper, ChecklistSection, ColumnChooser, FileUploader, EmptyState, FilterBuilder, OrgTree, PermissionMatrix, SavedViewsMenu, StatCard, StatusChip, TrendChip } from './foundation';\nimport {\n AppShell,\n Breadcrumb,\n ConfigPanel,\n Footer,\n FullPageShell,\n LayoutModeSwitcher,\n Logo,\n Mask,\n Menu,\n MenuItem,\n PageHeader,\n RightPanel,\n Sidebar,\n ThemeSwitcher,\n Topbar,\n UserMenu,\n} from './shell';\n\n/**\n * The components this package registers, keyed the way the renderer looks them up.\n *\n * Every key is built with `componentRegistryKey` rather than written out, because the separator between\n * package and component name is the registry's own business - it is deliberately not the `.` a screen uses\n * to qualify a name, so that a package name containing dots stays unambiguous. Building a key by hand is\n * how a component ends up registered under something no lookup will ever produce.\n */\nexport const defaultBlueprintComponents: ComponentRegistry = {\n [componentRegistryKey(defaultBlueprintName, ComponentName.AppShell)]: AppShell,\n [componentRegistryKey(defaultBlueprintName, ComponentName.FullPageShell)]: FullPageShell,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Topbar)]: Topbar,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Sidebar)]: Sidebar,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Menu)]: Menu,\n [componentRegistryKey(defaultBlueprintName, ComponentName.MenuItem)]: MenuItem,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Breadcrumb)]: Breadcrumb,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Footer)]: Footer,\n [componentRegistryKey(defaultBlueprintName, ComponentName.RightPanel)]: RightPanel,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ConfigPanel)]: ConfigPanel,\n [componentRegistryKey(defaultBlueprintName, ComponentName.PageHeader)]: PageHeader,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Mask)]: Mask,\n [componentRegistryKey(defaultBlueprintName, ComponentName.Logo)]: Logo,\n [componentRegistryKey(defaultBlueprintName, ComponentName.UserMenu)]: UserMenu,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ThemeSwitcher)]: ThemeSwitcher,\n [componentRegistryKey(defaultBlueprintName, ComponentName.LayoutModeSwitcher)]: LayoutModeSwitcher,\n [componentRegistryKey(defaultBlueprintName, ComponentName.EmptyState)]: EmptyState,\n [componentRegistryKey(defaultBlueprintName, ComponentName.StatCard)]: StatCard,\n [componentRegistryKey(defaultBlueprintName, ComponentName.TrendChip)]: TrendChip,\n [componentRegistryKey(defaultBlueprintName, ComponentName.StatusChip)]: StatusChip,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ChartWrapper)]: ChartWrapper,\n [componentRegistryKey(defaultBlueprintName, ComponentName.FilterBuilder)]: FilterBuilder,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ColumnChooser)]: ColumnChooser,\n [componentRegistryKey(defaultBlueprintName, ComponentName.SavedViewsMenu)]: SavedViewsMenu,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ChecklistSection)]: ChecklistSection,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ActivityFeed)]: ActivityFeed,\n [componentRegistryKey(defaultBlueprintName, ComponentName.AvatarStack)]: AvatarStack,\n [componentRegistryKey(defaultBlueprintName, ComponentName.FileUploader)]: FileUploader,\n [componentRegistryKey(defaultBlueprintName, ComponentName.ApprovalChainStepper)]: ApprovalChainStepper,\n [componentRegistryKey(defaultBlueprintName, ComponentName.OrgTree)]: OrgTree,\n [componentRegistryKey(defaultBlueprintName, ComponentName.PermissionMatrix)]: PermissionMatrix,\n};\n"],"names":["defaultBlueprintComponents","componentRegistryKey","defaultBlueprintName","ComponentName","AppShell","FullPageShell","Topbar","Sidebar","Menu","MenuItem","Breadcrumb","Footer","RightPanel","ConfigPanel","PageHeader","Mask","Logo","UserMenu","ThemeSwitcher","LayoutModeSwitcher","EmptyState","StatCard","TrendChip","StatusChip","ChartWrapper","FilterBuilder","ColumnChooser","SavedViewsMenu","ChecklistSection","ActivityFeed","AvatarStack","FileUploader","ApprovalChainStepper","OrgTree","PermissionMatrix"],"mappings":"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"}
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var react = require('react');
|
|
5
|
+
var elementProperties = require('../shell/elementProperties.js');
|
|
6
|
+
var activityModel = require('./activityModel.js');
|
|
7
|
+
var ComponentState = require('./ComponentState.js');
|
|
8
|
+
var FoundationIcon = require('./FoundationIcon.js');
|
|
9
|
+
var formatting = require('./formatting.js');
|
|
10
|
+
var foundationStrings = require('./foundationStrings.js');
|
|
11
|
+
var StateFrame = require('./StateFrame.js');
|
|
12
|
+
|
|
13
|
+
const icons = {
|
|
14
|
+
[activityModel.ActivityKind.Comment]: 'user',
|
|
15
|
+
[activityModel.ActivityKind.Change]: 'refresh',
|
|
16
|
+
[activityModel.ActivityKind.Status]: 'check',
|
|
17
|
+
[activityModel.ActivityKind.System]: 'info'
|
|
18
|
+
};
|
|
19
|
+
/**
|
|
20
|
+
* The `activityFeed` component: what happened to a record, newest first, under a heading for each day.
|
|
21
|
+
*
|
|
22
|
+
* `entries` carry an id, who (`actor`), what (`action`), the instant (`at`, ISO 8601), a `kind` and an optional `body` such as a comment's
|
|
23
|
+
* text. The feed is an ordered list; each entry names its kind in words for assistive technology as well as by icon, and its time is a
|
|
24
|
+
* `time` element formatted for the locale. Content is supplied by the application - this only lays it out - and a feed of any length
|
|
25
|
+
* stays one list. `order="ascending"` reads oldest first, and `timeZone` fixes the zone days are cut in.
|
|
26
|
+
*/ function ActivityFeed({ element, interactions }) {
|
|
27
|
+
const entries = react.useMemo(()=>activityModel.readActivity(element.properties.entries), [
|
|
28
|
+
element.properties.entries
|
|
29
|
+
]);
|
|
30
|
+
const strings = foundationStrings.readFoundationStrings(element);
|
|
31
|
+
const locale = formatting.readLocale(element);
|
|
32
|
+
const timeZone = elementProperties.readOptionalString(element, 'timeZone');
|
|
33
|
+
const days = react.useMemo(()=>activityModel.groupByDay(entries, element.properties.order === 'ascending', timeZone), [
|
|
34
|
+
entries,
|
|
35
|
+
element.properties.order,
|
|
36
|
+
timeZone
|
|
37
|
+
]);
|
|
38
|
+
const state = ComponentState.readComponentState(element, entries.length > 0);
|
|
39
|
+
const kindText = {
|
|
40
|
+
comment: strings.activityComment,
|
|
41
|
+
change: strings.activityChange,
|
|
42
|
+
status: strings.activityStatus,
|
|
43
|
+
system: strings.activitySystem
|
|
44
|
+
};
|
|
45
|
+
const emptyElement = state === ComponentState.ComponentState.Empty ? {
|
|
46
|
+
...element,
|
|
47
|
+
properties: {
|
|
48
|
+
emptyHeadline: strings.activityEmpty,
|
|
49
|
+
...element.properties
|
|
50
|
+
}
|
|
51
|
+
} : element;
|
|
52
|
+
return /*#__PURE__*/ jsxRuntime.jsx(StateFrame.FoundationFrame, {
|
|
53
|
+
element: emptyElement,
|
|
54
|
+
interactions: interactions,
|
|
55
|
+
name: "activity-feed",
|
|
56
|
+
state: state,
|
|
57
|
+
skeleton: [
|
|
58
|
+
60,
|
|
59
|
+
90,
|
|
60
|
+
70,
|
|
61
|
+
85
|
|
62
|
+
],
|
|
63
|
+
children: (state === ComponentState.ComponentState.Ready || state === ComponentState.ComponentState.Partial) && days.map((day)=>/*#__PURE__*/ jsxRuntime.jsxs("section", {
|
|
64
|
+
className: "foundation-activity-day",
|
|
65
|
+
children: [
|
|
66
|
+
/*#__PURE__*/ jsxRuntime.jsx("h3", {
|
|
67
|
+
className: "foundation-activity-heading",
|
|
68
|
+
children: /*#__PURE__*/ jsxRuntime.jsx("time", {
|
|
69
|
+
dateTime: day.day,
|
|
70
|
+
children: formatting.formatDay(day.day, locale)
|
|
71
|
+
})
|
|
72
|
+
}),
|
|
73
|
+
/*#__PURE__*/ jsxRuntime.jsx("ol", {
|
|
74
|
+
className: "foundation-activity-list",
|
|
75
|
+
children: day.entries.map((entry)=>/*#__PURE__*/ jsxRuntime.jsxs("li", {
|
|
76
|
+
className: "foundation-activity-entry",
|
|
77
|
+
"data-kind": entry.kind,
|
|
78
|
+
children: [
|
|
79
|
+
/*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
80
|
+
className: "foundation-activity-icon",
|
|
81
|
+
children: /*#__PURE__*/ jsxRuntime.jsx(FoundationIcon.FoundationIcon, {
|
|
82
|
+
name: icons[entry.kind]
|
|
83
|
+
})
|
|
84
|
+
}),
|
|
85
|
+
/*#__PURE__*/ jsxRuntime.jsxs("div", {
|
|
86
|
+
className: "foundation-activity-content",
|
|
87
|
+
children: [
|
|
88
|
+
/*#__PURE__*/ jsxRuntime.jsxs("p", {
|
|
89
|
+
className: "foundation-activity-summary",
|
|
90
|
+
children: [
|
|
91
|
+
/*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
92
|
+
className: "foundation-visually-hidden",
|
|
93
|
+
children: `${kindText[entry.kind]}: `
|
|
94
|
+
}),
|
|
95
|
+
/*#__PURE__*/ jsxRuntime.jsx("strong", {
|
|
96
|
+
children: entry.actor
|
|
97
|
+
}),
|
|
98
|
+
" ",
|
|
99
|
+
entry.action
|
|
100
|
+
]
|
|
101
|
+
}),
|
|
102
|
+
entry.body && /*#__PURE__*/ jsxRuntime.jsx("p", {
|
|
103
|
+
className: "foundation-activity-body",
|
|
104
|
+
children: entry.body
|
|
105
|
+
}),
|
|
106
|
+
/*#__PURE__*/ jsxRuntime.jsx("time", {
|
|
107
|
+
className: "foundation-count",
|
|
108
|
+
dateTime: entry.at,
|
|
109
|
+
children: formatting.formatDate(entry.at, locale, true)
|
|
110
|
+
})
|
|
111
|
+
]
|
|
112
|
+
})
|
|
113
|
+
]
|
|
114
|
+
}, entry.id))
|
|
115
|
+
})
|
|
116
|
+
]
|
|
117
|
+
}, day.day))
|
|
118
|
+
});
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
exports.ActivityFeed = ActivityFeed;
|
|
122
|
+
//# sourceMappingURL=ActivityFeed.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ActivityFeed.js","sources":["../../../foundation/ActivityFeed.tsx"],"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 { useMemo } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { readOptionalString } from '../shell/elementProperties';\nimport { ActivityKind, groupByDay, readActivity } from './activityModel';\nimport { ComponentState, readComponentState } from './ComponentState';\nimport { FoundationIcon, FoundationIconName } from './FoundationIcon';\nimport { formatDate, formatDay, readLocale } from './formatting';\nimport { readFoundationStrings } from './foundationStrings';\nimport { FoundationFrame } from './StateFrame';\n\nconst icons: Record<ActivityKind, FoundationIconName> = {\n [ActivityKind.Comment]: 'user', [ActivityKind.Change]: 'refresh', [ActivityKind.Status]: 'check', [ActivityKind.System]: 'info',\n};\n\n/**\n * The `activityFeed` component: what happened to a record, newest first, under a heading for each day.\n *\n * `entries` carry an id, who (`actor`), what (`action`), the instant (`at`, ISO 8601), a `kind` and an optional `body` such as a comment's\n * text. The feed is an ordered list; each entry names its kind in words for assistive technology as well as by icon, and its time is a\n * `time` element formatted for the locale. Content is supplied by the application - this only lays it out - and a feed of any length\n * stays one list. `order=\"ascending\"` reads oldest first, and `timeZone` fixes the zone days are cut in.\n */\nexport function ActivityFeed({ element, interactions }: RegisteredComponentProps) {\n const entries = useMemo(() => readActivity(element.properties.entries), [element.properties.entries]);\n const strings = readFoundationStrings(element);\n const locale = readLocale(element);\n const timeZone = readOptionalString(element, 'timeZone');\n const days = useMemo(() => groupByDay(entries, element.properties.order === 'ascending', timeZone), [entries, element.properties.order, timeZone]);\n const state = readComponentState(element, entries.length > 0);\n const kindText: Record<ActivityKind, string> = { comment: strings.activityComment, change: strings.activityChange, status: strings.activityStatus, system: strings.activitySystem };\n const emptyElement = state === ComponentState.Empty ? { ...element, properties: { emptyHeadline: strings.activityEmpty, ...element.properties } } : element;\n\n return (\n <FoundationFrame element={emptyElement} interactions={interactions} name='activity-feed' state={state} skeleton={[60, 90, 70, 85]}>\n {(state === ComponentState.Ready || state === ComponentState.Partial) && days.map(day => (\n <section key={day.day} className='foundation-activity-day'>\n <h3 className='foundation-activity-heading'><time dateTime={day.day}>{formatDay(day.day, locale)}</time></h3>\n <ol className='foundation-activity-list'>\n {day.entries.map(entry => (\n <li key={entry.id} className='foundation-activity-entry' data-kind={entry.kind}>\n <span className='foundation-activity-icon'><FoundationIcon name={icons[entry.kind]} /></span>\n <div className='foundation-activity-content'>\n <p className='foundation-activity-summary'>\n <span className='foundation-visually-hidden'>{`${kindText[entry.kind]}: `}</span>\n <strong>{entry.actor}</strong> {entry.action}\n </p>\n {entry.body && <p className='foundation-activity-body'>{entry.body}</p>}\n <time className='foundation-count' dateTime={entry.at}>{formatDate(entry.at, locale, true)}</time>\n </div>\n </li>\n ))}\n </ol>\n </section>\n ))}\n </FoundationFrame>\n );\n}\n\n"],"names":["icons","ActivityKind","Comment","Change","Status","System","ActivityFeed","element","interactions","entries","useMemo","readActivity","properties","strings","readFoundationStrings","locale","readLocale","timeZone","readOptionalString","days","groupByDay","order","state","readComponentState","length","kindText","comment","activityComment","change","activityChange","status","activityStatus","system","activitySystem","emptyElement","ComponentState","Empty","emptyHeadline","activityEmpty","_jsx","FoundationFrame","name","skeleton","Ready","Partial","map","day","_jsxs","section","className","h3","time","dateTime","formatDay","ol","entry","li","data-kind","kind","span","FoundationIcon","div","p","strong","actor","action","body","at","formatDate","id"],"mappings":"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"}
|
|
@@ -0,0 +1,130 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var react = require('react');
|
|
5
|
+
var approvalModel = require('./approvalModel.js');
|
|
6
|
+
var ComponentState = require('./ComponentState.js');
|
|
7
|
+
var FoundationIcon = require('./FoundationIcon.js');
|
|
8
|
+
var formatting = require('./formatting.js');
|
|
9
|
+
var foundationStrings = require('./foundationStrings.js');
|
|
10
|
+
var StateFrame = require('./StateFrame.js');
|
|
11
|
+
|
|
12
|
+
const icons = {
|
|
13
|
+
[approvalModel.ApprovalState.Pending]: 'circle',
|
|
14
|
+
[approvalModel.ApprovalState.Current]: 'clock',
|
|
15
|
+
[approvalModel.ApprovalState.Approved]: 'check',
|
|
16
|
+
[approvalModel.ApprovalState.Rejected]: 'close',
|
|
17
|
+
[approvalModel.ApprovalState.Skipped]: 'minus'
|
|
18
|
+
};
|
|
19
|
+
const tones = {
|
|
20
|
+
[approvalModel.ApprovalState.Pending]: 'neutral',
|
|
21
|
+
[approvalModel.ApprovalState.Current]: 'info',
|
|
22
|
+
[approvalModel.ApprovalState.Approved]: 'success',
|
|
23
|
+
[approvalModel.ApprovalState.Rejected]: 'danger',
|
|
24
|
+
[approvalModel.ApprovalState.Skipped]: 'neutral'
|
|
25
|
+
};
|
|
26
|
+
/**
|
|
27
|
+
* The `approvalChainStepper` component: the steps a request goes through, who decides each, and where it stands.
|
|
28
|
+
*
|
|
29
|
+
* `steps` are written in order with a `label`, an `approver`, a `state` (pending, current, approved, rejected, skipped), and when it was
|
|
30
|
+
* decided (`at`) and a `comment`. The chain applies its own rules - a rejection stops the chain and the steps after it read "Not reached", and
|
|
31
|
+
* with no current step the first undecided one is it - so a request page needs no logic of its own. Every step says its state in words as
|
|
32
|
+
* well as by icon and color, the current step carries `aria-current="step"`, and the whole is an ordered list with the overall outcome
|
|
33
|
+
* stated above it. `orientation` is `horizontal` or `vertical`; below a phone's width it is always vertical.
|
|
34
|
+
*/ function ApprovalChainStepper({ element, interactions }) {
|
|
35
|
+
const written = react.useMemo(()=>approvalModel.readSteps(element.properties.steps), [
|
|
36
|
+
element.properties.steps
|
|
37
|
+
]);
|
|
38
|
+
const steps = react.useMemo(()=>approvalModel.effectiveSteps(written), [
|
|
39
|
+
written
|
|
40
|
+
]);
|
|
41
|
+
const outcome = approvalModel.chainOutcome(written);
|
|
42
|
+
const strings = foundationStrings.readFoundationStrings(element);
|
|
43
|
+
const locale = formatting.readLocale(element);
|
|
44
|
+
const state = ComponentState.readComponentState(element, written.length > 0);
|
|
45
|
+
const stateText = {
|
|
46
|
+
pending: strings.approvalPending,
|
|
47
|
+
current: strings.approvalCurrent,
|
|
48
|
+
approved: strings.approvalApproved,
|
|
49
|
+
rejected: strings.approvalRejected,
|
|
50
|
+
skipped: strings.approvalSkipped
|
|
51
|
+
};
|
|
52
|
+
const outcomeText = {
|
|
53
|
+
approved: strings.approvalOutcomeApproved,
|
|
54
|
+
rejected: strings.approvalOutcomeRejected,
|
|
55
|
+
inProgress: strings.approvalOutcomeInProgress,
|
|
56
|
+
pending: strings.approvalOutcomePending
|
|
57
|
+
};
|
|
58
|
+
return /*#__PURE__*/ jsxRuntime.jsx(StateFrame.FoundationFrame, {
|
|
59
|
+
element: element,
|
|
60
|
+
interactions: interactions,
|
|
61
|
+
name: "approval-chain",
|
|
62
|
+
state: state,
|
|
63
|
+
skeleton: [
|
|
64
|
+
100,
|
|
65
|
+
100
|
|
66
|
+
],
|
|
67
|
+
children: (state === ComponentState.ComponentState.Ready || state === ComponentState.ComponentState.Partial) && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
68
|
+
children: [
|
|
69
|
+
/*#__PURE__*/ jsxRuntime.jsx("p", {
|
|
70
|
+
className: "foundation-approval-outcome",
|
|
71
|
+
"data-outcome": outcome,
|
|
72
|
+
children: outcomeText[outcome]
|
|
73
|
+
}),
|
|
74
|
+
/*#__PURE__*/ jsxRuntime.jsx("ol", {
|
|
75
|
+
className: "foundation-approval-steps",
|
|
76
|
+
"aria-label": strings.approvalChain,
|
|
77
|
+
"data-orientation": element.properties.orientation === 'vertical' ? 'vertical' : 'horizontal',
|
|
78
|
+
children: steps.map((step, index)=>/*#__PURE__*/ jsxRuntime.jsxs("li", {
|
|
79
|
+
className: "foundation-approval-step",
|
|
80
|
+
"data-state": step.state,
|
|
81
|
+
"aria-current": step.state === approvalModel.ApprovalState.Current ? 'step' : undefined,
|
|
82
|
+
children: [
|
|
83
|
+
/*#__PURE__*/ jsxRuntime.jsxs("span", {
|
|
84
|
+
className: "foundation-chip",
|
|
85
|
+
"data-tone": tones[step.state],
|
|
86
|
+
children: [
|
|
87
|
+
/*#__PURE__*/ jsxRuntime.jsx(FoundationIcon.FoundationIcon, {
|
|
88
|
+
name: icons[step.state]
|
|
89
|
+
}),
|
|
90
|
+
/*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
91
|
+
children: step.notReached ? strings.approvalNotReached : stateText[step.state]
|
|
92
|
+
})
|
|
93
|
+
]
|
|
94
|
+
}),
|
|
95
|
+
/*#__PURE__*/ jsxRuntime.jsxs("strong", {
|
|
96
|
+
className: "foundation-approval-label",
|
|
97
|
+
children: [
|
|
98
|
+
/*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
99
|
+
className: "foundation-visually-hidden",
|
|
100
|
+
children: `${foundationStrings.formatText(strings.approvalStep, {
|
|
101
|
+
n: index + 1,
|
|
102
|
+
total: steps.length
|
|
103
|
+
})}: `
|
|
104
|
+
}),
|
|
105
|
+
step.label
|
|
106
|
+
]
|
|
107
|
+
}),
|
|
108
|
+
step.approver && /*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
109
|
+
className: "foundation-count",
|
|
110
|
+
children: step.approver
|
|
111
|
+
}),
|
|
112
|
+
step.at && /*#__PURE__*/ jsxRuntime.jsx("time", {
|
|
113
|
+
className: "foundation-count",
|
|
114
|
+
dateTime: step.at,
|
|
115
|
+
children: formatting.formatDate(step.at, locale, true)
|
|
116
|
+
}),
|
|
117
|
+
step.comment && /*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
118
|
+
className: "foundation-approval-comment",
|
|
119
|
+
children: step.comment
|
|
120
|
+
})
|
|
121
|
+
]
|
|
122
|
+
}, step.label + index))
|
|
123
|
+
})
|
|
124
|
+
]
|
|
125
|
+
})
|
|
126
|
+
});
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
exports.ApprovalChainStepper = ApprovalChainStepper;
|
|
130
|
+
//# sourceMappingURL=ApprovalChainStepper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ApprovalChainStepper.js","sources":["../../../foundation/ApprovalChainStepper.tsx"],"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 { useMemo } from 'react';\nimport { RegisteredComponentProps } from '@cratis/scene.react';\nimport { ApprovalState, ChainOutcome, chainOutcome, effectiveSteps, readSteps } from './approvalModel';\nimport { ComponentState, readComponentState } from './ComponentState';\nimport { FoundationIcon, FoundationIconName } from './FoundationIcon';\nimport { formatDate, readLocale } from './formatting';\nimport { formatText, readFoundationStrings } from './foundationStrings';\nimport { FoundationFrame } from './StateFrame';\n\nconst icons: Record<ApprovalState, FoundationIconName> = {\n [ApprovalState.Pending]: 'circle', [ApprovalState.Current]: 'clock', [ApprovalState.Approved]: 'check', [ApprovalState.Rejected]: 'close', [ApprovalState.Skipped]: 'minus',\n};\nconst tones: Record<ApprovalState, string> = {\n [ApprovalState.Pending]: 'neutral', [ApprovalState.Current]: 'info', [ApprovalState.Approved]: 'success', [ApprovalState.Rejected]: 'danger', [ApprovalState.Skipped]: 'neutral',\n};\n\n/**\n * The `approvalChainStepper` component: the steps a request goes through, who decides each, and where it stands.\n *\n * `steps` are written in order with a `label`, an `approver`, a `state` (pending, current, approved, rejected, skipped), and when it was\n * decided (`at`) and a `comment`. The chain applies its own rules - a rejection stops the chain and the steps after it read \"Not reached\", and\n * with no current step the first undecided one is it - so a request page needs no logic of its own. Every step says its state in words as\n * well as by icon and color, the current step carries `aria-current=\"step\"`, and the whole is an ordered list with the overall outcome\n * stated above it. `orientation` is `horizontal` or `vertical`; below a phone's width it is always vertical.\n */\nexport function ApprovalChainStepper({ element, interactions }: RegisteredComponentProps) {\n const written = useMemo(() => readSteps(element.properties.steps), [element.properties.steps]);\n const steps = useMemo(() => effectiveSteps(written), [written]);\n const outcome = chainOutcome(written);\n const strings = readFoundationStrings(element);\n const locale = readLocale(element);\n const state = readComponentState(element, written.length > 0);\n const stateText: Record<ApprovalState, string> = {\n pending: strings.approvalPending, current: strings.approvalCurrent, approved: strings.approvalApproved, rejected: strings.approvalRejected, skipped: strings.approvalSkipped,\n };\n const outcomeText: Record<ChainOutcome, string> = {\n approved: strings.approvalOutcomeApproved, rejected: strings.approvalOutcomeRejected, inProgress: strings.approvalOutcomeInProgress, pending: strings.approvalOutcomePending,\n };\n\n return (\n <FoundationFrame element={element} interactions={interactions} name='approval-chain' state={state} skeleton={[100, 100]}>\n {(state === ComponentState.Ready || state === ComponentState.Partial) && (\n <>\n <p className='foundation-approval-outcome' data-outcome={outcome}>{outcomeText[outcome]}</p>\n <ol className='foundation-approval-steps' aria-label={strings.approvalChain} data-orientation={element.properties.orientation === 'vertical' ? 'vertical' : 'horizontal'}>\n {steps.map((step, index) => (\n <li key={step.label + index} className='foundation-approval-step' data-state={step.state} aria-current={step.state === ApprovalState.Current ? 'step' : undefined}>\n <span className='foundation-chip' data-tone={tones[step.state]}><FoundationIcon name={icons[step.state]} /><span>{step.notReached ? strings.approvalNotReached : stateText[step.state]}</span></span>\n <strong className='foundation-approval-label'>\n <span className='foundation-visually-hidden'>{`${formatText(strings.approvalStep, { n: index + 1, total: steps.length })}: `}</span>\n {step.label}\n </strong>\n {step.approver && <span className='foundation-count'>{step.approver}</span>}\n {step.at && <time className='foundation-count' dateTime={step.at}>{formatDate(step.at, locale, true)}</time>}\n {step.comment && <span className='foundation-approval-comment'>{step.comment}</span>}\n </li>\n ))}\n </ol>\n </>\n )}\n </FoundationFrame>\n );\n}\n"],"names":["icons","ApprovalState","Pending","Current","Approved","Rejected","Skipped","tones","ApprovalChainStepper","element","interactions","written","useMemo","readSteps","properties","steps","effectiveSteps","outcome","chainOutcome","strings","readFoundationStrings","locale","readLocale","state","readComponentState","length","stateText","pending","approvalPending","current","approvalCurrent","approved","approvalApproved","rejected","approvalRejected","skipped","approvalSkipped","outcomeText","approvalOutcomeApproved","approvalOutcomeRejected","inProgress","approvalOutcomeInProgress","approvalOutcomePending","_jsx","FoundationFrame","name","skeleton","ComponentState","Ready","Partial","_jsxs","_Fragment","p","className","data-outcome","ol","aria-label","approvalChain","data-orientation","orientation","map","step","index","li","data-state","aria-current","undefined","span","data-tone","FoundationIcon","notReached","approvalNotReached","strong","formatText","approvalStep","n","total","label","approver","at","time","dateTime","formatDate","comment"],"mappings":"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"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
4
|
+
var react = require('react');
|
|
5
|
+
var avatarModel = require('./avatarModel.js');
|
|
6
|
+
var ComponentState = require('./ComponentState.js');
|
|
7
|
+
var foundationStrings = require('./foundationStrings.js');
|
|
8
|
+
var StateFrame = require('./StateFrame.js');
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* The `avatarStack` component: overlapping avatars for the people on a record, with a "+N" chip for the rest.
|
|
12
|
+
*
|
|
13
|
+
* `people` are names with an optional picture; without one the avatar shows the person's initials. The stack is a labelled group ("5 people"),
|
|
14
|
+
* each avatar is an image named after its person, and the overflow chip says how many more in words. `max` is how many are shown (4 by
|
|
15
|
+
* default) and `size` is `small` or `medium`.
|
|
16
|
+
*/ function AvatarStack({ element, interactions }) {
|
|
17
|
+
const people = react.useMemo(()=>avatarModel.readPeople(element.properties.people), [
|
|
18
|
+
element.properties.people
|
|
19
|
+
]);
|
|
20
|
+
const strings = foundationStrings.readFoundationStrings(element);
|
|
21
|
+
const { shown, hidden } = avatarModel.visiblePeople(people, typeof element.properties.max === 'number' ? element.properties.max : 4);
|
|
22
|
+
const state = ComponentState.readComponentState(element, people.length > 0);
|
|
23
|
+
const size = element.properties.size === 'small' ? 'small' : 'medium';
|
|
24
|
+
return /*#__PURE__*/ jsxRuntime.jsx(StateFrame.FoundationFrame, {
|
|
25
|
+
element: element,
|
|
26
|
+
interactions: interactions,
|
|
27
|
+
name: "avatar-stack",
|
|
28
|
+
state: state,
|
|
29
|
+
skeleton: [
|
|
30
|
+
35
|
|
31
|
+
],
|
|
32
|
+
children: (state === ComponentState.ComponentState.Ready || state === ComponentState.ComponentState.Partial) && /*#__PURE__*/ jsxRuntime.jsxs("ul", {
|
|
33
|
+
className: "foundation-avatars",
|
|
34
|
+
role: "group",
|
|
35
|
+
"aria-label": foundationStrings.formatText(strings.avatarPeople, {
|
|
36
|
+
count: people.length
|
|
37
|
+
}),
|
|
38
|
+
"data-size": size,
|
|
39
|
+
children: [
|
|
40
|
+
shown.map((person)=>/*#__PURE__*/ jsxRuntime.jsx("li", {
|
|
41
|
+
className: "foundation-avatar",
|
|
42
|
+
role: "img",
|
|
43
|
+
"aria-label": person.name,
|
|
44
|
+
title: person.name,
|
|
45
|
+
children: person.imageUrl ? /*#__PURE__*/ jsxRuntime.jsx("img", {
|
|
46
|
+
src: person.imageUrl,
|
|
47
|
+
alt: ""
|
|
48
|
+
}) : /*#__PURE__*/ jsxRuntime.jsx("span", {
|
|
49
|
+
"aria-hidden": "true",
|
|
50
|
+
children: avatarModel.initialsOf(person.name)
|
|
51
|
+
})
|
|
52
|
+
}, person.name)),
|
|
53
|
+
hidden > 0 && /*#__PURE__*/ jsxRuntime.jsx("li", {
|
|
54
|
+
className: "foundation-avatar foundation-avatar-more",
|
|
55
|
+
role: "img",
|
|
56
|
+
"aria-label": foundationStrings.formatText(strings.avatarOverflow, {
|
|
57
|
+
count: hidden
|
|
58
|
+
}),
|
|
59
|
+
children: /*#__PURE__*/ jsxRuntime.jsxs("span", {
|
|
60
|
+
"aria-hidden": "true",
|
|
61
|
+
children: [
|
|
62
|
+
"+",
|
|
63
|
+
hidden
|
|
64
|
+
]
|
|
65
|
+
})
|
|
66
|
+
})
|
|
67
|
+
]
|
|
68
|
+
})
|
|
69
|
+
});
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
exports.AvatarStack = AvatarStack;
|
|
73
|
+
//# sourceMappingURL=AvatarStack.js.map
|