@cratis/scene.blueprint.default 4.2.0 → 4.3.0

package/for_galleryScreenTemplates/when_checking_that_arrangements_reference_declared_slots.ts

@@ -1,53 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { Arrangement, FlowArrangement, FlowContainer, FlowNode, Slot } from '@cratis/scene.model';
-import { defaultBlueprint } from '../defaultBlueprint';
-import { galleryScreenTemplates } from '../gallery';
-
-function slotNamesIn(node: FlowNode): string[] {
-    if ('slotName' in node) {
-        return [(node as { slotName: string }).slotName];
-    }
-
-    if ('children' in node) {
-        return (node as FlowContainer).children.flatMap(slotNamesIn);
-    }
-
-    return [];
-}
-
-function referencedSlots(arrangement: Arrangement | undefined): string[] {
-    const flow = arrangement as FlowArrangement | undefined;
-    if (!flow?.root) {
-        return [];
-    }
-
-    return [flow.root, ...(flow.overrides ?? []).map(override => override.root)].flatMap(slotNamesIn);
-}
-
-function undeclared(slots: Slot[], arrangement: Arrangement | undefined): string[] {
-    const declared = new Set(slots.map(slot => slot.name));
-    return [...new Set(referencedSlots(arrangement))].filter(name => !declared.has(name));
-}
-
-describe('when checking that arrangements reference declared slots', () => {
-    for (const layout of defaultBlueprint.layouts ?? []) {
-        it(`should reference only slots the '${layout.name}' layout declares`, () => {
-            undeclared(layout.slots, layout.arrangement).should.be.empty;
-        });
-    }
-
-    for (const template of galleryScreenTemplates.filter(candidate => candidate.arrangement !== undefined)) {
-        it(`should reference only slots the '${template.name}' template declares`, () => {
-            undeclared(template.slots, template.arrangement).should.be.empty;
-        });
-    }
-
-    for (const template of galleryScreenTemplates) {
-        it(`should file '${template.name}' content only under slots it declares`, () => {
-            const declared = new Set(template.slots.map(slot => slot.name));
-            Object.keys(template.content ?? {}).filter(name => !declared.has(name)).should.be.empty;
-        });
-    }
-});

package/for_galleryScreenTemplates/when_following_the_nesting_chain.ts

@@ -1,41 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { Slot } from '@cratis/scene.model';
-import { appShellLayout, fullPageLayout } from '../layouts';
-import { featureSectionTemplate, galleryScreenTemplates, moduleWorkspaceTemplate, sliceSectionTemplate } from '../gallery';
-
-function declares(slots: Slot[], name: string | undefined): boolean {
-    return name !== undefined && slots.some(slot => slot.name === name);
-}
-
-describe('when following the nesting chain', () => {
-    it('should fit the module template into a slot the application layout declares', () => {
-        declares(appShellLayout.slots, moduleWorkspaceTemplate.fitsSlot).should.be.true;
-    });
-
-    it('should fit the feature template into a slot the module template declares', () => {
-        declares(moduleWorkspaceTemplate.slots, featureSectionTemplate.fitsSlot).should.be.true;
-    });
-
-    it('should fit the slice template into a slot the feature template declares', () => {
-        declares(featureSectionTemplate.slots, sliceSectionTemplate.fitsSlot).should.be.true;
-    });
-
-    it('should resolve each level against its direct parent rather than globally', () => {
-        featureSectionTemplate.fitsSlot!.should.equal(sliceSectionTemplate.fitsSlot!);
-    });
-
-    it('should fit every other template into a slot one of the layouts declares', () => {
-        const layoutSlots = [...appShellLayout.slots, ...fullPageLayout.slots];
-        const templateSlots = galleryScreenTemplates.flatMap(template => template.slots);
-        galleryScreenTemplates
-            .filter(template => !declares(layoutSlots, template.fitsSlot) && !declares(templateSlots, template.fitsSlot))
-            .map(template => template.name)
-            .should.be.empty;
-    });
-
-    it('should give every screen template a slot to fit into', () => {
-        galleryScreenTemplates.filter(template => template.fitsSlot === undefined).map(template => template.name).should.be.empty;
-    });
-});

package/for_galleryScreens/when_checking_the_layouts_and_slots_they_fill.ts

@@ -1,44 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { Layout } from '@cratis/scene.model';
-import { defaultBlueprint } from '../defaultBlueprint';
-import { galleryScreens } from '../gallery';
-import { shellComponentForLayout } from '../layouts';
-
-describe('when checking the layouts and slots they fill', () => {
-    const layouts = defaultBlueprint.layouts ?? [];
-    const layoutsByName = new Map<string, Layout>(layouts.map(layout => [layout.name, layout]));
-
-    it('should have at least one screen to check', () => {
-        galleryScreens.should.not.be.empty;
-    });
-
-    for (const screen of galleryScreens) {
-        describe(`and the screen is '${screen.name}'`, () => {
-            const layout = layoutsByName.get(screen.layout);
-
-            it('should name a layout this blueprint provides', () => {
-                (layout !== undefined).should.be.true;
-            });
-
-            it('should fill only slots the layout declares', () => {
-                const declared = new Set((layout?.slots ?? []).map(slot => slot.name));
-                const filled = Object.keys(screen.slotContent);
-                filled.filter(name => !declared.has(name)).should.be.empty;
-            });
-
-            it('should fill the content slot, which is the only one every layout declares', () => {
-                (screen.slotContent.content?.length ?? 0).should.be.greaterThan(0);
-            });
-
-            it('should name a screen template this blueprint provides', () => {
-                (defaultBlueprint.screenTemplates ?? []).map(template => template.name).should.contain(screen.screenTemplate);
-            });
-
-            it('should render in a shell this blueprint provides', () => {
-                (shellComponentForLayout(screen.layout) !== undefined).should.be.true;
-            });
-        });
-    }
-});

package/for_galleryScreens/when_resolving_the_component_names_they_reference.ts

@@ -1,60 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { resolveComponentName } from '@cratis/scene.engine';
-import { ComponentName } from '../ComponentName';
-import {
-    composeScreenElement,
-    distinctComponentNames,
-    galleryComponentCatalog,
-    galleryDialogTemplates,
-    galleryProfile,
-    galleryScreens,
-} from '../gallery';
-import { defaultBlueprintName } from '../packageName';
-
-describe('when resolving the component names they reference', () => {
-    const fromScreens = distinctComponentNames(galleryScreens.map(composeScreenElement));
-    const fromDialogs = distinctComponentNames(galleryDialogTemplates.flatMap(template => Object.values(template.content ?? {}).flat()));
-    const names = [...new Set([...fromScreens, ...fromDialogs])].sort();
-    const resolutions = names.map(name => ({ name, resolution: resolveComponentName(name, galleryProfile, galleryComponentCatalog) }));
-    const blueprintNames = new Set<string>(Object.values(ComponentName));
-
-    it('should reference something', () => {
-        names.should.not.be.empty;
-    });
-
-    it('should reference something from the dialog templates too', () => {
-        fromDialogs.should.not.be.empty;
-    });
-
-    it('should resolve every referenced name against the profile', () => {
-        resolutions
-            .filter(entry => entry.resolution === undefined)
-            .map(entry => entry.name)
-            .should.be.empty;
-    });
-
-    it('should resolve this blueprint own names to this blueprint', () => {
-        resolutions
-            .filter(entry => blueprintNames.has(entry.name))
-            .filter(entry => entry.resolution?.package !== defaultBlueprintName)
-            .map(entry => entry.name)
-            .should.be.empty;
-    });
-
-    it('should shadow the component libraries for the names this blueprint also declares', () => {
-        const menu = resolveComponentName(ComponentName.Menu, galleryProfile, galleryComponentCatalog);
-        menu!.package.should.equal(defaultBlueprintName);
-        menu!.shadows.should.contain('PrimeReact');
-    });
-
-    it('should reference every shell component the blueprint registers except the ones a host places itself', () => {
-        const referenced = new Set(names);
-        const placedByAHostRatherThanATemplate = [ComponentName.Mask, ComponentName.ThemeSwitcher, ComponentName.LayoutModeSwitcher, ComponentName.RightPanel];
-        Object.values(ComponentName)
-            .filter(name => !placedByAHostRatherThanATemplate.includes(name))
-            .filter(name => !referenced.has(name))
-            .should.be.empty;
-    });
-});

package/for_layoutConfigStorage/when_restoring_a_persisted_configuration.ts

@@ -1,76 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { ColorScheme, LayoutMode, MenuTheme, defaultLayoutConfigState, layoutConfigStorageKey, persistLayoutConfig, readPersistedLayoutConfig, withMobile, withMode, withSidebarAnchored } from '../configuration';
-
-class FakeStorage {
-    entries = new Map<string, string>();
-    getItem(key: string): string | null {
-        return this.entries.has(key) ? this.entries.get(key)! : null;
-    }
-
-    setItem(key: string, value: string): void {
-        this.entries.set(key, value);
-    }
-}
-
-function storageWith(raw: string): Storage {
-    const storage = new FakeStorage();
-    storage.setItem(layoutConfigStorageKey, raw);
-    return storage as unknown as Storage;
-}
-
-describe('when restoring a persisted configuration', () => {
-    it('should fall back to the defaults when nothing was persisted', () => {
-        readPersistedLayoutConfig(new FakeStorage() as unknown as Storage).should.deep.equal(defaultLayoutConfigState());
-    });
-
-    it('should fall back to the defaults when there is no storage at all', () => {
-        readPersistedLayoutConfig(undefined).should.deep.equal(defaultLayoutConfigState());
-    });
-
-    it('should round-trip the preferences that are worth keeping', () => {
-        const storage = new FakeStorage() as unknown as Storage;
-        const chosen = withSidebarAnchored(withMode(defaultLayoutConfigState(), LayoutMode.Drawer), true);
-        persistLayoutConfig(chosen, storage);
-
-        const restored = readPersistedLayoutConfig(storage);
-        restored.mode.should.equal(LayoutMode.Drawer);
-        restored.isSidebarAnchored.should.be.true;
-    });
-
-    it('should not restore the transient state', () => {
-        const storage = new FakeStorage() as unknown as Storage;
-        persistLayoutConfig(withMobile(defaultLayoutConfigState(), true), storage);
-        readPersistedLayoutConfig(storage).isMobile.should.be.false;
-    });
-
-    it('should ignore an unrecognized mode rather than putting a class no rule matches on the wrapper', () => {
-        readPersistedLayoutConfig(storageWith('{"mode":"kaleidoscope"}')).mode.should.equal(defaultLayoutConfigState().mode);
-    });
-
-    it('should ignore an unrecognized menu theme and color scheme', () => {
-        const restored = readPersistedLayoutConfig(storageWith('{"menuTheme":"neon","colorScheme":"sepia"}'));
-        restored.menuTheme.should.equal(MenuTheme.Light);
-        restored.colorScheme.should.equal(ColorScheme.Light);
-    });
-
-    it('should survive malformed json', () => {
-        readPersistedLayoutConfig(storageWith('{ not json')).should.deep.equal(defaultLayoutConfigState());
-    });
-
-    it('should survive json that is not an object', () => {
-        readPersistedLayoutConfig(storageWith('[1,2,3]')).should.deep.equal(defaultLayoutConfigState());
-    });
-
-    it('should not throw when storage refuses to write', () => {
-        const refusing = {
-            getItem: () => null,
-            setItem: () => {
-                throw new Error('QuotaExceededError');
-            },
-        } as unknown as Storage;
-
-        (() => persistLayoutConfig(defaultLayoutConfigState(), refusing)).should.not.throw();
-    });
-});

package/for_layoutConfigTransitions/when_anchoring_a_reveal_sidebar.ts

@@ -1,44 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import {
-    LayoutMode,
-    defaultLayoutConfigState,
-    isPointerRevealMode,
-    toggleSidebarAnchor,
-    withMode,
-    withSidebarRevealed,
-} from '../configuration';
-
-describe('when anchoring a reveal sidebar', () => {
-    const reveal = withMode(defaultLayoutConfigState(), LayoutMode.Reveal);
-    const anchored = toggleSidebarAnchor(reveal);
-
-    it('should recognize reveal and drawer as the pointer-driven modes', () => {
-        isPointerRevealMode(LayoutMode.Reveal).should.be.true;
-        isPointerRevealMode(LayoutMode.Drawer).should.be.true;
-        isPointerRevealMode(LayoutMode.Static).should.be.false;
-    });
-
-    it('should hold the sidebar out as soon as it is anchored', () => {
-        anchored.isSidebarRevealed.should.be.true;
-    });
-
-    it('should ignore the pointer while anchored', () => {
-        withSidebarRevealed(anchored, false).should.equal(anchored);
-    });
-
-    it('should let the pointer take over again once unanchored', () => {
-        const unanchored = toggleSidebarAnchor(anchored);
-        unanchored.isSidebarAnchored.should.be.false;
-        withSidebarRevealed(unanchored, true).isSidebarRevealed.should.be.true;
-    });
-
-    it('should keep the pin across a mode change, since it is a preference rather than transient state', () => {
-        withMode(anchored, LayoutMode.Drawer).isSidebarAnchored.should.be.true;
-    });
-
-    it('should drop a pointer-held reveal when the mode changes', () => {
-        withMode(withSidebarRevealed(reveal, true), LayoutMode.Static).isSidebarRevealed.should.be.false;
-    });
-});

package/for_layoutConfigTransitions/when_the_viewport_crosses_the_mobile_breakpoint.ts

@@ -1,61 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import {
-    LayoutMode,
-    defaultLayoutConfigState,
-    effectiveLayoutMode,
-    isMobileWidth,
-    layoutModes,
-    layoutWrapperClasses,
-    mobileBreakpoint,
-    toggleSidebar,
-    withMobile,
-    withMode,
-} from '../configuration';
-
-describe('when the viewport crosses the mobile breakpoint', () => {
-    const desktop = withMode(defaultLayoutConfigState(), LayoutMode.Slim);
-    const mobile = withMobile(desktop, true);
-    const backToDesktop = withMobile(mobile, false);
-
-    it('should treat the breakpoint itself as mobile, matching the stylesheet', () => {
-        isMobileWidth(mobileBreakpoint).should.be.true;
-        isMobileWidth(mobileBreakpoint + 1).should.be.false;
-    });
-
-    it('should force every mode off-canvas below the breakpoint', () => {
-        for (const mode of layoutModes) {
-            effectiveLayoutMode(withMobile(withMode(desktop, mode), true)).should.equal(LayoutMode.Overlay);
-        }
-    });
-
-    it('should keep the chosen mode rather than overwriting it', () => {
-        mobile.mode.should.equal(LayoutMode.Slim);
-    });
-
-    it('should close the sidebar on the way in so the page is not covered on arrival', () => {
-        mobile.isSidebarOpen.should.be.false;
-    });
-
-    it('should mark the wrapper mobile', () => {
-        layoutWrapperClasses(mobile).should.contain('layout-mobile');
-    });
-
-    it('should mark the wrapper mobile-active once the sidebar is opened', () => {
-        layoutWrapperClasses(toggleSidebar(mobile)).should.contain('layout-mobile-active');
-    });
-
-    it('should restore the chosen mode on the way back out', () => {
-        effectiveLayoutMode(backToDesktop).should.equal(LayoutMode.Slim);
-    });
-
-    it('should leave the state untouched when the regime has not actually changed', () => {
-        withMobile(mobile, true).should.equal(mobile);
-    });
-
-    it('should reopen a static sidebar on the way back out, since docked is its resting state', () => {
-        const staticMobile = withMobile(withMode(defaultLayoutConfigState(), LayoutMode.Static), true);
-        withMobile(staticMobile, false).isSidebarOpen.should.be.true;
-    });
-});

package/for_layoutWrapperClasses/when_rendering_each_mode.ts

@@ -1,63 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import {
-    LayoutMode,
-    defaultLayoutConfigState,
-    isLayoutMaskVisible,
-    layoutModes,
-    layoutWrapperClasses,
-    toggleSidebar,
-    withMobile,
-    withMode,
-    withSidebarAnchored,
-    withSidebarRevealed,
-} from '../configuration';
-
-describe('when rendering each mode', () => {
-    const started = defaultLayoutConfigState();
-
-    it('should always start with the wrapper class', () => {
-        layoutWrapperClasses(started)[0].should.equal('layout-wrapper');
-    });
-
-    for (const mode of layoutModes) {
-        it(`should put the '${mode}' mode class on the wrapper`, () => {
-            layoutWrapperClasses(withMode(started, mode)).should.contain(`layout-${mode}`);
-        });
-    }
-
-    it('should mark a closed static sidebar inactive', () => {
-        layoutWrapperClasses(toggleSidebar(withMode(started, LayoutMode.Static))).should.contain('layout-static-inactive');
-    });
-
-    it('should not mark an open static sidebar inactive', () => {
-        layoutWrapperClasses(withMode(started, LayoutMode.Static)).should.not.contain('layout-static-inactive');
-    });
-
-    it('should mark an opened overlay sidebar active', () => {
-        layoutWrapperClasses(toggleSidebar(withMode(started, LayoutMode.Overlay))).should.contain('layout-overlay-active');
-    });
-
-    it('should mark a revealed sidebar active', () => {
-        layoutWrapperClasses(withSidebarRevealed(withMode(started, LayoutMode.Reveal), true)).should.contain('layout-sidebar-active');
-    });
-
-    it('should mark an anchored sidebar anchored', () => {
-        layoutWrapperClasses(withSidebarAnchored(withMode(started, LayoutMode.Drawer), true)).should.contain('layout-sidebar-anchored');
-    });
-
-    it('should not mark a static sidebar anchored, since only reveal and drawer answer to the pointer', () => {
-        layoutWrapperClasses(withSidebarAnchored(withMode(started, LayoutMode.Static), true)).should.not.contain('layout-sidebar-anchored');
-    });
-
-    it('should show the mask only while a floating sidebar is open', () => {
-        isLayoutMaskVisible(toggleSidebar(withMode(started, LayoutMode.Overlay))).should.be.true;
-        isLayoutMaskVisible(withMode(started, LayoutMode.Overlay)).should.be.false;
-        isLayoutMaskVisible(withMode(started, LayoutMode.Static)).should.be.false;
-    });
-
-    it('should show the mask on mobile once the sidebar is opened, whatever the chosen mode', () => {
-        isLayoutMaskVisible(toggleSidebar(withMobile(withMode(started, LayoutMode.Horizontal), true))).should.be.true;
-    });
-});

package/for_navigation/when_aggregating_the_navigation_contributions.ts

@@ -1,50 +0,0 @@
-// Copyright (c) Cratis. All rights reserved.
-// Licensed under the MIT license. See LICENSE file in the project root for full license information.
-
-import { NavigationItem } from '@cratis/scene.model';
-import { aggregateContributions } from '@cratis/scene.engine';
-import { extractNavigationItem } from '@cratis/scene.react';
-import { galleryScreen, galleryScreenTemplates, navigationContributionPoint, navigationContributions, navigationEntries } from '../gallery';
-
-describe('when aggregating the navigation contributions', () => {
-    const aggregated = aggregateContributions(navigationContributions, navigationContributionPoint);
-    const items = aggregated.map(extractNavigationItem).filter((item): item is NavigationItem => item !== undefined);
-
-    it('should aggregate one contribution per navigation entry', () => {
-        aggregated.should.have.lengthOf(navigationEntries.length);
-    });
-
-    it('should extract every one of them as a navigation item', () => {
-        items.should.have.lengthOf(navigationEntries.length);
-    });
-
-    it('should carry the label and target screen through the property bag unchanged', () => {
-        const dashboard = items.find(item => item.targetScreen === 'Dashboard');
-        dashboard!.label.should.equal('Dashboard');
-    });
-
-    it('should carry the group so an aggregated navigation can section itself', () => {
-        items.filter(item => item.group === undefined).should.be.empty;
-    });
-
-    it('should carry a route parameter bag rather than leaving it undefined', () => {
-        items.filter(item => item.routeParameterBindings === undefined).should.be.empty;
-    });
-
-    it('should point every entry at a screen template this blueprint provides', () => {
-        const provided = new Set(galleryScreenTemplates.map(template => template.name));
-        items.filter(item => !provided.has(item.targetScreen)).map(item => item.targetScreen).should.be.empty;
-    });
-
-    it('should point every entry at a screen the gallery actually ships', () => {
-        items.filter(item => galleryScreen(item.targetScreen) === undefined).map(item => item.targetScreen).should.be.empty;
-    });
-
-    it('should carry the contributions on every application-shell screen', () => {
-        galleryScreen('Dashboard')!.contributions.should.have.lengthOf(navigationEntries.length);
-    });
-
-    it('should not carry navigation on a full-page screen, which has no navigation to render', () => {
-        galleryScreen('Login')!.contributions.should.be.empty;
-    });
-});