pixelize-design-library 1.0.78 → 1.0.80

package/dist/Components/Button/Button.js

@@ -29,7 +29,6 @@ var useCustomTheme_1 = require("../../Theme/useCustomTheme");
 function Button(_a) {
     var label = _a.label, _b = _a.width, width = _b === void 0 ? "100%" : _b, onClick = _a.onClick, color = _a.color, variant = _a.variant, leftIcon = _a.leftIcon, rightIcon = _a.rightIcon, size = _a.size, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isLoading, isLoading = _d === void 0 ? false : _d, _e = _a.loadingText, loadingText = _e === void 0 ? "Loading" : _e, type = _a.type;
     var theme = (0, useCustomTheme_1.useCustomTheme)();
-    console.log(theme);
     return (react_1.default.createElement(react_2.Button, { type: type, onClick: onClick, width: width, colorScheme: color, variant: variant, size: size, isLoading: isLoading, isDisabled: isDisabled, loadingText: loadingText, leftIcon: leftIcon, rightIcon: rightIcon, sx: !variant ? {
             backgroundColor: theme.colors.primary[500],
             color: theme.colors.white,

package/dist/Components/NavigationBar/NavigationBar.js

@@ -14,11 +14,11 @@ function NavBar(_a) {
                 react_1.default.createElement(react_2.Stack, { direction: "row", spacing: 7 },
                     react_1.default.createElement(react_2.Menu, null,
                         react_1.default.createElement(react_2.MenuButton, { as: react_2.Button, rounded: "full", variant: "link", cursor: "pointer", minW: 0 },
-                            react_1.default.createElement(react_2.Avatar, { size: "sm", src: userAvathar })),
+                            react_1.default.createElement(react_2.Avatar, { size: "sm", name: userName, src: userAvathar })),
                         react_1.default.createElement(react_2.MenuList, { alignItems: "center" },
                             react_1.default.createElement("br", null),
                             react_1.default.createElement(react_2.Center, null,
-                                react_1.default.createElement(react_2.Avatar, { size: "2xl", src: userAvathar })),
+                                react_1.default.createElement(react_2.Avatar, { size: "2xl", name: userName, src: userAvathar })),
                             react_1.default.createElement("br", null),
                             react_1.default.createElement(react_2.Center, null,
                                 react_1.default.createElement("p", null, userName)),

package/dist/Components/SideBar/SideBar.js

@@ -12,9 +12,12 @@ function Sidebar(_a) {
     var theme = (0, useCustomTheme_1.useCustomTheme)();
     return (react_1.default.createElement(react_2.Flex, { pos: "sticky", h: "100vh", boxShadow: "0 4px 12px 0 rgba(0, 0, 0, 0.05)", w: toggle ? "75px" : "200px", flexDir: "column", justifyContent: "space-between", background: "#ffffff" },
         react_1.default.createElement(react_2.Flex, { pl: toggle ? "22%" : "8%", flexDir: "column", w: "100%", alignItems: "flex-start", as: "nav", h: "100vh" },
-            react_1.default.createElement(react_2.Flex, { mt: 5, align: "center" },
-                react_1.default.createElement(react_2.Image, { borderRadius: "full", boxSize: "45px", src: logo, alt: "Company Logo" }),
-                react_1.default.createElement(react_2.Text, { ml: 4, display: toggle ? "none" : "flex" }, companyName)),
+            logo ?
+                react_1.default.createElement(react_2.Flex, { mt: 5, align: "center" },
+                    react_1.default.createElement(react_2.Image, { borderRadius: "full", boxSize: "45px", src: logo, alt: "Company Logo", mr: 3 }),
+                    react_1.default.createElement(react_2.Text, { display: toggle ? "none" : "flex", fontWeight: 800 }, companyName)) :
+                react_1.default.createElement(react_2.Box, { ml: "-8px", mt: 5, width: "100%", display: "flex", justifyContent: "center", alignItems: "center" },
+                    react_1.default.createElement(react_2.Text, { fontWeight: 800, fontSize: "1.3rem", textAlign: "center" }, toggle ? companyName[0] : companyName)),
             react_1.default.createElement(react_2.Flex, { position: "absolute", left: toggle ? "55px" : "180px", top: "60px", background: theme.colors.primary[500], borderRadius: "23px" },
                 react_1.default.createElement(react_2.IconButton, { background: "none", icon: toggle ? (react_1.default.createElement(fi_1.FiChevronRight, { color: "#ffffff" })) : (react_1.default.createElement(fi_1.FiChevronLeft, { color: "#ffffff" })), _hover: { background: "none" }, onClick: changeToggle, "aria-label": "Toggle Navigation" })),
             react_1.default.createElement(react_2.Flex, { mt: 30, flexDir: "column", w: "100%", alignItems: toggle ? "center" : "flex-start", h: "100vh", overflow: "scroll", css: {

package/dist/Components/SideBar/SideBarProps.d.ts

@@ -5,7 +5,7 @@ export type SidebarProps = {
     handleMenuClick: (title: string, url: string) => void;
     toggle: boolean;
     changeToggle: () => void;
-    logo: string;
+    logo?: string;
     companyName: string;
 };
 type Menu = {

package/dist/Layout.js

@@ -561,7 +561,7 @@ var Layout = function () {
             react_1.default.createElement(react_2.Box, null,
                 react_1.default.createElement(SideBar_1.default, { menus: menu, activeMenu: activeMenu, handleMenuClick: handleMenuClick, toggle: toggle, changeToggle: function () { return changeToggle(!toggle); }, logo: "https://bit.ly/dan-abramov", companyName: "PIXELIZE" })),
             react_1.default.createElement(react_2.Box, { flex: "1", maxWidth: width, overflow: "hidden" },
-                react_1.default.createElement(NavigationBar_1.default, { userAvathar: "https://bit.ly/dan-abramov", userName: "PIXELIZE", navMenu: navmenus, handleNavOnClick: handleNavOnClick, handleLogout: handleLogout, logoutText: "Logout", key: "navbar" }),
+                react_1.default.createElement(NavigationBar_1.default, { userAvathar: "https://bit.ly/dan-abramo", userName: "PIXELIZE", navMenu: navmenus, handleNavOnClick: handleNavOnClick, handleLogout: handleLogout, logoutText: "Logout", key: "navbar" }),
                 react_1.default.createElement("br", null),
                 react_1.default.createElement(Breadcrumbs_1.default, { separator: react_1.default.createElement(icons_1.ChevronRightIcon, { color: "gray.500" }), items: breadcrumbItems, handleClick: handleClick }),
                 react_1.default.createElement(react_2.Box, { p: "50px", height: height - 160, overflowY: "scroll", width: width - 75 },
@@ -642,7 +642,7 @@ var Layout = function () {
                     react_1.default.createElement(PinInput_1.default, { pins: 5, label: "Enter pin" }),
                     react_1.default.createElement("br", null),
                     react_1.default.createElement("br", null),
-                    react_1.default.createElement(ProfileCard_1.default, { CardStyle: { marginRight: "10px" }, borderTopColor: true },
+                    react_1.default.createElement(ProfileCard_1.default, { CardStyle: { marginRight: "10px" } },
                         react_1.default.createElement(ProfileCard_1.ProfileCardHeader, null, "Customer dashboard"),
                         react_1.default.createElement(ProfileCard_1.ProfileCardBody, null,
                             react_1.default.createElement(react_2.Text, null, "View a summary of all your customers over the last month.")),

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import "./bootstrap";
 import Accordian from "./Components/Accordion/Accordion";
 import AlertDialog from "./Components/AlertDialog/AlertDialog";
 import ApexBarChart from "./Components/Apexcharts/ApexBarChart/ApexBarChart";
@@ -38,5 +39,6 @@ import ToolTip from "./Components/ToolTip/ToolTip";
 import VerifyEmailOtp from "./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp";
 import withTheme from "./withTheme";
 import { skyline, meadow, radiant } from "./Theme";
-export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, InputTextArea, KaTable, TableActionCreator, TableEnums, TableProps, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, NoteTextArea, MultiSelect, NumberInput, PinInput, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Search, Select, SelectSearch, SideBar, Skeletons, Switch, Table, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, skyline, radiant, meadow };
+import { useCustomTheme } from "./Theme/useCustomTheme";
+export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, InputTextArea, KaTable, TableActionCreator, TableEnums, TableProps, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, NoteTextArea, MultiSelect, NumberInput, PinInput, ProfileCard, ProfileCardHeader, ProfileCardBody, ProfileCardFooter, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Search, Select, SelectSearch, SideBar, Skeletons, Switch, Table, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, useCustomTheme, skyline, radiant, meadow };
 export default withTheme;

package/dist/index.js

@@ -1,5 +1,4 @@
 "use strict";
-// import "./bootstrap";
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     var desc = Object.getOwnPropertyDescriptor(m, k);
@@ -28,7 +27,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ToolTip = exports.Toaster = exports.Timeline = exports.TextInput = exports.Table = exports.Switch = exports.Skeletons = exports.SideBar = exports.SelectSearch = exports.Select = exports.Search = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCardFooter = exports.ProfileCardBody = exports.ProfileCardHeader = exports.ProfileCard = exports.PinInput = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.NavigationBar = exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.TableProps = exports.TableEnums = exports.TableActionCreator = exports.KaTable = exports.InputTextArea = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
-exports.meadow = exports.radiant = exports.skyline = exports.VerifyEmailOtp = exports.useToaster = void 0;
+exports.meadow = exports.radiant = exports.skyline = exports.useCustomTheme = exports.VerifyEmailOtp = exports.useToaster = void 0;
+require("./bootstrap");
 var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
 exports.Accordian = Accordion_1.default;
 var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
@@ -124,4 +124,6 @@ var Theme_1 = require("./Theme");
 Object.defineProperty(exports, "skyline", { enumerable: true, get: function () { return Theme_1.skyline; } });
 Object.defineProperty(exports, "meadow", { enumerable: true, get: function () { return Theme_1.meadow; } });
 Object.defineProperty(exports, "radiant", { enumerable: true, get: function () { return Theme_1.radiant; } });
+var useCustomTheme_1 = require("./Theme/useCustomTheme");
+Object.defineProperty(exports, "useCustomTheme", { enumerable: true, get: function () { return useCustomTheme_1.useCustomTheme; } });
 exports.default = withTheme_1.default;

package/package.json

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