pixelize-design-library 2.2.43 → 2.2.45

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 (23) hide show
  1. package/dist/Components/DatePicker/CalendarPanel.d.ts +22 -0
  2. package/dist/Components/DatePicker/CalendarPanel.js +104 -0
  3. package/dist/Components/DatePicker/DatePicker.js +9 -120
  4. package/dist/Components/DatePicker/RangeDatePicker.d.ts +4 -0
  5. package/dist/Components/DatePicker/RangeDatePicker.js +205 -0
  6. package/dist/Components/DatePicker/SingleDatePicker.d.ts +4 -0
  7. package/dist/Components/DatePicker/SingleDatePicker.js +988 -0
  8. package/dist/Components/DatePicker/ThemeDatePicker.d.ts +4 -0
  9. package/dist/Components/DatePicker/ThemeDatePicker.js +43 -0
  10. package/dist/Components/DatePicker/TimeOnlyPicker.d.ts +4 -0
  11. package/dist/Components/DatePicker/TimeOnlyPicker.js +119 -0
  12. package/dist/Components/DatePicker/TimePickerInput.d.ts +12 -0
  13. package/dist/Components/DatePicker/TimePickerInput.js +362 -0
  14. package/dist/Components/NoteTextArea/NoteTextArea.d.ts +1 -1
  15. package/dist/Components/NoteTextArea/NoteTextArea.js +9 -9
  16. package/dist/Components/NoteTextArea/NoteTextAreaProps.d.ts +1 -0
  17. package/dist/Components/Table/Components/HeaderActions.js +41 -9
  18. package/dist/Theme/Meadow/palette.js +17 -17
  19. package/dist/Theme/Radiant/palette.js +34 -34
  20. package/dist/Theme/Skyline/palette.js +17 -17
  21. package/dist/index.d.ts +2 -2
  22. package/dist/index.js +3 -3
  23. package/package.json +1 -1
package/dist/Components/Table/Components/HeaderActions.js CHANGED
@@ -18,28 +18,60 @@ var react_1 = require("@chakra-ui/react");
18
18
  var lucide_react_1 = require("lucide-react");
19
19
  var react_2 = __importDefault(require("react"));
20
20
  var useCustomTheme_1 = require("../../../Theme/useCustomTheme");
21
+ // const ListItem = ({
22
+ // icon,
23
+ // name,
24
+ // onClick,
25
+ // selections,
26
+ // }: {
27
+ // icon: React.ReactElement;
28
+ // name: string;
29
+ // onClick?: (selection: (string | number)[]) => void;
30
+ // selections: (string | number)[];
31
+ // }) => {
32
+ // const { colors }: any = useCustomTheme();
33
+ // const styledIcon = React.cloneElement(icon, {
34
+ // color: colors?.text?.[500],
35
+ // size: "1.25rem",
36
+ // });
37
+ // return (
38
+ // <Box
39
+ // display={"flex"}
40
+ // alignItems={"center"}
41
+ // gap={"0.375rem"}
42
+ // onClick={() => onClick && onClick(selections)}
43
+ // cursor={"pointer"}
44
+ // _hover={{color: colors?.primary?.[500]}}
45
+ // >
46
+ // {styledIcon} {name}
47
+ // </Box>
48
+ // );
49
+ // };
21
50
  var ListItem = function (_a) {
22
- var _b;
23
- var icon = _a.icon, name = _a.name, onClick = _a.onClick, selections = _a.selections;
51
+ var _b, _c;
52
+ var icon = _a.icon, name = _a.name, onClick = _a.onClick, selections = _a.selections, _d = _a.isHoverEnabled, isHoverEnabled = _d === void 0 ? false : _d, hoverColor = _a.hoverColor;
24
53
  var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
25
54
  var styledIcon = react_2.default.cloneElement(icon, {
26
- color: (_b = colors === null || colors === void 0 ? void 0 : colors.text) === null || _b === void 0 ? void 0 : _b[500],
55
+ color: "currentColor",
27
56
  size: "1.25rem",
28
57
  });
29
- return (react_2.default.createElement(react_1.Box, { display: "flex", alignItems: "center", gap: "0.375rem", onClick: function () { return onClick && onClick(selections); }, cursor: "pointer" },
58
+ return (react_2.default.createElement(react_1.Box, { display: "flex", alignItems: "center", gap: "0.375rem", cursor: isHoverEnabled ? "pointer" : "default", onClick: function () { return onClick && onClick(selections); }, color: (_b = colors === null || colors === void 0 ? void 0 : colors.text) === null || _b === void 0 ? void 0 : _b[500], _hover: isHoverEnabled
59
+ ? { color: hoverColor ? hoverColor : (_c = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _c === void 0 ? void 0 : _c[500] } // ✅ hover updates both
60
+ : {}, transition: "color 0.2s ease" // ✅ smooth animation
61
+ },
30
62
  styledIcon,
31
63
  " ",
32
64
  name));
33
65
  };
34
66
  var HeaderActions = function (_a) {
35
- var _b, _c, _d, _e, _f, _g, _h;
67
+ var _b, _c, _d, _e, _f, _g, _h, _j;
36
68
  var actions = _a.actions, selections = _a.selections;
37
69
  var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
38
70
  return (react_2.default.createElement(react_1.Box, { display: "flex", gap: 4, fontSize: "0.875rem", fontWeight: 400, color: (_b = colors === null || colors === void 0 ? void 0 : colors.secondary) === null || _b === void 0 ? void 0 : _b[500] },
39
- ((_c = actions === null || actions === void 0 ? void 0 : actions.isDelete) === null || _c === void 0 ? void 0 : _c.enabled) && (react_2.default.createElement(ListItem, { icon: react_2.default.createElement(lucide_react_1.Trash2, null), name: "Delete", onClick: (_d = actions === null || actions === void 0 ? void 0 : actions.isDelete) === null || _d === void 0 ? void 0 : _d.onClick, selections: selections })),
40
- ((_e = actions === null || actions === void 0 ? void 0 : actions.isUpdate) === null || _e === void 0 ? void 0 : _e.enabled) && (react_2.default.createElement(ListItem, { icon: react_2.default.createElement(lucide_react_1.SquarePen, null), name: "Mass Update", onClick: (_f = actions === null || actions === void 0 ? void 0 : actions.isUpdate) === null || _f === void 0 ? void 0 : _f.onClick, selections: selections })),
41
- ((_g = actions === null || actions === void 0 ? void 0 : actions.items) === null || _g === void 0 ? void 0 : _g.length)
42
- ? (_h = actions === null || actions === void 0 ? void 0 : actions.items) === null || _h === void 0 ? void 0 : _h.map(function (item) { return (react_2.default.createElement(ListItem, __assign({}, item, { selections: selections }))); })
71
+ ((_c = actions === null || actions === void 0 ? void 0 : actions.isDelete) === null || _c === void 0 ? void 0 : _c.enabled) && (react_2.default.createElement(ListItem, { icon: react_2.default.createElement(lucide_react_1.Trash2, { className: "w-4 h-4" }), name: "Delete", onClick: (_d = actions === null || actions === void 0 ? void 0 : actions.isDelete) === null || _d === void 0 ? void 0 : _d.onClick, selections: selections, isHoverEnabled: true, hoverColor: (_e = colors === null || colors === void 0 ? void 0 : colors.red) === null || _e === void 0 ? void 0 : _e[500] })),
72
+ ((_f = actions === null || actions === void 0 ? void 0 : actions.isUpdate) === null || _f === void 0 ? void 0 : _f.enabled) && (react_2.default.createElement(ListItem, { icon: react_2.default.createElement(lucide_react_1.SquarePen, { className: "w-4 h-4" }), name: "Mass Update", onClick: (_g = actions === null || actions === void 0 ? void 0 : actions.isUpdate) === null || _g === void 0 ? void 0 : _g.onClick, selections: selections })),
73
+ ((_h = actions === null || actions === void 0 ? void 0 : actions.items) === null || _h === void 0 ? void 0 : _h.length)
74
+ ? (_j = actions === null || actions === void 0 ? void 0 : actions.items) === null || _j === void 0 ? void 0 : _j.map(function (item) { return (react_2.default.createElement(ListItem, __assign({}, item, { selections: selections }))); })
43
75
  : null));
44
76
  };
45
77
  exports.default = HeaderActions;
package/dist/Theme/Meadow/palette.js CHANGED
@@ -36,24 +36,24 @@ var palette = __assign(__assign({}, palette_1.default), { primary: {
36
36
  48: "#9A4FE57a",
37
37
  }
38
38
  }, secondary: {
39
- 50: "#e3f9e5",
40
- 100: "#c1f0c0",
41
- 200: "#9ee4a1",
42
- 300: "#72d785",
43
- 400: "#48c15d",
44
- 500: "#2caa3d",
45
- 600: "#239c31",
46
- 700: "#1d8626",
47
- 800: "#16631c",
48
- 900: "#0d4b13",
39
+ 50: "#e8e8e9",
40
+ 100: "#b7b8bb",
41
+ 200: "#94989b",
42
+ 300: "#63666d",
43
+ 400: "#454951",
44
+ 500: "#161b25",
45
+ 600: "#141922",
46
+ 700: "#10131a",
47
+ 800: "#0c0f14",
48
+ 900: "#090b10",
49
49
  opacity: {
50
- 4: "#9A4FE50a",
51
- 8: "#9A4FE514",
52
- 16: "#9A4FE529",
53
- 24: "#9A4FE53d",
54
- 32: "#9A4FE552",
55
- 40: "#9A4FE566",
56
- 48: "#9A4FE57a",
50
+ 4: "#161b250a",
51
+ 8: "#161b2514",
52
+ 16: "#161b2529",
53
+ 24: "#161b253d",
54
+ 32: "#161b2552",
55
+ 40: "#161b2566",
56
+ 48: "#161b257a",
57
57
  }
58
58
  }, tertiary: {
59
59
  50: "#e3f9e5",
package/dist/Theme/Radiant/palette.js CHANGED
@@ -36,44 +36,44 @@ var palette = __assign(__assign({}, palette_1.default), { primary: {
36
36
  48: "#9A4FE57a",
37
37
  }
38
38
  }, secondary: {
39
- 50: "#ffe0b2",
40
- 100: "#ffcc80",
41
- 200: "#ffb74d",
42
- 300: "#ffa726",
43
- 400: "#ff9800",
44
- 500: "#fb8c00",
45
- 600: "#f57c00",
46
- 700: "#ef6c00",
47
- 800: "#e65100",
48
- 900: "#bf360c",
39
+ 50: "#e8e8e9",
40
+ 100: "#b7b8bb",
41
+ 200: "#94989b",
42
+ 300: "#63666d",
43
+ 400: "#454951",
44
+ 500: "#161b25",
45
+ 600: "#141922",
46
+ 700: "#10131a",
47
+ 800: "#0c0f14",
48
+ 900: "#090b10",
49
49
  opacity: {
50
- 4: "#9A4FE50a",
51
- 8: "#9A4FE514",
52
- 16: "#9A4FE529",
53
- 24: "#9A4FE53d",
54
- 32: "#9A4FE552",
55
- 40: "#9A4FE566",
56
- 48: "#9A4FE57a",
50
+ 4: "#161b250a",
51
+ 8: "#161b2514",
52
+ 16: "#161b2529",
53
+ 24: "#161b253d",
54
+ 32: "#161b2552",
55
+ 40: "#161b2566",
56
+ 48: "#161b257a",
57
57
  }
58
58
  }, tertiary: {
59
- 50: "#ffe0b2",
60
- 100: "#ffcc80",
61
- 200: "#ffb74d",
62
- 300: "#ffa726",
63
- 400: "#ff9800",
64
- 500: "#fb8c00",
65
- 600: "#f57c00",
66
- 700: "#ef6c00",
67
- 800: "#e65100",
68
- 900: "#bf360c",
59
+ 50: "#e8e8e9",
60
+ 100: "#b7b8bb",
61
+ 200: "#94989b",
62
+ 300: "#63666d",
63
+ 400: "#454951",
64
+ 500: "#161b25",
65
+ 600: "#141922",
66
+ 700: "#10131a",
67
+ 800: "#0c0f14",
68
+ 900: "#090b10",
69
69
  opacity: {
70
- 4: "#9A4FE50a",
71
- 8: "#9A4FE514",
72
- 16: "#9A4FE529",
73
- 24: "#9A4FE53d",
74
- 32: "#9A4FE552",
75
- 40: "#9A4FE566",
76
- 48: "#9A4FE57a",
70
+ 4: "#161b250a",
71
+ 8: "#161b2514",
72
+ 16: "#161b2529",
73
+ 24: "#161b253d",
74
+ 32: "#161b2552",
75
+ 40: "#161b2566",
76
+ 48: "#161b257a",
77
77
  }
78
78
  }, transparent: "transparent", black: "#000", white: "#fff", semantic: {
79
79
  success: {
package/dist/Theme/Skyline/palette.js CHANGED
@@ -36,24 +36,24 @@ var palette = __assign(__assign({}, palette_1.default), { primary: {
36
36
  48: "#9A4FE57a",
37
37
  }
38
38
  }, secondary: {
39
- 50: "#e3f2f9",
40
- 100: "#c5e4f3",
41
- 200: "#a2d4ec",
42
- 300: "#7ac1e4",
43
- 400: "#47a9da",
44
- 500: "#0088cc",
45
- 600: "#007ab8",
46
- 700: "#006ba1",
47
- 800: "#005885",
48
- 900: "#003f5e",
39
+ 50: "#e8e8e9",
40
+ 100: "#b7b8bb",
41
+ 200: "#94989b",
42
+ 300: "#63666d",
43
+ 400: "#454951",
44
+ 500: "#161b25",
45
+ 600: "#141922",
46
+ 700: "#10131a",
47
+ 800: "#0c0f14",
48
+ 900: "#090b10",
49
49
  opacity: {
50
- 4: "#9A4FE50a",
51
- 8: "#9A4FE514",
52
- 16: "#9A4FE529",
53
- 24: "#9A4FE53d",
54
- 32: "#9A4FE552",
55
- 40: "#9A4FE566",
56
- 48: "#9A4FE57a",
50
+ 4: "#161b250a",
51
+ 8: "#161b2514",
52
+ 16: "#161b2529",
53
+ 24: "#161b253d",
54
+ 32: "#161b2552",
55
+ 40: "#161b2566",
56
+ 48: "#161b257a",
57
57
  }
58
58
  }, tertiary: {
59
59
  50: "#e3f2f9",
package/dist/index.d.ts CHANGED
@@ -13,7 +13,6 @@ import DatePicker from "./Components/DatePicker/DatePicker";
13
13
  import Drawer, { DrawerHeader, DrawerBody, DrawerFooter } from "./Components/Drawer/Drawer";
14
14
  import Dropdown from "./Components/Dropdown/DropDown";
15
15
  import Editor from "./Components/Editor/Editor";
16
- import FeedbackForm from "./Components/FeedbackForm/FeedbackForm";
17
16
  import FileUpload from "./Components/FileUpload/FileUpload";
18
17
  import FileUploader from "./Components/FileUploader/FileUploader";
19
18
  import FormWrapper from "./Components/Form/FormWrapper";
@@ -60,5 +59,6 @@ import { InputSwitch } from "./Components/Input/Switch/InputSwitch";
60
59
  import PaymentCard from "./Components/Card/PaymentCard/PaymentCard";
61
60
  import ApexLineChart from "./Components/Apexcharts/ApexLineChart/ApexLineChart";
62
61
  import Notification from "./Components/Notification/Notification";
63
- export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, FeedbackForm, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FileUploader, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, 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, };
62
+ import ThemeDatePicker from "./Components/DatePicker/ThemeDatePicker";
63
+ export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, ThemeDatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, FileUpload, FileUploader, FormWrapper, Header, HeaderActions, InputTextArea, InputSwitch, KanbanBoard, Loading, Modal, ModalHeader, ModalBody, ModalFooter, NavigationBar, Notification, 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, };
64
64
  export default withTheme;
package/dist/index.js CHANGED
@@ -27,7 +27,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
27
27
  return (mod && mod.__esModule) ? mod : { "default": mod };
28
28
  };
29
29
  Object.defineProperty(exports, "__esModule", { value: true });
30
- 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.Notification = 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.FileUploader = exports.FileUpload = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.DatePicker = exports.ContactForm = exports.Checkbox = exports.Card = exports.FeedbackForm = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexLineChart = exports.ApexPolarChart = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
30
+ 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.Notification = 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.FileUploader = exports.FileUpload = exports.Editor = exports.Dropdown = exports.DrawerFooter = exports.DrawerBody = exports.DrawerHeader = exports.Drawer = exports.ThemeDatePicker = 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;
31
31
  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 = exports.Search = exports.Reorder = exports.RadioButtonGroup = void 0;
32
32
  var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
33
33
  exports.Accordian = Accordion_1.default;
@@ -62,8 +62,6 @@ var DropDown_1 = __importDefault(require("./Components/Dropdown/DropDown"));
62
62
  exports.Dropdown = DropDown_1.default;
63
63
  var Editor_1 = __importDefault(require("./Components/Editor/Editor"));
64
64
  exports.Editor = Editor_1.default;
65
- var FeedbackForm_1 = __importDefault(require("./Components/FeedbackForm/FeedbackForm"));
66
- exports.FeedbackForm = FeedbackForm_1.default;
67
65
  var FileUpload_1 = __importDefault(require("./Components/FileUpload/FileUpload"));
68
66
  exports.FileUpload = FileUpload_1.default;
69
67
  var FileUploader_1 = __importDefault(require("./Components/FileUploader/FileUploader"));
@@ -163,4 +161,6 @@ var ApexLineChart_1 = __importDefault(require("./Components/Apexcharts/ApexLineC
163
161
  exports.ApexLineChart = ApexLineChart_1.default;
164
162
  var Notification_1 = __importDefault(require("./Components/Notification/Notification"));
165
163
  exports.Notification = Notification_1.default;
164
+ var ThemeDatePicker_1 = __importDefault(require("./Components/DatePicker/ThemeDatePicker"));
165
+ exports.ThemeDatePicker = ThemeDatePicker_1.default;
166
166
  exports.default = withTheme_1.default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "2.2.43",
3
+ "version": "2.2.45",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",