npm - pixelize-design-library - Versions diffs - 2.1.76 → 2.1.77 - Mend

pixelize-design-library 2.1.76 → 2.1.77

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (8) hide show

package/dist/Components/Apexcharts/ApexPolarCharts/ApexPolarCharts.d.ts ADDED Viewed

@@ -0,0 +1,4 @@
+import React from "react";
+import { ApexPolarChartProps } from "./ApexPolarChartsProps";
+declare const ApexPolarChart: ({ data, labels, title, height, width, chartColors, titlePosition, titleStyle, legendStyle, variant, }: ApexPolarChartProps) => React.JSX.Element;
+export default ApexPolarChart;

package/dist/Components/Apexcharts/ApexPolarCharts/ApexPolarCharts.js ADDED Viewed

@@ -0,0 +1,68 @@
+"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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+var react_apexcharts_1 = __importDefault(require("react-apexcharts"));
+var ApexPolarChart = function (_a) {
+    var data = _a.data, labels = _a.labels, title = _a.title, _b = _a.height, height = _b === void 0 ? 400 : _b, _c = _a.width, width = _c === void 0 ? 500 : _c, chartColors = _a.chartColors, _d = _a.titlePosition, titlePosition = _d === void 0 ? "center" : _d, _e = _a.titleStyle, titleStyle = _e === void 0 ? {
+        color: "#3182ce",
+        fontSize: "16px",
+        fontWeight: 600,
+        fontFamily: "Arial",
+    } : _e, _f = _a.legendStyle, legendStyle = _f === void 0 ? {
+        colors: "#000",
+        position: "bottom",
+        useSeriesColors: false,
+    } : _f, _g = _a.variant, variant = _g === void 0 ? "basic" : _g;
+    var extraOptions = {};
+    switch (variant) {
+        case "basic":
+            extraOptions = {
+                stroke: { colors: ["#fff"] },
+                fill: { opacity: 0.8 },
+            };
+            break;
+        case "monochrome":
+            extraOptions = {
+                theme: {
+                    monochrome: {
+                        enabled: true,
+                        shadeTo: "light",
+                        shadeIntensity: 0.6,
+                    },
+                },
+                stroke: { colors: ["#fff"] },
+                fill: { opacity: 0.8 },
+            };
+            break;
+        default:
+            break;
+    }
+    var options = __assign({ chart: { type: "polarArea" }, labels: labels, colors: chartColors !== null && chartColors !== void 0 ? chartColors : ["#3182ce", "#e53e3e", "#38a169", "#dd6b20"], legend: {
+            position: legendStyle.position,
+            labels: {
+                colors: legendStyle.colors,
+                useSeriesColors: legendStyle.useSeriesColors,
+            },
+        }, title: {
+            text: title,
+            align: titlePosition,
+            style: titleStyle,
+        }, dataLabels: { enabled: true } }, extraOptions);
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(react_apexcharts_1.default, { options: options, series: data, type: "polarArea", height: height, width: width })));
+};
+exports.default = ApexPolarChart;

package/dist/Components/Apexcharts/ApexPolarCharts/ApexPolarChartsProps.d.ts ADDED Viewed

@@ -0,0 +1,22 @@
+export type ApexPolarChartProps = {
+    variant?: PolarVariant;
+    data: number[];
+    labels: string[];
+    title?: string;
+    height?: number;
+    width?: number;
+    chartColors?: string[];
+    titlePosition?: "left" | "center" | "right";
+    titleStyle?: {
+        color?: string;
+        fontSize?: string;
+        fontWeight?: number | string;
+        fontFamily?: string;
+    };
+    legendStyle?: {
+        colors?: string | string[];
+        useSeriesColors?: boolean;
+        position?: "top" | "right" | "bottom" | "left";
+    };
+};
+export type PolarVariant = "basic" | "monochrome";

package/dist/Components/Apexcharts/ApexPolarCharts/ApexPolarChartsProps.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ "use strict";
2	+ Object.defineProperty(exports, "__esModule", { value: true });

package/dist/Pages/chart.js CHANGED Viewed

@@ -7,6 +7,7 @@ var react_1 = __importDefault(require("react"));
 var ApexBarChart_1 = __importDefault(require("../Components/Apexcharts/ApexBarChart/ApexBarChart"));
 var ApexPieChart_1 = __importDefault(require("../Components/Apexcharts/ApexPieChart/ApexPieChart"));
 var ApexLineChart_1 = __importDefault(require("../Components/Apexcharts/ApexLineChart/ApexLineChart"));
+var ApexPolarCharts_1 = __importDefault(require("../Components/Apexcharts/ApexPolarCharts/ApexPolarCharts"));
 var ChartPage = function () {
     var data = Array.from({ length: 10 }, function () { return Math.floor(Math.random() * 100); });
     var categories = data.map(function (_, index) { return "Category ".concat(index + 1); });
@@ -30,6 +31,8 @@ var ChartPage = function () {
             titleStyle: { color: "#00E396" } }),
         react_1.default.createElement(ApexPieChart_1.default, { data: data1, labels: categories1, title: "pie-with-image", variant: "pie-with-image", titlePosition: "left", chartColor: ["#00E396", "#3182ce", "#ff4757", "#ff6348", "#e84393"], titleStyle: { color: "#00E396" } }),
         react_1.default.createElement(ApexLineChart_1.default, { variant: "basic", data: [10, 20, 30, 40, 50], labels: ["Jan", "Feb", "Mar", "Apr", "May"], title: "Basic Line Chart", lineColors: ["#3182ce"], height: 300, width: 600 }),
-        react_1.default.createElement(ApexLineChart_1.default, { variant: "realtime", data: [15, 25, 35], title: "Realtime Line Chart", lineColors: ["#e53e3e"], height: 300, width: 600 })));
+        react_1.default.createElement(ApexLineChart_1.default, { variant: "realtime", data: [15, 25, 35], title: "Realtime Line Chart", lineColors: ["#e53e3e"], height: 300, width: 600 }),
+        react_1.default.createElement(ApexPolarCharts_1.default, { data: [21, 23, 19, 14, 6], labels: ["Apple", "Mango", "Orange", "Watermelon", "Banana"], variant: "basic" }),
+        react_1.default.createElement(ApexPolarCharts_1.default, { data: [21, 23, 19, 14, 6], labels: ["Apple", "Mango", "Orange", "Watermelon", "Banana"], variant: "monochrome" })));
 };
 exports.default = ChartPage;

package/dist/index.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ import Accordian from "./Components/Accordion/Accordion";
 import AlertDialog from "./Components/AlertDialog/AlertDialog";
 import ApexBarChart from "./Components/Apexcharts/ApexBarChart/ApexBarChart";
 import ApexPieChart from "./Components/Apexcharts/ApexPieChart/ApexPieChart";
+import ApexPolarChart from "./Components/Apexcharts/ApexPolarCharts/ApexPolarCharts";
 import Breadcrumbs from "./Components/Breadcrumbs/Breadcrumbs";
 import Button from "./Components/Button/Button";
 import ButtonGroupIcon from "./Components/ButtonGroupIcon/ButtonGroupIcon";
@@ -56,5 +57,5 @@ import PhoneNumberInput from "./Components/Input/PhoneNumberInput";
 import { InputSwitch } from "./Components/Input/Switch/InputSwitch";
 import PaymentCard from "./Components/Card/PaymentCard/PaymentCard";
 import ApexLineChart from "./Components/Apexcharts/ApexLineChart/ApexLineChart";
-export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, ThemesList, debounce, };
+export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, NoteTextArea, MultiSelect, NumberInput, PaymentCard, PhoneNumberInput, PinInput, ProductCard, ProductDetails, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Reorder, Search, Select, SearchSelect, SelectSearch, SideBar, Slider, Skeletons, Switch, Table, TableToggle, Tag, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, ThemesList, debounce, };
 export default withTheme;

package/dist/index.js CHANGED Viewed

@@ -27,8 +27,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Select = exports.Search = exports.Reorder = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.NavigationBar = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.FormWrapper = exports.FileUpload = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
-exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = void 0;
+exports.Search = exports.Reorder = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.ProductDetails = exports.ProductCard = exports.PinInput = exports.PhoneNumberInput = exports.PaymentCard = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.NavigationBar = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.FormWrapper = exports.FileUpload = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPolarChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
+exports.debounce = exports.ThemesList = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Tag = exports.TableToggle = exports.Table = exports.Switch = exports.Skeletons = exports.Slider = exports.SideBar = exports.SelectSearch = exports.SearchSelect = exports.Select = void 0;
 var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
 exports.Accordian = Accordion_1.default;
 var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
@@ -37,6 +37,8 @@ var ApexBarChart_1 = __importDefault(require("./Components/Apexcharts/ApexBarCha
 exports.ApexBarChart = ApexBarChart_1.default;
 var ApexPieChart_1 = __importDefault(require("./Components/Apexcharts/ApexPieChart/ApexPieChart"));
 exports.ApexPieChart = ApexPieChart_1.default;
+var ApexPolarCharts_1 = __importDefault(require("./Components/Apexcharts/ApexPolarCharts/ApexPolarCharts"));
+exports.ApexPolarChart = ApexPolarCharts_1.default;
 var Breadcrumbs_1 = __importDefault(require("./Components/Breadcrumbs/Breadcrumbs"));
 exports.Breadcrumbs = Breadcrumbs_1.default;
 var Button_1 = __importDefault(require("./Components/Button/Button"));

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "pixelize-design-library",
-  "version": "2.1.76",
+  "version": "2.1.77",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.js",