@soyfri/template 1.0.1 → 1.0.4

package/dist/partials/widgets/charts/ChartsWidget4.js

@@ -1,79 +1,49 @@
-"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 __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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartsWidget4 = void 0;
-var react_1 = __importStar(require("react"));
-var apexcharts_1 = __importDefault(require("apexcharts"));
-var _utils_1 = require("../../../assets/ts/_utils");
-var ThemeModeProvider_1 = require("../../layout/theme-mode/ThemeModeProvider");
-var ChartsWidget4 = function (_a) {
-    var className = _a.className;
-    var chartRef = (0, react_1.useRef)(null);
-    var mode = (0, ThemeModeProvider_1.useThemeMode)().mode;
-    var refreshChart = function () {
+import React, { useEffect, useRef } from 'react';
+import ApexCharts from 'apexcharts';
+import { getCSS, getCSSVariableValue } from '../../../assets/ts/_utils';
+import { useThemeMode } from '../../layout/theme-mode/ThemeModeProvider';
+const ChartsWidget4 = ({ className }) => {
+    const chartRef = useRef(null);
+    const { mode } = useThemeMode();
+    const refreshChart = () => {
         if (!chartRef.current) {
             return;
         }
-        var height = parseInt((0, _utils_1.getCSS)(chartRef.current, 'height'));
-        var chart = new apexcharts_1.default(chartRef.current, getChartOptions(height));
+        const height = parseInt(getCSS(chartRef.current, 'height'));
+        const chart = new ApexCharts(chartRef.current, getChartOptions(height));
         if (chart) {
             chart.render();
         }
         return chart;
     };
-    (0, react_1.useEffect)(function () {
-        var chart = refreshChart();
-        return function () {
+    useEffect(() => {
+        const chart = refreshChart();
+        return () => {
             if (chart) {
                 chart.destroy();
             }
         };
     }, [chartRef, mode]);
-    return (react_1.default.createElement("div", { className: "card ".concat(className) },
-        react_1.default.createElement("div", { className: 'card-header border-0 pt-5' },
-            react_1.default.createElement("h3", { className: 'card-title align-items-start flex-column' },
-                react_1.default.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Customers"),
-                react_1.default.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new customers")),
-            react_1.default.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_4_year_btn' }, "Year"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_4_month_btn' }, "Month"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_4_week_btn' }, "Week"))),
-        react_1.default.createElement("div", { className: 'card-body' },
-            react_1.default.createElement("div", { ref: chartRef, id: 'kt_charts_widget_4_chart', style: { height: '350px' } }))));
+    return (React.createElement("div", { className: `card ${className}` },
+        React.createElement("div", { className: 'card-header border-0 pt-5' },
+            React.createElement("h3", { className: 'card-title align-items-start flex-column' },
+                React.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Customers"),
+                React.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new customers")),
+            React.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_4_year_btn' }, "Year"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_4_month_btn' }, "Month"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_4_week_btn' }, "Week"))),
+        React.createElement("div", { className: 'card-body' },
+            React.createElement("div", { ref: chartRef, id: 'kt_charts_widget_4_chart', style: { height: '350px' } }))));
 };
-exports.ChartsWidget4 = ChartsWidget4;
+export { ChartsWidget4 };
 function getChartOptions(height) {
-    var labelColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-500');
-    var borderColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-200');
-    var baseColor = (0, _utils_1.getCSSVariableValue)('--bs-success');
-    var baseLightColor = (0, _utils_1.getCSSVariableValue)('--bs-success-light');
-    var secondaryColor = (0, _utils_1.getCSSVariableValue)('--bs-warning');
-    var secondaryLightColor = (0, _utils_1.getCSSVariableValue)('--bs-warning-light');
+    const labelColor = getCSSVariableValue('--bs-gray-500');
+    const borderColor = getCSSVariableValue('--bs-gray-200');
+    const baseColor = getCSSVariableValue('--bs-success');
+    const baseLightColor = getCSSVariableValue('--bs-success-light');
+    const secondaryColor = getCSSVariableValue('--bs-warning');
+    const secondaryLightColor = getCSSVariableValue('--bs-warning-light');
     return {
         series: [
             {

package/dist/partials/widgets/charts/ChartsWidget5.js

@@ -1,77 +1,47 @@
-"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 __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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartsWidget5 = void 0;
-var react_1 = __importStar(require("react"));
-var apexcharts_1 = __importDefault(require("apexcharts"));
-var _utils_1 = require("../../../assets/ts/_utils");
-var ThemeModeProvider_1 = require("../../layout/theme-mode/ThemeModeProvider");
-var ChartsWidget5 = function (_a) {
-    var className = _a.className;
-    var chartRef = (0, react_1.useRef)(null);
-    var mode = (0, ThemeModeProvider_1.useThemeMode)().mode;
-    var refreshChart = function () {
+import React, { useEffect, useRef } from 'react';
+import ApexCharts from 'apexcharts';
+import { getCSS, getCSSVariableValue } from '../../../assets/ts/_utils';
+import { useThemeMode } from '../../layout/theme-mode/ThemeModeProvider';
+const ChartsWidget5 = ({ className }) => {
+    const chartRef = useRef(null);
+    const { mode } = useThemeMode();
+    const refreshChart = () => {
         if (!chartRef.current) {
             return;
         }
-        var height = parseInt((0, _utils_1.getCSS)(chartRef.current, 'height'));
-        var chart = new apexcharts_1.default(chartRef.current, getChartOptions(height));
+        const height = parseInt(getCSS(chartRef.current, 'height'));
+        const chart = new ApexCharts(chartRef.current, getChartOptions(height));
         if (chart) {
             chart.render();
         }
         return chart;
     };
-    (0, react_1.useEffect)(function () {
-        var chart = refreshChart();
-        return function () {
+    useEffect(() => {
+        const chart = refreshChart();
+        return () => {
             if (chart) {
                 chart.destroy();
             }
         };
     }, [chartRef, mode]);
-    return (react_1.default.createElement("div", { className: "card ".concat(className) },
-        react_1.default.createElement("div", { className: 'card-header border-0 pt-5' },
-            react_1.default.createElement("h3", { className: 'card-title align-items-start flex-column' },
-                react_1.default.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Customers"),
-                react_1.default.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new customers")),
-            react_1.default.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_5_year_btn' }, "Year"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_5_month_btn' }, "Month"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_5_week_btn' }, "Week"))),
-        react_1.default.createElement("div", { className: 'card-body' },
-            react_1.default.createElement("div", { ref: chartRef, id: 'kt_charts_widget_5_chart', style: { height: '350px' } }))));
+    return (React.createElement("div", { className: `card ${className}` },
+        React.createElement("div", { className: 'card-header border-0 pt-5' },
+            React.createElement("h3", { className: 'card-title align-items-start flex-column' },
+                React.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Customers"),
+                React.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new customers")),
+            React.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_5_year_btn' }, "Year"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_5_month_btn' }, "Month"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_5_week_btn' }, "Week"))),
+        React.createElement("div", { className: 'card-body' },
+            React.createElement("div", { ref: chartRef, id: 'kt_charts_widget_5_chart', style: { height: '350px' } }))));
 };
-exports.ChartsWidget5 = ChartsWidget5;
+export { ChartsWidget5 };
 function getChartOptions(height) {
-    var labelColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-500');
-    var borderColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-200');
-    var baseColor = (0, _utils_1.getCSSVariableValue)('--bs-primary');
-    var secondaryColor = (0, _utils_1.getCSSVariableValue)('--bs-info');
+    const labelColor = getCSSVariableValue('--bs-gray-500');
+    const borderColor = getCSSVariableValue('--bs-gray-200');
+    const baseColor = getCSSVariableValue('--bs-primary');
+    const secondaryColor = getCSSVariableValue('--bs-info');
     return {
         series: [
             {

package/dist/partials/widgets/charts/ChartsWidget6.js

@@ -1,77 +1,47 @@
-"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 __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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartsWidget6 = void 0;
-var react_1 = __importStar(require("react"));
-var apexcharts_1 = __importDefault(require("apexcharts"));
-var _utils_1 = require("../../../assets/ts/_utils");
-var ThemeModeProvider_1 = require("../../layout/theme-mode/ThemeModeProvider");
-var ChartsWidget6 = function (_a) {
-    var className = _a.className;
-    var chartRef = (0, react_1.useRef)(null);
-    var mode = (0, ThemeModeProvider_1.useThemeMode)().mode;
-    var refreshChart = function () {
+import React, { useEffect, useRef } from 'react';
+import ApexCharts from 'apexcharts';
+import { getCSS, getCSSVariableValue } from '../../../assets/ts/_utils';
+import { useThemeMode } from '../../layout/theme-mode/ThemeModeProvider';
+const ChartsWidget6 = ({ className }) => {
+    const chartRef = useRef(null);
+    const { mode } = useThemeMode();
+    const refreshChart = () => {
         if (!chartRef.current) {
             return;
         }
-        var height = parseInt((0, _utils_1.getCSS)(chartRef.current, 'height'));
-        var chart = new apexcharts_1.default(chartRef.current, getChartOptions(height));
+        const height = parseInt(getCSS(chartRef.current, 'height'));
+        const chart = new ApexCharts(chartRef.current, getChartOptions(height));
         if (chart) {
             chart.render();
         }
         return chart;
     };
-    (0, react_1.useEffect)(function () {
-        var chart = refreshChart();
-        return function () {
+    useEffect(() => {
+        const chart = refreshChart();
+        return () => {
             if (chart) {
                 chart.destroy();
             }
         };
     }, [chartRef, mode]);
-    return (react_1.default.createElement("div", { className: "card ".concat(className) },
-        react_1.default.createElement("div", { className: 'card-header border-0 pt-5' },
-            react_1.default.createElement("h3", { className: 'card-title align-items-start flex-column' },
-                react_1.default.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Orders"),
-                react_1.default.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500+ new orders")),
-            react_1.default.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_6_sales_btn' }, "Sales"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_6_expenses_btn' }, "Expenses"))),
-        react_1.default.createElement("div", { className: 'card-body' },
-            react_1.default.createElement("div", { ref: chartRef, id: 'kt_charts_widget_6_chart', style: { height: '350px' } }))));
+    return (React.createElement("div", { className: `card ${className}` },
+        React.createElement("div", { className: 'card-header border-0 pt-5' },
+            React.createElement("h3", { className: 'card-title align-items-start flex-column' },
+                React.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Orders"),
+                React.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500+ new orders")),
+            React.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_6_sales_btn' }, "Sales"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_6_expenses_btn' }, "Expenses"))),
+        React.createElement("div", { className: 'card-body' },
+            React.createElement("div", { ref: chartRef, id: 'kt_charts_widget_6_chart', style: { height: '350px' } }))));
 };
-exports.ChartsWidget6 = ChartsWidget6;
+export { ChartsWidget6 };
 function getChartOptions(height) {
-    var labelColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-500');
-    var borderColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-200');
-    var baseColor = (0, _utils_1.getCSSVariableValue)('--bs-primary');
-    var baseLightColor = (0, _utils_1.getCSSVariableValue)('--bs-primary-light');
-    var secondaryColor = (0, _utils_1.getCSSVariableValue)('--bs-info');
+    const labelColor = getCSSVariableValue('--bs-gray-500');
+    const borderColor = getCSSVariableValue('--bs-gray-200');
+    const baseColor = getCSSVariableValue('--bs-primary');
+    const baseLightColor = getCSSVariableValue('--bs-primary-light');
+    const secondaryColor = getCSSVariableValue('--bs-info');
     return {
         series: [
             {

package/dist/partials/widgets/charts/ChartsWidget7.js

@@ -1,82 +1,52 @@
-"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 __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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartsWidget7 = void 0;
-var react_1 = __importStar(require("react"));
-var apexcharts_1 = __importDefault(require("apexcharts"));
-var _utils_1 = require("../../../assets/ts/_utils");
-var ThemeModeProvider_1 = require("../../layout/theme-mode/ThemeModeProvider");
-var ChartsWidget7 = function (_a) {
-    var className = _a.className;
-    var chartRef = (0, react_1.useRef)(null);
-    var mode = (0, ThemeModeProvider_1.useThemeMode)().mode;
-    var refreshChart = function () {
+import React, { useEffect, useRef } from 'react';
+import ApexCharts from 'apexcharts';
+import { getCSS, getCSSVariableValue } from '../../../assets/ts/_utils';
+import { useThemeMode } from '../../layout/theme-mode/ThemeModeProvider';
+const ChartsWidget7 = ({ className }) => {
+    const chartRef = useRef(null);
+    const { mode } = useThemeMode();
+    const refreshChart = () => {
         if (!chartRef.current) {
             return;
         }
-        var height = parseInt((0, _utils_1.getCSS)(chartRef.current, 'height'));
-        var chart = new apexcharts_1.default(chartRef.current, getChartOptions(height));
+        const height = parseInt(getCSS(chartRef.current, 'height'));
+        const chart = new ApexCharts(chartRef.current, getChartOptions(height));
         if (chart) {
             chart.render();
         }
         return chart;
     };
-    (0, react_1.useEffect)(function () {
-        var chart = refreshChart();
-        return function () {
+    useEffect(() => {
+        const chart = refreshChart();
+        return () => {
             if (chart) {
                 chart.destroy();
             }
         };
     }, [chartRef, mode]);
-    return (react_1.default.createElement("div", { className: "card ".concat(className) },
-        react_1.default.createElement("div", { className: 'card-header border-0 pt-5' },
-            react_1.default.createElement("h3", { className: 'card-title align-items-start flex-column' },
-                react_1.default.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Users"),
-                react_1.default.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new users")),
-            react_1.default.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_7_year_btn' }, "Year"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_7_month_btn' }, "Month"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_7_week_btn' }, "Week"))),
-        react_1.default.createElement("div", { className: 'card-body' },
-            react_1.default.createElement("div", { ref: chartRef, id: 'kt_charts_widget_7_chart', style: { height: '350px' }, className: 'card-rounded-bottom' }))));
+    return (React.createElement("div", { className: `card ${className}` },
+        React.createElement("div", { className: 'card-header border-0 pt-5' },
+            React.createElement("h3", { className: 'card-title align-items-start flex-column' },
+                React.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Users"),
+                React.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new users")),
+            React.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_7_year_btn' }, "Year"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_7_month_btn' }, "Month"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_7_week_btn' }, "Week"))),
+        React.createElement("div", { className: 'card-body' },
+            React.createElement("div", { ref: chartRef, id: 'kt_charts_widget_7_chart', style: { height: '350px' }, className: 'card-rounded-bottom' }))));
 };
-exports.ChartsWidget7 = ChartsWidget7;
+export { ChartsWidget7 };
 function getChartOptions(height) {
-    var labelColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-500');
-    var borderColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-200');
-    var strokeColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-300');
-    var color1 = (0, _utils_1.getCSSVariableValue)('--bs-warning');
-    var color1Light = (0, _utils_1.getCSSVariableValue)('--bs-warning-light');
-    var color2 = (0, _utils_1.getCSSVariableValue)('--bs-success');
-    var color2Light = (0, _utils_1.getCSSVariableValue)('--bs-success-light');
-    var color3 = (0, _utils_1.getCSSVariableValue)('--bs-primary');
-    var color3Light = (0, _utils_1.getCSSVariableValue)('--bs-primary-light');
+    const labelColor = getCSSVariableValue('--bs-gray-500');
+    const borderColor = getCSSVariableValue('--bs-gray-200');
+    const strokeColor = getCSSVariableValue('--bs-gray-300');
+    const color1 = getCSSVariableValue('--bs-warning');
+    const color1Light = getCSSVariableValue('--bs-warning-light');
+    const color2 = getCSSVariableValue('--bs-success');
+    const color2Light = getCSSVariableValue('--bs-success-light');
+    const color3 = getCSSVariableValue('--bs-primary');
+    const color3Light = getCSSVariableValue('--bs-primary-light');
     return {
         series: [
             {

package/dist/partials/widgets/charts/ChartsWidget8.js

@@ -1,82 +1,52 @@
-"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 __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;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ChartsWidget8 = void 0;
-var react_1 = __importStar(require("react"));
-var apexcharts_1 = __importDefault(require("apexcharts"));
-var _utils_1 = require("../../../assets/ts/_utils");
-var ThemeModeProvider_1 = require("../../layout/theme-mode/ThemeModeProvider");
-var ChartsWidget8 = function (_a) {
-    var className = _a.className;
-    var chartRef = (0, react_1.useRef)(null);
-    var mode = (0, ThemeModeProvider_1.useThemeMode)().mode;
-    var refreshChart = function () {
+import React, { useEffect, useRef } from 'react';
+import ApexCharts from 'apexcharts';
+import { getCSS, getCSSVariableValue } from '../../../assets/ts/_utils';
+import { useThemeMode } from '../../layout/theme-mode/ThemeModeProvider';
+const ChartsWidget8 = ({ className }) => {
+    const chartRef = useRef(null);
+    const { mode } = useThemeMode();
+    const refreshChart = () => {
         if (!chartRef.current) {
             return;
         }
-        var height = parseInt((0, _utils_1.getCSS)(chartRef.current, 'height'));
-        var chart = new apexcharts_1.default(chartRef.current, getChartOptions(height));
+        const height = parseInt(getCSS(chartRef.current, 'height'));
+        const chart = new ApexCharts(chartRef.current, getChartOptions(height));
         if (chart) {
             chart.render();
         }
         return chart;
     };
-    (0, react_1.useEffect)(function () {
-        var chart = refreshChart();
-        return function () {
+    useEffect(() => {
+        const chart = refreshChart();
+        return () => {
             if (chart) {
                 chart.destroy();
             }
         };
     }, [chartRef, mode]);
-    return (react_1.default.createElement("div", { className: "card ".concat(className) },
-        react_1.default.createElement("div", { className: 'card-header border-0 pt-5' },
-            react_1.default.createElement("h3", { className: 'card-title align-items-start flex-column' },
-                react_1.default.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Orders"),
-                react_1.default.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new orders")),
-            react_1.default.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_8_year_btn' }, "Year"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_8_month_btn' }, "Month"),
-                react_1.default.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_8_week_btn' }, "Week"))),
-        react_1.default.createElement("div", { className: 'card-body' },
-            react_1.default.createElement("div", { ref: chartRef, id: 'kt_charts_widget_8_chart', style: { height: '350px' }, className: 'card-rounded-bottom' }))));
+    return (React.createElement("div", { className: `card ${className}` },
+        React.createElement("div", { className: 'card-header border-0 pt-5' },
+            React.createElement("h3", { className: 'card-title align-items-start flex-column' },
+                React.createElement("span", { className: 'card-label fw-bold fs-3 mb-1' }, "Recent Orders"),
+                React.createElement("span", { className: 'text-muted fw-semibold fs-7' }, "More than 500 new orders")),
+            React.createElement("div", { className: 'card-toolbar', "data-kt-buttons": 'true' },
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary active px-4 me-1', id: 'kt_charts_widget_8_year_btn' }, "Year"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4 me-1', id: 'kt_charts_widget_8_month_btn' }, "Month"),
+                React.createElement("a", { className: 'btn btn-sm btn-color-muted btn-active btn-active-primary px-4', id: 'kt_charts_widget_8_week_btn' }, "Week"))),
+        React.createElement("div", { className: 'card-body' },
+            React.createElement("div", { ref: chartRef, id: 'kt_charts_widget_8_chart', style: { height: '350px' }, className: 'card-rounded-bottom' }))));
 };
-exports.ChartsWidget8 = ChartsWidget8;
+export { ChartsWidget8 };
 function getChartOptions(height) {
-    var labelColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-500');
-    var borderColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-200');
-    var strokeColor = (0, _utils_1.getCSSVariableValue)('--bs-gray-300');
-    var color1 = (0, _utils_1.getCSSVariableValue)('--bs-warning');
-    var color1Light = (0, _utils_1.getCSSVariableValue)('--bs-warning-light');
-    var color2 = (0, _utils_1.getCSSVariableValue)('--bs-success');
-    var color2Light = (0, _utils_1.getCSSVariableValue)('--bs-success-light');
-    var color3 = (0, _utils_1.getCSSVariableValue)('--bs-primary');
-    var color3Light = (0, _utils_1.getCSSVariableValue)('--bs-primary-light');
+    const labelColor = getCSSVariableValue('--bs-gray-500');
+    const borderColor = getCSSVariableValue('--bs-gray-200');
+    const strokeColor = getCSSVariableValue('--bs-gray-300');
+    const color1 = getCSSVariableValue('--bs-warning');
+    const color1Light = getCSSVariableValue('--bs-warning-light');
+    const color2 = getCSSVariableValue('--bs-success');
+    const color2Light = getCSSVariableValue('--bs-success-light');
+    const color3 = getCSSVariableValue('--bs-primary');
+    const color3Light = getCSSVariableValue('--bs-primary-light');
     return {
         series: [
             {

package/dist/partials/widgets/engage/EngageWidget1.js

@@ -1,25 +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.EngageWidget1 = void 0;
-var react_1 = __importDefault(require("react"));
-var helpers_1 = require("../../../helpers");
-var EngageWidget1 = function (_a) {
-    var className = _a.className, _b = _a.bgHex, bgHex = _b === void 0 ? '' : _b, _c = _a.bgColor, bgColor = _c === void 0 ? '' : _c, _d = _a.lg, lg = _d === void 0 ? '' : _d, _e = _a.bgImage, bgImage = _e === void 0 ? '' : _e;
-    var bgImagePath = bgImage ? (0, helpers_1.toAbsoluteUrl)("media/".concat(bgImage)) : '';
+import React from 'react';
+import { KTIcon, toAbsoluteUrl } from '../../../helpers';
+const EngageWidget1 = ({ className, bgHex = '', bgColor = '', lg = '', bgImage = '', }) => {
+    let bgImagePath = bgImage ? toAbsoluteUrl(`media/${bgImage}`) : '';
     if (bgImagePath) {
-        bgImagePath = "url(\"".concat(bgImagePath, "\")");
+        bgImagePath = `url("${bgImagePath}")`;
     }
-    return (react_1.default.createElement("div", { className: "card ".concat(className) },
-        react_1.default.createElement("div", { className: "card-body card-rounded p-0 d-flex bg-".concat(bgColor), style: { backgroundColor: bgHex } },
-            react_1.default.createElement("div", { className: "d-flex flex-column flex-lg-row-auto ".concat(lg ? 'py-10 py-md-14 px-10 px-md-20 pe-lg-0' : 'p-10 p-md-20') },
-                react_1.default.createElement("h1", { className: "fw-bold text-gray-900 ".concat(lg ? 'mb-0' : '') }, "Search Goods"),
-                react_1.default.createElement("div", { className: 'fs-3 mb-8' }, "Get Amazing Gadgets"),
-                react_1.default.createElement("form", { className: 'd-flex flex-center py-2 px-6 bg-body rounded' },
-                    react_1.default.createElement(helpers_1.KTIcon, { iconName: 'magnifier', className: 'fs-1 text-primary' }),
-                    react_1.default.createElement("input", { type: 'text', className: "form-control border-0 fw-semibold ps-2 ".concat(lg ? 'w-xxl-600px' : 'w-xxl-350px'), placeholder: 'Search Goods' }))),
-            react_1.default.createElement("div", { className: "d-none d-md-flex flex-row-fluid mw-400px ml-auto ".concat(bgImage ? 'bgi-no-repeat bgi-position-y-center bgi-position-x-left bgi-size-cover' : ''), style: { backgroundImage: bgImagePath } }))));
+    return (React.createElement("div", { className: `card ${className}` },
+        React.createElement("div", { className: `card-body card-rounded p-0 d-flex bg-${bgColor}`, style: { backgroundColor: bgHex } },
+            React.createElement("div", { className: `d-flex flex-column flex-lg-row-auto ${lg ? 'py-10 py-md-14 px-10 px-md-20 pe-lg-0' : 'p-10 p-md-20'}` },
+                React.createElement("h1", { className: `fw-bold text-gray-900 ${lg ? 'mb-0' : ''}` }, "Search Goods"),
+                React.createElement("div", { className: 'fs-3 mb-8' }, "Get Amazing Gadgets"),
+                React.createElement("form", { className: 'd-flex flex-center py-2 px-6 bg-body rounded' },
+                    React.createElement(KTIcon, { iconName: 'magnifier', className: 'fs-1 text-primary' }),
+                    React.createElement("input", { type: 'text', className: `form-control border-0 fw-semibold ps-2 ${lg ? 'w-xxl-600px' : 'w-xxl-350px'}`, placeholder: 'Search Goods' }))),
+            React.createElement("div", { className: `d-none d-md-flex flex-row-fluid mw-400px ml-auto ${bgImage ? 'bgi-no-repeat bgi-position-y-center bgi-position-x-left bgi-size-cover' : ''}`, style: { backgroundImage: bgImagePath } }))));
 };
-exports.EngageWidget1 = EngageWidget1;
+export { EngageWidget1 };