@cratis/scene.blueprint.default 0.1.0

package/dist/cjs/configuration/LayoutMode.js

@@ -0,0 +1,38 @@
+'use strict';
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * How the application shell arranges its sidebar against its content.
+ *
+ * The vocabulary - and the `layout-<mode>` wrapper class each value maps to - is deliberately the one
+ * PrimeTek's template line has used unchanged across Sakai, Diamond, Atlantis, Freya, Apollo, Ultima,
+ * Avalon and Verona. Anyone who has themed a PrimeReact application recognizes it, and a shell that
+ * invents its own names forces them to learn a second one for no gain.
+ *
+ * Every value here is user-selectable. Mobile deliberately is not - see {@link effectiveLayoutMode}.
+ */ var LayoutMode = /*#__PURE__*/ function(LayoutMode) {
+    /** Sidebar permanently docked; content is pushed by a matching margin, never covered. */ LayoutMode["Static"] = "static";
+    /** Sidebar parked off-canvas; opening floats it over the content behind a mask. */ LayoutMode["Overlay"] = "overlay";
+    /** Icon-only rail with circular buttons; submenus pop out as a floating panel. */ LayoutMode["Slim"] = "slim";
+    /** Wider rail with each icon's label stacked directly beneath it. */ LayoutMode["SlimPlus"] = "slim-plus";
+    /** The icon-only rail again, with square buttons, and the topbar shifted by the rail width. */ LayoutMode["Compact"] = "compact";
+    /** Sidebar flows into the topbar strip as a horizontal row; submenus drop down. */ LayoutMode["Horizontal"] = "horizontal";
+    /** Full panel translated off-left leaving a strip of icons; hovering slides it in over the content. */ LayoutMode["Reveal"] = "reveal";
+    /** Collapsed rail that animates its width to full on hover - it grows where reveal slides. */ LayoutMode["Drawer"] = "drawer";
+    return LayoutMode;
+}({});
+/** Every {@link LayoutMode}, in the order a configurator should offer them. */ const layoutModes = [
+    "static",
+    "overlay",
+    "slim",
+    "slim-plus",
+    "compact",
+    "horizontal",
+    "reveal",
+    "drawer"
+];
+
+exports.LayoutMode = LayoutMode;
+exports.layoutModes = layoutModes;
+//# sourceMappingURL=LayoutMode.js.map

package/dist/cjs/configuration/LayoutMode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LayoutMode.js","sources":["../../../configuration/LayoutMode.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 * How the application shell arranges its sidebar against its content.\n *\n * The vocabulary - and the `layout-<mode>` wrapper class each value maps to - is deliberately the one\n * PrimeTek's template line has used unchanged across Sakai, Diamond, Atlantis, Freya, Apollo, Ultima,\n * Avalon and Verona. Anyone who has themed a PrimeReact application recognizes it, and a shell that\n * invents its own names forces them to learn a second one for no gain.\n *\n * Every value here is user-selectable. Mobile deliberately is not - see {@link effectiveLayoutMode}.\n */\nexport enum LayoutMode {\n    /** Sidebar permanently docked; content is pushed by a matching margin, never covered. */\n    Static = 'static',\n\n    /** Sidebar parked off-canvas; opening floats it over the content behind a mask. */\n    Overlay = 'overlay',\n\n    /** Icon-only rail with circular buttons; submenus pop out as a floating panel. */\n    Slim = 'slim',\n\n    /** Wider rail with each icon's label stacked directly beneath it. */\n    SlimPlus = 'slim-plus',\n\n    /** The icon-only rail again, with square buttons, and the topbar shifted by the rail width. */\n    Compact = 'compact',\n\n    /** Sidebar flows into the topbar strip as a horizontal row; submenus drop down. */\n    Horizontal = 'horizontal',\n\n    /** Full panel translated off-left leaving a strip of icons; hovering slides it in over the content. */\n    Reveal = 'reveal',\n\n    /** Collapsed rail that animates its width to full on hover - it grows where reveal slides. */\n    Drawer = 'drawer',\n}\n\n/** Every {@link LayoutMode}, in the order a configurator should offer them. */\nexport const layoutModes: LayoutMode[] = [\n    LayoutMode.Static,\n    LayoutMode.Overlay,\n    LayoutMode.Slim,\n    LayoutMode.SlimPlus,\n    LayoutMode.Compact,\n    LayoutMode.Horizontal,\n    LayoutMode.Reveal,\n    LayoutMode.Drawer,\n];\n"],"names":["LayoutMode","layoutModes"],"mappings":";;AAAA;AACA;AAEA;;;;;;;;;IAUO,IAAKA,UAAAA,iBAAAA,SAAAA,UAAAA,EAAAA;8FAC+E,UAAA,CAAA,QAAA,CAAA,GAAA,QAAA;wFAGN,UAAA,CAAA,SAAA,CAAA,GAAA,SAAA;uFAGD,UAAA,CAAA,MAAA,CAAA,GAAA,MAAA;0EAGb,UAAA,CAAA,UAAA,CAAA,GAAA,WAAA;oGAG0B,UAAA,CAAA,SAAA,CAAA,GAAA,SAAA;wFAGZ,UAAA,CAAA,YAAA,CAAA,GAAA,YAAA;4GAGoB,UAAA,CAAA,QAAA,CAAA,GAAA,QAAA;mGAGT,UAAA,CAAA,QAAA,CAAA,GAAA,QAAA;AAtBpFA,IAAAA,OAAAA,UAAAA;AAwBX,CAAA,CAAA,EAAA;AAED,gFACO,MAAMC,WAAAA,GAA4B;;;;;;;;;;;;;;"}

package/dist/cjs/configuration/MenuTheme.js

@@ -0,0 +1,26 @@
+'use strict';
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * How the sidebar surface is tinted, independently of the overall {@link ColorScheme}.
+ *
+ * A dark sidebar against a light page is the single most common brand customization in the PrimeTek
+ * template line, which is why menu theme is its own configurator axis rather than something implied by
+ * the color scheme. The shell resolves each value from the active theme's tokens, so a menu theme never
+ * introduces a color of its own.
+ */ var MenuTheme = /*#__PURE__*/ function(MenuTheme) {
+    /** The sidebar uses the theme's ordinary card surface. */ MenuTheme["Light"] = "light";
+    /** The sidebar uses an inverted surface, regardless of the page's color scheme. */ MenuTheme["Dark"] = "dark";
+    /** The sidebar uses the theme's primary color as its surface. */ MenuTheme["Primary"] = "primary";
+    return MenuTheme;
+}({});
+/** Every {@link MenuTheme}, in the order a configurator should offer them. */ const menuThemes = [
+    "light",
+    "dark",
+    "primary"
+];
+
+exports.MenuTheme = MenuTheme;
+exports.menuThemes = menuThemes;
+//# sourceMappingURL=MenuTheme.js.map

package/dist/cjs/configuration/MenuTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuTheme.js","sources":["../../../configuration/MenuTheme.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 * How the sidebar surface is tinted, independently of the overall {@link ColorScheme}.\n *\n * A dark sidebar against a light page is the single most common brand customization in the PrimeTek\n * template line, which is why menu theme is its own configurator axis rather than something implied by\n * the color scheme. The shell resolves each value from the active theme's tokens, so a menu theme never\n * introduces a color of its own.\n */\nexport enum MenuTheme {\n    /** The sidebar uses the theme's ordinary card surface. */\n    Light = 'light',\n\n    /** The sidebar uses an inverted surface, regardless of the page's color scheme. */\n    Dark = 'dark',\n\n    /** The sidebar uses the theme's primary color as its surface. */\n    Primary = 'primary',\n}\n\n/** Every {@link MenuTheme}, in the order a configurator should offer them. */\nexport const menuThemes: MenuTheme[] = [MenuTheme.Light, MenuTheme.Dark, MenuTheme.Primary];\n"],"names":["MenuTheme","menuThemes"],"mappings":";;AAAA;AACA;AAEA;;;;;;;IAQO,IAAKA,SAAAA,iBAAAA,SAAAA,SAAAA,EAAAA;+DACgD,SAAA,CAAA,OAAA,CAAA,GAAA,OAAA;wFAGyB,SAAA,CAAA,MAAA,CAAA,GAAA,MAAA;sEAGlB,SAAA,CAAA,SAAA,CAAA,GAAA,SAAA;AAPvDA,IAAAA,OAAAA,SAAAA;AASX,CAAA,CAAA,EAAA;AAED,+EACO,MAAMC,UAAAA,GAA0B;;;;;;;;;"}

package/dist/cjs/configuration/layoutConfigStorage.js

@@ -0,0 +1,85 @@
+'use strict';
+
+var ColorScheme = require('./ColorScheme.js');
+var LayoutMode = require('./LayoutMode.js');
+var MenuTheme = require('./MenuTheme.js');
+var layoutConfigTransitions = require('./layoutConfigTransitions.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/** The `localStorage` key the shell persists its configuration under. */ const layoutConfigStorageKey = 'cratis.scene.blueprint.default';
+/**
+ * Reads the persisted configuration back, falling back to {@link defaultLayoutConfigState} for anything
+ * missing or unrecognized.
+ *
+ * Everything is validated against the enums rather than trusted, because `localStorage` is shared with
+ * every other script on the origin and outlives the version of this package that wrote it. An unknown
+ * mode left in place would put a class on the wrapper that no stylesheet rule matches - a shell with no
+ * sidebar at all, and no error to explain it.
+ *
+ * @param storage The storage to read from, or `undefined` when there is none (server-side rendering).
+ * @returns The restored state, with defaults filled in.
+ */ function readPersistedLayoutConfig(storage) {
+    const defaults = layoutConfigTransitions.defaultLayoutConfigState();
+    const stored = readRecord(storage);
+    if (!stored) {
+        return defaults;
+    }
+    return {
+        ...defaults,
+        mode: enumValue(Object.values(LayoutMode.LayoutMode), stored.mode) ?? defaults.mode,
+        menuTheme: enumValue(Object.values(MenuTheme.MenuTheme), stored.menuTheme) ?? defaults.menuTheme,
+        colorScheme: enumValue(Object.values(ColorScheme.ColorScheme), stored.colorScheme) ?? defaults.colorScheme,
+        themeName: typeof stored.themeName === 'string' ? stored.themeName : defaults.themeName,
+        isSidebarAnchored: typeof stored.isSidebarAnchored === 'boolean' ? stored.isSidebarAnchored : defaults.isSidebarAnchored
+    };
+}
+/**
+ * Writes the durable parts of the configuration.
+ *
+ * Storage can throw - Safari's private mode and a full quota both do - and a shell that cannot remember a
+ * preference is a far smaller problem than one that crashes on a mode switch, so a failure here is
+ * swallowed rather than propagated.
+ *
+ * @param state The state to persist.
+ * @param storage The storage to write to, or `undefined` when there is none.
+ */ function persistLayoutConfig(state, storage) {
+    if (!storage) {
+        return;
+    }
+    const persisted = {
+        mode: state.mode,
+        menuTheme: state.menuTheme,
+        colorScheme: state.colorScheme,
+        themeName: state.themeName,
+        isSidebarAnchored: state.isSidebarAnchored
+    };
+    try {
+        storage.setItem(layoutConfigStorageKey, JSON.stringify(persisted));
+    } catch  {
+    // A browser that refuses to store a preference still has to render the shell.
+    }
+}
+function readRecord(storage) {
+    if (!storage) {
+        return undefined;
+    }
+    try {
+        const raw = storage.getItem(layoutConfigStorageKey);
+        if (!raw) {
+            return undefined;
+        }
+        const parsed = JSON.parse(raw);
+        return typeof parsed === 'object' && parsed !== null && !Array.isArray(parsed) ? parsed : undefined;
+    } catch  {
+        return undefined;
+    }
+}
+function enumValue(values, candidate) {
+    return typeof candidate === 'string' && values.includes(candidate) ? candidate : undefined;
+}
+
+exports.layoutConfigStorageKey = layoutConfigStorageKey;
+exports.persistLayoutConfig = persistLayoutConfig;
+exports.readPersistedLayoutConfig = readPersistedLayoutConfig;
+//# sourceMappingURL=layoutConfigStorage.js.map

package/dist/cjs/configuration/layoutConfigStorage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layoutConfigStorage.js","sources":["../../../configuration/layoutConfigStorage.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 { ColorScheme } from './ColorScheme';\nimport { LayoutConfigState } from './LayoutConfigState';\nimport { LayoutMode } from './LayoutMode';\nimport { MenuTheme } from './MenuTheme';\nimport { defaultLayoutConfigState } from './layoutConfigTransitions';\n\n/** The `localStorage` key the shell persists its configuration under. */\nexport const layoutConfigStorageKey = 'cratis.scene.blueprint.default';\n\n/**\n * The parts of {@link LayoutConfigState} worth surviving a reload.\n *\n * Deliberately not the whole record: whether the sidebar happened to be open, whether the pointer was\n * over it, and whether the viewport was narrow are all facts about the moment rather than preferences, and\n * restoring them produces a shell that opens in a state the user never chose. The pin *is* a preference,\n * so it stays.\n */\nexport type PersistedLayoutConfig = Pick<LayoutConfigState, 'mode' | 'menuTheme' | 'colorScheme' | 'themeName' | 'isSidebarAnchored'>;\n\n/**\n * Reads the persisted configuration back, falling back to {@link defaultLayoutConfigState} for anything\n * missing or unrecognized.\n *\n * Everything is validated against the enums rather than trusted, because `localStorage` is shared with\n * every other script on the origin and outlives the version of this package that wrote it. An unknown\n * mode left in place would put a class on the wrapper that no stylesheet rule matches - a shell with no\n * sidebar at all, and no error to explain it.\n *\n * @param storage The storage to read from, or `undefined` when there is none (server-side rendering).\n * @returns The restored state, with defaults filled in.\n */\nexport function readPersistedLayoutConfig(storage?: Storage): LayoutConfigState {\n    const defaults = defaultLayoutConfigState();\n    const stored = readRecord(storage);\n    if (!stored) {\n        return defaults;\n    }\n\n    return {\n        ...defaults,\n        mode: enumValue(Object.values(LayoutMode), stored.mode) ?? defaults.mode,\n        menuTheme: enumValue(Object.values(MenuTheme), stored.menuTheme) ?? defaults.menuTheme,\n        colorScheme: enumValue(Object.values(ColorScheme), stored.colorScheme) ?? defaults.colorScheme,\n        themeName: typeof stored.themeName === 'string' ? stored.themeName : defaults.themeName,\n        isSidebarAnchored: typeof stored.isSidebarAnchored === 'boolean' ? stored.isSidebarAnchored : defaults.isSidebarAnchored,\n    };\n}\n\n/**\n * Writes the durable parts of the configuration.\n *\n * Storage can throw - Safari's private mode and a full quota both do - and a shell that cannot remember a\n * preference is a far smaller problem than one that crashes on a mode switch, so a failure here is\n * swallowed rather than propagated.\n *\n * @param state The state to persist.\n * @param storage The storage to write to, or `undefined` when there is none.\n */\nexport function persistLayoutConfig(state: LayoutConfigState, storage?: Storage): void {\n    if (!storage) {\n        return;\n    }\n\n    const persisted: PersistedLayoutConfig = {\n        mode: state.mode,\n        menuTheme: state.menuTheme,\n        colorScheme: state.colorScheme,\n        themeName: state.themeName,\n        isSidebarAnchored: state.isSidebarAnchored,\n    };\n\n    try {\n        storage.setItem(layoutConfigStorageKey, JSON.stringify(persisted));\n    } catch {\n        // A browser that refuses to store a preference still has to render the shell.\n    }\n}\n\nfunction readRecord(storage?: Storage): Record<string, unknown> | undefined {\n    if (!storage) {\n        return undefined;\n    }\n\n    try {\n        const raw = storage.getItem(layoutConfigStorageKey);\n        if (!raw) {\n            return undefined;\n        }\n\n        const parsed = JSON.parse(raw) as unknown;\n        return typeof parsed === 'object' && parsed !== null && !Array.isArray(parsed) ? (parsed as Record<string, unknown>) : undefined;\n    } catch {\n        return undefined;\n    }\n}\n\nfunction enumValue<TValue extends string>(values: TValue[], candidate: unknown): TValue | undefined {\n    return typeof candidate === 'string' && values.includes(candidate as TValue) ? (candidate as TValue) : undefined;\n}\n"],"names":["layoutConfigStorageKey","readPersistedLayoutConfig","storage","defaults","defaultLayoutConfigState","stored","readRecord","mode","enumValue","Object","values","LayoutMode","menuTheme","MenuTheme","colorScheme","ColorScheme","themeName","isSidebarAnchored","persistLayoutConfig","state","persisted","setItem","JSON","stringify","undefined","raw","getItem","parsed","parse","Array","isArray","candidate","includes"],"mappings":";;;;;;;AAAA;AACA;AAQA,0EACO,MAAMA,sBAAAA,GAAyB;AAYtC;;;;;;;;;;;IAYO,SAASC,yBAAAA,CAA0BC,OAAiB,EAAA;AACvD,IAAA,MAAMC,QAAAA,GAAWC,gDAAAA,EAAAA;AACjB,IAAA,MAAMC,SAASC,UAAAA,CAAWJ,OAAAA,CAAAA;AAC1B,IAAA,IAAI,CAACG,MAAAA,EAAQ;QACT,OAAOF,QAAAA;AACX,IAAA;IAEA,OAAO;AACH,QAAA,GAAGA,QAAQ;QACXI,IAAAA,EAAMC,SAAAA,CAAUC,OAAOC,MAAM,CAACC,wBAAaN,MAAAA,CAAOE,IAAI,CAAA,IAAKJ,QAAAA,CAASI,IAAI;QACxEK,SAAAA,EAAWJ,SAAAA,CAAUC,OAAOC,MAAM,CAACG,sBAAYR,MAAAA,CAAOO,SAAS,CAAA,IAAKT,QAAAA,CAASS,SAAS;QACtFE,WAAAA,EAAaN,SAAAA,CAAUC,OAAOC,MAAM,CAACK,0BAAcV,MAAAA,CAAOS,WAAW,CAAA,IAAKX,QAAAA,CAASW,WAAW;QAC9FE,SAAAA,EAAW,OAAOX,OAAOW,SAAS,KAAK,WAAWX,MAAAA,CAAOW,SAAS,GAAGb,QAAAA,CAASa,SAAS;QACvFC,iBAAAA,EAAmB,OAAOZ,OAAOY,iBAAiB,KAAK,YAAYZ,MAAAA,CAAOY,iBAAiB,GAAGd,QAAAA,CAASc;AAC3G,KAAA;AACJ;AAEA;;;;;;;;;AASC,IACM,SAASC,mBAAAA,CAAoBC,KAAwB,EAAEjB,OAAiB,EAAA;AAC3E,IAAA,IAAI,CAACA,OAAAA,EAAS;AACV,QAAA;AACJ,IAAA;AAEA,IAAA,MAAMkB,SAAAA,GAAmC;AACrCb,QAAAA,IAAAA,EAAMY,MAAMZ,IAAI;AAChBK,QAAAA,SAAAA,EAAWO,MAAMP,SAAS;AAC1BE,QAAAA,WAAAA,EAAaK,MAAML,WAAW;AAC9BE,QAAAA,SAAAA,EAAWG,MAAMH,SAAS;AAC1BC,QAAAA,iBAAAA,EAAmBE,MAAMF;AAC7B,KAAA;IAEA,IAAI;AACAf,QAAAA,OAAAA,CAAQmB,OAAO,CAACrB,sBAAAA,EAAwBsB,IAAAA,CAAKC,SAAS,CAACH,SAAAA,CAAAA,CAAAA;AAC3D,IAAA,CAAA,CAAE,OAAM;;AAER,IAAA;AACJ;AAEA,SAASd,WAAWJ,OAAiB,EAAA;AACjC,IAAA,IAAI,CAACA,OAAAA,EAAS;QACV,OAAOsB,SAAAA;AACX,IAAA;IAEA,IAAI;QACA,MAAMC,GAAAA,GAAMvB,OAAAA,CAAQwB,OAAO,CAAC1B,sBAAAA,CAAAA;AAC5B,QAAA,IAAI,CAACyB,GAAAA,EAAK;YACN,OAAOD,SAAAA;AACX,QAAA;QAEA,MAAMG,MAAAA,GAASL,IAAAA,CAAKM,KAAK,CAACH,GAAAA,CAAAA;QAC1B,OAAO,OAAOE,MAAAA,KAAW,QAAA,IAAYA,MAAAA,KAAW,IAAA,IAAQ,CAACE,KAAAA,CAAMC,OAAO,CAACH,MAAAA,CAAAA,GAAWA,MAAAA,GAAqCH,SAAAA;AAC3H,IAAA,CAAA,CAAE,OAAM;QACJ,OAAOA,SAAAA;AACX,IAAA;AACJ;AAEA,SAAShB,SAAAA,CAAiCE,MAAgB,EAAEqB,SAAkB,EAAA;AAC1E,IAAA,OAAO,OAAOA,SAAAA,KAAc,QAAA,IAAYrB,OAAOsB,QAAQ,CAACD,aAAwBA,SAAAA,GAAuBP,SAAAA;AAC3G;;;;;;"}

package/dist/cjs/configuration/layoutConfigTransitions.js

@@ -0,0 +1,158 @@
+'use strict';
+
+var ColorScheme = require('./ColorScheme.js');
+var LayoutMode = require('./LayoutMode.js');
+var MenuTheme = require('./MenuTheme.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The viewport width, in CSS pixels, below which the shell stops honoring the chosen {@link LayoutMode}
+ * and forces the off-canvas one. 991 is the breakpoint the PrimeTek template line uses throughout; the
+ * value is exported rather than buried in a media query so the resize listener and the stylesheet cannot
+ * disagree about where the boundary is.
+ */ const mobileBreakpoint = 991;
+/** The media query the shell watches to know whether it is in the mobile regime. */ const mobileMediaQuery = `(max-width: ${mobileBreakpoint}px)`;
+/**
+ * Whether a viewport width falls in the mobile regime. Inclusive of the breakpoint itself, so this and
+ * {@link mobileMediaQuery}'s `max-width` agree on the boundary rather than disagreeing by one pixel.
+ */ function isMobileWidth(width) {
+    return width <= mobileBreakpoint;
+}
+/**
+ * The state a shell starts in when nothing has been persisted: the docked sidebar every application
+ * template defaults to, on a light scheme, with the theme this package ships as its light one.
+ */ function defaultLayoutConfigState() {
+    return {
+        mode: LayoutMode.LayoutMode.Static,
+        menuTheme: MenuTheme.MenuTheme.Light,
+        colorScheme: ColorScheme.ColorScheme.Light,
+        themeName: 'Scene Default Light',
+        isSidebarOpen: true,
+        isSidebarAnchored: false,
+        isSidebarRevealed: false,
+        isMobile: false
+    };
+}
+/**
+ * The mode the shell actually renders, as opposed to the one the user picked.
+ *
+ * Below the mobile breakpoint every mode collapses to {@link LayoutMode.Overlay}: a docked 18rem sidebar,
+ * an icon rail or a horizontal menu strip are all unusable on a phone, so the template line forces
+ * off-canvas there and hides the mode picker. Deriving it rather than overwriting `mode` is what lets the
+ * chosen mode come back untouched when the viewport grows again.
+ */ function effectiveLayoutMode(state) {
+    return state.isMobile ? LayoutMode.LayoutMode.Overlay : state.mode;
+}
+/** Whether the mode keeps the sidebar off-canvas until something opens it. */ function isOffCanvasMode(mode) {
+    return mode === LayoutMode.LayoutMode.Overlay;
+}
+/** Whether the mode is one of the two that react to the pointer - `reveal` slides in, `drawer` grows. */ function isPointerRevealMode(mode) {
+    return mode === LayoutMode.LayoutMode.Reveal || mode === LayoutMode.LayoutMode.Drawer;
+}
+/**
+ * Chooses a different mode.
+ *
+ * Switching also resets the sidebar's transient state, because "open" means something different in each
+ * mode: a static sidebar starts docked, every other mode starts closed, and a reveal/drawer panel that
+ * was hovered out must not stay out under a mode that has no hover behavior. The pin survives, since it
+ * is a preference rather than transient state.
+ */ function withMode(state, mode) {
+    return {
+        ...state,
+        mode,
+        isSidebarOpen: mode === LayoutMode.LayoutMode.Static,
+        isSidebarRevealed: false
+    };
+}
+/**
+ * Records that the viewport crossed the mobile breakpoint.
+ *
+ * Entering the mobile regime closes the sidebar so the page is not covered on arrival; leaving it
+ * restores whatever the chosen mode considers its resting state. Both directions are recomputed rather
+ * than remembered, so a mode switch made while mobile still lands correctly on the way back out.
+ */ function withMobile(state, isMobile) {
+    if (state.isMobile === isMobile) {
+        return state;
+    }
+    return {
+        ...state,
+        isMobile,
+        isSidebarOpen: isMobile ? false : state.mode === LayoutMode.LayoutMode.Static,
+        isSidebarRevealed: false
+    };
+}
+/** Opens or closes the sidebar. */ function withSidebarOpen(state, isSidebarOpen) {
+    return {
+        ...state,
+        isSidebarOpen
+    };
+}
+/** Flips the sidebar between open and closed - what the topbar's menu button does in every mode. */ function toggleSidebar(state) {
+    return withSidebarOpen(state, !state.isSidebarOpen);
+}
+/**
+ * Holds a `reveal`/`drawer` sidebar out, or lets it fall back.
+ *
+ * An anchored sidebar ignores the pointer entirely - that is the whole point of pinning it - so this is a
+ * no-op while {@link LayoutConfigState.isSidebarAnchored} is set rather than something the pointer can
+ * fight with.
+ */ function withSidebarRevealed(state, isSidebarRevealed) {
+    if (state.isSidebarAnchored) {
+        return state;
+    }
+    return {
+        ...state,
+        isSidebarRevealed
+    };
+}
+/**
+ * Pins or unpins a `reveal`/`drawer` sidebar. Pinning implies revealed, so the panel does not snap shut
+ * the moment the pointer leaves the pin button that just pinned it.
+ */ function withSidebarAnchored(state, isSidebarAnchored) {
+    return {
+        ...state,
+        isSidebarAnchored,
+        isSidebarRevealed: isSidebarAnchored
+    };
+}
+/** Flips the pin - what the sidebar's anchor button does. */ function toggleSidebarAnchor(state) {
+    return withSidebarAnchored(state, !state.isSidebarAnchored);
+}
+/** Chooses the light/dark axis. */ function withColorScheme(state, colorScheme) {
+    return {
+        ...state,
+        colorScheme
+    };
+}
+/** Chooses how the sidebar surface is tinted. */ function withMenuTheme(state, menuTheme) {
+    return {
+        ...state,
+        menuTheme
+    };
+}
+/** Records which {@link Theme} is applied, so a theme switcher reflects the truth after a host-driven change. */ function withThemeName(state, themeName) {
+    return {
+        ...state,
+        themeName
+    };
+}
+
+exports.defaultLayoutConfigState = defaultLayoutConfigState;
+exports.effectiveLayoutMode = effectiveLayoutMode;
+exports.isMobileWidth = isMobileWidth;
+exports.isOffCanvasMode = isOffCanvasMode;
+exports.isPointerRevealMode = isPointerRevealMode;
+exports.mobileBreakpoint = mobileBreakpoint;
+exports.mobileMediaQuery = mobileMediaQuery;
+exports.toggleSidebar = toggleSidebar;
+exports.toggleSidebarAnchor = toggleSidebarAnchor;
+exports.withColorScheme = withColorScheme;
+exports.withMenuTheme = withMenuTheme;
+exports.withMobile = withMobile;
+exports.withMode = withMode;
+exports.withSidebarAnchored = withSidebarAnchored;
+exports.withSidebarOpen = withSidebarOpen;
+exports.withSidebarRevealed = withSidebarRevealed;
+exports.withThemeName = withThemeName;
+//# sourceMappingURL=layoutConfigTransitions.js.map

package/dist/cjs/configuration/layoutConfigTransitions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layoutConfigTransitions.js","sources":["../../../configuration/layoutConfigTransitions.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 { ColorScheme } from './ColorScheme';\nimport { LayoutConfigState } from './LayoutConfigState';\nimport { LayoutMode } from './LayoutMode';\nimport { MenuTheme } from './MenuTheme';\n\n/**\n * The viewport width, in CSS pixels, below which the shell stops honoring the chosen {@link LayoutMode}\n * and forces the off-canvas one. 991 is the breakpoint the PrimeTek template line uses throughout; the\n * value is exported rather than buried in a media query so the resize listener and the stylesheet cannot\n * disagree about where the boundary is.\n */\nexport const mobileBreakpoint = 991;\n\n/** The media query the shell watches to know whether it is in the mobile regime. */\nexport const mobileMediaQuery = `(max-width: ${mobileBreakpoint}px)`;\n\n/**\n * Whether a viewport width falls in the mobile regime. Inclusive of the breakpoint itself, so this and\n * {@link mobileMediaQuery}'s `max-width` agree on the boundary rather than disagreeing by one pixel.\n */\nexport function isMobileWidth(width: number): boolean {\n    return width <= mobileBreakpoint;\n}\n\n/**\n * The state a shell starts in when nothing has been persisted: the docked sidebar every application\n * template defaults to, on a light scheme, with the theme this package ships as its light one.\n */\nexport function defaultLayoutConfigState(): LayoutConfigState {\n    return {\n        mode: LayoutMode.Static,\n        menuTheme: MenuTheme.Light,\n        colorScheme: ColorScheme.Light,\n        themeName: 'Scene Default Light',\n        isSidebarOpen: true,\n        isSidebarAnchored: false,\n        isSidebarRevealed: false,\n        isMobile: false,\n    };\n}\n\n/**\n * The mode the shell actually renders, as opposed to the one the user picked.\n *\n * Below the mobile breakpoint every mode collapses to {@link LayoutMode.Overlay}: a docked 18rem sidebar,\n * an icon rail or a horizontal menu strip are all unusable on a phone, so the template line forces\n * off-canvas there and hides the mode picker. Deriving it rather than overwriting `mode` is what lets the\n * chosen mode come back untouched when the viewport grows again.\n */\nexport function effectiveLayoutMode(state: LayoutConfigState): LayoutMode {\n    return state.isMobile ? LayoutMode.Overlay : state.mode;\n}\n\n/** Whether the mode keeps the sidebar off-canvas until something opens it. */\nexport function isOffCanvasMode(mode: LayoutMode): boolean {\n    return mode === LayoutMode.Overlay;\n}\n\n/** Whether the mode is one of the two that react to the pointer - `reveal` slides in, `drawer` grows. */\nexport function isPointerRevealMode(mode: LayoutMode): boolean {\n    return mode === LayoutMode.Reveal || mode === LayoutMode.Drawer;\n}\n\n/**\n * Chooses a different mode.\n *\n * Switching also resets the sidebar's transient state, because \"open\" means something different in each\n * mode: a static sidebar starts docked, every other mode starts closed, and a reveal/drawer panel that\n * was hovered out must not stay out under a mode that has no hover behavior. The pin survives, since it\n * is a preference rather than transient state.\n */\nexport function withMode(state: LayoutConfigState, mode: LayoutMode): LayoutConfigState {\n    return { ...state, mode, isSidebarOpen: mode === LayoutMode.Static, isSidebarRevealed: false };\n}\n\n/**\n * Records that the viewport crossed the mobile breakpoint.\n *\n * Entering the mobile regime closes the sidebar so the page is not covered on arrival; leaving it\n * restores whatever the chosen mode considers its resting state. Both directions are recomputed rather\n * than remembered, so a mode switch made while mobile still lands correctly on the way back out.\n */\nexport function withMobile(state: LayoutConfigState, isMobile: boolean): LayoutConfigState {\n    if (state.isMobile === isMobile) {\n        return state;\n    }\n\n    return {\n        ...state,\n        isMobile,\n        isSidebarOpen: isMobile ? false : state.mode === LayoutMode.Static,\n        isSidebarRevealed: false,\n    };\n}\n\n/** Opens or closes the sidebar. */\nexport function withSidebarOpen(state: LayoutConfigState, isSidebarOpen: boolean): LayoutConfigState {\n    return { ...state, isSidebarOpen };\n}\n\n/** Flips the sidebar between open and closed - what the topbar's menu button does in every mode. */\nexport function toggleSidebar(state: LayoutConfigState): LayoutConfigState {\n    return withSidebarOpen(state, !state.isSidebarOpen);\n}\n\n/**\n * Holds a `reveal`/`drawer` sidebar out, or lets it fall back.\n *\n * An anchored sidebar ignores the pointer entirely - that is the whole point of pinning it - so this is a\n * no-op while {@link LayoutConfigState.isSidebarAnchored} is set rather than something the pointer can\n * fight with.\n */\nexport function withSidebarRevealed(state: LayoutConfigState, isSidebarRevealed: boolean): LayoutConfigState {\n    if (state.isSidebarAnchored) {\n        return state;\n    }\n\n    return { ...state, isSidebarRevealed };\n}\n\n/**\n * Pins or unpins a `reveal`/`drawer` sidebar. Pinning implies revealed, so the panel does not snap shut\n * the moment the pointer leaves the pin button that just pinned it.\n */\nexport function withSidebarAnchored(state: LayoutConfigState, isSidebarAnchored: boolean): LayoutConfigState {\n    return { ...state, isSidebarAnchored, isSidebarRevealed: isSidebarAnchored };\n}\n\n/** Flips the pin - what the sidebar's anchor button does. */\nexport function toggleSidebarAnchor(state: LayoutConfigState): LayoutConfigState {\n    return withSidebarAnchored(state, !state.isSidebarAnchored);\n}\n\n/** Chooses the light/dark axis. */\nexport function withColorScheme(state: LayoutConfigState, colorScheme: ColorScheme): LayoutConfigState {\n    return { ...state, colorScheme };\n}\n\n/** Chooses how the sidebar surface is tinted. */\nexport function withMenuTheme(state: LayoutConfigState, menuTheme: MenuTheme): LayoutConfigState {\n    return { ...state, menuTheme };\n}\n\n/** Records which {@link Theme} is applied, so a theme switcher reflects the truth after a host-driven change. */\nexport function withThemeName(state: LayoutConfigState, themeName: string): LayoutConfigState {\n    return { ...state, themeName };\n}\n"],"names":["mobileBreakpoint","mobileMediaQuery","isMobileWidth","width","defaultLayoutConfigState","mode","LayoutMode","Static","menuTheme","MenuTheme","Light","colorScheme","ColorScheme","themeName","isSidebarOpen","isSidebarAnchored","isSidebarRevealed","isMobile","effectiveLayoutMode","state","Overlay","isOffCanvasMode","isPointerRevealMode","Reveal","Drawer","withMode","withMobile","withSidebarOpen","toggleSidebar","withSidebarRevealed","withSidebarAnchored","toggleSidebarAnchor","withColorScheme","withMenuTheme","withThemeName"],"mappings":";;;;;;AAAA;AACA;AAOA;;;;;IAMO,MAAMA,gBAAAA,GAAmB;AAEhC,qFACO,MAAMC,gBAAAA,GAAmB,CAAC,YAAY,EAAED,gBAAAA,CAAiB,GAAG;AAEnE;;;IAIO,SAASE,aAAAA,CAAcC,KAAa,EAAA;AACvC,IAAA,OAAOA,KAAAA,IAASH,gBAAAA;AACpB;AAEA;;;AAGC,IACM,SAASI,wBAAAA,GAAAA;IACZ,OAAO;AACHC,QAAAA,IAAAA,EAAMC,sBAAWC,MAAM;AACvBC,QAAAA,SAAAA,EAAWC,oBAAUC,KAAK;AAC1BC,QAAAA,WAAAA,EAAaC,wBAAYF,KAAK;QAC9BG,SAAAA,EAAW,qBAAA;QACXC,aAAAA,EAAe,IAAA;QACfC,iBAAAA,EAAmB,KAAA;QACnBC,iBAAAA,EAAmB,KAAA;QACnBC,QAAAA,EAAU;AACd,KAAA;AACJ;AAEA;;;;;;;IAQO,SAASC,mBAAAA,CAAoBC,KAAwB,EAAA;AACxD,IAAA,OAAOA,MAAMF,QAAQ,GAAGX,sBAAWc,OAAO,GAAGD,MAAMd,IAAI;AAC3D;AAEA,+EACO,SAASgB,eAAAA,CAAgBhB,IAAgB,EAAA;IAC5C,OAAOA,IAAAA,KAASC,sBAAWc,OAAO;AACtC;AAEA,0GACO,SAASE,mBAAAA,CAAoBjB,IAAgB,EAAA;AAChD,IAAA,OAAOA,SAASC,qBAAAA,CAAWiB,MAAM,IAAIlB,IAAAA,KAASC,sBAAWkB,MAAM;AACnE;AAEA;;;;;;;AAOC,IACM,SAASC,QAAAA,CAASN,KAAwB,EAAEd,IAAgB,EAAA;IAC/D,OAAO;AAAE,QAAA,GAAGc,KAAK;AAAEd,QAAAA,IAAAA;QAAMS,aAAAA,EAAeT,IAAAA,KAASC,sBAAWC,MAAM;QAAES,iBAAAA,EAAmB;AAAM,KAAA;AACjG;AAEA;;;;;;AAMC,IACM,SAASU,UAAAA,CAAWP,KAAwB,EAAEF,QAAiB,EAAA;IAClE,IAAIE,KAAAA,CAAMF,QAAQ,KAAKA,QAAAA,EAAU;QAC7B,OAAOE,KAAAA;AACX,IAAA;IAEA,OAAO;AACH,QAAA,GAAGA,KAAK;AACRF,QAAAA,QAAAA;AACAH,QAAAA,aAAAA,EAAeG,WAAW,KAAA,GAAQE,KAAAA,CAAMd,IAAI,KAAKC,sBAAWC,MAAM;QAClES,iBAAAA,EAAmB;AACvB,KAAA;AACJ;AAEA,oCACO,SAASW,eAAAA,CAAgBR,KAAwB,EAAEL,aAAsB,EAAA;IAC5E,OAAO;AAAE,QAAA,GAAGK,KAAK;AAAEL,QAAAA;AAAc,KAAA;AACrC;AAEA,qGACO,SAASc,aAAAA,CAAcT,KAAwB,EAAA;AAClD,IAAA,OAAOQ,eAAAA,CAAgBR,KAAAA,EAAO,CAACA,KAAAA,CAAML,aAAa,CAAA;AACtD;AAEA;;;;;;AAMC,IACM,SAASe,mBAAAA,CAAoBV,KAAwB,EAAEH,iBAA0B,EAAA;IACpF,IAAIG,KAAAA,CAAMJ,iBAAiB,EAAE;QACzB,OAAOI,KAAAA;AACX,IAAA;IAEA,OAAO;AAAE,QAAA,GAAGA,KAAK;AAAEH,QAAAA;AAAkB,KAAA;AACzC;AAEA;;;AAGC,IACM,SAASc,mBAAAA,CAAoBX,KAAwB,EAAEJ,iBAA0B,EAAA;IACpF,OAAO;AAAE,QAAA,GAAGI,KAAK;AAAEJ,QAAAA,iBAAAA;QAAmBC,iBAAAA,EAAmBD;AAAkB,KAAA;AAC/E;AAEA,8DACO,SAASgB,mBAAAA,CAAoBZ,KAAwB,EAAA;AACxD,IAAA,OAAOW,mBAAAA,CAAoBX,KAAAA,EAAO,CAACA,KAAAA,CAAMJ,iBAAiB,CAAA;AAC9D;AAEA,oCACO,SAASiB,eAAAA,CAAgBb,KAAwB,EAAER,WAAwB,EAAA;IAC9E,OAAO;AAAE,QAAA,GAAGQ,KAAK;AAAER,QAAAA;AAAY,KAAA;AACnC;AAEA,kDACO,SAASsB,aAAAA,CAAcd,KAAwB,EAAEX,SAAoB,EAAA;IACxE,OAAO;AAAE,QAAA,GAAGW,KAAK;AAAEX,QAAAA;AAAU,KAAA;AACjC;AAEA,kHACO,SAAS0B,aAAAA,CAAcf,KAAwB,EAAEN,SAAiB,EAAA;IACrE,OAAO;AAAE,QAAA,GAAGM,KAAK;AAAEN,QAAAA;AAAU,KAAA;AACjC;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/configuration/layoutWrapperClasses.js

@@ -0,0 +1,62 @@
+'use strict';
+
+var LayoutMode = require('./LayoutMode.js');
+var layoutConfigTransitions = require('./layoutConfigTransitions.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * Turns the shell's state into the wrapper class list its stylesheet keys off - the single seam between
+ * the state machine and the CSS.
+ *
+ * Every class name here is the one the PrimeTek template line already uses (`layout-static`,
+ * `layout-overlay-active`, `layout-sidebar-anchored`, `layout-mobile-active`, ...), so a stylesheet
+ * written against those templates keeps working and anyone who has themed one can read this shell's DOM
+ * without a translation table.
+ *
+ * The mode class reflects the *effective* mode, so the off-canvas rules a phone needs come from the same
+ * `layout-overlay` block a desktop overlay uses instead of a parallel mobile-only ruleset. The chosen mode
+ * is still emitted separately as `data-layout-mode`, so a configurator can show what the user picked even
+ * while the viewport overrides it.
+ *
+ * @param state The current shell state.
+ * @returns The classes to put on the shell's wrapper element, always starting with `layout-wrapper`.
+ */ function layoutWrapperClasses(state) {
+    const mode = layoutConfigTransitions.effectiveLayoutMode(state);
+    const classes = [
+        'layout-wrapper',
+        `layout-${mode}`,
+        `layout-menu-${state.menuTheme}`,
+        `layout-color-scheme-${state.colorScheme}`
+    ];
+    if (mode === LayoutMode.LayoutMode.Static && !state.isSidebarOpen) {
+        classes.push('layout-static-inactive');
+    }
+    if (mode === LayoutMode.LayoutMode.Overlay && state.isSidebarOpen && !state.isMobile) {
+        classes.push('layout-overlay-active');
+    }
+    if (layoutConfigTransitions.isPointerRevealMode(mode) && state.isSidebarRevealed) {
+        classes.push('layout-sidebar-active');
+    }
+    if (layoutConfigTransitions.isPointerRevealMode(mode) && state.isSidebarAnchored) {
+        classes.push('layout-sidebar-anchored');
+    }
+    if (state.isMobile) {
+        classes.push('layout-mobile');
+    }
+    if (state.isMobile && state.isSidebarOpen) {
+        classes.push('layout-mobile-active');
+    }
+    return classes;
+}
+/**
+ * Whether the scrim that dims the content behind a floating sidebar should be showing. Overlay and mobile
+ * both cover the page, and both need the click-anywhere-to-close the mask provides; a docked or rail
+ * sidebar covers nothing and must not dim anything.
+ */ function isLayoutMaskVisible(state) {
+    return layoutConfigTransitions.effectiveLayoutMode(state) === LayoutMode.LayoutMode.Overlay && state.isSidebarOpen;
+}
+
+exports.isLayoutMaskVisible = isLayoutMaskVisible;
+exports.layoutWrapperClasses = layoutWrapperClasses;
+//# sourceMappingURL=layoutWrapperClasses.js.map

package/dist/cjs/configuration/layoutWrapperClasses.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layoutWrapperClasses.js","sources":["../../../configuration/layoutWrapperClasses.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 { LayoutConfigState } from './LayoutConfigState';\nimport { LayoutMode } from './LayoutMode';\nimport { effectiveLayoutMode, isPointerRevealMode } from './layoutConfigTransitions';\n\n/**\n * Turns the shell's state into the wrapper class list its stylesheet keys off - the single seam between\n * the state machine and the CSS.\n *\n * Every class name here is the one the PrimeTek template line already uses (`layout-static`,\n * `layout-overlay-active`, `layout-sidebar-anchored`, `layout-mobile-active`, ...), so a stylesheet\n * written against those templates keeps working and anyone who has themed one can read this shell's DOM\n * without a translation table.\n *\n * The mode class reflects the *effective* mode, so the off-canvas rules a phone needs come from the same\n * `layout-overlay` block a desktop overlay uses instead of a parallel mobile-only ruleset. The chosen mode\n * is still emitted separately as `data-layout-mode`, so a configurator can show what the user picked even\n * while the viewport overrides it.\n *\n * @param state The current shell state.\n * @returns The classes to put on the shell's wrapper element, always starting with `layout-wrapper`.\n */\nexport function layoutWrapperClasses(state: LayoutConfigState): string[] {\n    const mode = effectiveLayoutMode(state);\n    const classes = [\n        'layout-wrapper',\n        `layout-${mode}`,\n        `layout-menu-${state.menuTheme}`,\n        `layout-color-scheme-${state.colorScheme}`,\n    ];\n\n    if (mode === LayoutMode.Static && !state.isSidebarOpen) {\n        classes.push('layout-static-inactive');\n    }\n\n    if (mode === LayoutMode.Overlay && state.isSidebarOpen && !state.isMobile) {\n        classes.push('layout-overlay-active');\n    }\n\n    if (isPointerRevealMode(mode) && state.isSidebarRevealed) {\n        classes.push('layout-sidebar-active');\n    }\n\n    if (isPointerRevealMode(mode) && state.isSidebarAnchored) {\n        classes.push('layout-sidebar-anchored');\n    }\n\n    if (state.isMobile) {\n        classes.push('layout-mobile');\n    }\n\n    if (state.isMobile && state.isSidebarOpen) {\n        classes.push('layout-mobile-active');\n    }\n\n    return classes;\n}\n\n/**\n * Whether the scrim that dims the content behind a floating sidebar should be showing. Overlay and mobile\n * both cover the page, and both need the click-anywhere-to-close the mask provides; a docked or rail\n * sidebar covers nothing and must not dim anything.\n */\nexport function isLayoutMaskVisible(state: LayoutConfigState): boolean {\n    return effectiveLayoutMode(state) === LayoutMode.Overlay && state.isSidebarOpen;\n}\n"],"names":["layoutWrapperClasses","state","mode","effectiveLayoutMode","classes","menuTheme","colorScheme","LayoutMode","Static","isSidebarOpen","push","Overlay","isMobile","isPointerRevealMode","isSidebarRevealed","isSidebarAnchored","isLayoutMaskVisible"],"mappings":";;;;;AAAA;AACA;AAMA;;;;;;;;;;;;;;;;IAiBO,SAASA,oBAAAA,CAAqBC,KAAwB,EAAA;AACzD,IAAA,MAAMC,OAAOC,2CAAAA,CAAoBF,KAAAA,CAAAA;AACjC,IAAA,MAAMG,OAAAA,GAAU;AACZ,QAAA,gBAAA;QACA,CAAC,OAAO,EAAEF,IAAAA,CAAAA,CAAM;AAChB,QAAA,CAAC,YAAY,EAAED,KAAAA,CAAMI,SAAS,CAAA,CAAE;AAChC,QAAA,CAAC,oBAAoB,EAAEJ,KAAAA,CAAMK,WAAW,CAAA;AAC3C,KAAA;AAED,IAAA,IAAIJ,SAASK,qBAAAA,CAAWC,MAAM,IAAI,CAACP,KAAAA,CAAMQ,aAAa,EAAE;AACpDL,QAAAA,OAAAA,CAAQM,IAAI,CAAC,wBAAA,CAAA;AACjB,IAAA;IAEA,IAAIR,IAAAA,KAASK,qBAAAA,CAAWI,OAAO,IAAIV,KAAAA,CAAMQ,aAAa,IAAI,CAACR,KAAAA,CAAMW,QAAQ,EAAE;AACvER,QAAAA,OAAAA,CAAQM,IAAI,CAAC,uBAAA,CAAA;AACjB,IAAA;AAEA,IAAA,IAAIG,2CAAAA,CAAoBX,IAAAA,CAAAA,IAASD,KAAAA,CAAMa,iBAAiB,EAAE;AACtDV,QAAAA,OAAAA,CAAQM,IAAI,CAAC,uBAAA,CAAA;AACjB,IAAA;AAEA,IAAA,IAAIG,2CAAAA,CAAoBX,IAAAA,CAAAA,IAASD,KAAAA,CAAMc,iBAAiB,EAAE;AACtDX,QAAAA,OAAAA,CAAQM,IAAI,CAAC,yBAAA,CAAA;AACjB,IAAA;IAEA,IAAIT,KAAAA,CAAMW,QAAQ,EAAE;AAChBR,QAAAA,OAAAA,CAAQM,IAAI,CAAC,eAAA,CAAA;AACjB,IAAA;AAEA,IAAA,IAAIT,KAAAA,CAAMW,QAAQ,IAAIX,KAAAA,CAAMQ,aAAa,EAAE;AACvCL,QAAAA,OAAAA,CAAQM,IAAI,CAAC,sBAAA,CAAA;AACjB,IAAA;IAEA,OAAON,OAAAA;AACX;AAEA;;;;IAKO,SAASY,mBAAAA,CAAoBf,KAAwB,EAAA;AACxD,IAAA,OAAOE,4CAAoBF,KAAAA,CAAAA,KAAWM,qBAAAA,CAAWI,OAAO,IAAIV,MAAMQ,aAAa;AACnF;;;;;"}

package/dist/cjs/defaultBlueprint.js

@@ -0,0 +1,92 @@
+'use strict';
+
+var scene_model = require('@cratis/scene.model');
+var ComponentName = require('./ComponentName.js');
+var defaultBlueprintComponents = require('./defaultBlueprintComponents.js');
+require('./gallery/elements.js');
+require('./gallery/navigation.js');
+var LayoutName = require('./layouts/LayoutName.js');
+require('./layouts/shellComponents.js');
+require('./layouts/appShell.js');
+require('./layouts/fullPage.js');
+var defaultLayouts = require('./layouts/defaultLayouts.js');
+var packageName = require('./packageName.js');
+var defaultBlueprintThemes = require('./themes/defaultBlueprintThemes.js');
+require('react/jsx-runtime');
+require('react');
+require('@cratis/scene.react');
+require('./gallery/nesting.js');
+require('./gallery/workspaceTemplates.js');
+require('./gallery/supportTemplates.js');
+require('./gallery/authTemplates.js');
+require('./gallery/statusTemplates.js');
+var dialogTemplates = require('./gallery/dialogTemplates.js');
+var screens = require('./gallery/screens.js');
+require('@cratis/scene.engine');
+require('./gallery/previewProfile.js');
+require('./gallery/GalleryScreenPreview.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The default blueprint's declaration.
+ *
+ * A blueprint is the package an application picks once to get a coherent shape: the {@link Layout}s that
+ * are its base navigational look, the {@link ScreenTemplate}s and {@link DialogTemplate}s that go inside
+ * them, the components that fill their slots, and the themes that color all of it. Picking the parts
+ * separately is how an application ends up with a sidebar from one design language and a form from
+ * another.
+ *
+ * The dependency list is what makes a blueprint honest about what it is built from. This one declares
+ * PrimeReact - the shell's buttons, breadcrumb, overlay menu and drawer are PrimeReact 10 components - and
+ * Cratis Components, which its screen templates fill their content with. A profile that activated this
+ * blueprint without them would render a shell whose every control was a dashed red placeholder, and
+ * `resolvePackageDependencies` exists to catch that when the profile is configured rather than when
+ * someone opens the page.
+ *
+ * `layouts` lists only true application shells. A dashboard, a CRUD list or a sign-in screen is a screen
+ * template, not a layout, and is listed as one.
+ */ const defaultBlueprintManifest = {
+    name: packageName.defaultBlueprintName,
+    version: '1.0.0',
+    kind: scene_model.PackageKind.Blueprint,
+    dependencies: [
+        {
+            name: 'PrimeReact'
+        },
+        {
+            name: 'Cratis.Components'
+        }
+    ],
+    components: Object.values(ComponentName.ComponentName),
+    layouts: Object.values(LayoutName.LayoutName),
+    screenTemplates: screens.galleryScreenTemplates.map((template)=>template.name),
+    dialogTemplates: dialogTemplates.galleryDialogTemplates.map((template)=>template.name),
+    themes: defaultBlueprintThemes.defaultBlueprintThemes.map((theme)=>theme.name),
+    displayName: 'Cratis Default Blueprint',
+    description: 'Application shells with eight menu modes, the components that fill their slots, and a full screen and dialog template set.',
+    module: '@cratis/scene.blueprint.default'
+};
+/**
+ * The default blueprint as a loadable bundle.
+ *
+ * The manifest names things; this provides them. `validatePackageBundle` is what proves the two agree, and
+ * this package's specs run it - a manifest promising a component the bundle never registered renders as a
+ * dashed red placeholder somewhere deep inside a screen, a long way from the declaration that caused it.
+ *
+ * The screens are the gallery: real {@link Screen} instances naming a layout, a screen template and the
+ * content that fills it, so a preview boots them through the real engine as a working miniature
+ * application rather than a set of pictures.
+ */ const defaultBlueprint = {
+    manifest: defaultBlueprintManifest,
+    components: defaultBlueprintComponents.defaultBlueprintComponents,
+    layouts: defaultLayouts.defaultLayouts,
+    screenTemplates: screens.galleryScreenTemplates,
+    dialogTemplates: dialogTemplates.galleryDialogTemplates,
+    screens: screens.galleryScreens,
+    themes: defaultBlueprintThemes.defaultBlueprintThemes
+};
+
+exports.defaultBlueprint = defaultBlueprint;
+exports.defaultBlueprintManifest = defaultBlueprintManifest;
+//# sourceMappingURL=defaultBlueprint.js.map

package/dist/cjs/defaultBlueprint.js.map

@@ -0,0 +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 } from '@cratis/scene.react';\nimport { ComponentName } from './ComponentName';\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};\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};\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","defaultBlueprint","manifest","defaultBlueprintComponents","defaultLayouts","screens","galleryScreens"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAWA;;;;;;;;;;;;;;;;;;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;AACZ;AAEA;;;;;;;;;;UAWaC,gBAAAA,GAAuC;IAChDC,QAAAA,EAAU3B,wBAAAA;IACVQ,UAAAA,EAAYoB,qDAAAA;IACZhB,OAAAA,EAASiB,6BAAAA;IACTf,eAAAA,EAAiBC,8BAAAA;IACjBG,eAAAA,EAAiBC,sCAAAA;IACjBW,OAAAA,EAASC,sBAAAA;IACTX,MAAAA,EAAQC;AACZ;;;;;"}

package/dist/cjs/defaultBlueprintComponents.js

@@ -0,0 +1,54 @@
+'use strict';
+
+var scene_react = require('@cratis/scene.react');
+var ComponentName = require('./ComponentName.js');
+var packageName = require('./packageName.js');
+require('react/jsx-runtime');
+require('react');
+var AppShell = require('./shell/AppShell.js');
+var FullPageShell = require('./shell/FullPageShell.js');
+var Topbar = require('./shell/Topbar.js');
+var Sidebar = require('./shell/Sidebar.js');
+var Menu = require('./shell/Menu.js');
+var MenuItem = require('./shell/MenuItem.js');
+var Breadcrumb = require('./shell/Breadcrumb.js');
+var Footer = require('./shell/Footer.js');
+var RightPanel = require('./shell/RightPanel.js');
+var ConfigPanel = require('./shell/ConfigPanel.js');
+var PageHeader = require('./shell/PageHeader.js');
+var Mask = require('./shell/Mask.js');
+var Logo = require('./shell/Logo.js');
+var UserMenu = require('./shell/UserMenu.js');
+var ThemeSwitcher = require('./shell/ThemeSwitcher.js');
+var LayoutModeSwitcher = require('./shell/LayoutModeSwitcher.js');
+
+// Copyright (c) Cratis. All rights reserved.
+// Licensed under the MIT license. See LICENSE file in the project root for full license information.
+/**
+ * The components this package registers, keyed the way the renderer looks them up.
+ *
+ * Every key is built with `componentRegistryKey` rather than written out, because the separator between
+ * package and component name is the registry's own business - it is deliberately not the `.` a screen uses
+ * to qualify a name, so that a package name containing dots stays unambiguous. Building a key by hand is
+ * how a component ends up registered under something no lookup will ever produce.
+ */ const defaultBlueprintComponents = {
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.AppShell)]: AppShell.AppShell,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.FullPageShell)]: FullPageShell.FullPageShell,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Topbar)]: Topbar.Topbar,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Sidebar)]: Sidebar.Sidebar,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Menu)]: Menu.Menu,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.MenuItem)]: MenuItem.MenuItem,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Breadcrumb)]: Breadcrumb.Breadcrumb,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Footer)]: Footer.Footer,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.RightPanel)]: RightPanel.RightPanel,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ConfigPanel)]: ConfigPanel.ConfigPanel,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.PageHeader)]: PageHeader.PageHeader,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Mask)]: Mask.Mask,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.Logo)]: Logo.Logo,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.UserMenu)]: UserMenu.UserMenu,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.ThemeSwitcher)]: ThemeSwitcher.ThemeSwitcher,
+    [scene_react.componentRegistryKey(packageName.defaultBlueprintName, ComponentName.ComponentName.LayoutModeSwitcher)]: LayoutModeSwitcher.LayoutModeSwitcher
+};
+
+exports.defaultBlueprintComponents = defaultBlueprintComponents;
+//# sourceMappingURL=defaultBlueprintComponents.js.map

package/dist/cjs/defaultBlueprintComponents.js.map

@@ -0,0 +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 {\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};\n"],"names":["defaultBlueprintComponents","componentRegistryKey","defaultBlueprintName","ComponentName","AppShell","FullPageShell","Topbar","Sidebar","Menu","MenuItem","Breadcrumb","Footer","RightPanel","ConfigPanel","PageHeader","Mask","Logo","UserMenu","ThemeSwitcher","LayoutModeSwitcher"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAwBA;;;;;;;UAQaA,0BAAAA,GAAgD;AACzD,IAAA,CAACC,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcC,QAAQ,IAAIA,iBAAAA;AACtE,IAAA,CAACH,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcE,aAAa,IAAIA,2BAAAA;AAC3E,IAAA,CAACJ,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcG,MAAM,IAAIA,aAAAA;AACpE,IAAA,CAACL,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcI,OAAO,IAAIA,eAAAA;AACrE,IAAA,CAACN,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcK,IAAI,IAAIA,SAAAA;AAClE,IAAA,CAACP,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcM,QAAQ,IAAIA,iBAAAA;AACtE,IAAA,CAACR,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcO,UAAU,IAAIA,qBAAAA;AACxE,IAAA,CAACT,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcQ,MAAM,IAAIA,aAAAA;AACpE,IAAA,CAACV,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcS,UAAU,IAAIA,qBAAAA;AACxE,IAAA,CAACX,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcU,WAAW,IAAIA,uBAAAA;AACzE,IAAA,CAACZ,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcW,UAAU,IAAIA,qBAAAA;AACxE,IAAA,CAACb,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcY,IAAI,IAAIA,SAAAA;AAClE,IAAA,CAACd,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAca,IAAI,IAAIA,SAAAA;AAClE,IAAA,CAACf,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcc,QAAQ,IAAIA,iBAAAA;AACtE,IAAA,CAAChB,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAce,aAAa,IAAIA,2BAAAA;AAC3E,IAAA,CAACjB,gCAAAA,CAAqBC,gCAAAA,EAAsBC,2BAAAA,CAAcgB,kBAAkB,IAAIA;AACpF;;;;"}