@cratis/scene.blueprint.hr 0.0.0-stage → 4.53.1

package/hrApplication.ts

@@ -0,0 +1,28 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+import { UiProfile } from '@cratis/scene.model';
+import { ApplicationStructureIndex } from '@cratis/scene.engine';
+import { ApplicationDocument, CompositionOptions, defaultLayouts, previewProfile } from '@cratis/scene.blueprint.default';
+import { hrNavigation, hrStructure } from './navigation';
+import { hrScreens } from './screens';
+import { hrDialogTemplates, hrScreenTemplates } from './templates';
+
+/** The id of the sample-data pack a new application starts with. */
+export const hrDefaultSampleDataId = 'hr-nordic';
+
+/**
+ * The example application of the blueprint: the foundation's layouts, the HR People and Time Off templates and quick-create dialogs and its seven screens, rendering against the
+ * foundation's packages with the default sample-data pack chosen. This is what a gallery previews and what the conformance fixture
+ * (`Samples/Hr/hr.play`) declares in Screenplay: the document, the structure and the navigation are the three things an application is made of.
+ */
+export function hrApplication(sampleData: string = hrDefaultSampleDataId): ApplicationDocument {
+    const profile: UiProfile = { ...previewProfile(undefined), name: 'HR People and Time Off', sampleData: { activePack: sampleData, mappings: [], bindings: [] } };
+    return { layouts: defaultLayouts, screenTemplates: hrScreenTemplates, dialogTemplates: hrDialogTemplates, screens: hrScreens, uiProfiles: [profile] };
+}
+
+/** What a host composes the screens with: the application's logo, which the shell's topbar shows. */
+export const hrComposition: CompositionOptions = { logo: hrNavigation.application.logo };
+
+/** The structure and navigation the shell's regions show and the items' destinations resolve against. */
+export const hrNavigationModel = () => ({ structure: new ApplicationStructureIndex(hrStructure), navigation: hrNavigation });

package/hrParts.ts

@@ -0,0 +1,52 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+import {
+    Behavior, BindingSourceKind, DialogTemplate, ExternalComponent, InteractionActionKind, InteractionTriggerKind, NavigateAction, OpenDialogAction, SceneElement, ScreenTemplate, TemplateMetadata, TemplateScope,
+} from '@cratis/scene.model';
+import { component, panel } from '@cratis/scene.blueprint.default';
+import { hrTemplateProvenance } from './templateProvenance';
+
+export { component, panel };
+
+/** The category of every template of this blueprint (spec Part B 1.2: `Business / <domain>`). */
+export const hrCategory = 'Business / HR';
+
+/** The package-relative thumbnail of a template. */
+export const thumbnailOf = (templateName: string): string => `thumbnails/${templateName}.svg`;
+
+/** The metadata of a screen template of this blueprint: provenance, a type from the vocabulary, the category, a thumbnail and the levels it applies at. */
+export const hrMetadata = (name: string, type: 'Dashboard' | 'List' | 'Board' | 'Detail' | 'Form' | 'Dialog' | 'Workspace', scopes: TemplateScope[]): TemplateMetadata =>
+    ({ ...hrTemplateProvenance, type, category: hrCategory, thumbnail: thumbnailOf(name), scopes });
+
+/** A button of the foundation: a verb, its emphasis, and the permission rule every action declares (spec Part B 1.5). */
+export const actionButton = (id: string, label: string, emphasis: 'primary' | 'secondary' | 'quiet' | 'danger', extra: Record<string, unknown> = {}, behaviors?: Behavior[]): ExternalComponent =>
+    ({ ...component(id, 'actionButton', { label, emphasis, permission: 'enabled', ...extra }), ...(behaviors ? { behaviors } : {}) });
+
+/** What pressing an element does: open the named dialog template over the page. */
+export const opensDialog = (dialogTemplate: string): Behavior[] =>
+    [{ bindings: [{ trigger: { kind: InteractionTriggerKind.Click }, actions: [{ kind: InteractionActionKind.OpenDialog, dialogTemplate } as OpenDialogAction] }] }];
+
+/** What pressing an element does: go to the named screen. */
+export const goesTo = (screen: string): Behavior[] =>
+    [{ bindings: [{ trigger: { kind: InteractionTriggerKind.Click }, actions: [{ kind: InteractionActionKind.Navigate, screen } as NavigateAction] }] }];
+
+/**
+ * What choosing a row of a list does: open the record page, handing it the chosen row's id. The list is single-selection, so choosing a row is
+ * opening it - the way a table of records works everywhere.
+ */
+export const opensRecordOnSelect = (listId: string, screen: string): Behavior[] => [{
+    bindings: [{
+        trigger: { kind: InteractionTriggerKind.Select },
+        actions: [{ kind: InteractionActionKind.Navigate, screen, arguments: [{ name: 'id', value: { kind: BindingSourceKind.ComponentProperty, componentId: listId, path: 'value' } }] } as NavigateAction],
+    }],
+}];
+
+/** What a Cancel or Close control does: close the dialog it was opened from. */
+export const closesDialog = (): Behavior[] => [{ bindings: [{ trigger: { kind: InteractionTriggerKind.Click }, actions: [{ kind: InteractionActionKind.CloseDialog }] }] }];
+
+/** An element with the given behaviors attached. */
+export const withBehaviors = <T extends SceneElement>(element: T, behaviors: Behavior[]): T => ({ ...element, behaviors });
+
+export type HrScreenTemplate = ScreenTemplate;
+export type HrDialogTemplate = DialogTemplate;

package/hrQueries.ts

@@ -0,0 +1,59 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+import { BindingExpression, BindingSourceKind } from '@cratis/scene.model';
+
+/**
+ * A property taken from a query result - never a value. An HR template declares *where* its data comes from and the sample-data pack, or the real
+ * query, supplies the rows (spec SD1); `path` reaches into the result (`0.value` is the first row's `value`, an empty path is the whole result).
+ */
+export const fromQuery = (query: string, path = ''): BindingExpression => ({ kind: BindingSourceKind.QueryResult, query, path });
+
+/** The queries of the screens that are not a plain list. Each is a shape the sample-data pack supplies rows for. */
+export const HrQuery = {
+    /** One row: the `locale` the figures and dates are formatted in. */
+    Settings: 'HrSettings',
+    RecordTabs: 'HrRecordTabs',
+    OrgNodes: 'OrgNodes',
+    FormErrors: 'HrFormErrors',
+} as const;
+
+/** The HR entities a template is made for. */
+export enum HrEntityKind {
+    Employee = 'Employee',
+    TimeOff = 'TimeOff',
+    Balance = 'Balance',
+    Onboarding = 'Onboarding',
+}
+
+/** The read model (and so the shape) the records of each entity are queried from. */
+export const hrEntityPlural: Record<HrEntityKind, string> = {
+    [HrEntityKind.Employee]: 'Employees',
+    [HrEntityKind.TimeOff]: 'TimeOffRequests',
+    [HrEntityKind.Balance]: 'Balances',
+    [HrEntityKind.Onboarding]: 'Onboardings',
+};
+
+/**
+ * The queries one entity's templates bind to, named from the entity so a template never spells one out: the records, the columns and filter fields of the
+ * list, its saved views and column choices, the selection, the sections of the full and the quick form, and the record the page shows.
+ */
+export const hrQueriesOf = (entity: HrEntityKind) => ({
+    rows: hrEntityPlural[entity],
+    columns: `${entity}Columns`,
+    filterFields: `${entity}FilterFields`,
+    views: `${entity}Views`,
+    columnChoices: `${entity}ColumnChoices`,
+    selection: `${entity}Selection`,
+    sections: `${entity}Sections`,
+    quickSections: `${entity}QuickSections`,
+    record: `${entity}Record`,
+    summary: `${entity}Summary`,
+    documents: `${entity}Documents`,
+    activity: `${entity}Activity`,
+    tasks: `${entity}Tasks`,
+});
+
+/** The locale and currency of the data, bound onto every component that formats a figure or a date. */
+export const localeOfData = { locale: fromQuery(HrQuery.Settings, '0.locale') };
+export const currencyOfData = { ...localeOfData, currency: fromQuery(HrQuery.Settings, '0.currency') };

package/hrScreenSet.ts

@@ -0,0 +1,24 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+import { BlueprintScreen } from '@cratis/scene.model';
+
+/** One ready-to-use screen: the qualified name that is also its place in the application (`hr.directory.record` is the `record` feature of `directory` in the `hr` module). */
+export interface HrScreenDefinition extends BlueprintScreen {
+    template: string;
+    description: string;
+}
+
+/**
+ * The screens the blueprint brings, in navigation order. This one list is what the manifest's screen set, the `Screen` instances, the application structure
+ * and the navigation are all derived from, so they cannot disagree about which screens exist or where they sit.
+ */
+export const hrScreenDefinitions: HrScreenDefinition[] = [
+    { name: 'hr.directory', title: 'Directory', template: 'HrEmployeeDirectory', order: 0, description: 'Everyone in the company as cards with their photo, title, department and contact.' },
+    { name: 'hr.directory.record', title: 'Employee', template: 'HrEmployeePage', parent: 'hr.directory', description: 'One employee: personal and job information, documents and time-off balance.' },
+    { name: 'hr.org', title: 'Org chart', template: 'HrOrgChart', order: 1, description: 'Who reports to whom, as a tree.' },
+    { name: 'hr.timeoff', title: 'Time off', template: 'HrTimeOffList', order: 2, description: 'Time-off requests to approve, with who is away and for how long.' },
+    { name: 'hr.timeoff.balances', title: 'Balances', template: 'HrTimeOffBalanceList', parent: 'hr.timeoff', description: 'What each employee has taken and has left.' },
+    { name: 'hr.onboarding', title: 'Onboarding', template: 'HrOnboardingList', order: 3, description: 'New hires and how far along their onboarding is.' },
+    { name: 'hr.onboarding.record', title: 'Onboarding checklist', template: 'HrOnboardingChecklist', parent: 'hr.onboarding', description: 'One new hire\'s checklist: sections of tasks, each with an owner and a due date.' },
+];

package/index.ts

@@ -0,0 +1,14 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+export * from './packageName';
+export * from './templateProvenance';
+export * from './hrQueries';
+export * from './hrParts';
+export * from './hrScreenSet';
+export * from './templates';
+export * from './screens';
+export * from './navigation';
+export * from './manifest';
+export * from './blueprint';
+export * from './hrApplication';

package/manifest.ts

@@ -0,0 +1,41 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+import { PackageKind, ScenePackage } from '@cratis/scene.model';
+import { hrBlueprintName } from './packageName';
+import { hrScreenDefinitions } from './hrScreenSet';
+import { hrDialogTemplates, hrScreenTemplates } from './templates';
+
+const description = 'People, the org chart, time off and onboarding for an HR team: a directory of cards, employee pages, an org tree, time-off requests and balances, and onboarding checklists.';
+
+/**
+ * This blueprint's declaration. A domain blueprint depends on the foundation set (`Cratis.Blueprint.Default`) and reuses its layouts, slots,
+ * components and themes - it ships none of its own - and adds what is specific to the domain: templates, a ready-to-use screen set, sample data
+ * and thumbnails. The package `version` is the blueprint's version: it is what a template reference pins and what "update available" compares.
+ */
+export const hrBlueprintManifest: ScenePackage = {
+    name: hrBlueprintName,
+    version: '1.0.0',
+    kind: PackageKind.Blueprint,
+    dependencies: [{ name: 'Cratis.Blueprint.Default', versionRange: '^1.0.0' }],
+    components: [],
+    layouts: [],
+    screenTemplates: hrScreenTemplates.map(template => template.name),
+    dialogTemplates: hrDialogTemplates.map(template => template.name),
+    themes: [],
+    displayName: 'HR People and Time Off',
+    description,
+    module: '@cratis/scene.blueprint.hr',
+    license: 'MIT',
+    licenseUrl: 'https://github.com/Cratis/Scene/blob/main/LICENSE',
+    sampleData: [{ id: 'hr-nordic', title: 'HR · Nordic', locale: 'nb-NO', path: 'sampleData/hr-nordic.json' }],
+    blueprint: {
+        domain: 'hr',
+        description,
+        thumbnail: 'thumbnails/hr.svg',
+        screenSet: hrScreenDefinitions.map(({ name, title, description: screenDescription, template, parent, order }) => ({
+            name, title, description: screenDescription, template, ...(parent === undefined ? {} : { parent }), ...(order === undefined ? {} : { order }),
+        })),
+        defaultSampleData: 'hr-nordic',
+    },
+};

package/navigation.ts

@@ -0,0 +1,59 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+import { ApplicationStructure, NavigationModel, NavigationRegionKind, NavigationRegionMode } from '@cratis/scene.model';
+import { hrScreenDefinitions } from './hrScreenSet';
+
+/** The module the blueprint's screens live in, and so the first segment of every screen's qualified name. */
+export const hrModule = 'hr';
+
+/**
+ * The application structure the screen set implies: one module, `hr`, a feature for each screen and the sub-features beneath it (`hr.directory.record` is the
+ * `record` feature of `directory`). Derived from the screen names, so a screen added to the set is part of the structure without a second edit.
+ */
+export const hrStructure: ApplicationStructure = (() => {
+    interface Node { id: string; name: string; features: Node[]; slices: never[] }
+    const root: Node = { id: hrModule, name: 'HR', features: [], slices: [] };
+    for (const screen of hrScreenDefinitions) {
+        let parent = root;
+        for (const id of screen.name.split('.').slice(1)) {
+            let node = parent.features.find(candidate => candidate.id === id);
+            if (!node) {
+                node = { id, name: screen.title, features: [], slices: [] };
+                parent.features.push(node);
+            }
+            parent = node;
+        }
+    }
+
+    return { modules: [{ id: root.id, name: root.name, features: root.features }] } as unknown as ApplicationStructure;
+})();
+
+/**
+ * The navigation of the application the blueprint is: the topbar names the module, and the module's sidebar - which overrides the application's - lists
+ * the four places an HR team goes: Directory, Org chart, Time off (with its requests and its balances beneath it) and Onboarding.
+ */
+export const hrNavigation: NavigationModel = {
+    application: {
+        logo: { image: '', title: 'HR' },
+        regions: [{ region: NavigationRegionKind.Topbar, items: [{ id: 'hr', title: 'HR', target: { module: hrModule } }] }],
+    },
+    modules: [{
+        module: hrModule,
+        regions: [{
+            region: NavigationRegionKind.Sidebar,
+            mode: NavigationRegionMode.Override,
+            items: [
+                { id: 'directory', title: 'Directory', target: { module: hrModule, feature: 'directory' } },
+                { id: 'org', title: 'Org chart', target: { module: hrModule, feature: 'org' } },
+                {
+                    id: 'timeoff', title: 'Time off', target: { module: hrModule, feature: 'timeoff' }, children: [
+                        { id: 'requests', title: 'Requests', target: { module: hrModule, feature: 'timeoff' } },
+                        { id: 'balances', title: 'Balances', target: { module: hrModule, feature: 'timeoff.balances' } },
+                    ],
+                },
+                { id: 'onboarding', title: 'Onboarding', target: { module: hrModule, feature: 'onboarding' } },
+            ],
+        }],
+    }],
+};

package/package.json

@@ -1,6 +1,80 @@
 {
-  "name": "@cratis/scene.blueprint.hr",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+    "name": "@cratis/scene.blueprint.hr",
+    "version": "4.53.1",
+    "description": "People, the org chart, time off and onboarding for an HR team.",
+    "keywords": [
+        "cratis",
+        "scene",
+        "react",
+        "ui",
+        "blueprint",
+        "hr"
+    ],
+    "author": "Cratis",
+    "license": "MIT",
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/Cratis/Scene.git"
+    },
+    "publishConfig": {
+        "access": "public"
+    },
+    "files": [
+        "dist",
+        "sampleData",
+        "thumbnails",
+        "blueprintCatalog.json",
+        "**/*.ts",
+        "**/*.tsx",
+        "!**/for_*/**"
+    ],
+    "main": "dist/cjs/index.js",
+    "module": "dist/esm/index.js",
+    "types": "dist/esm/index.d.ts",
+    "exports": {
+        "./package.json": "./package.json",
+        ".": {
+            "types": "./dist/esm/index.d.ts",
+            "require": "./dist/cjs/index.js",
+            "import": "./dist/esm/index.js"
+        }
+    },
+    "scripts": {
+        "prepare": "yarn g:build",
+        "clean": "yarn g:clean",
+        "build": "yarn g:build",
+        "lint": "yarn g:lint",
+        "lint:ci": "yarn g:lint:ci",
+        "test": "yarn g:test",
+        "test:browser": "yarn g:test --config ./vitest.browser.config.mts",
+        "ci": "yarn g:ci",
+        "up": "yarn g:up"
+    },
+    "dependencies": {
+        "@cratis/scene.blueprint.default": "4.53.1",
+        "@cratis/scene.engine": "4.53.1",
+        "@cratis/scene.model": "4.53.1",
+        "@cratis/scene.react": "4.53.1"
+    },
+    "devDependencies": {
+        "@cratis/scene.blueprint.default": "4.53.1",
+        "@cratis/scene.engine": "4.53.1",
+        "@cratis/scene.model": "4.53.1",
+        "@cratis/scene.react": "4.53.1",
+        "@primereact/core": "11.2.0",
+        "@primereact/headless": "11.2.0",
+        "primeicons": "8.0.2",
+        "primereact": "11.2.0",
+        "react": "^19.3.0",
+        "react-dom": "^19.3.0"
+    },
+    "peerDependencies": {
+        "@cratis/components": "^4.1.1",
+        "@primereact/core": "^11.0.0",
+        "@primereact/headless": "^11.0.0",
+        "primeicons": "^8.0.0",
+        "primereact": "^11.0.0",
+        "react": "^19.0.0",
+        "react-dom": "^19.0.0"
+    }
 }

package/packageName.ts

@@ -0,0 +1,5 @@
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+
+/** The name this blueprint is known by inside a `ui profile`; every component registry key is built from it. */
+export const hrBlueprintName = 'Cratis.Blueprint.Hr';