@webiny/app-admin-ui 0.0.0-unstable.a4f3e4ea8b → 0.0.0-unstable.a85ef555b2

package/Dashboard/dashboardLayout/repository/abstractions.d.ts

@@ -0,0 +1,25 @@
+import type { DashboardLayoutData } from "../types.js";
+/**
+ * Talks to the API. `get` resolves to `null` when the user never customized their dashboard.
+ */
+export interface IDashboardLayoutGateway {
+    get(): Promise<DashboardLayoutData | null>;
+    save(layout: DashboardLayoutData): Promise<DashboardLayoutData>;
+}
+export declare const DashboardLayoutGateway: import("@webiny/di").Abstraction<IDashboardLayoutGateway>;
+export declare namespace DashboardLayoutGateway {
+    type Interface = IDashboardLayoutGateway;
+}
+/**
+ * Keeps a copy of each user's layout in localStorage, so the dashboard renders straight away and
+ * the API request only confirms or corrects it.
+ */
+export interface IDashboardLayoutRepository {
+    getCached(userId: string): DashboardLayoutData | null;
+    fetch(userId: string): Promise<DashboardLayoutData | null>;
+    save(userId: string, layout: DashboardLayoutData): Promise<void>;
+}
+export declare const DashboardLayoutRepository: import("@webiny/di").Abstraction<IDashboardLayoutRepository>;
+export declare namespace DashboardLayoutRepository {
+    type Interface = IDashboardLayoutRepository;
+}

package/Dashboard/dashboardLayout/repository/abstractions.js

@@ -0,0 +1,6 @@
+import { createAbstraction } from "@webiny/feature/admin";
+const DashboardLayoutGateway = createAbstraction("DashboardLayoutGateway");
+const DashboardLayoutRepository = createAbstraction("DashboardLayoutRepository");
+export { DashboardLayoutGateway, DashboardLayoutRepository };
+
+//# sourceMappingURL=abstractions.js.map

package/Dashboard/dashboardLayout/repository/abstractions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/repository/abstractions.js","sources":["../../../../src/Dashboard/dashboardLayout/repository/abstractions.ts"],"sourcesContent":["import { createAbstraction } from \"@webiny/feature/admin\";\nimport type { DashboardLayoutData } from \"../types.js\";\n\n/**\n * Talks to the API. `get` resolves to `null` when the user never customized their dashboard.\n */\nexport interface IDashboardLayoutGateway {\n    get(): Promise<DashboardLayoutData | null>;\n    save(layout: DashboardLayoutData): Promise<DashboardLayoutData>;\n}\n\nexport const DashboardLayoutGateway =\n    createAbstraction<IDashboardLayoutGateway>(\"DashboardLayoutGateway\");\n\nexport namespace DashboardLayoutGateway {\n    export type Interface = IDashboardLayoutGateway;\n}\n\n/**\n * Keeps a copy of each user's layout in localStorage, so the dashboard renders straight away and\n * the API request only confirms or corrects it.\n */\nexport interface IDashboardLayoutRepository {\n    // The cached layout, or `null` if there is none for this user and tenant.\n    getCached(userId: string): DashboardLayoutData | null;\n    // Fetches the stored layout and refreshes the cache with it.\n    fetch(userId: string): Promise<DashboardLayoutData | null>;\n    save(userId: string, layout: DashboardLayoutData): Promise<void>;\n}\n\nexport const DashboardLayoutRepository = createAbstraction<IDashboardLayoutRepository>(\n    \"DashboardLayoutRepository\"\n);\n\nexport namespace DashboardLayoutRepository {\n    export type Interface = IDashboardLayoutRepository;\n}\n"],"names":["DashboardLayoutGateway","createAbstraction","DashboardLayoutRepository"],"mappings":";AAWO,MAAMA,yBACTC,kBAA2C;AAkBxC,MAAMC,4BAA4BD,kBACrC"}

package/Dashboard/dashboardLayout/repository/feature.d.ts

@@ -0,0 +1 @@
+export declare const DashboardLayoutRepositoryFeature: import("@webiny/feature/admin").FeatureDefinition<any, []>;

package/Dashboard/dashboardLayout/repository/feature.js

@@ -0,0 +1,13 @@
+import { createFeature } from "@webiny/feature/admin";
+import { DashboardLayoutGateway } from "./DashboardLayoutGateway.js";
+import { DashboardLayoutRepository } from "./DashboardLayoutRepository.js";
+const DashboardLayoutRepositoryFeature = createFeature({
+    name: "AdminUI/DashboardLayoutRepository",
+    register (container) {
+        container.register(DashboardLayoutGateway).inSingletonScope();
+        container.register(DashboardLayoutRepository).inSingletonScope();
+    }
+});
+export { DashboardLayoutRepositoryFeature };
+
+//# sourceMappingURL=feature.js.map

package/Dashboard/dashboardLayout/repository/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/repository/feature.js","sources":["../../../../src/Dashboard/dashboardLayout/repository/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { DashboardLayoutGateway } from \"./DashboardLayoutGateway.js\";\nimport { DashboardLayoutRepository } from \"./DashboardLayoutRepository.js\";\n\nexport const DashboardLayoutRepositoryFeature = createFeature({\n    name: \"AdminUI/DashboardLayoutRepository\",\n    register(container) {\n        container.register(DashboardLayoutGateway).inSingletonScope();\n        container.register(DashboardLayoutRepository).inSingletonScope();\n    }\n});\n"],"names":["DashboardLayoutRepositoryFeature","createFeature","container","DashboardLayoutGateway","DashboardLayoutRepository"],"mappings":";;;AAIO,MAAMA,mCAAmCC,cAAc;IAC1D,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC,wBAAwB,gBAAgB;QAC3DD,UAAU,QAAQ,CAACE,2BAA2B,gBAAgB;IAClE;AACJ"}

package/Dashboard/dashboardLayout/saveLayout/SaveDashboardLayoutUseCase.d.ts

@@ -0,0 +1,12 @@
+import { DashboardLayoutRepository } from "../repository/abstractions.js";
+import { SaveDashboardLayoutUseCase as UseCaseAbstraction } from "./abstractions.js";
+import type { DashboardLayoutData } from "../types.js";
+declare class SaveDashboardLayoutUseCaseImpl implements UseCaseAbstraction.Interface {
+    private repository;
+    constructor(repository: DashboardLayoutRepository.Interface);
+    execute(userId: string, layout: DashboardLayoutData): Promise<void>;
+}
+export declare const SaveDashboardLayoutUseCase: typeof SaveDashboardLayoutUseCaseImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("./abstractions.js").ISaveDashboardLayoutUseCase>;
+};
+export {};

package/Dashboard/dashboardLayout/saveLayout/SaveDashboardLayoutUseCase.js

@@ -0,0 +1,19 @@
+import { DashboardLayoutRepository } from "../repository/abstractions.js";
+import { SaveDashboardLayoutUseCase } from "./abstractions.js";
+class SaveDashboardLayoutUseCaseImpl {
+    constructor(repository){
+        this.repository = repository;
+    }
+    async execute(userId, layout) {
+        await this.repository.save(userId, layout);
+    }
+}
+const SaveDashboardLayoutUseCase_SaveDashboardLayoutUseCase = SaveDashboardLayoutUseCase.createImplementation({
+    implementation: SaveDashboardLayoutUseCaseImpl,
+    dependencies: [
+        DashboardLayoutRepository
+    ]
+});
+export { SaveDashboardLayoutUseCase_SaveDashboardLayoutUseCase as SaveDashboardLayoutUseCase };
+
+//# sourceMappingURL=SaveDashboardLayoutUseCase.js.map

package/Dashboard/dashboardLayout/saveLayout/SaveDashboardLayoutUseCase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/saveLayout/SaveDashboardLayoutUseCase.js","sources":["../../../../src/Dashboard/dashboardLayout/saveLayout/SaveDashboardLayoutUseCase.ts"],"sourcesContent":["import { DashboardLayoutRepository } from \"../repository/abstractions.js\";\nimport { SaveDashboardLayoutUseCase as UseCaseAbstraction } from \"./abstractions.js\";\nimport type { DashboardLayoutData } from \"../types.js\";\n\nclass SaveDashboardLayoutUseCaseImpl implements UseCaseAbstraction.Interface {\n    constructor(private repository: DashboardLayoutRepository.Interface) {}\n\n    async execute(userId: string, layout: DashboardLayoutData): Promise<void> {\n        await this.repository.save(userId, layout);\n    }\n}\n\nexport const SaveDashboardLayoutUseCase = UseCaseAbstraction.createImplementation({\n    implementation: SaveDashboardLayoutUseCaseImpl,\n    dependencies: [DashboardLayoutRepository]\n});\n"],"names":["SaveDashboardLayoutUseCaseImpl","repository","userId","layout","SaveDashboardLayoutUseCase","UseCaseAbstraction","DashboardLayoutRepository"],"mappings":";;AAIA,MAAMA;IACF,YAAoBC,UAA+C,CAAE;aAAjDA,UAAU,GAAVA;IAAkD;IAEtE,MAAM,QAAQC,MAAc,EAAEC,MAA2B,EAAiB;QACtE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,CAACD,QAAQC;IACvC;AACJ;AAEO,MAAMC,wDAA6BC,2BAAAA,oBAAuC,CAAC;IAC9E,gBAAgBL;IAChB,cAAc;QAACM;KAA0B;AAC7C"}

package/Dashboard/dashboardLayout/saveLayout/abstractions.d.ts

@@ -0,0 +1,8 @@
+import type { DashboardLayoutData } from "../types.js";
+export interface ISaveDashboardLayoutUseCase {
+    execute(userId: string, layout: DashboardLayoutData): Promise<void>;
+}
+export declare const SaveDashboardLayoutUseCase: import("@webiny/di").Abstraction<ISaveDashboardLayoutUseCase>;
+export declare namespace SaveDashboardLayoutUseCase {
+    type Interface = ISaveDashboardLayoutUseCase;
+}

package/Dashboard/dashboardLayout/saveLayout/abstractions.js

@@ -0,0 +1,5 @@
+import { createAbstraction } from "@webiny/feature/admin";
+const SaveDashboardLayoutUseCase = createAbstraction("SaveDashboardLayoutUseCase");
+export { SaveDashboardLayoutUseCase };
+
+//# sourceMappingURL=abstractions.js.map

package/Dashboard/dashboardLayout/saveLayout/abstractions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/saveLayout/abstractions.js","sources":["../../../../src/Dashboard/dashboardLayout/saveLayout/abstractions.ts"],"sourcesContent":["import { createAbstraction } from \"@webiny/feature/admin\";\nimport type { DashboardLayoutData } from \"../types.js\";\n\nexport interface ISaveDashboardLayoutUseCase {\n    execute(userId: string, layout: DashboardLayoutData): Promise<void>;\n}\n\nexport const SaveDashboardLayoutUseCase = createAbstraction<ISaveDashboardLayoutUseCase>(\n    \"SaveDashboardLayoutUseCase\"\n);\n\nexport namespace SaveDashboardLayoutUseCase {\n    export type Interface = ISaveDashboardLayoutUseCase;\n}\n"],"names":["SaveDashboardLayoutUseCase","createAbstraction"],"mappings":";AAOO,MAAMA,6BAA6BC,kBACtC"}

package/Dashboard/dashboardLayout/saveLayout/feature.d.ts

@@ -0,0 +1 @@
+export declare const SaveDashboardLayoutFeature: import("@webiny/feature/admin").FeatureDefinition<any, []>;

package/Dashboard/dashboardLayout/saveLayout/feature.js

@@ -0,0 +1,11 @@
+import { createFeature } from "@webiny/feature/admin";
+import { SaveDashboardLayoutUseCase } from "./SaveDashboardLayoutUseCase.js";
+const SaveDashboardLayoutFeature = createFeature({
+    name: "AdminUI/SaveDashboardLayout",
+    register (container) {
+        container.register(SaveDashboardLayoutUseCase);
+    }
+});
+export { SaveDashboardLayoutFeature };
+
+//# sourceMappingURL=feature.js.map

package/Dashboard/dashboardLayout/saveLayout/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/saveLayout/feature.js","sources":["../../../../src/Dashboard/dashboardLayout/saveLayout/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { SaveDashboardLayoutUseCase } from \"./SaveDashboardLayoutUseCase.js\";\n\nexport const SaveDashboardLayoutFeature = createFeature({\n    name: \"AdminUI/SaveDashboardLayout\",\n    register(container) {\n        container.register(SaveDashboardLayoutUseCase);\n    }\n});\n"],"names":["SaveDashboardLayoutFeature","createFeature","container","SaveDashboardLayoutUseCase"],"mappings":";;AAGO,MAAMA,6BAA6BC,cAAc;IACpD,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC;IACvB;AACJ"}

package/Dashboard/dashboardLayout/toColumnIndex.d.ts

@@ -0,0 +1 @@
+export declare const toColumnIndex: (column: string | number | undefined) => number;

package/Dashboard/dashboardLayout/toColumnIndex.js

@@ -0,0 +1,7 @@
+const toColumnIndex = (column)=>{
+    if ("number" == typeof column) return column;
+    return "right" === column ? 1 : 0;
+};
+export { toColumnIndex };
+
+//# sourceMappingURL=toColumnIndex.js.map

package/Dashboard/dashboardLayout/toColumnIndex.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/toColumnIndex.js","sources":["../../../src/Dashboard/dashboardLayout/toColumnIndex.ts"],"sourcesContent":["// Widgets register their column as a string (\"left\" or \"right\") or as a zero-based index.\nexport const toColumnIndex = (column: string | number | undefined): number => {\n    if (typeof column === \"number\") {\n        return column;\n    }\n    return column === \"right\" ? 1 : 0;\n};\n"],"names":["toColumnIndex","column"],"mappings":"AACO,MAAMA,gBAAgB,CAACC;IAC1B,IAAI,AAAkB,YAAlB,OAAOA,QACP,OAAOA;IAEX,OAAOA,AAAW,YAAXA,SAAqB,IAAI;AACpC"}

package/Dashboard/dashboardLayout/types.d.ts

@@ -0,0 +1,15 @@
+/** Default column count when a user hasn't customized their dashboard. */
+export declare const DEFAULT_COLUMN_COUNT = 2;
+/** Allowed range for the user-selectable column count. */
+export declare const MIN_COLUMN_COUNT = 2;
+export declare const MAX_COLUMN_COUNT = 4;
+/**
+ * The persisted, per-user dashboard layout: an ordered list of widget names per column
+ * (`columns[i]` = column i), the widgets the user has removed (`hidden`), and how many
+ * columns the user has chosen.
+ */
+export interface DashboardLayoutData {
+    columns: string[][];
+    hidden: string[];
+    columnCount: number;
+}

package/Dashboard/dashboardLayout/types.js

@@ -0,0 +1,6 @@
+const DEFAULT_COLUMN_COUNT = 2;
+const MIN_COLUMN_COUNT = 2;
+const MAX_COLUMN_COUNT = 4;
+export { DEFAULT_COLUMN_COUNT, MAX_COLUMN_COUNT, MIN_COLUMN_COUNT };
+
+//# sourceMappingURL=types.js.map

package/Dashboard/dashboardLayout/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dashboard/dashboardLayout/types.js","sources":["../../../src/Dashboard/dashboardLayout/types.ts"],"sourcesContent":["/** Default column count when a user hasn't customized their dashboard. */\nexport const DEFAULT_COLUMN_COUNT = 2;\n\n/** Allowed range for the user-selectable column count. */\nexport const MIN_COLUMN_COUNT = 2;\nexport const MAX_COLUMN_COUNT = 4;\n\n/**\n * The persisted, per-user dashboard layout: an ordered list of widget names per column\n * (`columns[i]` = column i), the widgets the user has removed (`hidden`), and how many\n * columns the user has chosen.\n */\nexport interface DashboardLayoutData {\n    columns: string[][];\n    hidden: string[];\n    columnCount: number;\n}\n"],"names":["DEFAULT_COLUMN_COUNT","MIN_COLUMN_COUNT","MAX_COLUMN_COUNT"],"mappings":"AACO,MAAMA,uBAAuB;AAG7B,MAAMC,mBAAmB;AACzB,MAAMC,mBAAmB"}

package/Layout.js

@@ -1,9 +1,10 @@
 import react, { useCallback, useMemo, useRef } from "react";
 import react_helmet from "react-helmet";
-import { LayoutRenderer, Navigation, TenantSelector, UserMenu } from "@webiny/app-admin";
+import { AssumedPermissionsSelector, BannerBar, DebuggerIndicator, LayoutRenderer, Navigation, TenantSelector, UserMenu } from "@webiny/app-admin";
 import { HeaderBar, SidebarProvider, cn, useSidebar } from "@webiny/admin-ui";
 import { useLocalStorage, useLocalStorageValue } from "@webiny/app";
 import { CommandPalette } from "./CommandPalette/CommandPalette.js";
+import { Breadcrumbs } from "./Breadcrumbs/Breadcrumbs.js";
 const SIDEBAR_STATE_KEY = "navigation/state";
 const parseSidebarState = (raw)=>{
     try {
@@ -11,6 +12,7 @@ const parseSidebarState = (raw)=>{
         if ("string" == typeof raw) return JSON.parse(raw);
     } catch  {}
 };
+const MAKE_ROOM_FOR_BANNER = "has-[>[data-admin-banner]]:[--spacing-main-content:calc(100vh_-_var(--spacing-header)_-_var(--spacing-banner))]";
 const LayoutContent = ({ title, startElement = null, hideNavigation = false, children })=>{
     const { pinned } = useSidebar();
     const widthClassNames = {
@@ -20,14 +22,14 @@ const LayoutContent = ({ title, startElement = null, hideNavigation = false, chi
     return /*#__PURE__*/ react.createElement(react.Fragment, null, title ? /*#__PURE__*/ react.createElement(react_helmet, {
         title: title
     }) : null, /*#__PURE__*/ react.createElement(CommandPalette, null), hideNavigation ? null : /*#__PURE__*/ react.createElement(Navigation, null), /*#__PURE__*/ react.createElement("div", {
-        className: cn("ml-auto bg-neutral-base transition-[max-width,min-width] ease-linear w-full", hideNavigation ? void 0 : widthClassNames)
-    }, /*#__PURE__*/ react.createElement(HeaderBar, {
+        className: cn("ml-auto bg-neutral-base transition-[max-width,min-width] ease-linear w-full", MAKE_ROOM_FOR_BANNER, hideNavigation ? void 0 : widthClassNames)
+    }, /*#__PURE__*/ react.createElement(BannerBar, null), /*#__PURE__*/ react.createElement(HeaderBar, {
         start: /*#__PURE__*/ react.createElement("div", {
             className: "flex items-center gap-sm"
-        }, startElement),
+        }, /*#__PURE__*/ react.createElement(Breadcrumbs, null), startElement),
         end: /*#__PURE__*/ react.createElement("div", {
             className: "flex gap-x-sm items-center justify-end"
-        }, /*#__PURE__*/ react.createElement(TenantSelector, null), /*#__PURE__*/ react.createElement(UserMenu, null))
+        }, /*#__PURE__*/ react.createElement(DebuggerIndicator, null), /*#__PURE__*/ react.createElement(TenantSelector, null), /*#__PURE__*/ react.createElement(AssumedPermissionsSelector, null), /*#__PURE__*/ react.createElement(UserMenu, null))
     }), /*#__PURE__*/ react.createElement("main", {
         className: "relative overflow-y-auto h-main-content"
     }, children)));

package/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","sources":["../src/Layout.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef } from \"react\";\nimport Helmet from \"react-helmet\";\nimport type { LayoutProps } from \"@webiny/app-admin\";\nimport { LayoutRenderer, Navigation, TenantSelector, UserMenu } from \"@webiny/app-admin\";\nimport { HeaderBar, SidebarProvider, cn, useSidebar } from \"@webiny/admin-ui\";\nimport { useLocalStorage, useLocalStorageValue } from \"@webiny/app\";\nimport { CommandPalette } from \"./CommandPalette/CommandPalette.js\";\n\nconst SIDEBAR_STATE_KEY = \"navigation/state\";\n\ntype SidebarCachedState = {\n    pinned: boolean;\n    expandedSections: string[];\n    pinnedItems: string[];\n};\n\nconst parseSidebarState = (raw: unknown): SidebarCachedState | undefined => {\n    try {\n        if (typeof raw === \"object\" && raw !== null) {\n            return raw as SidebarCachedState;\n        }\n        if (typeof raw === \"string\") {\n            return JSON.parse(raw) as SidebarCachedState;\n        }\n    } catch {\n        // Ignore parse errors\n    }\n    return undefined;\n};\n\nconst LayoutContent = ({\n    title,\n    startElement = null,\n    hideNavigation = false,\n    children\n}: LayoutProps) => {\n    const { pinned } = useSidebar();\n\n    const widthClassNames = {\n        \"max-w-[calc(100%-(var(--spacing-sidebar-expanded)))] \": pinned,\n        \"max-w-[calc(100%-(var(--spacing-sidebar-collapsed)))] \": !pinned\n    };\n\n    return (\n        <>\n            {title ? <Helmet title={title} /> : null}\n            <CommandPalette />\n            {hideNavigation ? null : <Navigation />}\n            <div\n                className={cn(\n                    \"ml-auto bg-neutral-base transition-[max-width,min-width] ease-linear w-full\",\n                    hideNavigation ? undefined : widthClassNames\n                )}\n            >\n                <HeaderBar\n                    start={<div className=\"flex items-center gap-sm\">{startElement}</div>}\n                    end={\n                        <div className={\"flex gap-x-sm items-center justify-end\"}>\n                            <TenantSelector />\n                            <UserMenu />\n                        </div>\n                    }\n                />\n                <main className={\"relative overflow-y-auto h-main-content\"}>{children}</main>\n            </div>\n        </>\n    );\n};\n\nexport const Layout = LayoutRenderer.createDecorator(() => {\n    return function Layout(props: LayoutProps) {\n        const localStorage = useLocalStorage();\n        const localStorageRef = useRef(localStorage);\n        localStorageRef.current = localStorage;\n\n        const rawState = useLocalStorageValue(SIDEBAR_STATE_KEY);\n        const cachedState = useMemo(() => parseSidebarState(rawState), [rawState]);\n\n        const onChangeState = useCallback((newState: SidebarCachedState) => {\n            localStorageRef.current.set(SIDEBAR_STATE_KEY, JSON.stringify(newState));\n        }, []);\n\n        return (\n            <SidebarProvider state={cachedState} onChangeState={onChangeState}>\n                <LayoutContent {...props} />\n            </SidebarProvider>\n        );\n    };\n});\n"],"names":["SIDEBAR_STATE_KEY","parseSidebarState","raw","JSON","LayoutContent","title","startElement","hideNavigation","children","pinned","useSidebar","widthClassNames","Helmet","CommandPalette","Navigation","cn","undefined","HeaderBar","TenantSelector","UserMenu","Layout","LayoutRenderer","props","localStorage","useLocalStorage","localStorageRef","useRef","rawState","useLocalStorageValue","cachedState","useMemo","onChangeState","useCallback","newState","SidebarProvider"],"mappings":";;;;;;AAQA,MAAMA,oBAAoB;AAQ1B,MAAMC,oBAAoB,CAACC;IACvB,IAAI;QACA,IAAI,AAAe,YAAf,OAAOA,OAAoBA,AAAQ,SAARA,KAC3B,OAAOA;QAEX,IAAI,AAAe,YAAf,OAAOA,KACP,OAAOC,KAAK,KAAK,CAACD;IAE1B,EAAE,OAAM,CAER;AAEJ;AAEA,MAAME,gBAAgB,CAAC,EACnBC,KAAK,EACLC,eAAe,IAAI,EACnBC,iBAAiB,KAAK,EACtBC,QAAQ,EACE;IACV,MAAM,EAAEC,MAAM,EAAE,GAAGC;IAEnB,MAAMC,kBAAkB;QACpB,yDAAyDF;QACzD,0DAA0D,CAACA;IAC/D;IAEA,OAAO,WAAP,GACI,0CACKJ,QAAQ,WAARA,GAAQ,oBAACO,cAAMA;QAAC,OAAOP;SAAY,oBACpC,oBAACQ,gBAAcA,OACdN,iBAAiB,OAAO,WAAP,GAAO,oBAACO,YAAUA,OAAAA,WAAAA,GACpC,oBAAC;QACG,WAAWC,GACP,+EACAR,iBAAiBS,SAAYL;qBAGjC,oBAACM,WAASA;QACN,qBAAO,oBAAC;YAAI,WAAU;WAA4BX;QAClD,mBACI,oBAAC;YAAI,WAAW;yBACZ,oBAACY,gBAAcA,OAAAA,WAAAA,GACf,oBAACC,UAAQA;sBAIrB,oBAAC;QAAK,WAAW;OAA4CX;AAI7E;AAEO,MAAMY,gBAASC,eAAe,eAAe,CAAC,IAC1C,SAAgBC,KAAkB;QACrC,MAAMC,eAAeC;QACrB,MAAMC,kBAAkBC,OAAOH;QAC/BE,gBAAgB,OAAO,GAAGF;QAE1B,MAAMI,WAAWC,qBAAqB5B;QACtC,MAAM6B,cAAcC,QAAQ,IAAM7B,kBAAkB0B,WAAW;YAACA;SAAS;QAEzE,MAAMI,gBAAgBC,YAAY,CAACC;YAC/BR,gBAAgB,OAAO,CAAC,GAAG,CAACzB,mBAAmBG,KAAK,SAAS,CAAC8B;QAClE,GAAG,EAAE;QAEL,OAAO,WAAP,GACI,oBAACC,iBAAeA;YAAC,OAAOL;YAAa,eAAeE;yBAChD,oBAAC3B,eAAkBkB;IAG/B"}
+{"version":3,"file":"Layout.js","sources":["../src/Layout.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef } from \"react\";\nimport Helmet from \"react-helmet\";\nimport type { LayoutProps } from \"@webiny/app-admin\";\nimport { AssumedPermissionsSelector } from \"@webiny/app-admin\";\nimport { BannerBar } from \"@webiny/app-admin\";\nimport { DebuggerIndicator } from \"@webiny/app-admin\";\nimport { LayoutRenderer } from \"@webiny/app-admin\";\nimport { Navigation } from \"@webiny/app-admin\";\nimport { TenantSelector } from \"@webiny/app-admin\";\nimport { UserMenu } from \"@webiny/app-admin\";\nimport { HeaderBar, SidebarProvider, cn, useSidebar } from \"@webiny/admin-ui\";\nimport { useLocalStorage, useLocalStorageValue } from \"@webiny/app\";\nimport { CommandPalette } from \"./CommandPalette/CommandPalette.js\";\nimport { Breadcrumbs } from \"./Breadcrumbs/Breadcrumbs.js\";\n\nconst SIDEBAR_STATE_KEY = \"navigation/state\";\n\ntype SidebarCachedState = {\n    pinned: boolean;\n    expandedSections: string[];\n    pinnedItems: string[];\n};\n\nconst parseSidebarState = (raw: unknown): SidebarCachedState | undefined => {\n    try {\n        if (typeof raw === \"object\" && raw !== null) {\n            return raw as SidebarCachedState;\n        }\n        if (typeof raw === \"string\") {\n            return JSON.parse(raw) as SidebarCachedState;\n        }\n    } catch {\n        // Ignore parse errors\n    }\n    return undefined;\n};\n\n/*\n * Views size themselves with `h-main-content`, which is the window minus the header. While the\n * banner bar shows, they have to lose its height too, or every page scrolls by exactly that much.\n * The bar is always `--spacing-banner` tall, so plain CSS can do it. Scoped to the wrapper below,\n * which holds both the bar and the views.\n *\n * TODO: Temporary. The real fix is for views to fill `main` instead of computing their own height\n * from the window: make this wrapper a full-height column and `main` `flex-1 min-h-0`, then move\n * the ~13 views that use `h-main-content` to `h-full`. That also lets the bar wrap its text.\n */\nconst MAKE_ROOM_FOR_BANNER =\n    \"has-[>[data-admin-banner]]:[--spacing-main-content:calc(100vh_-_var(--spacing-header)_-_var(--spacing-banner))]\";\n\nconst LayoutContent = ({\n    title,\n    startElement = null,\n    hideNavigation = false,\n    children\n}: LayoutProps) => {\n    const { pinned } = useSidebar();\n\n    const widthClassNames = {\n        \"max-w-[calc(100%-(var(--spacing-sidebar-expanded)))] \": pinned,\n        \"max-w-[calc(100%-(var(--spacing-sidebar-collapsed)))] \": !pinned\n    };\n\n    return (\n        <>\n            {title ? <Helmet title={title} /> : null}\n            <CommandPalette />\n            {hideNavigation ? null : <Navigation />}\n            <div\n                className={cn(\n                    \"ml-auto bg-neutral-base transition-[max-width,min-width] ease-linear w-full\",\n                    MAKE_ROOM_FOR_BANNER,\n                    hideNavigation ? undefined : widthClassNames\n                )}\n            >\n                <BannerBar />\n                <HeaderBar\n                    start={\n                        <div className=\"flex items-center gap-sm\">\n                            <Breadcrumbs />\n                            {startElement}\n                        </div>\n                    }\n                    end={\n                        <div className={\"flex gap-x-sm items-center justify-end\"}>\n                            <DebuggerIndicator />\n                            <TenantSelector />\n                            <AssumedPermissionsSelector />\n                            <UserMenu />\n                        </div>\n                    }\n                />\n                <main className={\"relative overflow-y-auto h-main-content\"}>{children}</main>\n            </div>\n        </>\n    );\n};\n\nexport const Layout = LayoutRenderer.createDecorator(() => {\n    return function Layout(props: LayoutProps) {\n        const localStorage = useLocalStorage();\n        const localStorageRef = useRef(localStorage);\n        localStorageRef.current = localStorage;\n\n        const rawState = useLocalStorageValue(SIDEBAR_STATE_KEY);\n        const cachedState = useMemo(() => parseSidebarState(rawState), [rawState]);\n\n        const onChangeState = useCallback((newState: SidebarCachedState) => {\n            localStorageRef.current.set(SIDEBAR_STATE_KEY, JSON.stringify(newState));\n        }, []);\n\n        return (\n            <SidebarProvider state={cachedState} onChangeState={onChangeState}>\n                <LayoutContent {...props} />\n            </SidebarProvider>\n        );\n    };\n});\n"],"names":["SIDEBAR_STATE_KEY","parseSidebarState","raw","JSON","MAKE_ROOM_FOR_BANNER","LayoutContent","title","startElement","hideNavigation","children","pinned","useSidebar","widthClassNames","Helmet","CommandPalette","Navigation","cn","undefined","BannerBar","HeaderBar","Breadcrumbs","DebuggerIndicator","TenantSelector","AssumedPermissionsSelector","UserMenu","Layout","LayoutRenderer","props","localStorage","useLocalStorage","localStorageRef","useRef","rawState","useLocalStorageValue","cachedState","useMemo","onChangeState","useCallback","newState","SidebarProvider"],"mappings":";;;;;;;AAeA,MAAMA,oBAAoB;AAQ1B,MAAMC,oBAAoB,CAACC;IACvB,IAAI;QACA,IAAI,AAAe,YAAf,OAAOA,OAAoBA,AAAQ,SAARA,KAC3B,OAAOA;QAEX,IAAI,AAAe,YAAf,OAAOA,KACP,OAAOC,KAAK,KAAK,CAACD;IAE1B,EAAE,OAAM,CAER;AAEJ;AAYA,MAAME,uBACF;AAEJ,MAAMC,gBAAgB,CAAC,EACnBC,KAAK,EACLC,eAAe,IAAI,EACnBC,iBAAiB,KAAK,EACtBC,QAAQ,EACE;IACV,MAAM,EAAEC,MAAM,EAAE,GAAGC;IAEnB,MAAMC,kBAAkB;QACpB,yDAAyDF;QACzD,0DAA0D,CAACA;IAC/D;IAEA,OAAO,WAAP,GACI,0CACKJ,QAAQ,WAARA,GAAQ,oBAACO,cAAMA;QAAC,OAAOP;SAAY,oBACpC,oBAACQ,gBAAcA,OACdN,iBAAiB,OAAO,WAAP,GAAO,oBAACO,YAAUA,OAAAA,WAAAA,GACpC,oBAAC;QACG,WAAWC,GACP,+EACAZ,sBACAI,iBAAiBS,SAAYL;qBAGjC,oBAACM,WAASA,OAAAA,WAAAA,GACV,oBAACC,WAASA;QACN,qBACI,oBAAC;YAAI,WAAU;yBACX,oBAACC,aAAWA,OACXb;QAGT,mBACI,oBAAC;YAAI,WAAW;yBACZ,oBAACc,mBAAiBA,OAAAA,WAAAA,GAClB,oBAACC,gBAAcA,OAAAA,WAAAA,GACf,oBAACC,4BAA0BA,OAAAA,WAAAA,GAC3B,oBAACC,UAAQA;sBAIrB,oBAAC;QAAK,WAAW;OAA4Cf;AAI7E;AAEO,MAAMgB,gBAASC,eAAe,eAAe,CAAC,IAC1C,SAAgBC,KAAkB;QACrC,MAAMC,eAAeC;QACrB,MAAMC,kBAAkBC,OAAOH;QAC/BE,gBAAgB,OAAO,GAAGF;QAE1B,MAAMI,WAAWC,qBAAqBjC;QACtC,MAAMkC,cAAcC,QAAQ,IAAMlC,kBAAkB+B,WAAW;YAACA;SAAS;QAEzE,MAAMI,gBAAgBC,YAAY,CAACC;YAC/BR,gBAAgB,OAAO,CAAC,GAAG,CAAC9B,mBAAmBG,KAAK,SAAS,CAACmC;QAClE,GAAG,EAAE;QAEL,OAAO,WAAP,GACI,oBAACC,iBAAeA;YAAC,OAAOL;YAAa,eAAeE;yBAChD,oBAAC/B,eAAkBsB;IAG/B"}

package/index.js

@@ -1,5 +1,5 @@
 import react from "react";
-import { AdminConfig } from "@webiny/app-admin";
+import { AdminConfig, RegisterFeature } from "@webiny/app-admin";
 import { Layout } from "./Layout.js";
 import { Navigation } from "./Navigation/Navigation.js";
 import { UserMenu } from "./UserMenu.js";
@@ -8,16 +8,27 @@ import { NotFound } from "./NotFound.js";
 import { Dashboard } from "./Dashboard.js";
 import { Logo } from "./Logo.js";
 import { AssistanceWidget, CommunityWidget } from "./Dashboard/components/index.js";
-const AdminUI = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(AdminConfig, null, /*#__PURE__*/ react.createElement(AdminConfig.Dashboard.Widget, {
+import { DashboardLayoutPresenterFeature } from "./Dashboard/dashboardLayout/presenter/feature.js";
+const AdminUI = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(RegisterFeature, {
+        feature: DashboardLayoutPresenterFeature
+    }), /*#__PURE__*/ react.createElement(AdminConfig, null, /*#__PURE__*/ react.createElement(AdminConfig.Dashboard.Widget, {
         name: "admin.assistance",
+        title: "Need some assistance?",
+        description: "Documentation and ways to reach the Webiny team.",
+        group: "General",
         column: "right",
         pin: "last",
-        element: /*#__PURE__*/ react.createElement(AssistanceWidget, null)
+        element: /*#__PURE__*/ react.createElement(AssistanceWidget, null),
+        preview: /*#__PURE__*/ react.createElement(AssistanceWidget, null)
     }), /*#__PURE__*/ react.createElement(AdminConfig.Dashboard.Widget, {
         name: "admin.community",
+        title: "Join our community",
+        description: "GitHub, Slack, YouTube and X.",
+        group: "General",
         pin: "last",
         column: "right",
-        element: /*#__PURE__*/ react.createElement(CommunityWidget, null)
+        element: /*#__PURE__*/ react.createElement(CommunityWidget, null),
+        preview: /*#__PURE__*/ react.createElement(CommunityWidget, null)
     })), /*#__PURE__*/ react.createElement(Dashboard, null), /*#__PURE__*/ react.createElement(Dialog, null), /*#__PURE__*/ react.createElement(Layout, null), /*#__PURE__*/ react.createElement(Navigation, null), /*#__PURE__*/ react.createElement(NotFound, null), /*#__PURE__*/ react.createElement(UserMenu, null), /*#__PURE__*/ react.createElement(Logo, null));
 export { AdminUI };
 

package/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../src/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig } from \"@webiny/app-admin\";\nimport { Layout } from \"./Layout.js\";\nimport { Navigation } from \"./Navigation/Navigation.js\";\nimport { UserMenu } from \"~/UserMenu.js\";\nimport { Dialog } from \"./Dialog.js\";\nimport { NotFound } from \"./NotFound.js\";\nimport { Dashboard } from \"./Dashboard.js\";\nimport { Logo } from \"./Logo.js\";\nimport { AssistanceWidget, CommunityWidget } from \"./Dashboard/components/index.js\";\n\nexport const AdminUI = () => {\n    return (\n        <>\n            <AdminConfig>\n                <AdminConfig.Dashboard.Widget\n                    name=\"admin.assistance\"\n                    column=\"right\"\n                    pin=\"last\"\n                    element={<AssistanceWidget />}\n                />\n                <AdminConfig.Dashboard.Widget\n                    name=\"admin.community\"\n                    pin=\"last\"\n                    column=\"right\"\n                    element={<CommunityWidget />}\n                />\n            </AdminConfig>\n            <Dashboard />\n            <Dialog />\n            <Layout />\n            <Navigation />\n            <NotFound />\n            <UserMenu />\n            <Logo />\n        </>\n    );\n};\n"],"names":["AdminUI","AdminConfig","AssistanceWidget","CommunityWidget","Dashboard","Dialog","Layout","Navigation","NotFound","UserMenu","Logo"],"mappings":";;;;;;;;;;AAWO,MAAMA,UAAU,IACZ,WAAP,GACI,wDACI,oBAACC,aAAWA,MAAAA,WAAAA,GACR,oBAACA,YAAY,SAAS,CAAC,MAAM;QACzB,MAAK;QACL,QAAO;QACP,KAAI;QACJ,uBAAS,oBAACC,kBAAgBA;sBAE9B,oBAACD,YAAY,SAAS,CAAC,MAAM;QACzB,MAAK;QACL,KAAI;QACJ,QAAO;QACP,uBAAS,oBAACE,iBAAeA;uBAGjC,oBAACC,WAASA,OAAAA,WAAAA,GACV,oBAACC,QAAMA,OAAAA,WAAAA,GACP,oBAACC,QAAMA,OAAAA,WAAAA,GACP,oBAACC,YAAUA,OAAAA,WAAAA,GACX,oBAACC,UAAQA,OAAAA,WAAAA,GACT,oBAACC,UAAQA,OAAAA,WAAAA,GACT,oBAACC,MAAIA"}
+{"version":3,"file":"index.js","sources":["../src/index.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig } from \"@webiny/app-admin\";\nimport { RegisterFeature } from \"@webiny/app-admin\";\nimport { Layout } from \"./Layout.js\";\nimport { Navigation } from \"./Navigation/Navigation.js\";\nimport { UserMenu } from \"~/UserMenu.js\";\nimport { Dialog } from \"./Dialog.js\";\nimport { NotFound } from \"./NotFound.js\";\nimport { Dashboard } from \"./Dashboard.js\";\nimport { Logo } from \"./Logo.js\";\nimport { AssistanceWidget } from \"./Dashboard/components/index.js\";\nimport { CommunityWidget } from \"./Dashboard/components/index.js\";\nimport { DashboardLayoutPresenterFeature } from \"./Dashboard/dashboardLayout/presenter/feature.js\";\n\nexport const AdminUI = () => {\n    return (\n        <>\n            <RegisterFeature feature={DashboardLayoutPresenterFeature} />\n            <AdminConfig>\n                <AdminConfig.Dashboard.Widget\n                    name=\"admin.assistance\"\n                    title=\"Need some assistance?\"\n                    description=\"Documentation and ways to reach the Webiny team.\"\n                    group=\"General\"\n                    column=\"right\"\n                    pin=\"last\"\n                    element={<AssistanceWidget />}\n                    preview={<AssistanceWidget />}\n                />\n                <AdminConfig.Dashboard.Widget\n                    name=\"admin.community\"\n                    title=\"Join our community\"\n                    description=\"GitHub, Slack, YouTube and X.\"\n                    group=\"General\"\n                    pin=\"last\"\n                    column=\"right\"\n                    element={<CommunityWidget />}\n                    preview={<CommunityWidget />}\n                />\n            </AdminConfig>\n            <Dashboard />\n            <Dialog />\n            <Layout />\n            <Navigation />\n            <NotFound />\n            <UserMenu />\n            <Logo />\n        </>\n    );\n};\n"],"names":["AdminUI","RegisterFeature","DashboardLayoutPresenterFeature","AdminConfig","AssistanceWidget","CommunityWidget","Dashboard","Dialog","Layout","Navigation","NotFound","UserMenu","Logo"],"mappings":";;;;;;;;;;;AAcO,MAAMA,UAAU,IACZ,WAAP,GACI,wDACI,oBAACC,iBAAeA;QAAC,SAASC;sBAC1B,oBAACC,aAAWA,MAAAA,WAAAA,GACR,oBAACA,YAAY,SAAS,CAAC,MAAM;QACzB,MAAK;QACL,OAAM;QACN,aAAY;QACZ,OAAM;QACN,QAAO;QACP,KAAI;QACJ,uBAAS,oBAACC,kBAAgBA;QAC1B,uBAAS,oBAACA,kBAAgBA;sBAE9B,oBAACD,YAAY,SAAS,CAAC,MAAM;QACzB,MAAK;QACL,OAAM;QACN,aAAY;QACZ,OAAM;QACN,KAAI;QACJ,QAAO;QACP,uBAAS,oBAACE,iBAAeA;QACzB,uBAAS,oBAACA,iBAAeA;uBAGjC,oBAACC,WAASA,OAAAA,WAAAA,GACV,oBAACC,QAAMA,OAAAA,WAAAA,GACP,oBAACC,QAAMA,OAAAA,WAAAA,GACP,oBAACC,YAAUA,OAAAA,WAAAA,GACX,oBAACC,UAAQA,OAAAA,WAAAA,GACT,oBAACC,UAAQA,OAAAA,WAAAA,GACT,oBAACC,MAAIA"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/app-admin-ui",
-	"version": "0.0.0-unstable.a4f3e4ea8b",
+	"version": "0.0.0-unstable.a85ef555b2",
 	"type": "module",
 	"exports": {
 		".": "./index.js",
@@ -14,20 +14,26 @@
 	"license": "MIT",
 	"dependencies": {
 		"@types/react": "18.3.31",
-		"@webiny/admin-ui": "0.0.0-unstable.a4f3e4ea8b",
-		"@webiny/app": "0.0.0-unstable.a4f3e4ea8b",
-		"@webiny/app-admin": "0.0.0-unstable.a4f3e4ea8b",
-		"@webiny/icons": "0.0.0-unstable.a4f3e4ea8b",
+		"@webiny/admin-ui": "0.0.0-unstable.a85ef555b2",
+		"@webiny/app": "0.0.0-unstable.a85ef555b2",
+		"@webiny/app-admin": "0.0.0-unstable.a85ef555b2",
+		"@webiny/feature": "0.0.0-unstable.a85ef555b2",
+		"@webiny/icons": "0.0.0-unstable.a85ef555b2",
 		"cmdk": "1.1.1",
+		"mobx": "7.0.3",
 		"react": "18.3.1",
+		"react-dnd": "16.0.1",
+		"react-dnd-html5-backend": "16.0.1",
 		"react-dom": "18.3.1",
 		"react-helmet": "6.1.0"
 	},
 	"devDependencies": {
 		"@types/react-helmet": "6.1.11",
-		"@webiny/build-tools": "0.0.0-unstable.a4f3e4ea8b",
+		"@webiny/build-tools": "0.0.0-unstable.a85ef555b2",
+		"@webiny/di": "2.0.0",
 		"rimraf": "6.1.3",
-		"typescript": "7.0.2"
+		"typescript": "7.0.2",
+		"vitest": "4.1.11"
 	},
 	"publishConfig": {
 		"access": "public"