@webiny/app-admin 0.0.0-unstable.a4637c5ce6 → 0.0.0-unstable.a4f3e4ea8b

package/presentation/commandPalette/commands/SendMessageCommand.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+import { Command } from "../abstractions.js";
+/**
+ * DEMO command showcasing a `detailView`: selecting it opens a form inside the palette,
+ * and submitting calls `execute(data)`. Safe to remove — kept as a live example of the
+ * detail-view capability.
+ */
+declare const SendMessageDetailView: ({ command, onClose }: Command.DetailProps) => React.JSX.Element;
+declare class SendMessageCommandImpl implements Command.Interface {
+    name: string;
+    label: string;
+    description: string;
+    category: string;
+    keywords: string[];
+    shortcut: string;
+    icon: React.JSX.Element;
+    detailView: typeof SendMessageDetailView;
+    execute(params?: unknown): void;
+}
+export declare const SendMessageCommand: typeof SendMessageCommandImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("../abstractions.js").ICommand>;
+};
+export {};

package/presentation/commandPalette/commands/SendMessageCommand.js

@@ -0,0 +1,66 @@
+import react, { useState } from "react";
+import { Button, Icon, Input } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/send.svg";
+import { Command } from "../abstractions.js";
+const SendMessageDetailView = ({ command, onClose })=>{
+    const [recipient, setRecipient] = useState("");
+    const [message, setMessage] = useState("");
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-sm p-md"
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Recipient",
+        value: recipient,
+        onChange: setRecipient,
+        placeholder: "Enter recipient",
+        autoFocus: true
+    }), /*#__PURE__*/ react.createElement(Input, {
+        label: "Message",
+        value: message,
+        onChange: setMessage,
+        placeholder: "Enter your message"
+    }), /*#__PURE__*/ react.createElement("div", {
+        className: "flex justify-end pt-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        variant: "primary",
+        text: "Send",
+        onClick: ()=>{
+            command.execute({
+                recipient,
+                message
+            });
+            onClose();
+        }
+    })));
+};
+class SendMessageCommandImpl {
+    execute(params) {
+        const data = params;
+        window.alert(`Message to ${data?.recipient || "?"}: ${data?.message || ""}`);
+    }
+    constructor(){
+        this.name = "admin.demo.sendMessage";
+        this.label = "Send message";
+        this.description = "Demo — a form rendered inside the palette";
+        this.category = "Demo";
+        this.keywords = [
+            "demo",
+            "form",
+            "message"
+        ];
+        this.shortcut = "cmd+shift+m";
+        this.icon = /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            size: "sm",
+            color: "neutral-strong",
+            label: ""
+        });
+        this.detailView = SendMessageDetailView;
+    }
+}
+const SendMessageCommand = Command.createImplementation({
+    implementation: SendMessageCommandImpl,
+    dependencies: []
+});
+export { SendMessageCommand };
+
+//# sourceMappingURL=SendMessageCommand.js.map

package/presentation/commandPalette/commands/SendMessageCommand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/commandPalette/commands/SendMessageCommand.js","sources":["../../../../src/presentation/commandPalette/commands/SendMessageCommand.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { Button, Icon, Input } from \"@webiny/admin-ui\";\nimport { ReactComponent as SendIcon } from \"@webiny/icons/send.svg\";\nimport { Command } from \"../abstractions.js\";\n\n/**\n * DEMO command showcasing a `detailView`: selecting it opens a form inside the palette,\n * and submitting calls `execute(data)`. Safe to remove — kept as a live example of the\n * detail-view capability.\n */\nconst SendMessageDetailView = ({ command, onClose }: Command.DetailProps) => {\n    const [recipient, setRecipient] = useState(\"\");\n    const [message, setMessage] = useState(\"\");\n\n    return (\n        <div className=\"flex flex-col gap-sm p-md\">\n            <Input\n                label=\"Recipient\"\n                value={recipient}\n                onChange={setRecipient}\n                placeholder=\"Enter recipient\"\n                autoFocus\n            />\n            <Input\n                label=\"Message\"\n                value={message}\n                onChange={setMessage}\n                placeholder=\"Enter your message\"\n            />\n            <div className=\"flex justify-end pt-sm\">\n                <Button\n                    variant=\"primary\"\n                    text=\"Send\"\n                    onClick={() => {\n                        command.execute({ recipient, message });\n                        onClose();\n                    }}\n                />\n            </div>\n        </div>\n    );\n};\n\nclass SendMessageCommandImpl implements Command.Interface {\n    name = \"admin.demo.sendMessage\";\n    label = \"Send message\";\n    description = \"Demo — a form rendered inside the palette\";\n    category = \"Demo\";\n    keywords = [\"demo\", \"form\", \"message\"];\n    shortcut = \"cmd+shift+m\";\n    icon = <Icon icon={<SendIcon />} size=\"sm\" color=\"neutral-strong\" label=\"\" />;\n    detailView = SendMessageDetailView;\n\n    execute(params?: unknown) {\n        const data = params as { recipient?: string; message?: string } | undefined;\n        window.alert(`Message to ${data?.recipient || \"?\"}: ${data?.message || \"\"}`);\n    }\n}\n\nexport const SendMessageCommand = Command.createImplementation({\n    implementation: SendMessageCommandImpl,\n    dependencies: []\n});\n"],"names":["SendMessageDetailView","command","onClose","recipient","setRecipient","useState","message","setMessage","Input","Button","SendMessageCommandImpl","params","data","window","Icon","SendIcon","SendMessageCommand","Command"],"mappings":";;;;AAUA,MAAMA,wBAAwB,CAAC,EAAEC,OAAO,EAAEC,OAAO,EAAuB;IACpE,MAAM,CAACC,WAAWC,aAAa,GAAGC,SAAS;IAC3C,MAAM,CAACC,SAASC,WAAW,GAAGF,SAAS;IAEvC,OAAO,WAAP,GACI,oBAAC;QAAI,WAAU;qBACX,oBAACG,OAAKA;QACF,OAAM;QACN,OAAOL;QACP,UAAUC;QACV,aAAY;QACZ;sBAEJ,oBAACI,OAAKA;QACF,OAAM;QACN,OAAOF;QACP,UAAUC;QACV,aAAY;sBAEhB,oBAAC;QAAI,WAAU;qBACX,oBAACE,QAAMA;QACH,SAAQ;QACR,MAAK;QACL,SAAS;YACLR,QAAQ,OAAO,CAAC;gBAAEE;gBAAWG;YAAQ;YACrCJ;QACJ;;AAKpB;AAEA,MAAMQ;IAUF,QAAQC,MAAgB,EAAE;QACtB,MAAMC,OAAOD;QACbE,OAAO,KAAK,CAAC,CAAC,WAAW,EAAED,MAAM,aAAa,IAAI,EAAE,EAAEA,MAAM,WAAW,IAAI;IAC/E;;aAZA,IAAI,GAAG;aACP,KAAK,GAAG;aACR,WAAW,GAAG;aACd,QAAQ,GAAG;aACX,QAAQ,GAAG;YAAC;YAAQ;YAAQ;SAAU;aACtC,QAAQ,GAAG;aACX,IAAI,GAAG,WAAP,GAAO,oBAACE,MAAIA;YAAC,oBAAM,oBAACC,gBAAQA;YAAK,MAAK;YAAK,OAAM;YAAiB,OAAM;;aACxE,UAAU,GAAGf;;AAMjB;AAEO,MAAMgB,qBAAqBC,QAAQ,oBAAoB,CAAC;IAC3D,gBAAgBP;IAChB,cAAc,EAAE;AACpB"}

package/presentation/commandPalette/commands/SignOutCommand.d.ts

@@ -0,0 +1,18 @@
+import React from "react";
+import { Command } from "../abstractions.js";
+import { LogOutUseCase } from "../../../features/security/LogOut/index.js";
+declare class SignOutCommandImpl implements Command.Interface {
+    private logOut;
+    name: string;
+    label: string;
+    description: string;
+    category: string;
+    keywords: string[];
+    icon: React.JSX.Element;
+    constructor(logOut: LogOutUseCase.Interface);
+    execute(): void;
+}
+export declare const SignOutCommand: typeof SignOutCommandImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("../abstractions.js").ICommand>;
+};
+export {};

package/presentation/commandPalette/commands/SignOutCommand.js

@@ -0,0 +1,37 @@
+import react from "react";
+import { Icon } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/logout.svg";
+import { Command } from "../abstractions.js";
+import { LogOutUseCase } from "../../../features/security/LogOut/index.js";
+class SignOutCommandImpl {
+    constructor(logOut){
+        this.logOut = logOut;
+        this.name = "admin.signOut";
+        this.label = "Sign out";
+        this.description = "Log out of the admin app";
+        this.category = "Actions";
+        this.keywords = [
+            "logout",
+            "exit",
+            "session"
+        ];
+        this.icon = /*#__PURE__*/ react.createElement(Icon, {
+            icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+            size: "sm",
+            color: "neutral-strong",
+            label: ""
+        });
+    }
+    execute() {
+        this.logOut.execute();
+    }
+}
+const SignOutCommand = Command.createImplementation({
+    implementation: SignOutCommandImpl,
+    dependencies: [
+        LogOutUseCase
+    ]
+});
+export { SignOutCommand };
+
+//# sourceMappingURL=SignOutCommand.js.map

package/presentation/commandPalette/commands/SignOutCommand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/commandPalette/commands/SignOutCommand.js","sources":["../../../../src/presentation/commandPalette/commands/SignOutCommand.tsx"],"sourcesContent":["import React from \"react\";\nimport { Icon } from \"@webiny/admin-ui\";\nimport { ReactComponent as LogoutIcon } from \"@webiny/icons/logout.svg\";\nimport { Command } from \"../abstractions.js\";\nimport { LogOutUseCase } from \"~/features/security/LogOut/index.js\";\n\nclass SignOutCommandImpl implements Command.Interface {\n    name = \"admin.signOut\";\n    label = \"Sign out\";\n    description = \"Log out of the admin app\";\n    category = \"Actions\";\n    keywords = [\"logout\", \"exit\", \"session\"];\n    icon = <Icon icon={<LogoutIcon />} size=\"sm\" color=\"neutral-strong\" label=\"\" />;\n\n    constructor(private logOut: LogOutUseCase.Interface) {}\n\n    execute() {\n        void this.logOut.execute();\n    }\n}\n\nexport const SignOutCommand = Command.createImplementation({\n    implementation: SignOutCommandImpl,\n    dependencies: [LogOutUseCase]\n});\n"],"names":["SignOutCommandImpl","logOut","Icon","LogoutIcon","SignOutCommand","Command","LogOutUseCase"],"mappings":";;;;;AAMA,MAAMA;IAQF,YAAoBC,MAA+B,CAAE;aAAjCA,MAAM,GAANA;aAPpB,IAAI,GAAG;aACP,KAAK,GAAG;aACR,WAAW,GAAG;aACd,QAAQ,GAAG;aACX,QAAQ,GAAG;YAAC;YAAU;YAAQ;SAAU;aACxC,IAAI,GAAG,WAAP,GAAO,oBAACC,MAAIA;YAAC,oBAAM,oBAACC,gBAAUA;YAAK,MAAK;YAAK,OAAM;YAAiB,OAAM;;IAEpB;IAEtD,UAAU;QACD,IAAI,CAAC,MAAM,CAAC,OAAO;IAC5B;AACJ;AAEO,MAAMC,iBAAiBC,QAAQ,oBAAoB,CAAC;IACvD,gBAAgBL;IAChB,cAAc;QAACM;KAAc;AACjC"}

package/presentation/commandPalette/commands/feature.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Baseline command-palette actions available everywhere in the admin app. Registered
+ * as DI commands; other modules register their own via `Command.createImplementation`.
+ */
+export declare const AdminCommandsFeature: import("@webiny/feature/admin").FeatureDefinition<any, []>;

package/presentation/commandPalette/commands/feature.js

@@ -0,0 +1,15 @@
+import { createFeature } from "@webiny/feature/admin";
+import { CopyCurrentUrlCommand } from "./CopyCurrentUrlCommand.js";
+import { SignOutCommand } from "./SignOutCommand.js";
+import { SendMessageCommand } from "./SendMessageCommand.js";
+const AdminCommandsFeature = createFeature({
+    name: "AdminCommands",
+    register (container) {
+        container.register(CopyCurrentUrlCommand);
+        container.register(SignOutCommand);
+        container.register(SendMessageCommand);
+    }
+});
+export { AdminCommandsFeature };
+
+//# sourceMappingURL=feature.js.map

package/presentation/commandPalette/commands/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/commandPalette/commands/feature.js","sources":["../../../../src/presentation/commandPalette/commands/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { Container } from \"@webiny/di\";\nimport { CopyCurrentUrlCommand } from \"./CopyCurrentUrlCommand.js\";\nimport { SignOutCommand } from \"./SignOutCommand.js\";\nimport { SendMessageCommand } from \"./SendMessageCommand.js\";\n\n/**\n * Baseline command-palette actions available everywhere in the admin app. Registered\n * as DI commands; other modules register their own via `Command.createImplementation`.\n */\nexport const AdminCommandsFeature = createFeature({\n    name: \"AdminCommands\",\n    register(container: Container) {\n        container.register(CopyCurrentUrlCommand);\n        container.register(SignOutCommand);\n        // Demo of the detail-view capability — safe to remove.\n        container.register(SendMessageCommand);\n    }\n});\n"],"names":["AdminCommandsFeature","createFeature","container","CopyCurrentUrlCommand","SignOutCommand","SendMessageCommand"],"mappings":";;;;AAUO,MAAMA,uBAAuBC,cAAc;IAC9C,MAAM;IACN,UAASC,SAAoB;QACzBA,UAAU,QAAQ,CAACC;QACnBD,UAAU,QAAQ,CAACE;QAEnBF,UAAU,QAAQ,CAACG;IACvB;AACJ"}

package/presentation/commandPalette/feature.d.ts

@@ -0,0 +1,3 @@
+export declare const CommandPaletteFeature: import("@webiny/feature/admin").FeatureDefinition<{
+    presenter: import("./abstractions.js").ICommandPalettePresenter;
+}, []>;

package/presentation/commandPalette/feature.js

@@ -0,0 +1,17 @@
+import { createFeature } from "@webiny/feature/admin";
+import { Command, CommandPalettePresenter } from "./abstractions.js";
+import { CommandPalettePresenter as external_CommandPalettePresenter_js_CommandPalettePresenter } from "./CommandPalettePresenter.js";
+const CommandPaletteFeature = createFeature({
+    name: "CommandPalette",
+    register (container) {
+        container.registerFactory(CommandPalettePresenter, ()=>new external_CommandPalettePresenter_js_CommandPalettePresenter(()=>container.resolveAll(Command)));
+    },
+    resolve (container) {
+        return {
+            presenter: container.resolve(CommandPalettePresenter)
+        };
+    }
+});
+export { CommandPaletteFeature };
+
+//# sourceMappingURL=feature.js.map

package/presentation/commandPalette/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/commandPalette/feature.js","sources":["../../../src/presentation/commandPalette/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { Container } from \"@webiny/di\";\nimport { CommandPalettePresenter as Abstraction, Command } from \"./abstractions.js\";\nimport { CommandPalettePresenter } from \"./CommandPalettePresenter.js\";\n\nexport const CommandPaletteFeature = createFeature({\n    name: \"CommandPalette\",\n    register(container: Container) {\n        container.registerFactory(Abstraction, () => {\n            return new CommandPalettePresenter(() => {\n                return container.resolveAll(Command);\n            });\n        });\n    },\n    resolve(container: Container) {\n        return {\n            presenter: container.resolve(Abstraction)\n        };\n    }\n});\n"],"names":["CommandPaletteFeature","createFeature","container","Abstraction","CommandPalettePresenter","Command"],"mappings":";;;AAKO,MAAMA,wBAAwBC,cAAc;IAC/C,MAAM;IACN,UAASC,SAAoB;QACzBA,UAAU,eAAe,CAACC,yBAAa,IAC5B,IAAIC,4DAAwB,IACxBF,UAAU,UAAU,CAACG;IAGxC;IACA,SAAQH,SAAoB;QACxB,OAAO;YACH,WAAWA,UAAU,OAAO,CAACC;QACjC;IACJ;AACJ"}

package/presentation/commandPalette/index.d.ts

@@ -0,0 +1,3 @@
+export { Command, CommandPalettePresenter } from "./abstractions.js";
+export type { ICommand, CommandDetailProps, CommandItemVm, ActiveCommandVm, CommandPaletteViewModel } from "./abstractions.js";
+export { CommandPaletteFeature } from "./feature.js";

package/presentation/commandPalette/index.js

@@ -0,0 +1,2 @@
+export { Command, CommandPalettePresenter } from "./abstractions.js";
+export { CommandPaletteFeature } from "./feature.js";

package/presentation/installation/components/SystemInstaller/SystemInstaller.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface SystemInstallerProps {
+    children: React.ReactNode;
+}
+export declare const SystemInstaller: (({ children }: SystemInstallerProps) => React.JSX.Element) & {
+    displayName: string;
+};
+export {};

package/presentation/installation/components/SystemInstaller/SystemInstaller.js

@@ -0,0 +1,65 @@
+import react from "react";
+import { observer } from "mobx-react-lite";
+import { useFeature } from "@webiny/app";
+import { OverlayLoader, ProgressItemState, SteppedProgress, Text } from "@webiny/admin-ui";
+import { SystemInstallerFeature } from "../../presenters/SystemInstaller/feature.js";
+import { LoginScreen } from "../../../../base/ui/LoginScreen.js";
+import { Tags } from "../../../../base/ui/Tags.js";
+import { Logo } from "../../../../base/ui/Logo.js";
+import { IntroductionStep } from "./steps/IntroductionStep.js";
+import { BasicInfoStep } from "./steps/BasicInfoStep.js";
+import { AdminUserStep } from "./steps/AdminUserStep.js";
+import { FinishSetupStep } from "./steps/FinishSetup.js";
+const stateMap = {
+    idle: ProgressItemState.IDLE,
+    current: ProgressItemState.IN_PROGRESS,
+    completed: ProgressItemState.COMPLETED_AFFIRMATIVE
+};
+const SystemInstaller = observer(({ children })=>{
+    const { presenter } = useFeature(SystemInstallerFeature);
+    const vm = presenter.vm;
+    if (vm.loading) return /*#__PURE__*/ react.createElement(OverlayLoader, {
+        text: "Preparing system..."
+    });
+    if (vm.startUsing) return /*#__PURE__*/ react.createElement(LoginScreen, null, children);
+    return /*#__PURE__*/ react.createElement(Tags, {
+        tags: {
+            installer: true
+        }
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex w-full"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "bg-neutral-light h-screen w-[312px] p-xl"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "w-[240px] p-"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "mb-lg"
+    }, /*#__PURE__*/ react.createElement(Logo, null)), /*#__PURE__*/ react.createElement(Text, {
+        as: "div",
+        size: "md",
+        className: "text-neutral-strong mb-lg"
+    }, "Follow these steps to create your very first Webiny project:"), /*#__PURE__*/ react.createElement(SteppedProgress, {
+        items: vm.steps.map((step)=>({
+                id: step.name,
+                label: step.label,
+                state: stateMap[step.state]
+            }))
+    }))), /*#__PURE__*/ react.createElement("div", {
+        className: "flex h-screen w-full justify-center"
+    }, "introduction" === vm.currentStep ? /*#__PURE__*/ react.createElement(IntroductionStep, {
+        nextStep: presenter.nextStep
+    }) : null, "basic-info" === vm.currentStep ? /*#__PURE__*/ react.createElement(BasicInfoStep, {
+        nextStep: presenter.nextStep
+    }) : null, "admin-account" === vm.currentStep ? /*#__PURE__*/ react.createElement(AdminUserStep, {
+        nextStep: presenter.nextStep
+    }) : null, "finish" === vm.currentStep ? /*#__PURE__*/ react.createElement(FinishSetupStep, {
+        error: vm.error,
+        installing: vm.installing,
+        isInstalled: vm.isInstalled,
+        finishInstallation: presenter.finishInstallation,
+        installSystem: presenter.installSystem
+    }) : null)));
+});
+export { SystemInstaller };
+
+//# sourceMappingURL=SystemInstaller.js.map

package/presentation/installation/components/SystemInstaller/SystemInstaller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/installation/components/SystemInstaller/SystemInstaller.js","sources":["../../../../../src/presentation/installation/components/SystemInstaller/SystemInstaller.tsx"],"sourcesContent":["import React from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { useFeature } from \"@webiny/app\";\nimport { OverlayLoader, ProgressItemState, SteppedProgress, Text } from \"@webiny/admin-ui\";\nimport { SystemInstallerFeature } from \"~/presentation/installation/presenters/SystemInstaller/feature.js\";\nimport { LoginScreen } from \"~/base/ui/LoginScreen.js\";\nimport { Tags } from \"~/base/ui/Tags.js\";\nimport { Logo } from \"~/base/ui/Logo.js\";\nimport { IntroductionStep } from \"./steps/IntroductionStep.js\";\nimport { BasicInfoStep } from \"./steps/BasicInfoStep.js\";\nimport { AdminUserStep } from \"./steps/AdminUserStep.js\";\nimport { FinishSetupStep } from \"~/presentation/installation/components/SystemInstaller/steps/FinishSetup.js\";\n\ninterface SystemInstallerProps {\n    children: React.ReactNode;\n}\n\nconst stateMap = {\n    idle: ProgressItemState.IDLE,\n    current: ProgressItemState.IN_PROGRESS,\n    completed: ProgressItemState.COMPLETED_AFFIRMATIVE\n};\n\nexport const SystemInstaller = observer(({ children }: SystemInstallerProps) => {\n    const { presenter } = useFeature(SystemInstallerFeature);\n\n    const vm = presenter.vm;\n\n    if (vm.loading) {\n        return <OverlayLoader text={\"Preparing system...\"} />;\n    }\n\n    if (vm.startUsing) {\n        return <LoginScreen>{children}</LoginScreen>;\n    }\n\n    return (\n        <Tags tags={{ installer: true }}>\n            <div className=\"flex w-full\">\n                <div className={\"bg-neutral-light h-screen w-[312px] p-xl\"}>\n                    <div className={\"w-[240px] p-\"}>\n                        <div className={\"mb-lg\"}>\n                            <Logo />\n                        </div>\n                        <Text as=\"div\" size={\"md\"} className={\"text-neutral-strong mb-lg\"}>\n                            Follow these steps to create your very first Webiny project:\n                        </Text>\n                        <SteppedProgress\n                            items={vm.steps.map(step => ({\n                                id: step.name,\n                                label: step.label,\n                                state: stateMap[step.state]\n                            }))}\n                        />\n                    </div>\n                </div>\n                <div className={\"flex h-screen w-full justify-center\"}>\n                    {vm.currentStep === \"introduction\" ? (\n                        <IntroductionStep nextStep={presenter.nextStep} />\n                    ) : null}\n                    {vm.currentStep === \"basic-info\" ? (\n                        <BasicInfoStep nextStep={presenter.nextStep} />\n                    ) : null}\n                    {vm.currentStep === \"admin-account\" ? (\n                        <AdminUserStep nextStep={presenter.nextStep} />\n                    ) : null}\n                    {vm.currentStep === \"finish\" ? (\n                        <FinishSetupStep\n                            error={vm.error}\n                            installing={vm.installing}\n                            isInstalled={vm.isInstalled}\n                            finishInstallation={presenter.finishInstallation}\n                            installSystem={presenter.installSystem}\n                        />\n                    ) : null}\n                </div>\n            </div>\n        </Tags>\n    );\n});\n"],"names":["stateMap","ProgressItemState","SystemInstaller","observer","children","presenter","useFeature","SystemInstallerFeature","vm","OverlayLoader","LoginScreen","Tags","Logo","Text","SteppedProgress","step","IntroductionStep","BasicInfoStep","AdminUserStep","FinishSetupStep"],"mappings":";;;;;;;;;;;;AAiBA,MAAMA,WAAW;IACb,MAAMC,kBAAkB,IAAI;IAC5B,SAASA,kBAAkB,WAAW;IACtC,WAAWA,kBAAkB,qBAAqB;AACtD;AAEO,MAAMC,kBAAkBC,SAAS,CAAC,EAAEC,QAAQ,EAAwB;IACvE,MAAM,EAAEC,SAAS,EAAE,GAAGC,WAAWC;IAEjC,MAAMC,KAAKH,UAAU,EAAE;IAEvB,IAAIG,GAAG,OAAO,EACV,OAAO,WAAP,GAAO,oBAACC,eAAaA;QAAC,MAAM;;IAGhC,IAAID,GAAG,UAAU,EACb,OAAO,WAAP,GAAO,oBAACE,aAAWA,MAAEN;IAGzB,OAAO,WAAP,GACI,oBAACO,MAAIA;QAAC,MAAM;YAAE,WAAW;QAAK;qBAC1B,oBAAC;QAAI,WAAU;qBACX,oBAAC;QAAI,WAAW;qBACZ,oBAAC;QAAI,WAAW;qBACZ,oBAAC;QAAI,WAAW;qBACZ,oBAACC,MAAIA,QAAAA,WAAAA,GAET,oBAACC,MAAIA;QAAC,IAAG;QAAM,MAAM;QAAM,WAAW;OAA6B,+EAGnE,oBAACC,iBAAeA;QACZ,OAAON,GAAG,KAAK,CAAC,GAAG,CAACO,CAAAA,OAAS;gBACzB,IAAIA,KAAK,IAAI;gBACb,OAAOA,KAAK,KAAK;gBACjB,OAAOf,QAAQ,CAACe,KAAK,KAAK,CAAC;YAC/B;wBAIZ,oBAAC;QAAI,WAAW;OACXP,AAAmB,mBAAnBA,GAAG,WAAW,GAAsB,WAAjB,GAChB,oBAACQ,kBAAgBA;QAAC,UAAUX,UAAU,QAAQ;SAC9C,MACHG,AAAmB,iBAAnBA,GAAG,WAAW,GAAoB,WAAf,GAChB,oBAACS,eAAaA;QAAC,UAAUZ,UAAU,QAAQ;SAC3C,MACHG,AAAmB,oBAAnBA,GAAG,WAAW,GAAuB,WAAlB,GAChB,oBAACU,eAAaA;QAAC,UAAUb,UAAU,QAAQ;SAC3C,MACHG,AAAmB,aAAnBA,GAAG,WAAW,GAAgB,WAAX,GAChB,oBAACW,iBAAeA;QACZ,OAAOX,GAAG,KAAK;QACf,YAAYA,GAAG,UAAU;QACzB,aAAaA,GAAG,WAAW;QAC3B,oBAAoBH,UAAU,kBAAkB;QAChD,eAAeA,UAAU,aAAa;SAE1C;AAKxB"}

package/presentation/installation/components/SystemInstaller/SystemInstallerProvider.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const SystemInstallerProvider: () => React.JSX.Element;

package/presentation/installation/components/SystemInstaller/SystemInstallerProvider.js

@@ -0,0 +1,12 @@
+import react from "react";
+import { Provider, createProvider } from "@webiny/app";
+import { SystemInstaller } from "./SystemInstaller.js";
+const SystemInstallerHoc = createProvider((Original)=>function({ children }) {
+        return /*#__PURE__*/ react.createElement(SystemInstaller, null, /*#__PURE__*/ react.createElement(Original, null, children));
+    });
+const SystemInstallerProvider_SystemInstallerProvider = ()=>/*#__PURE__*/ react.createElement(Provider, {
+        hoc: SystemInstallerHoc
+    });
+export { SystemInstallerProvider_SystemInstallerProvider as SystemInstallerProvider };
+
+//# sourceMappingURL=SystemInstallerProvider.js.map

package/presentation/installation/components/SystemInstaller/SystemInstallerProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/installation/components/SystemInstaller/SystemInstallerProvider.js","sources":["../../../../../src/presentation/installation/components/SystemInstaller/SystemInstallerProvider.tsx"],"sourcesContent":["import React from \"react\";\nimport { createProvider, Provider } from \"@webiny/app\";\nimport { SystemInstaller } from \"./SystemInstaller.js\";\n\nconst SystemInstallerHoc = createProvider(Original => {\n    return function SystemInstallerProvider({ children }) {\n        return (\n            <SystemInstaller>\n                <Original>{children}</Original>\n            </SystemInstaller>\n        );\n    };\n});\n\nexport const SystemInstallerProvider = () => {\n    return <Provider hoc={SystemInstallerHoc} />;\n};\n"],"names":["SystemInstallerHoc","createProvider","Original","children","SystemInstaller","SystemInstallerProvider","Provider"],"mappings":";;;AAIA,MAAMA,qBAAqBC,eAAeC,CAAAA,WAC/B,SAAiC,EAAEC,QAAQ,EAAE;QAChD,OAAO,WAAP,GACI,oBAACC,iBAAeA,MAAAA,WAAAA,GACZ,oBAACF,UAAAA,MAAUC;IAGvB;AAGG,MAAME,kDAA0B,IAC5B,WAAP,GAAO,oBAACC,UAAQA;QAAC,KAAKN"}

package/presentation/installation/components/SystemInstaller/index.d.ts

@@ -0,0 +1 @@
+export { SystemInstallerProvider } from "./SystemInstallerProvider.js";

package/presentation/installation/components/SystemInstaller/index.js

@@ -0,0 +1 @@
+export { SystemInstallerProvider } from "./SystemInstallerProvider.js";

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep/createPasswordValidator.d.ts

@@ -0,0 +1,8 @@
+export interface PasswordPolicy {
+    minimumLength?: number;
+    requireLowercase?: boolean;
+    requireNumbers?: boolean;
+    requireSymbols?: boolean;
+    requireUppercase?: boolean;
+}
+export declare const createPasswordValidator: (policy: PasswordPolicy) => (value?: string) => void;

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep/createPasswordValidator.js

@@ -0,0 +1,17 @@
+import { ValidationError } from "@webiny/validation";
+const createPasswordValidator = (policy)=>(value)=>{
+        if (!value) return;
+        value += "";
+        const requireSymbols = /([=+\-^$*.[\]{}()?"!@#%&/,><':;|_~`])+/;
+        const requireNumber = /[0-9]/;
+        const requireLowercase = /[a-z]/;
+        const requireUppercase = /[A-Z]/;
+        if (void 0 !== policy.minimumLength && value.length < policy.minimumLength) throw new ValidationError(`Value requires at least ${policy.minimumLength} characters.`);
+        if (policy.requireLowercase && !requireLowercase.test(value)) throw new ValidationError("Value must contain a lowercase character.");
+        if (policy.requireNumbers && !requireNumber.test(value)) throw new ValidationError("Value must contain a number.");
+        if (policy.requireUppercase && !requireUppercase.test(value)) throw new ValidationError("Value must contain an uppercase character.");
+        if (policy.requireSymbols && !requireSymbols.test(value)) throw new ValidationError("Value must contain a special character.");
+    };
+export { createPasswordValidator };
+
+//# sourceMappingURL=createPasswordValidator.js.map

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep/createPasswordValidator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/installation/components/SystemInstaller/steps/AdminUserStep/createPasswordValidator.js","sources":["../../../../../../../src/presentation/installation/components/SystemInstaller/steps/AdminUserStep/createPasswordValidator.ts"],"sourcesContent":["import { ValidationError } from \"@webiny/validation\";\n\nexport interface PasswordPolicy {\n    minimumLength?: number;\n    requireLowercase?: boolean;\n    requireNumbers?: boolean;\n    requireSymbols?: boolean;\n    requireUppercase?: boolean;\n}\n\nexport const createPasswordValidator =\n    (policy: PasswordPolicy) =>\n    (value?: string): void => {\n        if (!value) {\n            return;\n        }\n        /**\n         * TODO @ts-refactor\n         * @pavel expl\n         */\n        value = value + \"\";\n\n        const requireSymbols = /([=+\\-^$*.[\\]{}()?\"!@#%&/,><':;|_~`])+/;\n        const requireNumber = /[0-9]/;\n        const requireLowercase = /[a-z]/;\n        const requireUppercase = /[A-Z]/;\n\n        if (policy.minimumLength !== undefined && value.length < policy.minimumLength) {\n            throw new ValidationError(\n                `Value requires at least ${policy.minimumLength} characters.`\n            );\n        }\n\n        if (policy.requireLowercase && !requireLowercase.test(value)) {\n            throw new ValidationError(\"Value must contain a lowercase character.\");\n        }\n\n        if (policy.requireNumbers && !requireNumber.test(value)) {\n            throw new ValidationError(\"Value must contain a number.\");\n        }\n\n        if (policy.requireUppercase && !requireUppercase.test(value)) {\n            throw new ValidationError(\"Value must contain an uppercase character.\");\n        }\n\n        if (policy.requireSymbols && !requireSymbols.test(value)) {\n            throw new ValidationError(\"Value must contain a special character.\");\n        }\n    };\n"],"names":["createPasswordValidator","policy","value","requireSymbols","requireNumber","requireLowercase","requireUppercase","undefined","ValidationError"],"mappings":";AAUO,MAAMA,0BACT,CAACC,SACD,CAACC;QACG,IAAI,CAACA,OACD;QAMJA,SAAgB;QAEhB,MAAMC,iBAAiB;QACvB,MAAMC,gBAAgB;QACtB,MAAMC,mBAAmB;QACzB,MAAMC,mBAAmB;QAEzB,IAAIL,AAAyBM,WAAzBN,OAAO,aAAa,IAAkBC,MAAM,MAAM,GAAGD,OAAO,aAAa,EACzE,MAAM,IAAIO,gBACN,CAAC,wBAAwB,EAAEP,OAAO,aAAa,CAAC,YAAY,CAAC;QAIrE,IAAIA,OAAO,gBAAgB,IAAI,CAACI,iBAAiB,IAAI,CAACH,QAClD,MAAM,IAAIM,gBAAgB;QAG9B,IAAIP,OAAO,cAAc,IAAI,CAACG,cAAc,IAAI,CAACF,QAC7C,MAAM,IAAIM,gBAAgB;QAG9B,IAAIP,OAAO,gBAAgB,IAAI,CAACK,iBAAiB,IAAI,CAACJ,QAClD,MAAM,IAAIM,gBAAgB;QAG9B,IAAIP,OAAO,cAAc,IAAI,CAACE,eAAe,IAAI,CAACD,QAC9C,MAAM,IAAIM,gBAAgB;IAElC"}

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep/usePasswordValidator.d.ts

@@ -0,0 +1 @@
+export declare function usePasswordValidator(): (value?: string) => void;

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep/usePasswordValidator.js

@@ -0,0 +1,16 @@
+import { useMemo } from "react";
+import { config } from "@webiny/app/config.js";
+import { createPasswordValidator } from "./createPasswordValidator.js";
+function usePasswordValidator() {
+    let envPasswordValidatorPolicy;
+    try {
+        envPasswordValidatorPolicy = JSON.parse(process.env.REACT_APP_USER_POOL_PASSWORD_POLICY);
+    } catch  {}
+    const passwordValidatorPolicy = config.getKey("USER_POOL_PASSWORD_POLICY", envPasswordValidatorPolicy);
+    return useMemo(()=>createPasswordValidator(passwordValidatorPolicy), [
+        passwordValidatorPolicy
+    ]);
+}
+export { usePasswordValidator };
+
+//# sourceMappingURL=usePasswordValidator.js.map

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep/usePasswordValidator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/installation/components/SystemInstaller/steps/AdminUserStep/usePasswordValidator.js","sources":["../../../../../../../src/presentation/installation/components/SystemInstaller/steps/AdminUserStep/usePasswordValidator.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport { config as appConfig } from \"@webiny/app/config.js\";\nimport { createPasswordValidator, type PasswordPolicy } from \"./createPasswordValidator.js\";\n\nexport function usePasswordValidator() {\n    let envPasswordValidatorPolicy;\n    try {\n        envPasswordValidatorPolicy = JSON.parse(\n            process.env.REACT_APP_USER_POOL_PASSWORD_POLICY as string\n        );\n    } catch {\n        // Do nothing.\n    }\n\n    const passwordValidatorPolicy = appConfig.getKey<PasswordPolicy>(\n        \"USER_POOL_PASSWORD_POLICY\",\n        envPasswordValidatorPolicy\n    );\n\n    return useMemo(\n        () => createPasswordValidator(passwordValidatorPolicy),\n        [passwordValidatorPolicy]\n    );\n}\n"],"names":["usePasswordValidator","envPasswordValidatorPolicy","JSON","process","passwordValidatorPolicy","appConfig","useMemo","createPasswordValidator"],"mappings":";;;AAIO,SAASA;IACZ,IAAIC;IACJ,IAAI;QACAA,6BAA6BC,KAAK,KAAK,CACnCC,QAAQ,GAAG,CAAC,mCAAmC;IAEvD,EAAE,OAAM,CAER;IAEA,MAAMC,0BAA0BC,OAAAA,MAAgB,CAC5C,6BACAJ;IAGJ,OAAOK,QACH,IAAMC,wBAAwBH,0BAC9B;QAACA;KAAwB;AAEjC"}

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { ISystemInstallerPresenter } from "../../../../../presentation/installation/presenters/SystemInstaller/abstractions.js";
+interface StepProps {
+    nextStep: ISystemInstallerPresenter["nextStep"];
+}
+export declare const AdminUserStep: ({ nextStep }: StepProps) => React.JSX.Element;
+export {};

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep.js

@@ -0,0 +1,69 @@
+import react from "react";
+import { Button, Grid, Input } from "@webiny/admin-ui";
+import { Bind, Form, useForm } from "@webiny/form";
+import { validation } from "@webiny/validation";
+import { Center } from "./Center.js";
+import { Container } from "./Container.js";
+import { usePasswordValidator } from "./AdminUserStep/usePasswordValidator.js";
+const AdminUserStep = ({ nextStep })=>/*#__PURE__*/ react.createElement(Container, {
+        title: "Admin account",
+        message: "This is the account you’ll use to access and manage your Webiny instance."
+    }, /*#__PURE__*/ react.createElement(Center, null, /*#__PURE__*/ react.createElement("div", {
+        style: {
+            width: 400
+        }
+    }, /*#__PURE__*/ react.createElement(Form, {
+        onSubmit: (data)=>nextStep(data)
+    }, ()=>/*#__PURE__*/ react.createElement(AdminUserInputs, null)))));
+const AdminUserInputs = ()=>{
+    const form = useForm();
+    const passwordValidator = usePasswordValidator();
+    return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "Cognito.firstName",
+        validators: validation.create("required")
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "First name"
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 6
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "Cognito.lastName",
+        validators: validation.create("required")
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Last name"
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "Cognito.email",
+        beforeChange: (value, cb)=>cb(value.toLowerCase()),
+        validators: validation.create("required,email")
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Your email",
+        autoComplete: "new-password"
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "Cognito.password",
+        validators: [
+            passwordValidator,
+            validation.create("required")
+        ]
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Choose password",
+        type: "password",
+        autoComplete: "new-password"
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Button, {
+        containerClassName: "w-full",
+        className: "w-full",
+        variant: "primary",
+        size: "lg",
+        text: "Next step",
+        onClick: form.submit
+    })));
+};
+export { AdminUserStep };
+
+//# sourceMappingURL=AdminUserStep.js.map

package/presentation/installation/components/SystemInstaller/steps/AdminUserStep.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/installation/components/SystemInstaller/steps/AdminUserStep.js","sources":["../../../../../../src/presentation/installation/components/SystemInstaller/steps/AdminUserStep.tsx"],"sourcesContent":["import React from \"react\";\nimport { Button, Grid, Input } from \"@webiny/admin-ui\";\nimport { Bind, Form, useForm } from \"@webiny/form\";\nimport { validation } from \"@webiny/validation\";\nimport { Center } from \"./Center.js\";\nimport { Container } from \"./Container.js\";\nimport type { ISystemInstallerPresenter } from \"~/presentation/installation/presenters/SystemInstaller/abstractions.js\";\nimport { usePasswordValidator } from \"./AdminUserStep/usePasswordValidator.js\";\n\ninterface StepProps {\n    nextStep: ISystemInstallerPresenter[\"nextStep\"];\n}\n\nexport const AdminUserStep = ({ nextStep }: StepProps) => {\n    return (\n        <Container\n            title={\"Admin account\"}\n            message={\"This is the account you’ll use to access and manage your Webiny instance.\"}\n        >\n            <Center>\n                <div style={{ width: 400 }}>\n                    <Form onSubmit={data => nextStep(data)}>{() => <AdminUserInputs />}</Form>\n                </div>\n            </Center>\n        </Container>\n    );\n};\n\nconst AdminUserInputs = () => {\n    const form = useForm();\n    const passwordValidator = usePasswordValidator();\n\n    return (\n        <Grid>\n            <Grid.Column span={6}>\n                <Bind name={\"Cognito.firstName\"} validators={validation.create(\"required\")}>\n                    <Input label={\"First name\"} />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={6}>\n                <Bind name={\"Cognito.lastName\"} validators={validation.create(\"required\")}>\n                    <Input label={\"Last name\"} />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Bind\n                    name={\"Cognito.email\"}\n                    beforeChange={(value: string, cb) => cb(value.toLowerCase())}\n                    validators={validation.create(\"required,email\")}\n                >\n                    <Input label={\"Your email\"} autoComplete={\"new-password\"} />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Bind\n                    name={\"Cognito.password\"}\n                    validators={[passwordValidator, validation.create(\"required\")]}\n                >\n                    <Input\n                        label={\"Choose password\"}\n                        type={\"password\"}\n                        autoComplete={\"new-password\"}\n                    />\n                </Bind>\n            </Grid.Column>\n\n            <Grid.Column span={12}>\n                <Button\n                    containerClassName={\"w-full\"}\n                    className={\"w-full\"}\n                    variant={\"primary\"}\n                    size={\"lg\"}\n                    text={\"Next step\"}\n                    onClick={form.submit}\n                />\n            </Grid.Column>\n        </Grid>\n    );\n};\n"],"names":["AdminUserStep","nextStep","Container","Center","Form","data","AdminUserInputs","form","useForm","passwordValidator","usePasswordValidator","Grid","Bind","validation","Input","value","cb","Button"],"mappings":";;;;;;;AAaO,MAAMA,gBAAgB,CAAC,EAAEC,QAAQ,EAAa,GAC1C,WAAP,GACI,oBAACC,WAASA;QACN,OAAO;QACP,SAAS;qBAET,oBAACC,QAAMA,MAAAA,WAAAA,GACH,oBAAC;QAAI,OAAO;YAAE,OAAO;QAAI;qBACrB,oBAACC,MAAIA;QAAC,UAAUC,CAAAA,OAAQJ,SAASI;OAAQ,kBAAM,oBAACC,iBAAeA;AAOnF,MAAMA,kBAAkB;IACpB,MAAMC,OAAOC;IACb,MAAMC,oBAAoBC;IAE1B,OAAO,WAAP,GACI,oBAACC,MAAIA,MAAAA,WAAAA,GACD,oBAACA,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAM;QAAqB,YAAYC,WAAW,MAAM,CAAC;qBAC3D,oBAACC,OAAKA;QAAC,OAAO;wBAGtB,oBAACH,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAM;QAAoB,YAAYC,WAAW,MAAM,CAAC;qBAC1D,oBAACC,OAAKA;QAAC,OAAO;wBAGtB,oBAACH,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QACD,MAAM;QACN,cAAc,CAACG,OAAeC,KAAOA,GAAGD,MAAM,WAAW;QACzD,YAAYF,WAAW,MAAM,CAAC;qBAE9B,oBAACC,OAAKA;QAAC,OAAO;QAAc,cAAc;wBAGlD,oBAACH,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QACD,MAAM;QACN,YAAY;YAACH;YAAmBI,WAAW,MAAM,CAAC;SAAY;qBAE9D,oBAACC,OAAKA;QACF,OAAO;QACP,MAAM;QACN,cAAc;wBAK1B,oBAACH,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACM,QAAMA;QACH,oBAAoB;QACpB,WAAW;QACX,SAAS;QACT,MAAM;QACN,MAAM;QACN,SAASV,KAAK,MAAM;;AAKxC"}

package/presentation/installation/components/SystemInstaller/steps/BasicInfoStep.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { ISystemInstallerPresenter } from "../../../../../presentation/installation/presenters/SystemInstaller/abstractions.js";
+interface StepProps {
+    nextStep: ISystemInstallerPresenter["nextStep"];
+}
+export declare const BasicInfoStep: ({ nextStep }: StepProps) => React.JSX.Element;
+export {};

package/presentation/installation/components/SystemInstaller/steps/BasicInfoStep.js

@@ -0,0 +1,85 @@
+import react from "react";
+import { Button, Checkbox, Grid, Input, Select } from "@webiny/admin-ui";
+import { Bind, Form, useBind, useForm } from "@webiny/form";
+import { validation } from "@webiny/validation";
+import { Center } from "./Center.js";
+import { Container } from "./Container.js";
+import { referralSources } from "./referralSources.js";
+const ExternalLink = ({ to, children })=>/*#__PURE__*/ react.createElement("a", {
+        href: to,
+        target: "_blank",
+        rel: "noreferrer"
+    }, children);
+const BasicInfoStep = ({ nextStep })=>/*#__PURE__*/ react.createElement(Container, {
+        title: "Basic info",
+        message: "To get started, we need some basic information about your project and how you found us."
+    }, /*#__PURE__*/ react.createElement(Center, null, /*#__PURE__*/ react.createElement("div", {
+        style: {
+            width: 400
+        }
+    }, /*#__PURE__*/ react.createElement(Form, {
+        onSubmit: (data)=>nextStep(data)
+    }, ()=>/*#__PURE__*/ react.createElement(BasicInfoFormInputs, null)))));
+const referralOptions = referralSources.map((label)=>({
+        label,
+        value: label
+    }));
+const requireChecked = (value)=>{
+    if (!value) throw Error("You must accept our Terms of Service and Privacy Policy.");
+};
+const BasicInfoFormInputs = ()=>{
+    const form = useForm();
+    const tosBind = useBind({
+        name: "basicInfo.termsOfService",
+        defaultValue: false,
+        validators: requireChecked
+    });
+    return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "basicInfo.projectName",
+        validators: validation.create("required")
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Project name"
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "basicInfo.organizationName",
+        validators: validation.create("required")
+    }, /*#__PURE__*/ react.createElement(Input, {
+        label: "Organization name"
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Bind, {
+        name: "basicInfo.referralSource",
+        validators: validation.create("required")
+    }, /*#__PURE__*/ react.createElement(Select, {
+        label: "Where did you hear about Webiny?",
+        displayResetAction: false,
+        options: referralOptions
+    }))), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Checkbox, {
+        onChange: tosBind.onChange,
+        checked: tosBind.value,
+        label: /*#__PURE__*/ react.createElement(react.Fragment, null, "I agree to Webiny’s", " ", /*#__PURE__*/ react.createElement(ExternalLink, {
+            to: "https://www.webiny.com/terms-of-service"
+        }, "Terms of Service"), " ", "and", " ", /*#__PURE__*/ react.createElement(ExternalLink, {
+            to: "https://www.webiny.com/privacy-policy"
+        }, "Privacy Policy")),
+        validation: tosBind.validation
+    })), /*#__PURE__*/ react.createElement(Grid.Column, {
+        span: 12
+    }, /*#__PURE__*/ react.createElement(Button, {
+        disabled: true !== tosBind.value,
+        containerClassName: "w-full",
+        className: "w-full",
+        variant: "primary",
+        size: "lg",
+        text: "Next step",
+        onClick: form.submit
+    })));
+};
+export { BasicInfoStep };
+
+//# sourceMappingURL=BasicInfoStep.js.map

package/presentation/installation/components/SystemInstaller/steps/BasicInfoStep.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/installation/components/SystemInstaller/steps/BasicInfoStep.js","sources":["../../../../../../src/presentation/installation/components/SystemInstaller/steps/BasicInfoStep.tsx"],"sourcesContent":["import React from \"react\";\nimport { Button, Checkbox, Grid, Input, Select } from \"@webiny/admin-ui\";\nimport { Bind, Form, useBind, useForm } from \"@webiny/form\";\nimport { validation } from \"@webiny/validation\";\nimport { Center } from \"./Center.js\";\nimport { Container } from \"./Container.js\";\nimport type { ISystemInstallerPresenter } from \"~/presentation/installation/presenters/SystemInstaller/abstractions.js\";\nimport { referralSources } from \"~/presentation/installation/components/SystemInstaller/steps/referralSources.js\";\n\ninterface StepProps {\n    nextStep: ISystemInstallerPresenter[\"nextStep\"];\n}\n\ntype ExternalLinkProps = {\n    to: string;\n    children: React.ReactNode;\n};\n\nconst ExternalLink = ({ to, children }: ExternalLinkProps) => {\n    return (\n        <a href={to} target={\"_blank\"} rel=\"noreferrer\">\n            {children}\n        </a>\n    );\n};\n\nexport const BasicInfoStep = ({ nextStep }: StepProps) => {\n    return (\n        <Container\n            title={\"Basic info\"}\n            message={\n                \"To get started, we need some basic information about your project and how you found us.\"\n            }\n        >\n            <Center>\n                <div style={{ width: 400 }}>\n                    <Form onSubmit={data => nextStep(data)}>{() => <BasicInfoFormInputs />}</Form>\n                </div>\n            </Center>\n        </Container>\n    );\n};\n\nconst referralOptions = referralSources.map(label => ({ label, value: label }));\n\nconst requireChecked = (value: boolean) => {\n    if (!value) {\n        throw Error(`You must accept our Terms of Service and Privacy Policy.`);\n    }\n};\n\nconst BasicInfoFormInputs = () => {\n    const form = useForm();\n\n    const tosBind = useBind({\n        name: \"basicInfo.termsOfService\",\n        defaultValue: false,\n        validators: requireChecked\n    });\n\n    return (\n        <Grid>\n            <Grid.Column span={12}>\n                <Bind name={\"basicInfo.projectName\"} validators={validation.create(\"required\")}>\n                    <Input label={\"Project name\"} />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Bind\n                    name={\"basicInfo.organizationName\"}\n                    validators={validation.create(\"required\")}\n                >\n                    <Input label={\"Organization name\"} />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Bind name={\"basicInfo.referralSource\"} validators={validation.create(\"required\")}>\n                    <Select\n                        label={\"Where did you hear about Webiny?\"}\n                        displayResetAction={false}\n                        options={referralOptions}\n                    />\n                </Bind>\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Checkbox\n                    onChange={tosBind.onChange}\n                    checked={tosBind.value}\n                    label={\n                        <>\n                            I agree to Webiny’s{\" \"}\n                            <ExternalLink to={\"https://www.webiny.com/terms-of-service\"}>\n                                Terms of Service\n                            </ExternalLink>{\" \"}\n                            and{\" \"}\n                            <ExternalLink to={\"https://www.webiny.com/privacy-policy\"}>\n                                Privacy Policy\n                            </ExternalLink>\n                        </>\n                    }\n                    validation={tosBind.validation}\n                />\n            </Grid.Column>\n            <Grid.Column span={12}>\n                <Button\n                    disabled={tosBind.value !== true}\n                    containerClassName={\"w-full\"}\n                    className={\"w-full\"}\n                    variant={\"primary\"}\n                    size={\"lg\"}\n                    text={\"Next step\"}\n                    onClick={form.submit}\n                />\n            </Grid.Column>\n        </Grid>\n    );\n};\n"],"names":["ExternalLink","to","children","BasicInfoStep","nextStep","Container","Center","Form","data","BasicInfoFormInputs","referralOptions","referralSources","label","requireChecked","value","Error","form","useForm","tosBind","useBind","Grid","Bind","validation","Input","Select","Checkbox","Button"],"mappings":";;;;;;;AAkBA,MAAMA,eAAe,CAAC,EAAEC,EAAE,EAAEC,QAAQ,EAAqB,GAC9C,WAAP,GACI,oBAAC;QAAE,MAAMD;QAAI,QAAQ;QAAU,KAAI;OAC9BC;AAKN,MAAMC,gBAAgB,CAAC,EAAEC,QAAQ,EAAa,GAC1C,WAAP,GACI,oBAACC,WAASA;QACN,OAAO;QACP,SACI;qBAGJ,oBAACC,QAAMA,MAAAA,WAAAA,GACH,oBAAC;QAAI,OAAO;YAAE,OAAO;QAAI;qBACrB,oBAACC,MAAIA;QAAC,UAAUC,CAAAA,OAAQJ,SAASI;OAAQ,kBAAM,oBAACC,qBAAmBA;AAOvF,MAAMC,kBAAkBC,gBAAgB,GAAG,CAACC,CAAAA,QAAU;QAAEA;QAAO,OAAOA;IAAM;AAE5E,MAAMC,iBAAiB,CAACC;IACpB,IAAI,CAACA,OACD,MAAMC,MAAM;AAEpB;AAEA,MAAMN,sBAAsB;IACxB,MAAMO,OAAOC;IAEb,MAAMC,UAAUC,QAAQ;QACpB,MAAM;QACN,cAAc;QACd,YAAYN;IAChB;IAEA,OAAO,WAAP,GACI,oBAACO,MAAIA,MAAAA,WAAAA,GACD,oBAACA,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAM;QAAyB,YAAYC,WAAW,MAAM,CAAC;qBAC/D,oBAACC,OAAKA;QAAC,OAAO;wBAGtB,oBAACH,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QACD,MAAM;QACN,YAAYC,WAAW,MAAM,CAAC;qBAE9B,oBAACC,OAAKA;QAAC,OAAO;wBAGtB,oBAACH,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACC,MAAIA;QAAC,MAAM;QAA4B,YAAYC,WAAW,MAAM,CAAC;qBAClE,oBAACE,QAAMA;QACH,OAAO;QACP,oBAAoB;QACpB,SAASd;wBAIrB,oBAACU,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACK,UAAQA;QACL,UAAUP,QAAQ,QAAQ;QAC1B,SAASA,QAAQ,KAAK;QACtB,qBACI,0CAAE,uBACsB,mBACpB,oBAAClB,cAAYA;YAAC,IAAI;WAA2C,qBAE7C,KAAI,OAChB,mBACJ,oBAACA,cAAYA;YAAC,IAAI;WAAyC;QAKnE,YAAYkB,QAAQ,UAAU;uBAGtC,oBAACE,KAAK,MAAM;QAAC,MAAM;qBACf,oBAACM,QAAMA;QACH,UAAUR,AAAkB,SAAlBA,QAAQ,KAAK;QACvB,oBAAoB;QACpB,WAAW;QACX,SAAS;QACT,MAAM;QACN,MAAM;QACN,SAASF,KAAK,MAAM;;AAKxC"}