pixelize-design-library 1.0.59 → 1.0.61
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.
- package/README.md +2 -0
- package/dist/Components/Accordion/Accordion.d.ts +2 -1
- package/dist/Components/Accordion/Accordion.js +1 -2
- package/dist/Components/AlertDialog/AlertDialog.d.ts +1 -1
- package/dist/Components/AlertDialog/AlertDialog.js +2 -2
- package/dist/Components/AlertDialog/AlertDialogProps.d.ts +1 -0
- package/dist/Components/Dropdown/DropDown.d.ts +1 -1
- package/dist/Components/Dropdown/DropDown.js +2 -2
- package/dist/Components/Dropdown/DropdownProps.d.ts +6 -0
- package/dist/Layout.js +2 -2
- package/dist/index.d.ts +3 -1
- package/dist/index.js +5 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { AccordionProps } from "./AccordionProps";
|
|
3
|
-
|
|
3
|
+
declare const Accordion: ({ allowMultiple, allowToggle, index, onChange, reduceMotion, items, ...rest }: AccordionProps) => React.JSX.Element;
|
|
4
|
+
export default Accordion;
|
|
@@ -25,7 +25,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
25
25
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
26
|
};
|
|
27
27
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
-
exports.Accordion = void 0;
|
|
29
28
|
var react_1 = __importDefault(require("react"));
|
|
30
29
|
var react_2 = require("@chakra-ui/react");
|
|
31
30
|
var Accordion = function (_a) {
|
|
@@ -38,4 +37,4 @@ var Accordion = function (_a) {
|
|
|
38
37
|
react_1.default.createElement(react_2.AccordionPanel, __assign({}, item.panelProps, { sx: (_c = item.customStyles) === null || _c === void 0 ? void 0 : _c.panelStyle }), item.content)));
|
|
39
38
|
})));
|
|
40
39
|
};
|
|
41
|
-
exports.
|
|
40
|
+
exports.default = Accordion;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { AlertDialogsProps } from "./AlertDialogProps";
|
|
3
|
-
declare const AlertDialog: ({ isOpen, onClose, leastDestructiveRef, content, title, confirmButtonText, cancelButtonText, isConfirmLoading, onConfirm, headerStyle, bodyStyle, footerStyle, closeButtonStyle, button1Style, button2Style, }: AlertDialogsProps) => React.JSX.Element;
|
|
3
|
+
declare const AlertDialog: ({ isOpen, onClose, leastDestructiveRef, content, title, confirmButtonText, cancelButtonText, isConfirmLoading, onConfirm, headerStyle, bodyStyle, footerStyle, closeButtonStyle, button1Style, button2Style, isCentered, key }: AlertDialogsProps) => React.JSX.Element;
|
|
4
4
|
export default AlertDialog;
|
|
@@ -6,8 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
var react_1 = require("@chakra-ui/react");
|
|
7
7
|
var react_2 = __importDefault(require("react"));
|
|
8
8
|
var AlertDialog = function (_a) {
|
|
9
|
-
var isOpen = _a.isOpen, onClose = _a.onClose, leastDestructiveRef = _a.leastDestructiveRef, content = _a.content, title = _a.title, _b = _a.confirmButtonText, confirmButtonText = _b === void 0 ? "Yes" : _b, _c = _a.cancelButtonText, cancelButtonText = _c === void 0 ? "No" : _c, isConfirmLoading = _a.isConfirmLoading, onConfirm = _a.onConfirm, headerStyle = _a.headerStyle, bodyStyle = _a.bodyStyle, footerStyle = _a.footerStyle, closeButtonStyle = _a.closeButtonStyle, button1Style = _a.button1Style, button2Style = _a.button2Style;
|
|
10
|
-
return (react_2.default.createElement(react_1.AlertDialog, { motionPreset: "slideInBottom", leastDestructiveRef: leastDestructiveRef, onClose: onClose, isOpen: isOpen, isCentered:
|
|
9
|
+
var isOpen = _a.isOpen, onClose = _a.onClose, leastDestructiveRef = _a.leastDestructiveRef, content = _a.content, title = _a.title, _b = _a.confirmButtonText, confirmButtonText = _b === void 0 ? "Yes" : _b, _c = _a.cancelButtonText, cancelButtonText = _c === void 0 ? "No" : _c, isConfirmLoading = _a.isConfirmLoading, onConfirm = _a.onConfirm, headerStyle = _a.headerStyle, bodyStyle = _a.bodyStyle, footerStyle = _a.footerStyle, closeButtonStyle = _a.closeButtonStyle, button1Style = _a.button1Style, button2Style = _a.button2Style, isCentered = _a.isCentered, key = _a.key;
|
|
10
|
+
return (react_2.default.createElement(react_1.AlertDialog, { motionPreset: "slideInBottom", leastDestructiveRef: leastDestructiveRef, onClose: onClose, isOpen: isOpen, isCentered: isCentered, key: key },
|
|
11
11
|
react_2.default.createElement(react_1.AlertDialogOverlay, null),
|
|
12
12
|
react_2.default.createElement(react_1.AlertDialogContent, null,
|
|
13
13
|
react_2.default.createElement(react_1.AlertDialogHeader, { sx: headerStyle }, title),
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { DropdownProps } from "./DropdownProps";
|
|
3
|
-
declare const Dropdown: ({ dropDownButtonStyle, ButtonText, options, handleOptionSelect, dropdownType, text, DropdownIcon, isVisibleIconShow, buttonProps, }: DropdownProps) => React.JSX.Element;
|
|
3
|
+
declare const Dropdown: ({ dropDownButtonStyle, ButtonText, options, handleOptionSelect, dropdownType, text, DropdownIcon, isVisibleIconShow, buttonProps, position, }: DropdownProps) => React.JSX.Element;
|
|
4
4
|
export default Dropdown;
|
|
@@ -40,7 +40,7 @@ var fi_1 = require("react-icons/fi");
|
|
|
40
40
|
var framer_motion_1 = require("framer-motion");
|
|
41
41
|
var MotionBox = (0, framer_motion_1.motion)(react_2.Box);
|
|
42
42
|
var Dropdown = function (_a) {
|
|
43
|
-
var dropDownButtonStyle = _a.dropDownButtonStyle, ButtonText = _a.ButtonText, options = _a.options, handleOptionSelect = _a.handleOptionSelect, _b = _a.dropdownType, dropdownType = _b === void 0 ? "button" : _b, text = _a.text, DropdownIcon = _a.DropdownIcon, _c = _a.isVisibleIconShow, isVisibleIconShow = _c === void 0 ? true : _c, buttonProps = _a.buttonProps;
|
|
43
|
+
var dropDownButtonStyle = _a.dropDownButtonStyle, ButtonText = _a.ButtonText, options = _a.options, handleOptionSelect = _a.handleOptionSelect, _b = _a.dropdownType, dropdownType = _b === void 0 ? "button" : _b, text = _a.text, DropdownIcon = _a.DropdownIcon, _c = _a.isVisibleIconShow, isVisibleIconShow = _c === void 0 ? true : _c, buttonProps = _a.buttonProps, position = _a.position;
|
|
44
44
|
var _d = (0, react_2.useDisclosure)(), isOpen = _d.isOpen, onToggle = _d.onToggle, onClose = _d.onClose;
|
|
45
45
|
var dropdownRef = (0, react_1.useRef)(null);
|
|
46
46
|
var handleListItemClick = function (optionId, optionLabel) {
|
|
@@ -79,6 +79,6 @@ var Dropdown = function (_a) {
|
|
|
79
79
|
};
|
|
80
80
|
return (react_1.default.createElement(react_2.Box, { ref: dropdownRef, position: "relative", display: "inline-block", width: "100%" },
|
|
81
81
|
dropDownToggleOption(),
|
|
82
|
-
isOpen && (react_1.default.createElement(MotionBox, { position: "absolute", zIndex: 5, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 } }, DropdownContentRender()))));
|
|
82
|
+
isOpen && (react_1.default.createElement(MotionBox, { position: "absolute", zIndex: 5, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, style: position }, DropdownContentRender()))));
|
|
83
83
|
};
|
|
84
84
|
exports.default = Dropdown;
|
|
@@ -10,6 +10,12 @@ export type DropdownProps = {
|
|
|
10
10
|
dropDownButtonStyle?: React.CSSProperties;
|
|
11
11
|
isVisibleIconShow?: boolean;
|
|
12
12
|
buttonProps?: ButtonProps;
|
|
13
|
+
position?: {
|
|
14
|
+
top?: string;
|
|
15
|
+
bottom?: string;
|
|
16
|
+
left?: string;
|
|
17
|
+
right?: string;
|
|
18
|
+
};
|
|
13
19
|
};
|
|
14
20
|
type Option = {
|
|
15
21
|
id: string | number;
|
package/dist/Layout.js
CHANGED
|
@@ -73,7 +73,7 @@ var DatePicker_1 = __importDefault(require("./Components/DatePicker/DatePicker")
|
|
|
73
73
|
var Search_1 = __importDefault(require("./Components/Search/Search"));
|
|
74
74
|
var Timeline_1 = __importDefault(require("./Components/Timeline/Timeline"));
|
|
75
75
|
var SelectSearch_1 = __importDefault(require("./Components/SelectSearch/SelectSearch"));
|
|
76
|
-
var Accordion_1 = require("./Components/Accordion/Accordion");
|
|
76
|
+
var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
|
|
77
77
|
var fa_1 = require("react-icons/fa");
|
|
78
78
|
var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
|
|
79
79
|
var Layout = function () {
|
|
@@ -617,7 +617,7 @@ var Layout = function () {
|
|
|
617
617
|
react_2.default.createElement("br", null),
|
|
618
618
|
react_2.default.createElement("br", null),
|
|
619
619
|
react_2.default.createElement(react_1.Text, null, "Accordion"),
|
|
620
|
-
react_2.default.createElement(Accordion_1.
|
|
620
|
+
react_2.default.createElement(Accordion_1.default, { allowToggle: true, items: [
|
|
621
621
|
{
|
|
622
622
|
header: (react_2.default.createElement(react_2.default.Fragment, null,
|
|
623
623
|
react_2.default.createElement(react_1.Box, { as: "span", flex: "1", textAlign: "left" }, "Section 1 title"),
|
package/dist/index.d.ts
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import Accordian from "./Components/Accordion/Accordion";
|
|
2
|
+
import AlertDialog from "./Components/AlertDialog/AlertDialog";
|
|
1
3
|
import ApexBarChart from "./Components/Apexcharts/ApexBarChart/ApexBarChart";
|
|
2
4
|
import ApexPieChart from "./Components/Apexcharts/ApexPieChart/ApexPieChart";
|
|
3
5
|
import Breadcrumbs from "./Components/Breadcrumbs/Breadcrumbs";
|
|
@@ -33,4 +35,4 @@ import Timeline from "./Components/Timeline/Timeline";
|
|
|
33
35
|
import Toaster, { useToaster } from "./Components/Toaster/Toaster";
|
|
34
36
|
import ToolTip from "./Components/ToolTip/ToolTip";
|
|
35
37
|
import VerifyEmailOtp from "./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp";
|
|
36
|
-
export { ApexBarChart, ApexPieChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, DatePicker, Drawer, Dropdown, Editor, InputTextArea, Loading, Modal, NavigationBar, NoteTextArea, MultiSelect, NumberInput, PinInput, ProfileCard, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Search, Select, SelectSearch, SideBar, Skeletons, Switch, Table, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, };
|
|
38
|
+
export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, DatePicker, Drawer, Dropdown, Editor, InputTextArea, Loading, Modal, NavigationBar, NoteTextArea, MultiSelect, NumberInput, PinInput, ProfileCard, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Search, Select, SelectSearch, SideBar, Skeletons, Switch, Table, TextInput, Timeline, Toaster, ToolTip, useToaster, VerifyEmailOtp, };
|
package/dist/index.js
CHANGED
|
@@ -27,7 +27,11 @@ 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.VerifyEmailOtp = exports.useToaster = 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.ProfileCard = exports.PinInput = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.NavigationBar = exports.Modal = exports.Loading = exports.InputTextArea = exports.Editor = exports.Dropdown = exports.Drawer = exports.DatePicker = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexPieChart = exports.ApexBarChart = void 0;
|
|
30
|
+
exports.VerifyEmailOtp = exports.useToaster = 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.ProfileCard = exports.PinInput = exports.NumberInput = exports.MultiSelect = exports.NoteTextArea = exports.NavigationBar = exports.Modal = exports.Loading = exports.InputTextArea = exports.Editor = exports.Dropdown = exports.Drawer = exports.DatePicker = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexPieChart = exports.ApexBarChart = exports.AlertDialog = exports.Accordian = void 0;
|
|
31
|
+
var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
|
|
32
|
+
exports.Accordian = Accordion_1.default;
|
|
33
|
+
var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
|
|
34
|
+
exports.AlertDialog = AlertDialog_1.default;
|
|
31
35
|
var ApexBarChart_1 = __importDefault(require("./Components/Apexcharts/ApexBarChart/ApexBarChart"));
|
|
32
36
|
exports.ApexBarChart = ApexBarChart_1.default;
|
|
33
37
|
var ApexPieChart_1 = __importDefault(require("./Components/Apexcharts/ApexPieChart/ApexPieChart"));
|