@soyfri/template 1.0.0

package/dist/partials/content/cards/Card3.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card3 = void 0;
+var react_1 = __importDefault(require("react"));
+var helpers_1 = require("../../../helpers");
+var Card3 = function (_a) {
+    var _b = _a.color, color = _b === void 0 ? '' : _b, _c = _a.avatar, avatar = _c === void 0 ? '' : _c, _d = _a.online, online = _d === void 0 ? false : _d, name = _a.name, job = _a.job, avgEarnings = _a.avgEarnings, totalEarnings = _a.totalEarnings;
+    return (react_1.default.createElement("div", { className: 'card' },
+        react_1.default.createElement("div", { className: 'card-body d-flex flex-center flex-column p-9' },
+            react_1.default.createElement("div", { className: 'mb-5' },
+                react_1.default.createElement("div", { className: 'symbol symbol-75px symbol-circle' },
+                    color ? (react_1.default.createElement("span", { className: "symbol-label bg-light-".concat(color, " text-").concat(color, " fs-5 fw-bolder") }, name.charAt(0))) : (react_1.default.createElement("img", { alt: 'Pic', src: (0, helpers_1.toAbsoluteUrl)(avatar) })),
+                    online && (react_1.default.createElement("div", { className: 'symbol-badge bg-success start-100 top-100 border-4 h-15px w-15px ms-n3 mt-n3' })))),
+            react_1.default.createElement("a", { href: '#', className: 'fs-4 text-gray-800 text-hover-primary fw-bolder mb-0' }, name),
+            react_1.default.createElement("div", { className: 'fw-bold text-gray-500 mb-6' }, job),
+            react_1.default.createElement("div", { className: 'd-flex flex-center flex-wrap mb-5' },
+                react_1.default.createElement("div", { className: 'border border-gray-300 border-dashed rounded min-w-125px py-3 px-4 mx-3 mb-3' },
+                    react_1.default.createElement("div", { className: 'fs-6 fw-bolder text-gray-700' }, avgEarnings),
+                    react_1.default.createElement("div", { className: 'fw-bold text-gray-500' }, "Avg. Earnings")),
+                react_1.default.createElement("div", { className: 'border border-gray-300 border-dashed rounded min-w-125px py-3 mx-3 px-4 mb-3' },
+                    react_1.default.createElement("div", { className: 'fs-6 fw-bolder text-gray-700' }, totalEarnings),
+                    react_1.default.createElement("div", { className: 'fw-bold text-gray-500' }, "Total Sales"))),
+            react_1.default.createElement("a", { href: '#', className: 'btn btn-sm btn-light' },
+                react_1.default.createElement(helpers_1.KTIcon, { iconName: 'plus', className: 'fs-3' }),
+                "Connect"))));
+};
+exports.Card3 = Card3;

package/dist/partials/content/cards/Card4.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+type Props = {
+    icon: string;
+    title: string;
+    description: string;
+};
+declare const Card4: FC<Props>;
+export { Card4 };

package/dist/partials/content/cards/Card4.js

@@ -0,0 +1,19 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card4 = void 0;
+var react_1 = __importDefault(require("react"));
+var helpers_1 = require("../../../helpers");
+var Card4 = function (_a) {
+    var icon = _a.icon, title = _a.title, description = _a.description;
+    return (react_1.default.createElement("div", { className: 'card h-100' },
+        react_1.default.createElement("div", { className: 'card-body d-flex justify-content-center text-center flex-column p-8' },
+            react_1.default.createElement("a", { href: '#', className: 'text-gray-800 text-hover-primary d-flex flex-column' },
+                react_1.default.createElement("div", { className: 'symbol symbol-75px mb-6' },
+                    react_1.default.createElement("img", { src: (0, helpers_1.toAbsoluteUrl)(icon), alt: '' })),
+                react_1.default.createElement("div", { className: 'fs-5 fw-bolder mb-2' }, title)),
+            react_1.default.createElement("div", { className: 'fs-7 fw-bold text-gray-500 mt-auto' }, description))));
+};
+exports.Card4 = Card4;

package/dist/partials/content/cards/Card5.d.ts

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+type Props = {
+    image: string;
+    title: string;
+    description: string;
+    status: 'up' | 'down';
+    statusValue: number;
+    statusDesc: string;
+    progress: number;
+    progressType: string;
+};
+declare const Card5: FC<Props>;
+export { Card5 };

package/dist/partials/content/cards/Card5.js

@@ -0,0 +1,38 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Card5 = void 0;
+var react_1 = __importDefault(require("react"));
+var helpers_1 = require("../../../helpers");
+var Dropdown1_1 = require("../dropdown/Dropdown1");
+var Card5 = function (_a) {
+    var image = _a.image, title = _a.title, description = _a.description, status = _a.status, statusValue = _a.statusValue, statusDesc = _a.statusDesc, progress = _a.progress, progressType = _a.progressType;
+    return (react_1.default.createElement("div", { className: 'card h-100' },
+        react_1.default.createElement("div", { className: 'card-header flex-nowrap border-0 pt-9' },
+            react_1.default.createElement("div", { className: 'card-title m-0' },
+                react_1.default.createElement("div", { className: 'symbol symbol-45px w-45px bg-light me-5' },
+                    react_1.default.createElement("img", { src: (0, helpers_1.toAbsoluteUrl)(image), alt: 'Metronic', className: 'p-3' })),
+                react_1.default.createElement("a", { href: '#', className: 'fs-4 fw-bold text-hover-primary text-gray-600 m-0' }, title)),
+            react_1.default.createElement("div", { className: 'card-toolbar m-0' },
+                react_1.default.createElement("button", { type: 'button', className: 'btn btn-clean btn-sm btn-icon btn-icon-primary btn-active-light-primary me-n3', "data-kt-menu-trigger": 'click', "data-kt-menu-placement": 'bottom-end', "data-kt-menu-flip": 'top-end' },
+                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'category', className: 'fs-3 text-primary' })),
+                react_1.default.createElement(Dropdown1_1.Dropdown1, null))),
+        react_1.default.createElement("div", { className: 'card-body d-flex flex-column px-9 pt-6 pb-8' },
+            react_1.default.createElement("div", { className: 'fs-2tx fw-bolder mb-3' }, description),
+            react_1.default.createElement("div", { className: 'd-flex align-items-center flex-wrap mb-5 mt-auto fs-6' },
+                status === 'up' && (react_1.default.createElement(helpers_1.KTIcon, { iconName: 'arrow-up-right', className: 'fs-3 me-1 text-success' })),
+                status === 'down' && (react_1.default.createElement(helpers_1.KTIcon, { iconName: 'arrow-down-right', className: 'fs-3 me-1 text-danger' })),
+                react_1.default.createElement("div", { className: "fw-bolder me-2 " + (status === 'up' ? 'text-success' : 'text-danger') },
+                    status === 'up' ? '+' : '-',
+                    statusValue,
+                    "%"),
+                react_1.default.createElement("div", { className: 'fw-bold text-gray-500' }, statusDesc)),
+            react_1.default.createElement("div", { className: 'd-flex align-items-center fw-bold' },
+                react_1.default.createElement("span", { className: 'badge bg-light text-gray-700 px-3 py-2 me-2' },
+                    progress,
+                    "%"),
+                react_1.default.createElement("span", { className: 'text-gray-500 fs-7' }, progressType)))));
+};
+exports.Card5 = Card5;

package/dist/partials/content/code-highlight/CodeBlock.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+type Props = {
+    code: string;
+    language: string;
+};
+declare const CodeBlock: FC<Props>;
+export { CodeBlock };

package/dist/partials/content/code-highlight/CodeBlock.js

@@ -0,0 +1,75 @@
+"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.CodeBlock = void 0;
+var react_1 = __importStar(require("react"));
+var react_copy_to_clipboard_1 = require("react-copy-to-clipboard");
+var prism_react_renderer_1 = require("prism-react-renderer");
+var react_bootstrap_1 = require("react-bootstrap");
+var CodeBlock = function (_a) {
+    var code = _a.code, language = _a.language;
+    var codeRef = (0, react_1.useRef)(null);
+    var _b = (0, react_1.useState)(false), copied = _b[0], setCopied = _b[1];
+    (0, react_1.useEffect)(function () {
+        if (!copied) {
+            return;
+        }
+        setTimeout(function () {
+            setCopied(false);
+        }, 1500);
+    }, [copied]);
+    (0, react_1.useEffect)(function () {
+        if (!codeRef.current) {
+            return;
+        }
+        var prismCodeElement = codeRef.current.querySelector('.prism-code ');
+        if (prismCodeElement) {
+            prismCodeElement.style.background = 'none';
+            prismCodeElement.style.fontSize = '13px';
+        }
+    }, []);
+    return (react_1.default.createElement("div", { className: 'py-5' },
+        react_1.default.createElement("div", { className: 'highlight' },
+            react_1.default.createElement(react_bootstrap_1.OverlayTrigger, { key: 'copy-to-clipboard', placement: 'top', overlay: react_1.default.createElement(react_bootstrap_1.Tooltip, { id: 'tooltip-copy-to-clipboard' }, "Copy Code") },
+                react_1.default.createElement(react_copy_to_clipboard_1.CopyToClipboard, { text: code, onCopy: function () { return setCopied(true); } },
+                    react_1.default.createElement("a", { className: 'highlight-copy btn' }, copied ? 'copied' : 'copy'))),
+            react_1.default.createElement("div", { className: 'highlight-code', ref: codeRef },
+                react_1.default.createElement(prism_react_renderer_1.Highlight, { code: code, language: language }, function (_a) {
+                    var className = _a.className, style = _a.style, tokens = _a.tokens, getLineProps = _a.getLineProps, getTokenProps = _a.getTokenProps;
+                    return (react_1.default.createElement("pre", { className: className, style: __assign({ maxHeight: '300px' }, style) }, tokens.map(function (line, i) { return (react_1.default.createElement("div", __assign({}, getLineProps({ line: line, key: i })), line.map(function (token, key) { return (react_1.default.createElement("span", __assign({}, getTokenProps({ token: token, key: key })))); }))); })));
+                })))));
+};
+exports.CodeBlock = CodeBlock;

package/dist/partials/content/dropdown/Dropdown1.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare function Dropdown1(): React.JSX.Element;

package/dist/partials/content/dropdown/Dropdown1.js

@@ -0,0 +1,41 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropdown1 = void 0;
+var react_1 = __importDefault(require("react"));
+function Dropdown1() {
+    return (react_1.default.createElement("div", { className: 'menu menu-sub menu-sub-dropdown w-250px w-md-300px', "data-kt-menu": 'true' },
+        react_1.default.createElement("div", { className: 'px-7 py-5' },
+            react_1.default.createElement("div", { className: 'fs-5 text-gray-900 fw-bolder' }, "Filter Options")),
+        react_1.default.createElement("div", { className: 'separator border-gray-200' }),
+        react_1.default.createElement("div", { className: 'px-7 py-5' },
+            react_1.default.createElement("div", { className: 'mb-10' },
+                react_1.default.createElement("label", { className: 'form-label fw-bold' }, "Status:"),
+                react_1.default.createElement("div", null,
+                    react_1.default.createElement("select", { className: 'form-select form-select-solid', "data-kt-select2": 'true', "data-placeholder": 'Select option', "data-allow-clear": 'true', defaultValue: '1' },
+                        react_1.default.createElement("option", null),
+                        react_1.default.createElement("option", { value: '1' }, "Approved"),
+                        react_1.default.createElement("option", { value: '2' }, "Pending"),
+                        react_1.default.createElement("option", { value: '3' }, "In Process"),
+                        react_1.default.createElement("option", { value: '4' }, "Rejected")))),
+            react_1.default.createElement("div", { className: 'mb-10' },
+                react_1.default.createElement("label", { className: 'form-label fw-bold' }, "Member Type:"),
+                react_1.default.createElement("div", { className: 'd-flex' },
+                    react_1.default.createElement("label", { className: 'form-check form-check-sm form-check-custom form-check-solid me-5' },
+                        react_1.default.createElement("input", { className: 'form-check-input', type: 'checkbox', value: '1' }),
+                        react_1.default.createElement("span", { className: 'form-check-label' }, "Author")),
+                    react_1.default.createElement("label", { className: 'form-check form-check-sm form-check-custom form-check-solid' },
+                        react_1.default.createElement("input", { className: 'form-check-input', type: 'checkbox', value: '2', defaultChecked: true }),
+                        react_1.default.createElement("span", { className: 'form-check-label' }, "Customer")))),
+            react_1.default.createElement("div", { className: 'mb-10' },
+                react_1.default.createElement("label", { className: 'form-label fw-bold' }, "Notifications:"),
+                react_1.default.createElement("div", { className: 'form-check form-switch form-switch-sm form-check-custom form-check-solid' },
+                    react_1.default.createElement("input", { className: 'form-check-input', type: 'checkbox', value: '', name: 'notifications', defaultChecked: true }),
+                    react_1.default.createElement("label", { className: 'form-check-label' }, "Enabled"))),
+            react_1.default.createElement("div", { className: 'd-flex justify-content-end' },
+                react_1.default.createElement("button", { type: 'reset', className: 'btn btn-sm btn-light btn-active-light-primary me-2', "data-kt-menu-dismiss": 'true' }, "Reset"),
+                react_1.default.createElement("button", { type: 'submit', className: 'btn btn-sm btn-primary', "data-kt-menu-dismiss": 'true' }, "Apply")))));
+}
+exports.Dropdown1 = Dropdown1;

package/dist/partials/content/dropdown/Dropdown2.d.ts

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

package/dist/partials/content/dropdown/Dropdown2.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropdown2 = void 0;
+var react_1 = __importDefault(require("react"));
+var Dropdown2 = function () {
+    return (react_1.default.createElement("div", { className: 'menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-bold w-200px', "data-kt-menu": 'true' },
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("div", { className: 'menu-content fs-6 text-gray-900 fw-bolder px-3 py-4' }, "Quick Actions")),
+        react_1.default.createElement("div", { className: 'separator mb-3 opacity-75' }),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "New Ticket")),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "New Customer")),
+        react_1.default.createElement("div", { className: 'menu-item px-3', "data-kt-menu-trigger": 'hover', "data-kt-menu-placement": 'right-start', "data-kt-menu-flip": 'left-start, top' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' },
+                react_1.default.createElement("span", { className: 'menu-title' }, "New Group"),
+                react_1.default.createElement("span", { className: 'menu-arrow' })),
+            react_1.default.createElement("div", { className: 'menu-sub menu-sub-dropdown w-175px py-4' },
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Admin Group")),
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Staff Group")),
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Member Group")))),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "New Contact")),
+        react_1.default.createElement("div", { className: 'separator mt-3 opacity-75' }),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("div", { className: 'menu-content px-3 py-3' },
+                react_1.default.createElement("a", { className: 'btn btn-primary  btn-sm px-4', href: '#' }, "Generate Reports")))));
+};
+exports.Dropdown2 = Dropdown2;

package/dist/partials/content/dropdown/Dropdown3.d.ts

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

package/dist/partials/content/dropdown/Dropdown3.js

@@ -0,0 +1,40 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropdown3 = void 0;
+var react_1 = __importDefault(require("react"));
+var Dropdown3 = function () {
+    return (react_1.default.createElement("div", { className: 'menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg-light-primary fw-bold w-200px py-3', "data-kt-menu": 'true' },
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("div", { className: 'menu-content text-muted pb-2 px-3 fs-7 text-uppercase' }, "Payments")),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Create Invoice")),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link flex-stack px-3' },
+                "Create Payment",
+                react_1.default.createElement("i", { className: 'fas fa-exclamation-circle ms-2 fs-7', "data-bs-toggle": 'tooltip', title: 'Specify a target name for future usage and reference' }))),
+        react_1.default.createElement("div", { className: 'menu-item px-3' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Generate Bill")),
+        react_1.default.createElement("div", { className: 'menu-item px-3', "data-kt-menu-trigger": 'hover', "data-kt-menu-placement": 'left-start', "data-kt-menu-flip": 'center, top' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' },
+                react_1.default.createElement("span", { className: 'menu-title' }, "Subscription"),
+                react_1.default.createElement("span", { className: 'menu-arrow' })),
+            react_1.default.createElement("div", { className: 'menu-sub menu-sub-dropdown w-175px py-4' },
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Plans")),
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Billing")),
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Statements")),
+                react_1.default.createElement("div", { className: 'separator my-2' }),
+                react_1.default.createElement("div", { className: 'menu-item px-3' },
+                    react_1.default.createElement("div", { className: 'menu-content px-3' },
+                        react_1.default.createElement("label", { className: 'form-check form-switch form-check-custom form-check-solid' },
+                            react_1.default.createElement("input", { className: 'form-check-input w-30px h-20px', type: 'checkbox', value: '1', checked: true, name: 'notifications' }),
+                            react_1.default.createElement("span", { className: 'form-check-label text-muted fs-6' }, "Recuring")))))),
+        react_1.default.createElement("div", { className: 'menu-item px-3 my-1' },
+            react_1.default.createElement("a", { href: '#', className: 'menu-link px-3' }, "Settings"))));
+};
+exports.Dropdown3 = Dropdown3;

package/dist/partials/content/editor/EditorToolbar.d.ts

@@ -0,0 +1,58 @@
+export declare const editorToolbarSettings: {
+    options: string[];
+    inline: {
+        inDropdown: boolean;
+        className: undefined;
+        component: undefined;
+        dropdownClassName: undefined;
+        options: string[];
+    };
+    fontSize: {
+        options: number[];
+        className: undefined;
+        component: undefined;
+        dropdownClassName: undefined;
+    };
+    fontFamily: {
+        options: string[];
+        className: undefined;
+        component: undefined;
+        dropdownClassName: undefined;
+    };
+    link: {
+        inDropdown: boolean;
+        className: undefined;
+        component: undefined;
+        popupClassName: undefined;
+        dropdownClassName: undefined;
+        showOpenOptionOnHover: boolean;
+        defaultTargetOption: string;
+        options: string[];
+        link: {
+            className: undefined;
+        };
+        unlink: {
+            className: undefined;
+        };
+        linkCallback: undefined;
+    };
+    image: {
+        className: undefined;
+        component: undefined;
+        popupClassName: undefined;
+        urlEnabled: boolean;
+        uploadEnabled: boolean;
+        alignmentEnabled: boolean;
+        uploadCallback: undefined;
+        previewImage: boolean;
+        inputAccept: string;
+        alt: {
+            present: boolean;
+            mandatory: boolean;
+        };
+        defaultSize: {
+            height: string;
+            width: string;
+        };
+    };
+};

package/dist/partials/content/editor/EditorToolbar.js

@@ -0,0 +1,54 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.editorToolbarSettings = void 0;
+exports.editorToolbarSettings = {
+    options: ['inline', 'fontSize', 'fontFamily', 'link', 'image'],
+    inline: {
+        inDropdown: false,
+        className: undefined,
+        component: undefined,
+        dropdownClassName: undefined,
+        options: ['bold', 'italic', 'underline', 'strikethrough'],
+    },
+    fontSize: {
+        options: [8, 9, 10, 11, 12, 14, 16, 18, 24, 30, 36, 48, 60, 72, 96],
+        className: undefined,
+        component: undefined,
+        dropdownClassName: undefined,
+    },
+    fontFamily: {
+        options: ['Arial', 'Georgia', 'Impact', 'Tahoma', 'Times New Roman', 'Verdana'],
+        className: undefined,
+        component: undefined,
+        dropdownClassName: undefined,
+    },
+    link: {
+        inDropdown: false,
+        className: undefined,
+        component: undefined,
+        popupClassName: undefined,
+        dropdownClassName: undefined,
+        showOpenOptionOnHover: true,
+        defaultTargetOption: '_self',
+        options: ['link', 'unlink'],
+        link: { className: undefined },
+        unlink: { className: undefined },
+        linkCallback: undefined,
+    },
+    image: {
+        className: undefined,
+        component: undefined,
+        popupClassName: undefined,
+        urlEnabled: true,
+        uploadEnabled: true,
+        alignmentEnabled: true,
+        uploadCallback: undefined,
+        previewImage: false,
+        inputAccept: 'image/gif,image/jpeg,image/jpg,image/png,image/svg',
+        alt: { present: false, mandatory: false },
+        defaultSize: {
+            height: 'auto',
+            width: 'auto',
+        },
+    },
+};

package/dist/partials/content/portal/Portal.d.ts

@@ -0,0 +1,12 @@
+import { FC } from 'react';
+import { WithChildren } from '../../../helpers';
+/**
+ * React portal based on https://stackoverflow.com/a/59154364
+ * @param children Child elements
+ * @param className CSS classname
+ * @param el HTML element to create.  default: div
+ */
+declare const Portal: FC<{
+    className?: string;
+} & WithChildren>;
+export { Portal };

package/dist/partials/content/portal/Portal.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Portal = void 0;
+var react_1 = require("react");
+var react_dom_1 = require("react-dom");
+/**
+ * React portal based on https://stackoverflow.com/a/59154364
+ * @param children Child elements
+ * @param className CSS classname
+ * @param el HTML element to create.  default: div
+ */
+var Portal = function (_a) {
+    var children = _a.children, _b = _a.className, className = _b === void 0 ? '' : _b;
+    var container = (0, react_1.useState)(document.createElement('div'))[0];
+    if (className)
+        container.classList.add(className);
+    (0, react_1.useEffect)(function () {
+        document.body.appendChild(container);
+        return function () {
+            document.body.removeChild(container);
+        };
+    }, [container]);
+    return (0, react_dom_1.createPortal)(children, container);
+};
+exports.Portal = Portal;

package/dist/partials/index.d.ts

@@ -0,0 +1,22 @@
+export * from './layout/quick-links/QuicLinks';
+export * from './layout/search/Search';
+export * from './layout/search/SearchInner';
+export * from './layout/SearchModal';
+export * from './layout/InboxCompose';
+export * from './layout/header-menus/HeaderUserMenu';
+export * from './layout/header-menus/HeaderNotificationsMenu';
+export * from './layout/drawer-messenger/DrawerMessenger';
+export * from './layout/activity-drawer/ActivityDrawer';
+export * from './layout/create-app/CreateApp';
+export * from './layout/theme-mode/ThemeModeProvider';
+export * from './layout/theme-mode/ThemeModeSwitcher';
+export * from './content/dropdown/Dropdown1';
+export * from './content/dropdown/Dropdown2';
+export * from './content/editor/EditorToolbar';
+export * from './content/code-highlight/CodeBlock';
+export * from './content/portal/Portal';
+export * from './modals/create-app-stepper/CreateAppModal';
+export * from './modals/select-location/SelectLocationModal';
+export * from './modals/invite-users/InviteUsers';
+export * from './modals/upgrade-plan/UpgradePlan';
+export * from './chat/ChatInner';

package/dist/partials/index.js

@@ -0,0 +1,42 @@
+"use strict";
+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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./layout/quick-links/QuicLinks"), exports);
+__exportStar(require("./layout/search/Search"), exports);
+__exportStar(require("./layout/search/SearchInner"), exports);
+__exportStar(require("./layout/SearchModal"), exports);
+__exportStar(require("./layout/InboxCompose"), exports);
+__exportStar(require("./layout/header-menus/HeaderUserMenu"), exports);
+__exportStar(require("./layout/header-menus/HeaderNotificationsMenu"), exports);
+__exportStar(require("./layout/drawer-messenger/DrawerMessenger"), exports);
+__exportStar(require("./layout/activity-drawer/ActivityDrawer"), exports);
+__exportStar(require("./layout/create-app/CreateApp"), exports);
+__exportStar(require("./layout/theme-mode/ThemeModeProvider"), exports);
+__exportStar(require("./layout/theme-mode/ThemeModeSwitcher"), exports);
+// dropdpwns
+__exportStar(require("./content/dropdown/Dropdown1"), exports);
+__exportStar(require("./content/dropdown/Dropdown2"), exports);
+// editors
+__exportStar(require("./content/editor/EditorToolbar"), exports);
+__exportStar(require("./content/code-highlight/CodeBlock"), exports);
+__exportStar(require("./content/portal/Portal"), exports);
+// modals
+__exportStar(require("./modals/create-app-stepper/CreateAppModal"), exports);
+__exportStar(require("./modals/select-location/SelectLocationModal"), exports);
+__exportStar(require("./modals/invite-users/InviteUsers"), exports);
+__exportStar(require("./modals/upgrade-plan/UpgradePlan"), exports);
+// chat
+__exportStar(require("./chat/ChatInner"), exports);

package/dist/partials/layout/InboxCompose.d.ts

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