pixelize-design-library 2.3.1-beta.16 → 2.3.1-beta.18

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.
@@ -39,7 +39,9 @@
39
39
  "Bash(./node_modules/.bin/tsc --noEmit --skipLibCheck)",
40
40
  "Bash(./node_modules/.bin/tsc --noEmit)",
41
41
  "Bash(echo \"tsc exit: $?\")",
42
- "Bash(echo \"local tsc exit: $?\")"
42
+ "Bash(echo \"local tsc exit: $?\")",
43
+ "Bash(ls -la src/pages/Tasks/TaskComponent/)",
44
+ "Bash(wc -l src/pages/Tasks/TaskComponent/*.tsx)"
43
45
  ],
44
46
  "additionalDirectories": [
45
47
  "/private/tmp",
@@ -50,58 +50,110 @@ var framer_motion_1 = require("framer-motion");
50
50
  var useCustomTheme_1 = require("../../Theme/useCustomTheme");
51
51
  var lucide_react_1 = require("lucide-react");
52
52
  var MotionBox = (0, framer_motion_1.motion)((0, react_1.forwardRef)(function (props, ref) { return (react_1.default.createElement(react_2.Box, __assign({ ref: ref }, props))); }));
53
+ // Size scale (mirrors the Button sizes). `btn` is the Chakra Button size.
54
+ var SIZE_MAP = {
55
+ xs: { btn: "xs", fontSize: "0.75rem", py: 1, px: 2.5, img: "1rem", chevron: 13, minW: "8rem", gap: 1.5 },
56
+ sm: { btn: "sm", fontSize: "0.8125rem", py: 1.5, px: 3, img: "1.05rem", chevron: 14, minW: "9rem", gap: 2 },
57
+ md: { btn: "md", fontSize: "0.875rem", py: 2, px: 3, img: "1.15rem", chevron: 16, minW: "11rem", gap: 2 },
58
+ lg: { btn: "lg", fontSize: "0.9375rem", py: 2.5, px: 3.5, img: "1.25rem", chevron: 18, minW: "12rem", gap: 2.5 },
59
+ xl: { btn: "lg", fontSize: "1.0625rem", py: 3, px: 4, img: "1.4rem", chevron: 20, minW: "13rem", gap: 3 },
60
+ };
53
61
  var Dropdown = (0, react_1.forwardRef)(function (_a, ref) {
54
- 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, headStyle = _a.headStyle, ListStyle = _a.ListStyle, ItemStyle = _a.ItemStyle, LabelStyle = _a.LabelStyle, ImageStyle = _a.ImageStyle, _d = _a.optionsSize, optionsSize = _d === void 0 ? "lg" : _d, _e = _a.divider, divider = _e === void 0 ? false : _e;
62
+ var _b, _c;
63
+ var dropDownButtonStyle = _a.dropDownButtonStyle, ButtonText = _a.ButtonText, options = _a.options, handleOptionSelect = _a.handleOptionSelect, _d = _a.dropdownType, dropdownType = _d === void 0 ? "button" : _d, text = _a.text, DropdownIcon = _a.DropdownIcon, _e = _a.isVisibleIconShow, isVisibleIconShow = _e === void 0 ? true : _e, buttonProps = _a.buttonProps, headStyle = _a.headStyle, ListStyle = _a.ListStyle, ItemStyle = _a.ItemStyle, LabelStyle = _a.LabelStyle, ImageStyle = _a.ImageStyle, size = _a.size, optionsSize = _a.optionsSize, _f = _a.divider, divider = _f === void 0 ? false : _f;
55
64
  var theme = (0, useCustomTheme_1.useCustomTheme)();
56
- var _f = (0, react_2.useDisclosure)(), isOpen = _f.isOpen, onToggle = _f.onToggle, onClose = _f.onClose;
65
+ var _g = (0, react_2.useDisclosure)(), isOpen = _g.isOpen, onToggle = _g.onToggle, onClose = _g.onClose;
57
66
  var dropdownRef = (0, react_1.useRef)(null);
67
+ var menuRef = (0, react_1.useRef)(null);
68
+ var _h = (0, react_1.useState)({ top: 0, left: 0, width: 0 }), menuPos = _h[0], setMenuPos = _h[1];
69
+ var s = (_c = SIZE_MAP[(_b = size !== null && size !== void 0 ? size : optionsSize) !== null && _b !== void 0 ? _b : "md"]) !== null && _c !== void 0 ? _c : SIZE_MAP.md;
58
70
  var handleListItemClick = function (optionId, optionLabel) {
59
71
  onClose();
60
72
  handleOptionSelect(optionId, optionLabel);
61
73
  };
74
+ // The menu is portaled to <body> (so it sits above everything). Anchor it to
75
+ // the trigger and keep it anchored while the page/ancestors scroll or resize.
76
+ var updateMenuPos = (0, react_1.useCallback)(function () {
77
+ if (!dropdownRef.current)
78
+ return;
79
+ var r = dropdownRef.current.getBoundingClientRect();
80
+ setMenuPos({ top: r.bottom, left: r.left, width: r.width });
81
+ }, []);
82
+ (0, react_1.useEffect)(function () {
83
+ if (!isOpen)
84
+ return;
85
+ updateMenuPos();
86
+ window.addEventListener("scroll", updateMenuPos, true);
87
+ window.addEventListener("resize", updateMenuPos);
88
+ return function () {
89
+ window.removeEventListener("scroll", updateMenuPos, true);
90
+ window.removeEventListener("resize", updateMenuPos);
91
+ };
92
+ }, [isOpen, updateMenuPos]);
62
93
  (0, react_1.useEffect)(function () {
63
94
  var handleClickOutside = function (event) {
64
- if (dropdownRef.current &&
65
- !dropdownRef.current.contains(event.target)) {
66
- onClose();
67
- }
95
+ var _a, _b;
96
+ var target = event.target;
97
+ // Ignore clicks on the trigger or inside the (portaled) menu.
98
+ if ((_a = dropdownRef.current) === null || _a === void 0 ? void 0 : _a.contains(target))
99
+ return;
100
+ if ((_b = menuRef.current) === null || _b === void 0 ? void 0 : _b.contains(target))
101
+ return;
102
+ onClose();
68
103
  };
69
104
  document.addEventListener("mousedown", handleClickOutside);
70
105
  return function () {
71
106
  document.removeEventListener("mousedown", handleClickOutside);
72
107
  };
73
- }, [dropdownRef, onClose]);
108
+ }, [onClose]);
109
+ var setMenuRef = function (node) {
110
+ menuRef.current = node;
111
+ if (typeof ref === "function")
112
+ ref(node);
113
+ else if (ref)
114
+ ref.current = node;
115
+ };
116
+ var Chevron = isVisibleIconShow ? (react_1.default.createElement(react_2.Box, { as: "span", display: "inline-flex", transition: "transform 0.2s ease", transform: isOpen ? "rotate(180deg)" : "rotate(0deg)" },
117
+ react_1.default.createElement(lucide_react_1.ChevronDown, { size: s.chevron }))) : undefined;
74
118
  var dropDownToggleOption = function () {
75
- var ButtonToggle = (react_1.default.createElement(react_2.Button, __assign({ onClick: onToggle, style: __assign({ backgroundColor: theme.colors.primary[500] }, dropDownButtonStyle), rightIcon: isVisibleIconShow ? (react_1.default.createElement(react_2.Icon, { as: lucide_react_1.ChevronDown, transform: isOpen ? "rotate(180deg)" : "rotate(0deg)" })) : undefined }, buttonProps),
76
- DropdownIcon,
77
- " \u00A0 ",
78
- ButtonText));
79
- var TextToggle = (react_1.default.createElement(react_2.Flex, { onClick: onToggle, align: "center", style: dropDownButtonStyle, cursor: "pointer" },
119
+ var _a, _b, _c, _d;
120
+ var ButtonToggle = (react_1.default.createElement(react_2.Button, __assign({ onClick: onToggle, size: s.btn, colorScheme: "primary", borderRadius: "0.5rem", fontWeight: 600, "aria-haspopup": "menu", "aria-expanded": isOpen, rightIcon: Chevron, sx: __assign({ transition: "all 0.15s ease" }, dropDownButtonStyle) }, buttonProps),
121
+ react_1.default.createElement(react_2.Box, { as: "span", display: "inline-flex", alignItems: "center", gap: DropdownIcon && ButtonText ? s.gap : 0 },
122
+ DropdownIcon,
123
+ ButtonText)));
124
+ var TextToggle = (react_1.default.createElement(react_2.Flex, { onClick: onToggle, align: "center", gap: 1.5, cursor: "pointer", fontSize: s.fontSize, fontWeight: 500, color: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.text) === null || _b === void 0 ? void 0 : _b[700], transition: "color 0.15s ease", _hover: { color: (_d = (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.primary) === null || _d === void 0 ? void 0 : _d[600] }, style: dropDownButtonStyle, role: "button", "aria-haspopup": "menu", "aria-expanded": isOpen },
80
125
  DropdownIcon,
81
- " ",
82
126
  text,
83
- isVisibleIconShow && react_1.default.createElement(react_2.Icon, { as: lucide_react_1.ChevronDown })));
127
+ Chevron));
84
128
  return dropdownType === "button" ? ButtonToggle : TextToggle;
85
129
  };
86
130
  var DropdownContentRender = function () {
87
- var _a, _b, _c;
88
- return (react_1.default.createElement(react_2.List, { bg: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.backgroundColor) === null || _b === void 0 ? void 0 : _b.light, border: "1px solid ".concat((_c = theme.colors) === null || _c === void 0 ? void 0 : _c.gray[300]), borderRadius: theme.radii.md, shadow: theme.shadows.lg, py: 2, mt: "0.2rem", minWidth: "200px", style: ListStyle }, options.map(function (option) {
89
- var _a;
90
- return (react_1.default.createElement(react_2.ListItem, { key: option.id, onClick: function () { return handleListItemClick(option.id, option.label); }, p: optionsSize === "sm" ? 1 : 2, px: 2, _hover: {
91
- bg: theme.colors.gray[100],
92
- color: theme.colors.primary[500],
93
- }, display: "flex", alignItems: "center", cursor: "pointer", style: ItemStyle, borderBottom: divider ? "1px solid ".concat((_a = theme.colors) === null || _a === void 0 ? void 0 : _a.gray[300]) : undefined, sx: {
94
- "&:last-child": {
95
- borderBottom: "none",
96
- },
97
- } },
98
- (option === null || option === void 0 ? void 0 : option.image) && (react_1.default.createElement(react_2.Icon, { as: option.image, boxSize: optionsSize === "sm" ? "1.1rem" : "1.5rem", mr: 2, style: ImageStyle })),
99
- react_1.default.createElement(react_2.Box, { as: "span", fontSize: optionsSize === "sm" ? "14px" : "16px", isTruncated: true, style: LabelStyle }, option.label)));
131
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
132
+ return (react_1.default.createElement(react_2.List, { bg: (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.white) !== null && _b !== void 0 ? _b : "#fff", border: "0.063rem solid ".concat((_e = (_d = (_c = theme.colors) === null || _c === void 0 ? void 0 : _c.boxborder) === null || _d === void 0 ? void 0 : _d[200]) !== null && _e !== void 0 ? _e : (_f = theme.colors) === null || _f === void 0 ? void 0 : _f.gray[200]), borderRadius: "0.625rem", boxShadow: (_g = theme.shadows) === null || _g === void 0 ? void 0 : _g.lg, py: 1.5, mt: "0.375rem", minWidth: s.minW, maxH: "18rem", overflowY: "auto", overflowX: "hidden", sx: {
133
+ scrollbarWidth: "thin",
134
+ scrollbarColor: "".concat((_j = (_h = theme.colors) === null || _h === void 0 ? void 0 : _h.gray) === null || _j === void 0 ? void 0 : _j[300], " transparent"),
135
+ "&::-webkit-scrollbar": { width: "6px" },
136
+ "&::-webkit-scrollbar-thumb": {
137
+ background: (_l = (_k = theme.colors) === null || _k === void 0 ? void 0 : _k.gray) === null || _l === void 0 ? void 0 : _l[300],
138
+ borderRadius: "3px",
139
+ },
140
+ "&::-webkit-scrollbar-thumb:hover": { background: (_o = (_m = theme.colors) === null || _m === void 0 ? void 0 : _m.gray) === null || _o === void 0 ? void 0 : _o[400] },
141
+ }, style: ListStyle }, options.map(function (option) {
142
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
143
+ return (react_1.default.createElement(react_2.ListItem, { key: option.id, onClick: function () { return handleListItemClick(option.id, option.label); }, mx: 1.5, px: s.px, py: s.py, borderRadius: "0.375rem", display: "flex", alignItems: "center", gap: 2, cursor: "pointer", color: (_c = (_b = (_a = theme.colors) === null || _a === void 0 ? void 0 : _a.text) === null || _b === void 0 ? void 0 : _b[700]) !== null && _c !== void 0 ? _c : (_e = (_d = theme.colors) === null || _d === void 0 ? void 0 : _d.gray) === null || _e === void 0 ? void 0 : _e[700], transition: "background 0.12s ease, color 0.12s ease", _hover: {
144
+ bg: (_j = (_h = (_g = (_f = theme.colors) === null || _f === void 0 ? void 0 : _f.primary) === null || _g === void 0 ? void 0 : _g.opacity) === null || _h === void 0 ? void 0 : _h[8]) !== null && _j !== void 0 ? _j : (_k = theme.colors) === null || _k === void 0 ? void 0 : _k.gray[100],
145
+ color: (_o = (_m = (_l = theme.colors) === null || _l === void 0 ? void 0 : _l.primary) === null || _m === void 0 ? void 0 : _m[700]) !== null && _o !== void 0 ? _o : (_q = (_p = theme.colors) === null || _p === void 0 ? void 0 : _p.primary) === null || _q === void 0 ? void 0 : _q[600],
146
+ }, borderBottom: divider
147
+ ? "0.063rem solid ".concat((_t = (_s = (_r = theme.colors) === null || _r === void 0 ? void 0 : _r.boxborder) === null || _s === void 0 ? void 0 : _s[100]) !== null && _t !== void 0 ? _t : (_u = theme.colors) === null || _u === void 0 ? void 0 : _u.gray[200])
148
+ : undefined, sx: { "&:last-child": { borderBottom: "none" } }, style: ItemStyle },
149
+ (option === null || option === void 0 ? void 0 : option.image) && (react_1.default.createElement(react_2.Box, { as: option.image, boxSize: s.img, flexShrink: 0, color: (_w = (_v = theme.colors) === null || _v === void 0 ? void 0 : _v.gray) === null || _w === void 0 ? void 0 : _w[500], style: ImageStyle })),
150
+ react_1.default.createElement(react_2.Box, { as: "span", fontSize: s.fontSize, isTruncated: true, style: LabelStyle }, option.label)));
100
151
  })));
101
152
  };
102
153
  return (react_1.default.createElement(react_2.Box, { ref: dropdownRef, position: "relative", display: "inline-block" },
103
154
  dropDownToggleOption(),
104
- isOpen && (react_1.default.createElement(MotionBox, { ref: ref, position: "absolute", zIndex: 5, initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, style: headStyle }, DropdownContentRender()))));
155
+ isOpen && (react_1.default.createElement(react_2.Portal, null,
156
+ react_1.default.createElement(MotionBox, { ref: setMenuRef, position: "fixed", top: "".concat(menuPos.top, "px"), left: "".concat(menuPos.left, "px"), minW: "".concat(menuPos.width, "px"), zIndex: 1500, initial: { opacity: 0, y: -6 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -6 }, style: headStyle }, DropdownContentRender())))));
105
157
  });
106
158
  Dropdown.displayName = "Dropdown";
107
159
  exports.default = Dropdown;
@@ -14,7 +14,10 @@ export type DropdownProps = {
14
14
  ItemStyle?: React.CSSProperties;
15
15
  LabelStyle?: React.CSSProperties;
16
16
  ImageStyle?: React.CSSProperties;
17
- optionsSize?: "sm" | "md";
17
+ /** Overall size of the trigger + options (like Button sizes). */
18
+ size?: "xs" | "sm" | "md" | "lg" | "xl";
19
+ /** @deprecated Use `size` instead. Kept for backward compatibility. */
20
+ optionsSize?: "sm" | "md" | "lg";
18
21
  divider?: boolean;
19
22
  };
20
23
  type Option = {
@@ -0,0 +1,4 @@
1
+ import React from "react";
2
+ import { CreateOrgModalProps } from "./OrganizationDetailsProps";
3
+ declare const CreateOrgModal: React.FC<CreateOrgModalProps>;
4
+ export default CreateOrgModal;
@@ -0,0 +1,122 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
14
+ if (k2 === undefined) k2 = k;
15
+ var desc = Object.getOwnPropertyDescriptor(m, k);
16
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
17
+ desc = { enumerable: true, get: function() { return m[k]; } };
18
+ }
19
+ Object.defineProperty(o, k2, desc);
20
+ }) : (function(o, m, k, k2) {
21
+ if (k2 === undefined) k2 = k;
22
+ o[k2] = m[k];
23
+ }));
24
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
25
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
26
+ }) : function(o, v) {
27
+ o["default"] = v;
28
+ });
29
+ var __importStar = (this && this.__importStar) || (function () {
30
+ var ownKeys = function(o) {
31
+ ownKeys = Object.getOwnPropertyNames || function (o) {
32
+ var ar = [];
33
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
34
+ return ar;
35
+ };
36
+ return ownKeys(o);
37
+ };
38
+ return function (mod) {
39
+ if (mod && mod.__esModule) return mod;
40
+ var result = {};
41
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
42
+ __setModuleDefault(result, mod);
43
+ return result;
44
+ };
45
+ })();
46
+ var __importDefault = (this && this.__importDefault) || function (mod) {
47
+ return (mod && mod.__esModule) ? mod : { "default": mod };
48
+ };
49
+ Object.defineProperty(exports, "__esModule", { value: true });
50
+ var react_1 = __importStar(require("react"));
51
+ var react_2 = require("@chakra-ui/react");
52
+ var useCustomTheme_1 = require("../../Theme/useCustomTheme");
53
+ var Button_1 = __importDefault(require("../Button/Button"));
54
+ var TextInput_1 = __importDefault(require("../Input/TextInput"));
55
+ var EMPTY = {
56
+ company_name: "",
57
+ company_address: "",
58
+ phone: "",
59
+ };
60
+ var CreateOrgModal = function (_a) {
61
+ var _b, _c, _d;
62
+ var isOpen = _a.isOpen, onClose = _a.onClose, isLoading = _a.isLoading, onSubmit = _a.onSubmit, labels = _a.labels;
63
+ var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
64
+ var _e = (0, react_1.useState)(EMPTY), values = _e[0], setValues = _e[1];
65
+ var _f = (0, react_1.useState)({}), errors = _f[0], setErrors = _f[1];
66
+ (0, react_1.useEffect)(function () {
67
+ if (isOpen) {
68
+ setValues(EMPTY);
69
+ setErrors({});
70
+ }
71
+ }, [isOpen]);
72
+ var setField = function (key, value) {
73
+ setValues(function (prev) {
74
+ var _a;
75
+ return (__assign(__assign({}, prev), (_a = {}, _a[key] = value, _a)));
76
+ });
77
+ if (errors[key])
78
+ setErrors(function (prev) {
79
+ var _a;
80
+ return (__assign(__assign({}, prev), (_a = {}, _a[key] = undefined, _a)));
81
+ });
82
+ };
83
+ var validate = function () {
84
+ var next = {};
85
+ if (!values.company_name.trim())
86
+ next.company_name = labels.requiredField;
87
+ if (!values.company_address.trim())
88
+ next.company_address = labels.requiredField;
89
+ var digits = values.phone.replace(/\D/g, "");
90
+ if (!values.phone.trim()) {
91
+ next.phone = labels.requiredField;
92
+ }
93
+ else if (digits.length < 8) {
94
+ next.phone = labels.invalidPhone;
95
+ }
96
+ setErrors(next);
97
+ return Object.keys(next).length === 0;
98
+ };
99
+ var handleSubmit = function () {
100
+ if (!validate())
101
+ return;
102
+ onSubmit({
103
+ company_name: values.company_name.trim(),
104
+ company_address: values.company_address.trim(),
105
+ phone: values.phone.trim(),
106
+ });
107
+ };
108
+ return (react_1.default.createElement(react_2.Modal, { isOpen: isOpen, onClose: onClose, isCentered: true, autoFocus: false },
109
+ react_1.default.createElement(react_2.ModalOverlay, { backdropFilter: "blur(4px)" }),
110
+ react_1.default.createElement(react_2.ModalContent, { borderRadius: "2xl", overflow: "hidden" },
111
+ react_1.default.createElement(react_2.ModalHeader, { borderBottom: "1px solid", borderColor: (_c = (_b = colors === null || colors === void 0 ? void 0 : colors.boxborder) === null || _b === void 0 ? void 0 : _b[200]) !== null && _c !== void 0 ? _c : (_d = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _d === void 0 ? void 0 : _d[200], fontSize: "1.05rem", fontWeight: 600 }, labels.createOrganization),
112
+ react_1.default.createElement(react_2.ModalCloseButton, null),
113
+ react_1.default.createElement(react_2.ModalBody, { py: 6 },
114
+ react_1.default.createElement(react_2.VStack, { spacing: 4, align: "stretch" },
115
+ react_1.default.createElement(TextInput_1.default, { label: labels.companyName, value: values.company_name, onChange: function (e) { return setField("company_name", e.target.value); }, isRequired: true, width: "100%", placeholder: "Enter Company Name", error: !!errors.company_name, errorMessage: errors.company_name }),
116
+ react_1.default.createElement(TextInput_1.default, { label: labels.companyAddress, value: values.company_address, onChange: function (e) { return setField("company_address", e.target.value); }, isRequired: true, width: "100%", placeholder: "Enter Company Address", error: !!errors.company_address, errorMessage: errors.company_address }),
117
+ react_1.default.createElement(TextInput_1.default, { label: labels.phone, value: values.phone, onChange: function (e) { return setField("phone", e.target.value); }, isRequired: true, width: "100%", placeholder: "Enter Phone Number", error: !!errors.phone, errorMessage: errors.phone })),
118
+ react_1.default.createElement(react_2.HStack, { justifyContent: "center", spacing: 4, mt: 6 },
119
+ react_1.default.createElement(Button_1.default, { label: labels.cancel, onClick: onClose, variant: "outline", colorScheme: "red", size: "sm" }),
120
+ react_1.default.createElement(Button_1.default, { label: labels.submit, onClick: handleSubmit, colorScheme: "primary", size: "sm", isLoading: isLoading }))))));
121
+ };
122
+ exports.default = CreateOrgModal;
@@ -0,0 +1,4 @@
1
+ import React from "react";
2
+ import { DeleteOrgModalProps } from "./OrganizationDetailsProps";
3
+ declare const DeleteOrgModal: React.FC<DeleteOrgModalProps>;
4
+ export default DeleteOrgModal;
@@ -0,0 +1,29 @@
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 lucide_react_1 = require("lucide-react");
9
+ var useCustomTheme_1 = require("../../Theme/useCustomTheme");
10
+ var Button_1 = __importDefault(require("../Button/Button"));
11
+ var DeleteOrgModal = function (_a) {
12
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
13
+ var isOpen = _a.isOpen, onClose = _a.onClose, isLoading = _a.isLoading, onConfirm = _a.onConfirm, labels = _a.labels;
14
+ var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
15
+ return (react_1.default.createElement(react_2.Modal, { isOpen: isOpen, onClose: onClose, isCentered: true },
16
+ react_1.default.createElement(react_2.ModalOverlay, { backdropFilter: "blur(4px)" }),
17
+ react_1.default.createElement(react_2.ModalContent, { borderRadius: "2xl", overflow: "hidden" },
18
+ react_1.default.createElement(react_2.ModalHeader, { borderBottom: "1px solid", borderColor: (_c = (_b = colors === null || colors === void 0 ? void 0 : colors.boxborder) === null || _b === void 0 ? void 0 : _b[200]) !== null && _c !== void 0 ? _c : (_d = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _d === void 0 ? void 0 : _d[200], display: "flex", alignItems: "center", gap: 3 },
19
+ react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "full", bg: (_j = (_g = (_f = (_e = colors === null || colors === void 0 ? void 0 : colors.semantic) === null || _e === void 0 ? void 0 : _e.error) === null || _f === void 0 ? void 0 : _f[50]) !== null && _g !== void 0 ? _g : (_h = colors === null || colors === void 0 ? void 0 : colors.red) === null || _h === void 0 ? void 0 : _h[50]) !== null && _j !== void 0 ? _j : "#FEF2F2", color: (_p = (_m = (_l = (_k = colors === null || colors === void 0 ? void 0 : colors.semantic) === null || _k === void 0 ? void 0 : _k.error) === null || _l === void 0 ? void 0 : _l[500]) !== null && _m !== void 0 ? _m : (_o = colors === null || colors === void 0 ? void 0 : colors.red) === null || _o === void 0 ? void 0 : _o[500]) !== null && _p !== void 0 ? _p : "#EF4444" },
20
+ react_1.default.createElement(lucide_react_1.AlertTriangle, { size: 18 })),
21
+ react_1.default.createElement(react_2.Text, { fontSize: "1.05rem", fontWeight: 600 }, labels.confirmDeletion)),
22
+ react_1.default.createElement(react_2.ModalCloseButton, null),
23
+ react_1.default.createElement(react_2.ModalBody, { py: 6 },
24
+ react_1.default.createElement(react_2.Text, { color: (_q = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _q === void 0 ? void 0 : _q[600], fontSize: "sm", mb: 5 }, labels.deleteConfirmText),
25
+ react_1.default.createElement(react_2.HStack, { justifyContent: "flex-end", spacing: 3 },
26
+ react_1.default.createElement(Button_1.default, { label: labels.cancel, onClick: onClose, variant: "outline", colorScheme: "gray", size: "sm" }),
27
+ react_1.default.createElement(Button_1.default, { label: labels.delete, onClick: onConfirm, colorScheme: "red", size: "sm", isLoading: isLoading, leftIcon: react_1.default.createElement(lucide_react_1.Trash2, { size: 15 }) }))))));
28
+ };
29
+ exports.default = DeleteOrgModal;
@@ -0,0 +1,4 @@
1
+ import React from "react";
2
+ import { OrganizationDetailsProps } from "./OrganizationDetailsProps";
3
+ declare const OrganizationDetails: React.FC<OrganizationDetailsProps>;
4
+ export default OrganizationDetails;
@@ -0,0 +1,264 @@
1
+ "use strict";
2
+ var __assign = (this && this.__assign) || function () {
3
+ __assign = Object.assign || function(t) {
4
+ for (var s, i = 1, n = arguments.length; i < n; i++) {
5
+ s = arguments[i];
6
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
7
+ t[p] = s[p];
8
+ }
9
+ return t;
10
+ };
11
+ return __assign.apply(this, arguments);
12
+ };
13
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
14
+ if (k2 === undefined) k2 = k;
15
+ var desc = Object.getOwnPropertyDescriptor(m, k);
16
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
17
+ desc = { enumerable: true, get: function() { return m[k]; } };
18
+ }
19
+ Object.defineProperty(o, k2, desc);
20
+ }) : (function(o, m, k, k2) {
21
+ if (k2 === undefined) k2 = k;
22
+ o[k2] = m[k];
23
+ }));
24
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
25
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
26
+ }) : function(o, v) {
27
+ o["default"] = v;
28
+ });
29
+ var __importStar = (this && this.__importStar) || (function () {
30
+ var ownKeys = function(o) {
31
+ ownKeys = Object.getOwnPropertyNames || function (o) {
32
+ var ar = [];
33
+ for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
34
+ return ar;
35
+ };
36
+ return ownKeys(o);
37
+ };
38
+ return function (mod) {
39
+ if (mod && mod.__esModule) return mod;
40
+ var result = {};
41
+ if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
42
+ __setModuleDefault(result, mod);
43
+ return result;
44
+ };
45
+ })();
46
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
47
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
48
+ return new (P || (P = Promise))(function (resolve, reject) {
49
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
50
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
51
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
52
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
53
+ });
54
+ };
55
+ var __generator = (this && this.__generator) || function (thisArg, body) {
56
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
57
+ return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
58
+ function verb(n) { return function (v) { return step([n, v]); }; }
59
+ function step(op) {
60
+ if (f) throw new TypeError("Generator is already executing.");
61
+ while (g && (g = 0, op[0] && (_ = 0)), _) try {
62
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
63
+ if (y = 0, t) op = [op[0] & 2, t.value];
64
+ switch (op[0]) {
65
+ case 0: case 1: t = op; break;
66
+ case 4: _.label++; return { value: op[1], done: false };
67
+ case 5: _.label++; y = op[1]; op = [0]; continue;
68
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
69
+ default:
70
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
71
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
72
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
73
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
74
+ if (t[2]) _.ops.pop();
75
+ _.trys.pop(); continue;
76
+ }
77
+ op = body.call(thisArg, _);
78
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
79
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
80
+ }
81
+ };
82
+ var __importDefault = (this && this.__importDefault) || function (mod) {
83
+ return (mod && mod.__esModule) ? mod : { "default": mod };
84
+ };
85
+ Object.defineProperty(exports, "__esModule", { value: true });
86
+ var react_1 = __importStar(require("react"));
87
+ var react_2 = require("@chakra-ui/react");
88
+ var lucide_react_1 = require("lucide-react");
89
+ var useCustomTheme_1 = require("../../Theme/useCustomTheme");
90
+ var Button_1 = __importDefault(require("../Button/Button"));
91
+ var EmptyState_1 = __importDefault(require("../EmptyState/EmptyState"));
92
+ var CreateOrgModal_1 = __importDefault(require("./CreateOrgModal"));
93
+ var DeleteOrgModal_1 = __importDefault(require("./DeleteOrgModal"));
94
+ var DEFAULT_LABELS = {
95
+ greeting: "Hello, User!",
96
+ manageSubtitle: "Manage your organizations",
97
+ organizationDetails: "Organization Details",
98
+ createNewOrganization: "Create New Organization",
99
+ createOrganization: "Create Organization",
100
+ activeOrganizations: "Active Organizations",
101
+ invitedOrganizations: "Invited Organizations",
102
+ setAsDefault: "Set as Default",
103
+ settingDefault: "Setting...",
104
+ default: "Default",
105
+ pending: "Pending",
106
+ accept: "Accept",
107
+ accepting: "Accepting...",
108
+ decline: "Decline",
109
+ deleteOrganization: "Delete Organization",
110
+ protectedOrganization: "Protected organization",
111
+ delete: "Delete",
112
+ noOrganizationsTitle: "No organizations found",
113
+ noOrganizationsDescription: "Get started by creating your first organization or wait for an invitation",
114
+ companyName: "Company Name",
115
+ companyAddress: "Company Address",
116
+ phone: "Phone",
117
+ cancel: "Cancel",
118
+ submit: "Submit",
119
+ requiredField: "This field is required",
120
+ invalidPhone: "Phone number must be at least 8 digits",
121
+ confirmDeletion: "Confirm Deletion",
122
+ deleteConfirmText: "Are you sure you want to delete this Organization?",
123
+ copyright: "Pixelize Corp. All rights reserved.",
124
+ termsOfService: "Terms of Service",
125
+ };
126
+ var OrganizationDetails = function (_a) {
127
+ var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z;
128
+ var activeOrganizations = _a.activeOrganizations, invitedOrganizations = _a.invitedOrganizations, _0 = _a.isLoading, isLoading = _0 === void 0 ? false : _0, _1 = _a.switchingOrgIds, switchingOrgIds = _1 === void 0 ? [] : _1, _2 = _a.respondingOrgIds, respondingOrgIds = _2 === void 0 ? [] : _2, _3 = _a.isCreating, isCreating = _3 === void 0 ? false : _3, userName = _a.userName, userAvatarUrl = _a.userAvatarUrl, onSetDefault = _a.onSetDefault, onAcceptInvite = _a.onAcceptInvite, onDeclineInvite = _a.onDeclineInvite, onDeleteOrganization = _a.onDeleteOrganization, onCreateOrganization = _a.onCreateOrganization, onBack = _a.onBack, footerSlot = _a.footerSlot, labelOverrides = _a.labels;
129
+ var colors = (0, useCustomTheme_1.useCustomTheme)().colors;
130
+ var labels = (0, react_1.useMemo)(function () { return (__assign(__assign({}, DEFAULT_LABELS), labelOverrides)); }, [labelOverrides]);
131
+ var _4 = (0, react_1.useState)(false), isCreateOpen = _4[0], setCreateOpen = _4[1];
132
+ var _5 = (0, react_1.useState)(null), deleteOrgId = _5[0], setDeleteOrgId = _5[1];
133
+ var border = (_e = (_c = (_b = colors === null || colors === void 0 ? void 0 : colors.boxborder) === null || _b === void 0 ? void 0 : _b[200]) !== null && _c !== void 0 ? _c : (_d = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _d === void 0 ? void 0 : _d[200]) !== null && _e !== void 0 ? _e : "#E2E8F0";
134
+ var surface = (_f = colors === null || colors === void 0 ? void 0 : colors.white) !== null && _f !== void 0 ? _f : "#FFFFFF";
135
+ var muted = (_h = (_g = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _g === void 0 ? void 0 : _g[500]) !== null && _h !== void 0 ? _h : "#64748B";
136
+ var subtle = (_k = (_j = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _j === void 0 ? void 0 : _j[600]) !== null && _k !== void 0 ? _k : "#475569";
137
+ var heading = (_m = (_l = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _l === void 0 ? void 0 : _l[800]) !== null && _m !== void 0 ? _m : "#1E293B";
138
+ var pageBg = (_p = (_o = colors === null || colors === void 0 ? void 0 : colors.gray) === null || _o === void 0 ? void 0 : _o[50]) !== null && _p !== void 0 ? _p : "#F8FAFC";
139
+ var primary50 = (_r = (_q = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _q === void 0 ? void 0 : _q[50]) !== null && _r !== void 0 ? _r : "#EEF2FF";
140
+ var primary100 = (_t = (_s = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _s === void 0 ? void 0 : _s[100]) !== null && _t !== void 0 ? _t : "#E0E7FF";
141
+ var primary500 = (_v = (_u = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _u === void 0 ? void 0 : _u[500]) !== null && _v !== void 0 ? _v : "#6366F1";
142
+ var primary600 = (_x = (_w = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _w === void 0 ? void 0 : _w[600]) !== null && _x !== void 0 ? _x : "#4F46E5";
143
+ var cardSx = {
144
+ backgroundColor: surface,
145
+ borderRadius: "xl",
146
+ border: "1px solid",
147
+ borderColor: border,
148
+ boxShadow: "0 1px 2px rgba(16,24,40,0.05)",
149
+ };
150
+ var sectionBadge = function (count, scheme) { return (react_1.default.createElement(react_2.Badge, { colorScheme: scheme, variant: "subtle", borderRadius: "full", px: 2, py: 0.5, fontSize: "0.65rem" }, count)); };
151
+ var renderActiveCard = function (item) {
152
+ var _a, _b, _c, _d, _e, _f;
153
+ var isSwitching = switchingOrgIds.includes(item.orgId);
154
+ var isProtected = item.defaultOrg === 1;
155
+ return (react_1.default.createElement(react_2.Box, __assign({ key: item.orgId }, cardSx, { p: 3, position: "relative", transition: "all 0.2s ease", _hover: {
156
+ borderColor: (_b = (_a = colors === null || colors === void 0 ? void 0 : colors.primary) === null || _a === void 0 ? void 0 : _a[300]) !== null && _b !== void 0 ? _b : "#A5B4FC",
157
+ boxShadow: "0 8px 24px rgba(16,24,40,0.10)",
158
+ transform: "translateY(-3px)",
159
+ } }),
160
+ react_1.default.createElement(react_2.Flex, { justifyContent: "space-between", alignItems: "flex-start", mb: 2 },
161
+ react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "lg", bg: primary50, color: primary600 },
162
+ react_1.default.createElement(lucide_react_1.Building2, { size: 18 })),
163
+ react_1.default.createElement(react_2.Box, { mr: "2rem" }, item.default === 1 ? (react_1.default.createElement(react_2.Badge, { colorScheme: "green", borderRadius: "full", px: 2, py: 0.5, display: "flex", alignItems: "center", gap: 1, fontSize: "0.7rem", fontWeight: 600 },
164
+ react_1.default.createElement(lucide_react_1.CheckCircle2, { size: 12 }),
165
+ labels.default)) : isSwitching ? (react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, color: primary500 },
166
+ react_1.default.createElement(react_2.Spinner, { size: "sm" }),
167
+ react_1.default.createElement(react_2.Text, { fontSize: "xs" }, labels.settingDefault))) : (react_1.default.createElement(react_2.Flex, { align: "center", gap: 1, fontSize: "xs", color: primary600, fontWeight: 600, cursor: "pointer", _hover: { color: primary500, gap: 2 }, transition: "all 0.2s ease", onClick: function () { return onSetDefault === null || onSetDefault === void 0 ? void 0 : onSetDefault(item.orgId); } },
168
+ react_1.default.createElement(lucide_react_1.CheckCircle2, { size: 12 }),
169
+ react_1.default.createElement(react_2.Text, null, labels.setAsDefault))))),
170
+ react_1.default.createElement(react_2.Text, { fontSize: "sm", fontWeight: 700, color: heading, noOfLines: 1 }, item.company_name),
171
+ react_1.default.createElement(react_2.Tooltip, { label: isProtected ? labels.protectedOrganization : labels.deleteOrganization, hasArrow: true },
172
+ react_1.default.createElement(react_2.IconButton, { "aria-label": labels.deleteOrganization, icon: react_1.default.createElement(lucide_react_1.Trash2, { size: 14 }), size: "xs", variant: "ghost", position: "absolute", top: 2, right: 2, borderRadius: "full", color: muted, isDisabled: isProtected, _hover: {
173
+ bg: (_d = (_c = colors === null || colors === void 0 ? void 0 : colors.red) === null || _c === void 0 ? void 0 : _c[50]) !== null && _d !== void 0 ? _d : "#FEF2F2",
174
+ color: (_f = (_e = colors === null || colors === void 0 ? void 0 : colors.red) === null || _e === void 0 ? void 0 : _e[600]) !== null && _f !== void 0 ? _f : "#DC2626",
175
+ }, onClick: function () { return setDeleteOrgId(item.orgId); } }))));
176
+ };
177
+ var renderInvitedCard = function (item) {
178
+ var _a, _b, _c, _d;
179
+ var isResponding = respondingOrgIds.includes(item.orgId);
180
+ return (react_1.default.createElement(react_2.Box, __assign({ key: item.orgId }, cardSx, { p: 3, position: "relative", transition: "all 0.2s ease", _hover: {
181
+ boxShadow: "0 8px 24px rgba(16,24,40,0.10)",
182
+ transform: "translateY(-3px)",
183
+ } }),
184
+ react_1.default.createElement(react_2.Flex, { justifyContent: "space-between", alignItems: "flex-start", mb: 2 },
185
+ react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "lg", bg: (_b = (_a = colors === null || colors === void 0 ? void 0 : colors.yellow) === null || _a === void 0 ? void 0 : _a[100]) !== null && _b !== void 0 ? _b : "#FEF9C3", color: (_d = (_c = colors === null || colors === void 0 ? void 0 : colors.yellow) === null || _c === void 0 ? void 0 : _c[600]) !== null && _d !== void 0 ? _d : "#CA8A04" },
186
+ react_1.default.createElement(lucide_react_1.Building2, { size: 18 })),
187
+ react_1.default.createElement(react_2.Badge, { colorScheme: "yellow", borderRadius: "full", px: 2, py: 0.5, fontSize: "0.7rem", fontWeight: 600 }, labels.pending)),
188
+ react_1.default.createElement(react_2.Text, { fontSize: "sm", fontWeight: 700, color: heading, noOfLines: 1, mb: 1 }, item.company_name),
189
+ item.company_url && (react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, color: subtle, fontSize: "xs", mb: 2 },
190
+ react_1.default.createElement(lucide_react_1.Globe, { size: 13 }),
191
+ react_1.default.createElement(react_2.Text, { noOfLines: 1, title: item.company_url }, item.company_url))),
192
+ react_1.default.createElement(react_2.HStack, { spacing: 2, pt: 2, borderTop: "1px solid", borderColor: border },
193
+ react_1.default.createElement(react_2.Box, { flex: 1 },
194
+ react_1.default.createElement(Button_1.default, { label: labels.accept, colorScheme: "green", size: "sm", width: "100%", isLoading: isResponding, loadingText: labels.accepting, onClick: function () { return onAcceptInvite === null || onAcceptInvite === void 0 ? void 0 : onAcceptInvite(item.orgId); } })),
195
+ react_1.default.createElement(react_2.Box, { flex: 1 },
196
+ react_1.default.createElement(Button_1.default, { label: labels.decline, colorScheme: "red", size: "sm", width: "100%", onClick: function () { return onDeclineInvite === null || onDeclineInvite === void 0 ? void 0 : onDeclineInvite(item.orgId); } })))));
197
+ };
198
+ var gridSx = {
199
+ display: "grid",
200
+ gridTemplateColumns: {
201
+ base: "1fr",
202
+ md: "repeat(2, 1fr)",
203
+ lg: "repeat(3, 1fr)",
204
+ },
205
+ gap: 3,
206
+ width: "100%",
207
+ };
208
+ var hasOrganizations = activeOrganizations.length > 0 || invitedOrganizations.length > 0;
209
+ return (react_1.default.createElement(react_2.Box, { backgroundColor: pageBg, minHeight: "100%", p: { base: 2, md: 3 } },
210
+ react_1.default.createElement(react_2.Flex, __assign({}, cardSx, { px: 3, py: 2.5, mb: 3, alignItems: "center", justifyContent: "space-between", flexWrap: "wrap", gap: 3, bgGradient: "linear(135deg, ".concat(primary50, " 0%, ").concat(primary100, " 100%)") }),
211
+ react_1.default.createElement(react_2.Flex, { alignItems: "center", gap: 3 },
212
+ onBack && (react_1.default.createElement(react_2.IconButton, { "aria-label": "Go back", icon: react_1.default.createElement(lucide_react_1.ArrowLeft, { size: 18 }), variant: "ghost", size: "sm", color: subtle, onClick: onBack })),
213
+ react_1.default.createElement(react_2.Flex, { align: "center", justify: "center", boxSize: "36px", borderRadius: "full", bg: primary500, color: "white" },
214
+ react_1.default.createElement(lucide_react_1.Building2, { size: 18 })),
215
+ react_1.default.createElement(react_2.Box, null,
216
+ react_1.default.createElement(react_2.HStack, { spacing: 2 },
217
+ react_1.default.createElement(react_2.Heading, { size: "sm", color: heading, fontWeight: 700 }, userName ? "".concat(labels.greeting.replace(/User!?/, "")).concat(userName, "!").trim() : labels.greeting),
218
+ react_1.default.createElement(react_2.Avatar, { size: "xs", name: userName, src: userAvatarUrl })),
219
+ react_1.default.createElement(react_2.Text, { fontSize: "xs", color: subtle, mt: 0.5 }, labels.manageSubtitle))),
220
+ react_1.default.createElement(Button_1.default, { label: labels.createNewOrganization, onClick: function () { return setCreateOpen(true); }, leftIcon: react_1.default.createElement(lucide_react_1.Plus, { size: 16 }), colorScheme: "primary", size: "sm" })),
221
+ isLoading ? (react_1.default.createElement(react_2.Box, __assign({}, gridSx), Array.from({ length: 6 }).map(function (_, idx) { return (react_1.default.createElement(react_2.Box, __assign({ key: idx }, cardSx, { p: 3 }),
222
+ react_1.default.createElement(react_2.Skeleton, { boxSize: "36px", borderRadius: "lg", mb: 2 }),
223
+ react_1.default.createElement(react_2.SkeletonText, { noOfLines: 2, spacing: 2 }))); }))) : !hasOrganizations ? (react_1.default.createElement(EmptyState_1.default, { icon: lucide_react_1.Building2, title: labels.noOrganizationsTitle, description: labels.noOrganizationsDescription, minH: "40vh", action: react_1.default.createElement(Button_1.default, { label: labels.createOrganization, onClick: function () { return setCreateOpen(true); }, leftIcon: react_1.default.createElement(lucide_react_1.Plus, { size: 16 }), colorScheme: "primary", size: "sm" }) })) : (react_1.default.createElement(react_2.VStack, { align: "stretch", spacing: 4 },
224
+ activeOrganizations.length > 0 && (react_1.default.createElement(react_2.Box, null,
225
+ react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, mb: 2 },
226
+ react_1.default.createElement(lucide_react_1.Users, { size: 16, color: primary500 }),
227
+ react_1.default.createElement(react_2.Heading, { size: "sm", color: heading, fontWeight: 600 }, labels.activeOrganizations),
228
+ sectionBadge(activeOrganizations.length, "blue")),
229
+ react_1.default.createElement(react_2.Box, __assign({}, gridSx), activeOrganizations.map(renderActiveCard)))),
230
+ invitedOrganizations.length > 0 && (react_1.default.createElement(react_2.Box, null,
231
+ react_1.default.createElement(react_2.Flex, { align: "center", gap: 2, mb: 2 },
232
+ react_1.default.createElement(lucide_react_1.Mail, { size: 16, color: (_z = (_y = colors === null || colors === void 0 ? void 0 : colors.yellow) === null || _y === void 0 ? void 0 : _y[500]) !== null && _z !== void 0 ? _z : "#EAB308" }),
233
+ react_1.default.createElement(react_2.Heading, { size: "sm", color: heading, fontWeight: 600 }, labels.invitedOrganizations),
234
+ sectionBadge(invitedOrganizations.length, "yellow")),
235
+ react_1.default.createElement(react_2.Box, __assign({}, gridSx), invitedOrganizations.map(renderInvitedCard)))))),
236
+ footerSlot,
237
+ react_1.default.createElement(CreateOrgModal_1.default, { isOpen: isCreateOpen, onClose: function () { return setCreateOpen(false); }, isLoading: isCreating, onSubmit: function (values) { return __awaiter(void 0, void 0, void 0, function () {
238
+ return __generator(this, function (_a) {
239
+ switch (_a.label) {
240
+ case 0: return [4 /*yield*/, (onCreateOrganization === null || onCreateOrganization === void 0 ? void 0 : onCreateOrganization(values))];
241
+ case 1:
242
+ _a.sent();
243
+ setCreateOpen(false);
244
+ return [2 /*return*/];
245
+ }
246
+ });
247
+ }); }, labels: labels }),
248
+ react_1.default.createElement(DeleteOrgModal_1.default, { isOpen: deleteOrgId !== null, onClose: function () { return setDeleteOrgId(null); }, onConfirm: function () { return __awaiter(void 0, void 0, void 0, function () {
249
+ return __generator(this, function (_a) {
250
+ switch (_a.label) {
251
+ case 0:
252
+ if (!(deleteOrgId !== null)) return [3 /*break*/, 2];
253
+ return [4 /*yield*/, (onDeleteOrganization === null || onDeleteOrganization === void 0 ? void 0 : onDeleteOrganization(deleteOrgId))];
254
+ case 1:
255
+ _a.sent();
256
+ _a.label = 2;
257
+ case 2:
258
+ setDeleteOrgId(null);
259
+ return [2 /*return*/];
260
+ }
261
+ });
262
+ }); }, labels: labels })));
263
+ };
264
+ exports.default = OrganizationDetails;
@@ -0,0 +1 @@
1
+ import "@testing-library/jest-dom";
@@ -0,0 +1,122 @@
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("@testing-library/react");
8
+ require("@testing-library/jest-dom");
9
+ var react_3 = require("@chakra-ui/react");
10
+ var OrganizationDetails_1 = __importDefault(require("./OrganizationDetails"));
11
+ jest.mock("../../Theme/useCustomTheme", function () { return ({
12
+ useCustomTheme: function () { return ({
13
+ colors: {
14
+ white: "#ffffff",
15
+ gray: {
16
+ 50: "#f8fafc",
17
+ 100: "#f0f0f0",
18
+ 200: "#e2e8f0",
19
+ 300: "#cbd5e1",
20
+ 500: "#64748b",
21
+ 600: "#475569",
22
+ 700: "#334155",
23
+ 800: "#1e293b",
24
+ },
25
+ primary: {
26
+ 50: "#eef2ff",
27
+ 100: "#e0e7ff",
28
+ 300: "#a5b4fc",
29
+ 500: "#6366f1",
30
+ 600: "#4f46e5",
31
+ 700: "#4338ca",
32
+ },
33
+ boxborder: { 200: "#e2e8f0" },
34
+ text: { 400: "#94a3b8", 500: "#64748b", 600: "#475569", 700: "#334155" },
35
+ secondary: { 500: "#805ad5" },
36
+ backgroundColor: { light: "#ffffff" },
37
+ yellow: { 100: "#fef9c3", 200: "#fef08a", 500: "#eab308", 600: "#ca8a04" },
38
+ green: { 400: "#4ade80", 500: "#22c55e" },
39
+ red: { 50: "#fef2f2", 400: "#f87171", 500: "#ef4444", 600: "#dc2626" },
40
+ semantic: { error: { 50: "#fef2f2", 500: "#ef4444" } },
41
+ },
42
+ }); },
43
+ }); });
44
+ beforeAll(function () {
45
+ Object.defineProperty(window, "matchMedia", {
46
+ writable: true,
47
+ configurable: true,
48
+ value: jest.fn().mockImplementation(function (query) { return ({
49
+ matches: false,
50
+ media: query,
51
+ onchange: null,
52
+ addListener: jest.fn(),
53
+ removeListener: jest.fn(),
54
+ addEventListener: jest.fn(),
55
+ removeEventListener: jest.fn(),
56
+ dispatchEvent: jest.fn(),
57
+ }); }),
58
+ });
59
+ });
60
+ var active = [
61
+ {
62
+ orgId: 1,
63
+ company_name: "Acme Corp",
64
+ company_url: "acme.example.com",
65
+ default: 1,
66
+ uiInvite: 1,
67
+ defaultOrg: 1,
68
+ },
69
+ {
70
+ orgId: 2,
71
+ company_name: "Globex",
72
+ company_url: "globex.example.com",
73
+ default: 0,
74
+ uiInvite: 1,
75
+ defaultOrg: 0,
76
+ },
77
+ ];
78
+ var invited = [
79
+ {
80
+ orgId: 3,
81
+ company_name: "Initech",
82
+ company_url: "initech.example.com",
83
+ default: 0,
84
+ uiInvite: 0,
85
+ defaultOrg: 0,
86
+ },
87
+ ];
88
+ var renderWithChakra = function (ui) {
89
+ return (0, react_2.render)(react_1.default.createElement(react_3.ChakraProvider, null, ui));
90
+ };
91
+ describe("OrganizationDetails", function () {
92
+ it("renders active and invited organizations", function () {
93
+ renderWithChakra(react_1.default.createElement(OrganizationDetails_1.default, { activeOrganizations: active, invitedOrganizations: invited }));
94
+ expect(react_2.screen.getByText("Active Organizations")).toBeInTheDocument();
95
+ expect(react_2.screen.getByText("Acme Corp")).toBeInTheDocument();
96
+ expect(react_2.screen.getByText("Globex")).toBeInTheDocument();
97
+ expect(react_2.screen.getByText("Invited Organizations")).toBeInTheDocument();
98
+ expect(react_2.screen.getByText("Initech")).toBeInTheDocument();
99
+ });
100
+ it("shows an empty state when there are no organizations", function () {
101
+ renderWithChakra(react_1.default.createElement(OrganizationDetails_1.default, { activeOrganizations: [], invitedOrganizations: [] }));
102
+ expect(react_2.screen.getByText("No organizations found")).toBeInTheDocument();
103
+ });
104
+ it("opens the create organization modal", function () {
105
+ renderWithChakra(react_1.default.createElement(OrganizationDetails_1.default, { activeOrganizations: active, invitedOrganizations: [] }));
106
+ react_2.fireEvent.click(react_2.screen.getByText("Create New Organization"));
107
+ var dialog = react_2.screen.getByRole("dialog");
108
+ expect((0, react_2.within)(dialog).getByText("Create Organization")).toBeInTheDocument();
109
+ expect((0, react_2.within)(dialog).getByText("Company Address")).toBeInTheDocument();
110
+ });
111
+ it("opens the delete confirmation for a non-protected org", function () {
112
+ renderWithChakra(react_1.default.createElement(OrganizationDetails_1.default, { activeOrganizations: active, invitedOrganizations: [] }));
113
+ react_2.fireEvent.click(react_2.screen.getAllByLabelText("Delete Organization")[1]);
114
+ expect(react_2.screen.getByText("Are you sure you want to delete this Organization?")).toBeInTheDocument();
115
+ });
116
+ it("calls onAcceptInvite when Accept is clicked", function () {
117
+ var onAcceptInvite = jest.fn();
118
+ renderWithChakra(react_1.default.createElement(OrganizationDetails_1.default, { activeOrganizations: [], invitedOrganizations: invited, onAcceptInvite: onAcceptInvite }));
119
+ react_2.fireEvent.click(react_2.screen.getByText("Accept"));
120
+ expect(onAcceptInvite).toHaveBeenCalledWith(3);
121
+ });
122
+ });
@@ -0,0 +1,88 @@
1
+ import { ReactNode } from "react";
2
+ export type OrganizationItem = {
3
+ orgId: number;
4
+ company_name: string;
5
+ company_url: string;
6
+ /** 1 when this org is the user's default org. */
7
+ default: number;
8
+ /** 1 = active/accepted, 0 = pending invite. */
9
+ uiInvite: number;
10
+ /** 1 when the org is protected and cannot be deleted. */
11
+ defaultOrg: number;
12
+ };
13
+ export type CreateOrgFormValues = {
14
+ company_name: string;
15
+ company_address: string;
16
+ phone: string;
17
+ };
18
+ /**
19
+ * All user-facing strings. Provide translated values from the host app; every
20
+ * key has a sensible English default so the component works standalone.
21
+ */
22
+ export type OrganizationDetailsLabels = {
23
+ greeting?: string;
24
+ manageSubtitle?: string;
25
+ organizationDetails?: string;
26
+ createNewOrganization?: string;
27
+ createOrganization?: string;
28
+ activeOrganizations?: string;
29
+ invitedOrganizations?: string;
30
+ setAsDefault?: string;
31
+ settingDefault?: string;
32
+ default?: string;
33
+ pending?: string;
34
+ accept?: string;
35
+ accepting?: string;
36
+ decline?: string;
37
+ deleteOrganization?: string;
38
+ protectedOrganization?: string;
39
+ delete?: string;
40
+ noOrganizationsTitle?: string;
41
+ noOrganizationsDescription?: string;
42
+ companyName?: string;
43
+ companyAddress?: string;
44
+ phone?: string;
45
+ cancel?: string;
46
+ submit?: string;
47
+ requiredField?: string;
48
+ invalidPhone?: string;
49
+ confirmDeletion?: string;
50
+ deleteConfirmText?: string;
51
+ copyright?: string;
52
+ termsOfService?: string;
53
+ };
54
+ export interface OrganizationDetailsProps {
55
+ activeOrganizations: OrganizationItem[];
56
+ invitedOrganizations: OrganizationItem[];
57
+ isLoading?: boolean;
58
+ /** Org ids currently being switched to default. */
59
+ switchingOrgIds?: number[];
60
+ /** Org ids currently responding to an invite. */
61
+ respondingOrgIds?: number[];
62
+ isCreating?: boolean;
63
+ createError?: string;
64
+ userName?: string;
65
+ userAvatarUrl?: string;
66
+ onSetDefault?: (orgId: number) => void;
67
+ onAcceptInvite?: (orgId: number) => void;
68
+ onDeclineInvite?: (orgId: number) => void;
69
+ onDeleteOrganization?: (orgId: number) => void | Promise<void>;
70
+ onCreateOrganization?: (values: CreateOrgFormValues) => void | Promise<void>;
71
+ onBack?: () => void;
72
+ footerSlot?: ReactNode;
73
+ labels?: OrganizationDetailsLabels;
74
+ }
75
+ export interface CreateOrgModalProps {
76
+ isOpen: boolean;
77
+ onClose: () => void;
78
+ isLoading?: boolean;
79
+ onSubmit: (values: CreateOrgFormValues) => void | Promise<void>;
80
+ labels: Required<Pick<OrganizationDetailsLabels, "createOrganization" | "companyName" | "companyAddress" | "phone" | "cancel" | "submit" | "requiredField" | "invalidPhone">>;
81
+ }
82
+ export interface DeleteOrgModalProps {
83
+ isOpen: boolean;
84
+ onClose: () => void;
85
+ isLoading?: boolean;
86
+ onConfirm: () => void;
87
+ labels: Required<Pick<OrganizationDetailsLabels, "confirmDeletion" | "deleteConfirmText" | "cancel" | "delete">>;
88
+ }
@@ -0,0 +1,2 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
package/dist/index.d.ts CHANGED
@@ -76,9 +76,11 @@ import UserDetails from "./Components/UserDetails/UserDetails";
76
76
  import RolesPermission from "./Components/RolesPermission/RolesPermission";
77
77
  import CustomModulesTable from "./Components/CustomModulesTable/CustomModulesTable";
78
78
  import SignInActivityTable from "./Components/SignInActivityTable/SignInActivityTable";
79
- export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, EmptyState, FieldSelectModal, FilePreview, FilePreviewTrigger, FileUpload, FileUploader, FilterSidebar, FormWrapper, LazyWrapper, MoreItems, PdfViewer, ScrollToTop, CopyButton, StageProgress, StageItem, OrgSwitcher, UpgradeButton, UserDetails, RolesPermission, CustomModulesTable, SignInActivityTable, 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, };
79
+ import OrganizationDetails from "./Components/OrganizationDetails/OrganizationDetails";
80
+ export { Accordian, AlertDialog, ApexBarChart, ApexPieChart, ApexPolarChart, ApexLineChart, Breadcrumbs, Button, ButtonGroupIcon, Card, Checkbox, ContactForm, DatePicker, Drawer, DrawerHeader, DrawerBody, DrawerFooter, Dropdown, Editor, EmptyState, FieldSelectModal, FilePreview, FilePreviewTrigger, FileUpload, FileUploader, FilterSidebar, FormWrapper, LazyWrapper, MoreItems, PdfViewer, ScrollToTop, CopyButton, StageProgress, StageItem, OrgSwitcher, UpgradeButton, UserDetails, RolesPermission, CustomModulesTable, SignInActivityTable, OrganizationDetails, 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, };
80
81
  export default withTheme;
81
82
  export type { UserDetailsProps, UserDetailsLabels, UserListItem, SelectedUserDetail, UserDetailRow, RoleOption, AddUserFormValues, ChangeRoleSubmitPayload, } from "./Components/UserDetails/UserDetailsProps";
82
83
  export type { RolesPermissionProps, RolesPermissionLabels, RolesPermissionView, RolesPermissionMode, Permission, PermissionKey, RoleData, } from "./Components/RolesPermission/RolesPermissionProps";
83
84
  export type { CustomModulesTableProps, CustomModulesTableLabels, ModuleItem, UpdateModulePayload, } from "./Components/CustomModulesTable/CustomModulesTableProps";
84
85
  export type { SignInActivityTableProps, SignInActivityLabels, SignInDevice, } from "./Components/SignInActivityTable/SignInActivityTableProps";
86
+ export type { OrganizationDetailsProps, OrganizationDetailsLabels, OrganizationItem, CreateOrgFormValues, } from "./Components/OrganizationDetails/OrganizationDetailsProps";
package/dist/index.js CHANGED
@@ -37,8 +37,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
37
37
  return (mod && mod.__esModule) ? mod : { "default": mod };
38
38
  };
39
39
  Object.defineProperty(exports, "__esModule", { value: true });
40
- exports.ModalFooter = exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.SignInActivityTable = exports.CustomModulesTable = exports.RolesPermission = exports.UserDetails = exports.UpgradeButton = exports.OrgSwitcher = exports.StageItem = exports.StageProgress = exports.CopyButton = exports.ScrollToTop = exports.PdfViewer = exports.MoreItems = exports.LazyWrapper = exports.FormWrapper = exports.FilterSidebar = exports.FileUploader = exports.FileUpload = exports.FilePreviewTrigger = exports.FilePreview = exports.FieldSelectModal = exports.EmptyState = 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;
41
- 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 = 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 = void 0;
40
+ exports.ModalBody = exports.ModalHeader = exports.Modal = exports.Loading = exports.KanbanBoard = exports.InputSwitch = exports.InputTextArea = exports.HeaderActions = exports.Header = exports.OrganizationDetails = exports.SignInActivityTable = exports.CustomModulesTable = exports.RolesPermission = exports.UserDetails = exports.UpgradeButton = exports.OrgSwitcher = exports.StageItem = exports.StageProgress = exports.CopyButton = exports.ScrollToTop = exports.PdfViewer = exports.MoreItems = exports.LazyWrapper = exports.FormWrapper = exports.FilterSidebar = exports.FileUploader = exports.FileUpload = exports.FilePreviewTrigger = exports.FilePreview = exports.FieldSelectModal = exports.EmptyState = 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;
41
+ 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 = 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 = void 0;
42
42
  var Accordion_1 = __importDefault(require("./Components/Accordion/Accordion"));
43
43
  exports.Accordian = Accordion_1.default;
44
44
  var AlertDialog_1 = __importDefault(require("./Components/AlertDialog/AlertDialog"));
@@ -207,4 +207,6 @@ var CustomModulesTable_1 = __importDefault(require("./Components/CustomModulesTa
207
207
  exports.CustomModulesTable = CustomModulesTable_1.default;
208
208
  var SignInActivityTable_1 = __importDefault(require("./Components/SignInActivityTable/SignInActivityTable"));
209
209
  exports.SignInActivityTable = SignInActivityTable_1.default;
210
+ var OrganizationDetails_1 = __importDefault(require("./Components/OrganizationDetails/OrganizationDetails"));
211
+ exports.OrganizationDetails = OrganizationDetails_1.default;
210
212
  exports.default = withTheme_1.default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pixelize-design-library",
3
- "version": "2.3.1-beta.16",
3
+ "version": "2.3.1-beta.18",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",