@soyfri/template 1.0.0

package/dist/partials/layout/theme-mode/ThemeModeSwitcher.js

@@ -0,0 +1,42 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ThemeModeSwitcher = void 0;
+var clsx_1 = __importDefault(require("clsx"));
+var helpers_1 = require("../../../helpers");
+var layout_1 = require("../../../assets/ts/layout");
+var ThemeModeProvider_1 = require("./ThemeModeProvider");
+var react_1 = __importDefault(require("react"));
+var systemMode = layout_1.ThemeModeComponent.getSystemMode();
+var ThemeModeSwitcher = function (_a) {
+    var _b = _a.toggleBtnClass, toggleBtnClass = _b === void 0 ? '' : _b, _c = _a.toggleBtnIconClass, toggleBtnIconClass = _c === void 0 ? 'fs-1' : _c, _d = _a.menuPlacement, menuPlacement = _d === void 0 ? 'bottom-end' : _d, _e = _a.menuTrigger, menuTrigger = _e === void 0 ? "{default: 'click', lg: 'hover'}" : _e;
+    var _f = (0, ThemeModeProvider_1.useThemeMode)(), mode = _f.mode, menuMode = _f.menuMode, updateMode = _f.updateMode, updateMenuMode = _f.updateMenuMode;
+    var calculatedMode = mode === 'system' ? systemMode : mode;
+    var switchMode = function (_mode) {
+        updateMenuMode(_mode);
+        updateMode(_mode);
+    };
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("a", { href: '#', className: (0, clsx_1.default)('btn btn-icon ', toggleBtnClass), "data-kt-menu-trigger": menuTrigger, "data-kt-menu-attach": 'parent', "data-kt-menu-placement": menuPlacement },
+            calculatedMode === 'dark' && (react_1.default.createElement(helpers_1.KTIcon, { iconName: 'moon', className: (0, clsx_1.default)('theme-light-hide', toggleBtnIconClass) })),
+            calculatedMode === 'light' && (react_1.default.createElement(helpers_1.KTIcon, { iconName: 'night-day', className: (0, clsx_1.default)('theme-dark-hide', toggleBtnIconClass) }))),
+        react_1.default.createElement("div", { className: 'menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-title-gray-700 menu-icon-muted menu-active-bg menu-state-primary fw-semibold py-4 fs-base w-175px', "data-kt-menu": 'true' },
+            react_1.default.createElement("div", { className: 'menu-item px-3 my-0' },
+                react_1.default.createElement("a", { href: '#', className: (0, clsx_1.default)('menu-link px-3 py-2', { active: menuMode === 'light' }), onClick: function () { return switchMode('light'); } },
+                    react_1.default.createElement("span", { className: 'menu-icon', "data-kt-element": 'icon' },
+                        react_1.default.createElement(helpers_1.KTIcon, { iconName: 'night-day', className: 'fs-1' })),
+                    react_1.default.createElement("span", { className: 'menu-title' }, "Light"))),
+            react_1.default.createElement("div", { className: 'menu-item px-3 my-0' },
+                react_1.default.createElement("a", { href: '#', className: (0, clsx_1.default)('menu-link px-3 py-2', { active: menuMode === 'dark' }), onClick: function () { return switchMode('dark'); } },
+                    react_1.default.createElement("span", { className: 'menu-icon', "data-kt-element": 'icon' },
+                        react_1.default.createElement(helpers_1.KTIcon, { iconName: 'moon', className: 'fs-1' })),
+                    react_1.default.createElement("span", { className: 'menu-title' }, "Dark"))),
+            react_1.default.createElement("div", { className: 'menu-item px-3 my-0' },
+                react_1.default.createElement("a", { href: '#', className: (0, clsx_1.default)('menu-link px-3 py-2', { active: menuMode === 'system' }), onClick: function () { return switchMode('system'); } },
+                    react_1.default.createElement("span", { className: 'menu-icon', "data-kt-element": 'icon' },
+                        react_1.default.createElement(helpers_1.KTIcon, { iconName: 'screen', className: 'fs-1' })),
+                    react_1.default.createElement("span", { className: 'menu-title' }, "System"))))));
+};
+exports.ThemeModeSwitcher = ThemeModeSwitcher;

package/dist/partials/modals/create-app-stepper/CreateAppModal.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+type Props = {
+    show: boolean;
+    handleClose: () => void;
+};
+declare const CreateAppModal: ({ show, handleClose }: Props) => React.ReactPortal;
+export { CreateAppModal };

package/dist/partials/modals/create-app-stepper/CreateAppModal.js

@@ -0,0 +1,176 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CreateAppModal = void 0;
+var react_1 = __importStar(require("react"));
+var react_dom_1 = require("react-dom");
+var react_bootstrap_1 = require("react-bootstrap");
+var IAppModels_1 = require("./IAppModels");
+var components_1 = require("../../../assets/ts/components");
+var helpers_1 = require("../../../helpers");
+var Step1_1 = require("./steps/Step1");
+var Step2_1 = require("./steps/Step2");
+var Step3_1 = require("./steps/Step3");
+var Step4_1 = require("./steps/Step4");
+var Step5_1 = require("./steps/Step5");
+var modalsRoot = document.getElementById('root-modals') || document.body;
+var CreateAppModal = function (_a) {
+    var show = _a.show, handleClose = _a.handleClose;
+    var stepperRef = (0, react_1.useRef)(null);
+    var _b = (0, react_1.useState)(null), stepper = _b[0], setStepper = _b[1];
+    var _c = (0, react_1.useState)(IAppModels_1.defaultCreateAppData), data = _c[0], setData = _c[1];
+    var _d = (0, react_1.useState)(false), hasError = _d[0], setHasError = _d[1];
+    var loadStepper = function () {
+        setStepper(components_1.StepperComponent.createInsance(stepperRef.current));
+    };
+    var updateData = function (fieldsToUpdate) {
+        var updatedData = __assign(__assign({}, data), fieldsToUpdate);
+        setData(updatedData);
+    };
+    var checkAppBasic = function () {
+        if (!data.appBasic.appName || !data.appBasic.appType) {
+            return false;
+        }
+        return true;
+    };
+    var checkAppDataBase = function () {
+        if (!data.appDatabase.databaseName || !data.appDatabase.databaseSolution) {
+            return false;
+        }
+        return true;
+    };
+    var prevStep = function () {
+        if (!stepper) {
+            return;
+        }
+        stepper.goPrev();
+    };
+    var nextStep = function () {
+        setHasError(false);
+        if (!stepper) {
+            return;
+        }
+        if (stepper.getCurrentStepIndex() === 1) {
+            if (!checkAppBasic()) {
+                setHasError(true);
+                return;
+            }
+        }
+        if (stepper.getCurrentStepIndex() === 3) {
+            if (!checkAppDataBase()) {
+                setHasError(true);
+                return;
+            }
+        }
+        stepper.goNext();
+    };
+    var submit = function () {
+        window.location.reload();
+    };
+    return (0, react_dom_1.createPortal)(react_1.default.createElement(react_bootstrap_1.Modal, { id: 'kt_modal_create_app', tabIndex: -1, "aria-hidden": 'true', dialogClassName: 'modal-dialog modal-dialog-centered mw-900px', show: show, onHide: handleClose, onEntered: loadStepper, backdrop: true },
+        react_1.default.createElement("div", { className: 'modal-header' },
+            react_1.default.createElement("h2", null, "Create App"),
+            react_1.default.createElement("div", { className: 'btn btn-sm btn-icon btn-active-color-primary', onClick: handleClose },
+                react_1.default.createElement(helpers_1.KTIcon, { className: 'fs-1', iconName: 'cross' }))),
+        react_1.default.createElement("div", { className: 'modal-body py-lg-10 px-lg-10' },
+            react_1.default.createElement("div", { ref: stepperRef, className: 'stepper stepper-pills stepper-column d-flex flex-column flex-xl-row flex-row-fluid', id: 'kt_modal_create_app_stepper' },
+                react_1.default.createElement("div", { className: 'd-flex justify-content-center justify-content-xl-start flex-row-auto w-100 w-xl-300px' },
+                    react_1.default.createElement("div", { className: 'stepper-nav ps-lg-10' },
+                        react_1.default.createElement("div", { className: 'stepper-item current', "data-kt-stepper-element": 'nav' },
+                            react_1.default.createElement("div", { className: 'stepper-wrapper' },
+                                react_1.default.createElement("div", { className: 'stepper-icon w-40px h-40px' },
+                                    react_1.default.createElement("i", { className: 'stepper-check fas fa-check' }),
+                                    react_1.default.createElement("span", { className: 'stepper-number' }, "1")),
+                                react_1.default.createElement("div", { className: 'stepper-label' },
+                                    react_1.default.createElement("h3", { className: 'stepper-title' }, "Details"),
+                                    react_1.default.createElement("div", { className: 'stepper-desc' }, "Name your App"))),
+                            react_1.default.createElement("div", { className: 'stepper-line h-40px' })),
+                        react_1.default.createElement("div", { className: 'stepper-item', "data-kt-stepper-element": 'nav' },
+                            react_1.default.createElement("div", { className: 'stepper-wrapper' },
+                                react_1.default.createElement("div", { className: 'stepper-icon w-40px h-40px' },
+                                    react_1.default.createElement("i", { className: 'stepper-check fas fa-check' }),
+                                    react_1.default.createElement("span", { className: 'stepper-number' }, "2")),
+                                react_1.default.createElement("div", { className: 'stepper-label' },
+                                    react_1.default.createElement("h3", { className: 'stepper-title' }, "Frameworks"),
+                                    react_1.default.createElement("div", { className: 'stepper-desc' }, "Define your app framework"))),
+                            react_1.default.createElement("div", { className: 'stepper-line h-40px' })),
+                        react_1.default.createElement("div", { className: 'stepper-item', "data-kt-stepper-element": 'nav' },
+                            react_1.default.createElement("div", { className: 'stepper-wrapper' },
+                                react_1.default.createElement("div", { className: 'stepper-icon w-40px h-40px' },
+                                    react_1.default.createElement("i", { className: 'stepper-check fas fa-check' }),
+                                    react_1.default.createElement("span", { className: 'stepper-number' }, "3")),
+                                react_1.default.createElement("div", { className: 'stepper-label' },
+                                    react_1.default.createElement("h3", { className: 'stepper-title' }, "Database"),
+                                    react_1.default.createElement("div", { className: 'stepper-desc' }, "Select the app database type"))),
+                            react_1.default.createElement("div", { className: 'stepper-line h-40px' })),
+                        react_1.default.createElement("div", { className: 'stepper-item', "data-kt-stepper-element": 'nav' },
+                            react_1.default.createElement("div", { className: 'stepper-wrapper' },
+                                react_1.default.createElement("div", { className: 'stepper-icon w-40px h-40px' },
+                                    react_1.default.createElement("i", { className: 'stepper-check fas fa-check' }),
+                                    react_1.default.createElement("span", { className: 'stepper-number' }, "4")),
+                                react_1.default.createElement("div", { className: 'stepper-label' },
+                                    react_1.default.createElement("h3", { className: 'stepper-title' }, "Storage"),
+                                    react_1.default.createElement("div", { className: 'stepper-desc' }, "Provide storage details"))),
+                            react_1.default.createElement("div", { className: 'stepper-line h-40px' })),
+                        react_1.default.createElement("div", { className: 'stepper-item', "data-kt-stepper-element": 'nav' },
+                            react_1.default.createElement("div", { className: 'stepper-wrapper' },
+                                react_1.default.createElement("div", { className: 'stepper-icon w-40px h-40px' },
+                                    react_1.default.createElement("i", { className: 'stepper-check fas fa-check' }),
+                                    react_1.default.createElement("span", { className: 'stepper-number' }, "5")),
+                                react_1.default.createElement("div", { className: 'stepper-label' },
+                                    react_1.default.createElement("h3", { className: 'stepper-title' }, "Completed"),
+                                    react_1.default.createElement("div", { className: 'stepper-desc' }, "Review and Submit")))))),
+                react_1.default.createElement("div", { className: 'flex-row-fluid py-lg-5 px-lg-15' },
+                    react_1.default.createElement("form", { noValidate: true, id: 'kt_modal_create_app_form' },
+                        react_1.default.createElement(Step1_1.Step1, { data: data, updateData: updateData, hasError: hasError }),
+                        react_1.default.createElement(Step2_1.Step2, { data: data, updateData: updateData, hasError: hasError }),
+                        react_1.default.createElement(Step3_1.Step3, { data: data, updateData: updateData, hasError: hasError }),
+                        react_1.default.createElement(Step4_1.Step4, { data: data, updateData: updateData, hasError: hasError }),
+                        react_1.default.createElement(Step5_1.Step5, null),
+                        react_1.default.createElement("div", { className: 'd-flex flex-stack pt-10' },
+                            react_1.default.createElement("div", { className: 'me-2' },
+                                react_1.default.createElement("button", { type: 'button', className: 'btn btn-lg btn-light-primary me-3', "data-kt-stepper-action": 'previous', onClick: prevStep },
+                                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'arrow-left', className: 'fs-3 me-1' }),
+                                    " Previous")),
+                            react_1.default.createElement("div", null,
+                                react_1.default.createElement("button", { type: 'button', className: 'btn btn-lg btn-primary', "data-kt-stepper-action": 'submit', onClick: submit },
+                                    "Submit ",
+                                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'arrow-right', className: 'fs-3 ms-2 me-0' })),
+                                react_1.default.createElement("button", { type: 'button', className: 'btn btn-lg btn-primary', "data-kt-stepper-action": 'next', onClick: nextStep },
+                                    "Next Step ",
+                                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'arrow-right', className: 'fs-3 ms-1 me-0' }))))))))), modalsRoot);
+};
+exports.CreateAppModal = CreateAppModal;

package/dist/partials/modals/create-app-stepper/IAppModels.d.ts

@@ -0,0 +1,22 @@
+export interface IAppBasic {
+    appName: string;
+    appType: 'Quick Online Courses' | 'Face to Face Discussions' | 'Full Intro Training';
+}
+export type TAppFramework = 'HTML5' | 'ReactJS' | 'Angular' | 'Vue';
+export interface IAppDatabase {
+    databaseName: string;
+    databaseSolution: 'MySQL' | 'Firebase' | 'DynamoDB';
+}
+export type TAppStorage = 'Basic Server' | 'AWS' | 'Google';
+export interface ICreateAppData {
+    appBasic: IAppBasic;
+    appFramework: TAppFramework;
+    appDatabase: IAppDatabase;
+    appStorage: TAppStorage;
+}
+export declare const defaultCreateAppData: ICreateAppData;
+export type StepProps = {
+    data: ICreateAppData;
+    updateData: (fieldsToUpdate: Partial<ICreateAppData>) => void;
+    hasError: boolean;
+};

package/dist/partials/modals/create-app-stepper/IAppModels.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.defaultCreateAppData = void 0;
+exports.defaultCreateAppData = {
+    appBasic: { appName: '', appType: 'Quick Online Courses' },
+    appFramework: 'HTML5',
+    appDatabase: { databaseName: 'db_name', databaseSolution: 'MySQL' },
+    appStorage: 'Basic Server',
+};

package/dist/partials/modals/create-app-stepper/steps/Step1.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { StepProps } from '../IAppModels';
+declare const Step1: ({ data, updateData, hasError }: StepProps) => React.JSX.Element;
+export { Step1 };

package/dist/partials/modals/create-app-stepper/steps/Step1.js

@@ -0,0 +1,84 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Step1 = void 0;
+var react_1 = __importDefault(require("react"));
+var helpers_1 = require("../../../../helpers");
+var Step1 = function (_a) {
+    var data = _a.data, updateData = _a.updateData, hasError = _a.hasError;
+    return (react_1.default.createElement("div", { className: 'current', "data-kt-stepper-element": 'content' },
+        react_1.default.createElement("div", { className: 'w-100' },
+            react_1.default.createElement("div", { className: 'fv-row mb-10' },
+                react_1.default.createElement("label", { className: 'd-flex align-items-center fs-5 fw-semibold mb-2' },
+                    react_1.default.createElement("span", { className: 'required' }, "App Name"),
+                    react_1.default.createElement("i", { className: 'fas fa-exclamation-circle ms-2 fs-7', "data-bs-toggle": 'tooltip', title: 'Specify your unique app name' })),
+                react_1.default.createElement("input", { type: 'text', className: 'form-control form-control-lg form-control-solid', name: 'appname', placeholder: '', value: data.appBasic.appName, onChange: function (e) {
+                        return updateData({
+                            appBasic: {
+                                appName: e.target.value,
+                                appType: data.appBasic.appType,
+                            },
+                        });
+                    } }),
+                !data.appBasic.appName && hasError && (react_1.default.createElement("div", { className: 'fv-plugins-message-container' },
+                    react_1.default.createElement("div", { "data-field": 'appname', "data-validator": 'notEmpty', className: 'fv-help-block' }, "App name is required")))),
+            react_1.default.createElement("div", { className: 'fv-row' },
+                react_1.default.createElement("label", { className: 'd-flex align-items-center fs-5 fw-semibold mb-4' },
+                    react_1.default.createElement("span", { className: 'required' }, "Category"),
+                    react_1.default.createElement("i", { className: 'fas fa-exclamation-circle ms-2 fs-7', "data-bs-toggle": 'tooltip', title: 'Select your app category' })),
+                react_1.default.createElement("div", null,
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between mb-6 cursor-pointer' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-primary' },
+                                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'compass', className: 'fs-1 text-primary' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Quick Online Courses"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Creating a clear text structure is just one SEO"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appType', value: 'Quick Online Courses', checked: data.appBasic.appType === 'Quick Online Courses', onChange: function () {
+                                    return updateData({
+                                        appBasic: {
+                                            appName: data.appBasic.appName,
+                                            appType: 'Quick Online Courses',
+                                        },
+                                    });
+                                } }))),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between mb-6 cursor-pointer' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-danger' },
+                                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'category', className: 'fs-1 text-danger' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Face to Face Discussions"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Creating a clear text structure is just one aspect"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appType', value: 'Face to Face Discussions', checked: data.appBasic.appType === 'Face to Face Discussions', onChange: function () {
+                                    return updateData({
+                                        appBasic: {
+                                            appName: data.appBasic.appName,
+                                            appType: 'Face to Face Discussions',
+                                        },
+                                    });
+                                } }))),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between mb-6 cursor-pointer' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-success' },
+                                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'timer', className: 'fs-1 text-success' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Full Intro Training"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Creating a clear text structure copywriting"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appType', value: 'Full Intro Training', checked: data.appBasic.appType === 'Full Intro Training', onChange: function () {
+                                    return updateData({
+                                        appBasic: {
+                                            appName: data.appBasic.appName,
+                                            appType: 'Full Intro Training',
+                                        },
+                                    });
+                                } }))))))));
+};
+exports.Step1 = Step1;

package/dist/partials/modals/create-app-stepper/steps/Step2.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { StepProps } from '../IAppModels';
+declare const Step2: ({ data, updateData }: StepProps) => React.JSX.Element;
+export { Step2 };

package/dist/partials/modals/create-app-stepper/steps/Step2.js

@@ -0,0 +1,57 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Step2 = void 0;
+var react_1 = __importDefault(require("react"));
+var Step2 = function (_a) {
+    var data = _a.data, updateData = _a.updateData;
+    return (react_1.default.createElement("div", { className: 'pb-5', "data-kt-stepper-element": 'content' },
+        react_1.default.createElement("div", { className: 'w-100' },
+            react_1.default.createElement("div", { className: 'fv-row' },
+                react_1.default.createElement("label", { className: 'd-flex align-items-center fs-5 fw-semibold mb-4' },
+                    react_1.default.createElement("span", { className: 'required' }, "Select Framework"),
+                    react_1.default.createElement("i", { className: 'fas fa-exclamation-circle ms-2 fs-7', "data-bs-toggle": 'tooltip', title: 'Specify your apps framework' })),
+                react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                    react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                        react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                            react_1.default.createElement("span", { className: 'symbol-label bg-light-warning' },
+                                react_1.default.createElement("i", { className: 'fab fa-html5 text-warning fs-2x' }))),
+                        react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                            react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "HTML5"),
+                            react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Base Web Projec"))),
+                    react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                        react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appFramework', value: 'HTML5', checked: data.appFramework === 'HTML5', onChange: function () { return updateData({ appFramework: 'HTML5' }); } }))),
+                react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                    react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                        react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                            react_1.default.createElement("span", { className: 'symbol-label bg-light-success' },
+                                react_1.default.createElement("i", { className: 'fab fa-react text-success fs-2x' }))),
+                        react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                            react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "ReactJS"),
+                            react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Robust and flexible app framework"))),
+                    react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                        react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appFramework', value: 'ReactJS', checked: data.appFramework === 'ReactJS', onChange: function () { return updateData({ appFramework: 'ReactJS' }); } }))),
+                react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                    react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                        react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                            react_1.default.createElement("span", { className: 'symbol-label bg-light-danger' },
+                                react_1.default.createElement("i", { className: 'fab fa-angular text-danger fs-2x' }))),
+                        react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                            react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Angular"),
+                            react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Powerful data mangement"))),
+                    react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                        react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appFramework', value: 'Angular', checked: data.appFramework === 'Angular', onChange: function () { return updateData({ appFramework: 'Angular' }); } }))),
+                react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                    react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                        react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                            react_1.default.createElement("span", { className: 'symbol-label bg-light-primary' },
+                                react_1.default.createElement("i", { className: 'fab fa-vuejs text-primary fs-2x' }))),
+                        react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                            react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Vue"),
+                            react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Lightweight and responsive framework"))),
+                    react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                        react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appFramework', value: 'Vue', checked: data.appFramework === 'Vue', onChange: function () { return updateData({ appFramework: 'Vue' }); } })))))));
+};
+exports.Step2 = Step2;

package/dist/partials/modals/create-app-stepper/steps/Step3.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { StepProps } from '../IAppModels';
+declare const Step3: ({ data, updateData, hasError }: StepProps) => React.JSX.Element;
+export { Step3 };

package/dist/partials/modals/create-app-stepper/steps/Step3.js

@@ -0,0 +1,81 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Step3 = void 0;
+var react_1 = __importDefault(require("react"));
+var Step3 = function (_a) {
+    var data = _a.data, updateData = _a.updateData, hasError = _a.hasError;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: 'pb-5', "data-kt-stepper-element": 'content' },
+            react_1.default.createElement("div", { className: 'w-100' },
+                react_1.default.createElement("div", { className: 'fv-row mb-10' },
+                    react_1.default.createElement("label", { className: 'required fs-5 fw-semibold mb-2' }, "Database Name"),
+                    react_1.default.createElement("input", { type: 'text', className: 'form-control form-control-lg form-control-solid', name: 'dbname', value: data.appDatabase.databaseName, onChange: function (e) {
+                            return updateData({
+                                appDatabase: {
+                                    databaseName: e.target.value,
+                                    databaseSolution: data.appDatabase.databaseSolution,
+                                },
+                            });
+                        } }),
+                    !data.appDatabase.databaseName && hasError && (react_1.default.createElement("div", { className: 'fv-plugins-message-container' },
+                        react_1.default.createElement("div", { "data-field": 'appname', "data-validator": 'notEmpty', className: 'fv-help-block' }, "Database name is required")))),
+                react_1.default.createElement("div", { className: 'fv-row' },
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center fs-5 fw-semibold mb-4' },
+                        react_1.default.createElement("span", { className: 'required' }, "Select Database Engine"),
+                        react_1.default.createElement("i", { className: 'fas fa-exclamation-circle ms-2 fs-7', "data-bs-toggle": 'tooltip', title: 'Select your app database engine' })),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-success' },
+                                    react_1.default.createElement("i", { className: 'fas fa-database text-success fs-2x' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "MySQL"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Basic MySQL database"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'databaseSolution', value: 'MySQL', checked: data.appDatabase.databaseSolution === 'MySQL', onChange: function () {
+                                    return updateData({
+                                        appDatabase: {
+                                            databaseName: data.appDatabase.databaseName,
+                                            databaseSolution: 'MySQL',
+                                        },
+                                    });
+                                } }))),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-danger' },
+                                    react_1.default.createElement("i", { className: 'fab fa-google text-danger fs-2x' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Firebase"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Google based app data management"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'databaseSolution', value: 'Firebase', checked: data.appDatabase.databaseSolution === 'Firebase', onChange: function () {
+                                    return updateData({
+                                        appDatabase: {
+                                            databaseName: data.appDatabase.databaseName,
+                                            databaseSolution: 'Firebase',
+                                        },
+                                    });
+                                } }))),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-warning' },
+                                    react_1.default.createElement("i", { className: 'fab fa-amazon text-warning fs-2x' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "DynamoDB"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Amazon Fast NoSQL Database"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'databaseSolution', value: 'DynamoDB', checked: data.appDatabase.databaseSolution === 'DynamoDB', onChange: function () {
+                                    return updateData({
+                                        appDatabase: {
+                                            databaseName: data.appDatabase.databaseName,
+                                            databaseSolution: 'DynamoDB',
+                                        },
+                                    });
+                                } }))))))));
+};
+exports.Step3 = Step3;

package/dist/partials/modals/create-app-stepper/steps/Step4.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { StepProps } from '../IAppModels';
+declare const Step4: ({ data, updateData }: StepProps) => React.JSX.Element;
+export { Step4 };

package/dist/partials/modals/create-app-stepper/steps/Step4.js

@@ -0,0 +1,47 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Step4 = void 0;
+var react_1 = __importDefault(require("react"));
+var Step4 = function (_a) {
+    var data = _a.data, updateData = _a.updateData;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { className: 'pb-5', "data-kt-stepper-element": 'content' },
+            react_1.default.createElement("div", { className: 'w-100' },
+                react_1.default.createElement("div", { className: 'fv-row' },
+                    react_1.default.createElement("label", { className: 'fs-6 fw-bolder text-gray-900 mb-7d-flex align-items-center fs-5 fw-semibold mb-4' },
+                        react_1.default.createElement("span", { className: 'required' }, "Select Storage")),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-primary' },
+                                    react_1.default.createElement("i", { className: 'fab fa-linux text-primary fs-2x' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Basic Server"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Linux based server storage"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appStorage', value: 'Basic Server', checked: data.appStorage === 'Basic Server', onChange: function () { return updateData({ appStorage: 'Basic Server' }); } }))),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-warning' },
+                                    react_1.default.createElement("i", { className: 'fab fa-aws text-warning fs-2x' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "AWS"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Amazon Web Services"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appStorage', value: 'AWS', checked: data.appStorage === 'AWS', onChange: function () { return updateData({ appStorage: 'AWS' }); } }))),
+                    react_1.default.createElement("label", { className: 'd-flex align-items-center justify-content-between cursor-pointer mb-6' },
+                        react_1.default.createElement("span", { className: 'd-flex align-items-center me-2' },
+                            react_1.default.createElement("span", { className: 'symbol symbol-50px me-6' },
+                                react_1.default.createElement("span", { className: 'symbol-label bg-light-success  ' },
+                                    react_1.default.createElement("i", { className: 'fab fa-google text-success fs-2x' }))),
+                            react_1.default.createElement("span", { className: 'd-flex flex-column' },
+                                react_1.default.createElement("span", { className: 'fw-bolder fs-6' }, "Google"),
+                                react_1.default.createElement("span", { className: 'fs-7 text-muted' }, "Google Cloud Storage"))),
+                        react_1.default.createElement("span", { className: 'form-check form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input', type: 'radio', name: 'appStorage', value: 'Google', checked: data.appStorage === 'Google', onChange: function () { return updateData({ appStorage: 'Google' }); } }))))))));
+};
+exports.Step4 = Step4;

package/dist/partials/modals/create-app-stepper/steps/Step5.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const Step5: () => React.JSX.Element;
+export { Step5 };

package/dist/partials/modals/create-app-stepper/steps/Step5.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Step5 = void 0;
+var react_1 = __importDefault(require("react"));
+var helpers_1 = require("../../../../helpers");
+var Step5 = function () {
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("div", { "data-kt-stepper-element": 'content' },
+            react_1.default.createElement("div", { className: 'w-100 text-center' },
+                react_1.default.createElement("h1", { className: 'fw-bold text-gray-900 mb-3' }, "Release!"),
+                react_1.default.createElement("div", { className: 'text-muted fw-semibold fs-3' }, "Submit your app to kickstart your project."),
+                react_1.default.createElement("div", { className: 'text-center px-4 py-15' },
+                    react_1.default.createElement("img", { src: (0, helpers_1.useIllustrationsPath)('9.png'), alt: '', className: 'mw-100 mh-300px' }))))));
+};
+exports.Step5 = Step5;

package/dist/partials/modals/invite-users/InviteUsers.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+declare const InviteUsers: FC;
+export { InviteUsers };