@codezee/sixtify-brahma 0.2.194 → 0.2.196

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/package.json +1 -1
  2. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartSelectField.d.ts +7 -0
  3. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartSelectField.d.ts.map +1 -0
  4. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartSelectField.js +58 -0
  5. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartTextField.d.ts +5 -0
  6. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartTextField.d.ts.map +1 -0
  7. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartTextField.js +59 -0
  8. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartTooltip.d.ts +9 -0
  9. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartTooltip.d.ts.map +1 -0
  10. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/SmartTooltip.js +113 -0
  11. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/index.d.ts +4 -0
  12. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/index.d.ts.map +1 -0
  13. package/packages/shared-components/dist/SmartGrid/Components/EditableFields/index.js +19 -0
  14. package/packages/shared-components/dist/SmartGrid/Components/index.d.ts +2 -0
  15. package/packages/shared-components/dist/SmartGrid/Components/index.d.ts.map +1 -0
  16. package/packages/shared-components/dist/SmartGrid/Components/index.js +17 -0
  17. package/packages/shared-components/dist/SmartGrid/index.d.ts +1 -0
  18. package/packages/shared-components/dist/SmartGrid/index.d.ts.map +1 -1
  19. package/packages/shared-components/dist/SmartGrid/index.js +1 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@codezee/sixtify-brahma",
3
- "version": "0.2.194",
3
+ "version": "0.2.196",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/hardikranpariya/sixtify-brahma.git"
@@ -0,0 +1,7 @@
1
+ import type { SelectHTMLAttributes } from "react";
2
+ import type { Option } from "../../../FormFields";
3
+ export declare const SmartSelectField: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
4
+ errorMessage?: string;
5
+ options: Option[];
6
+ } & SelectHTMLAttributes<HTMLSelectElement> & import("react").RefAttributes<HTMLSelectElement>>>;
7
+ //# sourceMappingURL=SmartSelectField.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SmartSelectField.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/EditableFields/SmartSelectField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,OAAO,CAAC;AAElD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAgGlD,eAAO,MAAM,gBAAgB;mBA5FZ,MAAM;aACZ,MAAM,EAAE;gGAsGlB,CAAC"}
@@ -0,0 +1,58 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SmartSelectField = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const material_1 = require("@mui/material");
6
+ const react_1 = require("react");
7
+ const SmartTooltip_1 = require("./SmartTooltip");
8
+ const SmartSelectFieldComponent = (0, react_1.forwardRef)(({ errorMessage, options, ...rest }, ref) => {
9
+ const theme = (0, material_1.useTheme)();
10
+ const { butterflyBlue, lipstickRed, iron } = theme.palette.app.color;
11
+ const [isFocused, setIsFocused] = (0, react_1.useState)(false);
12
+ const getBorderColor = () => {
13
+ if (errorMessage && !isFocused) {
14
+ return lipstickRed[900];
15
+ }
16
+ if (isFocused) {
17
+ return butterflyBlue[900];
18
+ }
19
+ return iron[800];
20
+ };
21
+ return ((0, jsx_runtime_1.jsx)(SmartTooltip_1.SmartTooltip, { title: errorMessage ?? "", position: "top", delay: 50, children: (0, jsx_runtime_1.jsx)("div", { style: {
22
+ display: "flex",
23
+ flexDirection: "column",
24
+ gap: "4px",
25
+ width: "100%",
26
+ }, children: (0, jsx_runtime_1.jsx)("div", { style: {
27
+ display: "flex",
28
+ alignItems: "center",
29
+ border: `2px solid ${getBorderColor()}`,
30
+ borderRadius: "4px",
31
+ padding: "4px 8px",
32
+ background: "white",
33
+ minHeight: "20px",
34
+ }, children: (0, jsx_runtime_1.jsx)("select", { ref: ref, ...rest, style: {
35
+ width: "100%",
36
+ border: "none",
37
+ background: "transparent",
38
+ padding: "0",
39
+ fontSize: "13px",
40
+ outline: "none",
41
+ cursor: "pointer",
42
+ }, onClick: (e) => e.stopPropagation(), onFocus: (e) => {
43
+ e.stopPropagation();
44
+ setIsFocused(true);
45
+ }, onBlur: (e) => {
46
+ e.stopPropagation();
47
+ setIsFocused(false);
48
+ }, children: options.length === 0 ? ((0, jsx_runtime_1.jsx)("option", { value: "", disabled: true, children: "No Options" })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("option", { value: "", children: "Select Option" }), options.map((option) => ((0, jsx_runtime_1.jsx)("option", { value: String(option.value), children: option.label }, option.value)))] })) }) }) }) }));
49
+ });
50
+ SmartSelectFieldComponent.displayName = "SmartSelectFieldComponent";
51
+ exports.SmartSelectField = (0, react_1.memo)(SmartSelectFieldComponent, (prevProps, nextProps) => {
52
+ return (prevProps.name === nextProps.name &&
53
+ prevProps.value === nextProps.value &&
54
+ prevProps.disabled === nextProps.disabled &&
55
+ prevProps.options === nextProps.options &&
56
+ prevProps.errorMessage === nextProps.errorMessage);
57
+ });
58
+ exports.SmartSelectField.displayName = "SmartSelectField";
@@ -0,0 +1,5 @@
1
+ import type { InputHTMLAttributes } from "react";
2
+ export declare const SmartTextField: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<{
3
+ errorMessage?: string;
4
+ } & InputHTMLAttributes<HTMLInputElement> & import("react").RefAttributes<HTMLInputElement>>>;
5
+ //# sourceMappingURL=SmartTextField.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SmartTextField.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/EditableFields/SmartTextField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,OAAO,CAAC;AAiFjD,eAAO,MAAM,cAAc;mBA5EV,MAAM;6FAwFtB,CAAC"}
@@ -0,0 +1,59 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SmartTextField = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const material_1 = require("@mui/material");
6
+ const react_1 = require("react");
7
+ const SmartTooltip_1 = require("./SmartTooltip");
8
+ const SmartTextFieldComponent = (0, react_1.forwardRef)(({ errorMessage, ...rest }, ref) => {
9
+ const theme = (0, material_1.useTheme)();
10
+ const { butterflyBlue, lipstickRed, iron } = theme.palette.app.color;
11
+ const [isFocused, setIsFocused] = (0, react_1.useState)(false);
12
+ const getBorderColor = () => {
13
+ if (errorMessage && !isFocused) {
14
+ return lipstickRed[900];
15
+ }
16
+ if (isFocused) {
17
+ return butterflyBlue[900];
18
+ }
19
+ return iron[800];
20
+ };
21
+ return ((0, jsx_runtime_1.jsx)(SmartTooltip_1.SmartTooltip, { title: errorMessage ?? "", position: "top", delay: 50, children: (0, jsx_runtime_1.jsx)("div", { style: {
22
+ display: "flex",
23
+ flexDirection: "column",
24
+ gap: "4px",
25
+ width: "100%",
26
+ }, children: (0, jsx_runtime_1.jsx)("div", { style: {
27
+ display: "flex",
28
+ alignItems: "center",
29
+ border: `2px solid ${getBorderColor()}`,
30
+ borderRadius: "4px",
31
+ padding: "4px 8px",
32
+ background: "white",
33
+ minHeight: "20px",
34
+ }, children: (0, jsx_runtime_1.jsx)("input", { ref: ref, ...rest, style: {
35
+ width: "100%",
36
+ border: "none",
37
+ background: "transparent",
38
+ padding: "0",
39
+ fontSize: "14px",
40
+ outline: "none",
41
+ }, onClick: (e) => e.stopPropagation(), onFocus: (e) => {
42
+ e.stopPropagation();
43
+ setIsFocused(true);
44
+ }, onBlur: (e) => {
45
+ e.stopPropagation();
46
+ setIsFocused(false);
47
+ } }) }) }) }));
48
+ });
49
+ SmartTextFieldComponent.displayName = "SmartTextFieldComponent";
50
+ // Memoize with custom comparison to prevent unnecessary re-renders
51
+ exports.SmartTextField = (0, react_1.memo)(SmartTextFieldComponent, (prevProps, nextProps) => {
52
+ // Only re-render if these specific props change
53
+ return (prevProps.name === nextProps.name &&
54
+ prevProps.value === nextProps.value &&
55
+ prevProps.disabled === nextProps.disabled &&
56
+ prevProps.type === nextProps.type &&
57
+ prevProps.errorMessage === nextProps.errorMessage);
58
+ });
59
+ exports.SmartTextField.displayName = "SmartTextField";
@@ -0,0 +1,9 @@
1
+ type SmartTooltipProps = {
2
+ children: React.ReactNode;
3
+ title: string;
4
+ position?: "top" | "bottom" | "left" | "right";
5
+ delay?: number;
6
+ };
7
+ export declare const SmartTooltip: ({ children, title, position, delay, }: SmartTooltipProps) => import("react/jsx-runtime").JSX.Element;
8
+ export {};
9
+ //# sourceMappingURL=SmartTooltip.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SmartTooltip.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/EditableFields/SmartTooltip.tsx"],"names":[],"mappings":"AAKA,KAAK,iBAAiB,GAAG;IACvB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAsGF,eAAO,MAAM,YAAY,GAAI,uCAK1B,iBAAiB,4CAsDnB,CAAC"}
@@ -0,0 +1,113 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.SmartTooltip = void 0;
4
+ const jsx_runtime_1 = require("react/jsx-runtime");
5
+ const material_1 = require("@mui/material");
6
+ const react_1 = require("react");
7
+ const react_dom_1 = require("react-dom");
8
+ // Renders tooltip floating OUTSIDE AG GRID cell
9
+ const TooltipBox = ({ wrapper, title, position }) => {
10
+ const theme = (0, material_1.useTheme)();
11
+ const { iron } = theme.palette.app.color;
12
+ const rect = wrapper.getBoundingClientRect();
13
+ const baseStyles = {
14
+ position: "absolute",
15
+ zIndex: 999999,
16
+ background: iron[200],
17
+ color: iron[600],
18
+ padding: "4px 8px",
19
+ borderRadius: 4,
20
+ fontSize: 12,
21
+ pointerEvents: "none",
22
+ whiteSpace: "nowrap",
23
+ transition: "opacity 0.2s ease, transform 0.2s ease",
24
+ opacity: 1,
25
+ };
26
+ const arrowSize = 6;
27
+ const arrowStyles = {
28
+ position: "absolute",
29
+ width: 0,
30
+ height: 0,
31
+ borderStyle: "solid",
32
+ };
33
+ switch (position) {
34
+ case "top":
35
+ baseStyles.top = rect.top - 28;
36
+ baseStyles.left = rect.left + rect.width / 2;
37
+ baseStyles.transform = "translateX(-50%)";
38
+ Object.assign(arrowStyles, {
39
+ borderWidth: `${arrowSize}px ${arrowSize}px 0 ${arrowSize}px`,
40
+ borderColor: `${iron[200]} transparent transparent transparent`,
41
+ bottom: -arrowSize,
42
+ left: "50%",
43
+ transform: "translateX(-50%)",
44
+ });
45
+ break;
46
+ case "bottom":
47
+ baseStyles.top = rect.bottom + 4;
48
+ baseStyles.left = rect.left + rect.width / 2;
49
+ baseStyles.transform = "translateX(-50%)";
50
+ Object.assign(arrowStyles, {
51
+ borderWidth: `0 ${arrowSize}px ${arrowSize}px ${arrowSize}px`,
52
+ borderColor: `transparent transparent ${iron[200]} transparent`,
53
+ top: -arrowSize,
54
+ left: "50%",
55
+ transform: "translateX(-50%)",
56
+ });
57
+ break;
58
+ case "left":
59
+ baseStyles.top = rect.top + rect.height / 2;
60
+ baseStyles.left = rect.left - 8;
61
+ baseStyles.transform = "translateY(-50%)";
62
+ Object.assign(arrowStyles, {
63
+ borderWidth: `${arrowSize}px 0 ${arrowSize}px ${arrowSize}px`,
64
+ borderColor: `transparent transparent transparent ${iron[200]}`,
65
+ right: -arrowSize,
66
+ top: "50%",
67
+ transform: "translateY(-50%)",
68
+ });
69
+ break;
70
+ case "right":
71
+ baseStyles.top = rect.top + rect.height / 2;
72
+ baseStyles.left = rect.right + 8;
73
+ baseStyles.transform = "translateY(-50%)";
74
+ Object.assign(arrowStyles, {
75
+ borderWidth: `${arrowSize}px ${arrowSize}px ${arrowSize}px 0`,
76
+ borderColor: `transparent ${iron[200]} transparent transparent`,
77
+ left: -arrowSize,
78
+ top: "50%",
79
+ transform: "translateY(-50%)",
80
+ });
81
+ break;
82
+ }
83
+ return ((0, jsx_runtime_1.jsxs)("div", { style: baseStyles, children: [title, (0, jsx_runtime_1.jsx)("div", { style: arrowStyles })] }));
84
+ };
85
+ const SmartTooltip = ({ children, title, position = "top", delay = 50, }) => {
86
+ const [visible, setVisible] = (0, react_1.useState)(false);
87
+ const wrapperRef = (0, react_1.useRef)(null);
88
+ const timeoutRef = (0, react_1.useRef)(null);
89
+ const handleMouseEnter = () => {
90
+ if (timeoutRef.current) {
91
+ clearTimeout(timeoutRef.current);
92
+ }
93
+ timeoutRef.current = setTimeout(() => setVisible(true), delay);
94
+ };
95
+ const handleMouseLeave = () => {
96
+ if (timeoutRef.current) {
97
+ clearTimeout(timeoutRef.current);
98
+ }
99
+ setVisible(false);
100
+ };
101
+ (0, react_1.useEffect)(() => {
102
+ return () => {
103
+ if (timeoutRef.current) {
104
+ clearTimeout(timeoutRef.current);
105
+ }
106
+ };
107
+ }, []);
108
+ const tooltipContent = visible && title && wrapperRef.current
109
+ ? (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)(TooltipBox, { wrapper: wrapperRef.current, title: title, position: position }), document.body)
110
+ : null;
111
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { ref: wrapperRef, style: { display: "inline-block", width: "100%" }, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave, children: children }), tooltipContent] }));
112
+ };
113
+ exports.SmartTooltip = SmartTooltip;
@@ -0,0 +1,4 @@
1
+ export * from "./SmartSelectField";
2
+ export * from "./SmartTooltip";
3
+ export * from "./SmartTextField";
4
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/SmartGrid/Components/EditableFields/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,kBAAkB,CAAC"}
@@ -0,0 +1,19 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./SmartSelectField"), exports);
18
+ __exportStar(require("./SmartTooltip"), exports);
19
+ __exportStar(require("./SmartTextField"), exports);
@@ -0,0 +1,2 @@
1
+ export * from "./EditableFields";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/SmartGrid/Components/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./EditableFields"), exports);
@@ -1,4 +1,5 @@
1
1
  export * from "./SmartGrid";
2
2
  export * from "./types/index";
3
3
  export * from "./hooks/useExportToExcel";
4
+ export * from "./Components";
4
5
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/SmartGrid/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/SmartGrid/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,0BAA0B,CAAC;AACzC,cAAc,cAAc,CAAC"}
@@ -17,3 +17,4 @@ Object.defineProperty(exports, "__esModule", { value: true });
17
17
  __exportStar(require("./SmartGrid"), exports);
18
18
  __exportStar(require("./types/index"), exports);
19
19
  __exportStar(require("./hooks/useExportToExcel"), exports);
20
+ __exportStar(require("./Components"), exports);