pixelize-design-library 1.0.33 → 1.0.35

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 CHANGED
@@ -28,14 +28,16 @@ PixelizeDesign Library Components Are Below
28
28
  - ApexPieChart,
29
29
  - Breadcrumbs,
30
30
  - Button,
31
- - Checkbox,
32
- - Card,
33
31
  - ButtonGroupIcon,
34
- - TextInput,
32
+ - Card,
33
+ - Checkbox,
34
+ - Dropdown,
35
+ - Editor,
35
36
  - InputTextArea,
36
37
  - Loading,
37
38
  - Modal,
38
39
  - NavigationBar,
40
+ - NoteTextArea,
39
41
  - NumberInput,
40
42
  - PinInput,
41
43
  - ProfileCard,
@@ -46,10 +48,10 @@ PixelizeDesign Library Components Are Below
46
48
  - Select,
47
49
  - SideBar,
48
50
  - Skeletons,
51
+ - Switch,
49
52
  - Table,
53
+ - TextInput,
50
54
  - Toaster,
51
55
  - useToaster,
52
56
  - ToolTip,
53
- - Switch,
54
- - NoteTextArea,
55
- - Dropdown,
57
+ - VerifyEmailOtp \* New
@@ -0,0 +1,3 @@
1
+ import React from "react";
2
+ import { EditorProps } from "./EditorProps";
3
+ export default function Editor({ value, config, editorRef, className, onChange, onBlur, }: EditorProps): React.JSX.Element;
@@ -0,0 +1,12 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var jodit_react_1 = __importDefault(require("jodit-react"));
8
+ function Editor(_a) {
9
+ var value = _a.value, config = _a.config, editorRef = _a.editorRef, className = _a.className, onChange = _a.onChange, onBlur = _a.onBlur;
10
+ return (react_1.default.createElement(jodit_react_1.default, { config: config, value: value, ref: editorRef, className: className, onChange: onChange, onBlur: onBlur }));
11
+ }
12
+ exports.default = Editor;
@@ -0,0 +1,5 @@
1
+ /// <reference types="react" />
2
+ import { IJoditEditorProps } from "jodit-react";
3
+ export type EditorProps = Pick<IJoditEditorProps, "value" | "config" | "className" | "onChange" | "onBlur"> & {
4
+ editorRef?: React.RefObject<any>;
5
+ };
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -0,0 +1,3 @@
1
+ import React from "react";
2
+ import { VerifyEmailOtpProps } from "./VerifyEmailOtpProps";
3
+ export default function VerifyEmailOtp({ resendMaill, onChange, onComplete, placeholder, pins, description, title, }: VerifyEmailOtpProps): React.JSX.Element;
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ var react_1 = __importDefault(require("react"));
7
+ var react_2 = require("@chakra-ui/react");
8
+ var lu_1 = require("react-icons/lu");
9
+ function VerifyEmailOtp(_a) {
10
+ var resendMaill = _a.resendMaill, onChange = _a.onChange, onComplete = _a.onComplete, _b = _a.placeholder, placeholder = _b === void 0 ? "" : _b, _c = _a.pins, pins = _c === void 0 ? 5 : _c, description = _a.description, title = _a.title;
11
+ return (react_1.default.createElement(react_2.Card, { style: {
12
+ display: "flex",
13
+ justifyContent: "center",
14
+ alignItems: "center",
15
+ width: "97%",
16
+ } },
17
+ react_1.default.createElement("div", { style: { padding: "3%" } },
18
+ react_1.default.createElement(lu_1.LuMailCheck, { size: "100", color: "#3182ce" })),
19
+ react_1.default.createElement("h1", { style: { fontSize: "2rem", fontWeight: "bold", marginBottom: "2%" } }, title),
20
+ react_1.default.createElement("p", { style: { textAlign: "center", marginBottom: "2%" } },
21
+ description,
22
+ react_1.default.createElement("br", null),
23
+ " your new Pixel Account"),
24
+ react_1.default.createElement("div", { style: { marginBottom: "2%" } },
25
+ react_1.default.createElement(react_2.HStack, null,
26
+ react_1.default.createElement(react_2.PinInput, { placeholder: placeholder, onChange: onChange, onComplete: onComplete }, Array.from({ length: pins }).map(function (_, index) { return (react_1.default.createElement(react_2.PinInputField, { key: index })); })))),
27
+ react_1.default.createElement("p", { style: { textAlign: "center", marginBottom: "2%" } },
28
+ "Didn't receive the code?",
29
+ " ",
30
+ react_1.default.createElement("button", { onClick: function () { return resendMaill(); }, style: {
31
+ background: "none",
32
+ color: "#3182ce",
33
+ border: "none",
34
+ padding: "0",
35
+ font: "inherit",
36
+ cursor: "pointer",
37
+ outline: "inherit",
38
+ } }, "Resend Code"))));
39
+ }
40
+ exports.default = VerifyEmailOtp;
@@ -0,0 +1,9 @@
1
+ export type VerifyEmailOtpProps = {
2
+ resendMaill: () => void;
3
+ onChange: (value: string) => void;
4
+ onComplete: (value: string) => void;
5
+ placeholder?: string;
6
+ pins: number;
7
+ title: string;
8
+ description: string;
9
+ };
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
package/dist/Layout.js CHANGED
@@ -65,6 +65,8 @@ var Switch_1 = __importDefault(require("./Components/Switch/Switch"));
65
65
  var Card_1 = __importDefault(require("./Components/Card/Card"));
66
66
  var NoteTextArea_1 = __importDefault(require("./Components/NoteTextArea/NoteTextArea"));
67
67
  var DropDown_1 = __importDefault(require("./Components/Dropdown/DropDown"));
68
+ var Editor_1 = __importDefault(require("./Components/Editor/Editor"));
69
+ var VerifyEmailOtp_1 = __importDefault(require("./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp"));
68
70
  var Layout = function () {
69
71
  var navmenus = [
70
72
  { title: "Account Settings", url: "myaccount" },
@@ -394,6 +396,18 @@ var Layout = function () {
394
396
  react_2.default.createElement("br", null),
395
397
  react_2.default.createElement(DropDown_1.default, { ButtonText: "Vibility", options: exportOptionss, handleOptionSelect: function (id) {
396
398
  console.log("optionid", id);
397
- } }))))));
399
+ } }),
400
+ react_2.default.createElement("br", null),
401
+ react_2.default.createElement(Editor_1.default, { value: "heeeeejhbjhvbjhvbhj jbhkjhbiubviu iuhiuhiuhiu", config: { readonly: false, width: "900px" }, onChange: function (val) {
402
+ console.log(val);
403
+ } }),
404
+ react_2.default.createElement("br", null),
405
+ react_2.default.createElement(VerifyEmailOtp_1.default, { resendMaill: function () {
406
+ console.log("hello");
407
+ }, onChange: function (val) {
408
+ console.log("onchange", val);
409
+ }, onComplete: function (val) {
410
+ console.log("onComplete", val);
411
+ }, pins: 6, title: "Please Verify Account", description: "Enter the six digit code we sent to your email address to verify" }))))));
398
412
  };
399
413
  exports.default = Layout;
package/dist/index.d.ts CHANGED
@@ -3,15 +3,16 @@ import ApexPieChart from "./Components/Apexcharts/ApexPieChart/ApexPieChart";
3
3
  import Breadcrumbs from "./Components/Breadcrumbs/Breadcrumbs";
4
4
  import Button from "./Components/Button/Button";
5
5
  import ButtonGroupIcon from "./Components/ButtonGroupIcon/ButtonGroupIcon";
6
+ import Card from "./Components/Card/Card";
6
7
  import Checkbox from "./Components/Checkbox/Checkbox";
7
8
  import Dropdown from "./Components/Dropdown/DropDown";
8
- import TextInput from "./Components/Input/TextInput";
9
+ import Editor from "./Components/Editor/Editor";
9
10
  import InputTextArea from "./Components/InputTextArea/InputTextArea";
10
11
  import Loading from "./Components/Loading/Loading";
11
12
  import Modal from "./Components/Modal/Modal";
12
13
  import NavigationBar from "./Components/NavigationBar/NavigationBar";
13
- import NumberInput from "./Components/NumberInput/NumberInput";
14
14
  import NoteTextArea from "./Components/NoteTextArea/NoteTextArea";
15
+ import NumberInput from "./Components/NumberInput/NumberInput";
15
16
  import PinInput from "./Components/PinInput/PinInput";
16
17
  import ProfileCard from "./Components/ProfileCard/ProfileCard";
17
18
  import ProfilePhotoViewer from "./Components/ProfilePhotoViewer/ProfilePhotoViewer";
@@ -22,6 +23,8 @@ import SideBar from "./Components/SideBar/SideBar";
22
23
  import Skeletons from "./Components/Skeletons/Skeletons";
23
24
  import Switch from "./Components/Switch/Switch";
24
25
  import Table from "./Components/Table/Table";
26
+ import TextInput from "./Components/Input/TextInput";
25
27
  import Toaster, { useToaster } from "./Components/Toaster/Toaster";
26
28
  import ToolTip from "./Components/ToolTip/ToolTip";
27
- export { ApexBarChart, ApexPieChart, Breadcrumbs, Button, Checkbox, ButtonGroupIcon, TextInput, InputTextArea, Loading, Modal, NavigationBar, NumberInput, PinInput, ProfileCard, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Select, SideBar, Skeletons, Table, Toaster, ToolTip, useToaster, Switch, NoteTextArea, Dropdown, };
29
+ import VerifyEmailOtp from "./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp";
30
+ export { ApexBarChart, ApexPieChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, Dropdown, Editor, InputTextArea, Loading, Modal, NavigationBar, NoteTextArea, NumberInput, PinInput, ProfileCard, ProfilePhotoViewer, ProgressBar, RadioButton, RadioButtonGroup, Select, SideBar, Skeletons, Switch, Table, TextInput, Toaster, ToolTip, useToaster, VerifyEmailOtp, };
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.Dropdown = exports.NoteTextArea = exports.Switch = exports.useToaster = exports.ToolTip = exports.Toaster = exports.Table = exports.Skeletons = exports.SideBar = exports.Select = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCard = exports.PinInput = exports.NumberInput = exports.NavigationBar = exports.Modal = exports.Loading = exports.InputTextArea = exports.TextInput = exports.ButtonGroupIcon = exports.Checkbox = exports.Button = exports.Breadcrumbs = exports.ApexPieChart = exports.ApexBarChart = void 0;
30
+ exports.VerifyEmailOtp = exports.useToaster = exports.ToolTip = exports.Toaster = exports.TextInput = exports.Table = exports.Switch = exports.Skeletons = exports.SideBar = exports.Select = exports.RadioButtonGroup = exports.RadioButton = exports.ProgressBar = exports.ProfilePhotoViewer = exports.ProfileCard = exports.PinInput = exports.NumberInput = exports.NoteTextArea = exports.NavigationBar = exports.Modal = exports.Loading = exports.InputTextArea = exports.Editor = exports.Dropdown = exports.Checkbox = exports.Card = exports.ButtonGroupIcon = exports.Button = exports.Breadcrumbs = exports.ApexPieChart = exports.ApexBarChart = void 0;
31
31
  var ApexBarChart_1 = __importDefault(require("./Components/Apexcharts/ApexBarChart/ApexBarChart"));
32
32
  exports.ApexBarChart = ApexBarChart_1.default;
33
33
  var ApexPieChart_1 = __importDefault(require("./Components/Apexcharts/ApexPieChart/ApexPieChart"));
@@ -38,12 +38,14 @@ var Button_1 = __importDefault(require("./Components/Button/Button"));
38
38
  exports.Button = Button_1.default;
39
39
  var ButtonGroupIcon_1 = __importDefault(require("./Components/ButtonGroupIcon/ButtonGroupIcon"));
40
40
  exports.ButtonGroupIcon = ButtonGroupIcon_1.default;
41
+ var Card_1 = __importDefault(require("./Components/Card/Card"));
42
+ exports.Card = Card_1.default;
41
43
  var Checkbox_1 = __importDefault(require("./Components/Checkbox/Checkbox"));
42
44
  exports.Checkbox = Checkbox_1.default;
43
45
  var DropDown_1 = __importDefault(require("./Components/Dropdown/DropDown"));
44
46
  exports.Dropdown = DropDown_1.default;
45
- var TextInput_1 = __importDefault(require("./Components/Input/TextInput"));
46
- exports.TextInput = TextInput_1.default;
47
+ var Editor_1 = __importDefault(require("./Components/Editor/Editor"));
48
+ exports.Editor = Editor_1.default;
47
49
  var InputTextArea_1 = __importDefault(require("./Components/InputTextArea/InputTextArea"));
48
50
  exports.InputTextArea = InputTextArea_1.default;
49
51
  var Loading_1 = __importDefault(require("./Components/Loading/Loading"));
@@ -52,10 +54,10 @@ var Modal_1 = __importDefault(require("./Components/Modal/Modal"));
52
54
  exports.Modal = Modal_1.default;
53
55
  var NavigationBar_1 = __importDefault(require("./Components/NavigationBar/NavigationBar"));
54
56
  exports.NavigationBar = NavigationBar_1.default;
55
- var NumberInput_1 = __importDefault(require("./Components/NumberInput/NumberInput"));
56
- exports.NumberInput = NumberInput_1.default;
57
57
  var NoteTextArea_1 = __importDefault(require("./Components/NoteTextArea/NoteTextArea"));
58
58
  exports.NoteTextArea = NoteTextArea_1.default;
59
+ var NumberInput_1 = __importDefault(require("./Components/NumberInput/NumberInput"));
60
+ exports.NumberInput = NumberInput_1.default;
59
61
  var PinInput_1 = __importDefault(require("./Components/PinInput/PinInput"));
60
62
  exports.PinInput = PinInput_1.default;
61
63
  var ProfileCard_1 = __importDefault(require("./Components/ProfileCard/ProfileCard"));
@@ -77,8 +79,12 @@ var Switch_1 = __importDefault(require("./Components/Switch/Switch"));
77
79
  exports.Switch = Switch_1.default;
78
80
  var Table_1 = __importDefault(require("./Components/Table/Table"));
79
81
  exports.Table = Table_1.default;
82
+ var TextInput_1 = __importDefault(require("./Components/Input/TextInput"));
83
+ exports.TextInput = TextInput_1.default;
80
84
  var Toaster_1 = __importStar(require("./Components/Toaster/Toaster"));
81
85
  exports.Toaster = Toaster_1.default;
82
86
  Object.defineProperty(exports, "useToaster", { enumerable: true, get: function () { return Toaster_1.useToaster; } });
83
87
  var ToolTip_1 = __importDefault(require("./Components/ToolTip/ToolTip"));
84
88
  exports.ToolTip = ToolTip_1.default;
89
+ var VerifyEmailOtp_1 = __importDefault(require("./Components/EmailCards/VerifyEmailOtp/VerifyEmailOtp"));
90
+ exports.VerifyEmailOtp = VerifyEmailOtp_1.default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "1.0.33",
3
+ "version": "1.0.35",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -20,6 +20,7 @@
20
20
  "@types/react-dom": "^18.3.0",
21
21
  "apexcharts": "^3.49.1",
22
22
  "framer-motion": "^11.2.2",
23
+ "jodit-react": "^4.1.2",
23
24
  "react": "^18.3.1",
24
25
  "react-apexcharts": "^1.4.1",
25
26
  "react-dom": "^18.3.1",