@addsign/moje-agenda-shared-lib 2.0.48 → 2.0.49
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.
|
@@ -41,6 +41,7 @@ const Resizable = ({
|
|
|
41
41
|
const dx = e2.clientX - startPos.x;
|
|
42
42
|
const newWidth = w + dx + "px";
|
|
43
43
|
parent == null ? void 0 : parent.style.setProperty("width", newWidth);
|
|
44
|
+
parent == null ? void 0 : parent.style.setProperty("min-width", newWidth);
|
|
44
45
|
setWidth(newWidth);
|
|
45
46
|
};
|
|
46
47
|
const handleMouseUp = () => {
|
|
@@ -60,8 +61,10 @@ const Resizable = ({
|
|
|
60
61
|
const parent = node.parentElement;
|
|
61
62
|
if (node.parentNode !== ((_b = (_a = node.parentNode) == null ? void 0 : _a.parentNode) == null ? void 0 : _b.lastChild)) {
|
|
62
63
|
parent == null ? void 0 : parent.style.setProperty("width", `${width}`);
|
|
64
|
+
parent == null ? void 0 : parent.style.setProperty("min-width", `${width}`);
|
|
63
65
|
} else {
|
|
64
66
|
parent == null ? void 0 : parent.style.setProperty("width", `auto`);
|
|
67
|
+
parent == null ? void 0 : parent.style.setProperty("min-width", `auto`);
|
|
65
68
|
}
|
|
66
69
|
node.addEventListener("mousedown", handleMouseDown);
|
|
67
70
|
return () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Resizable.js","sources":["../../../lib/components/datatable/Resizable.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\r\n\r\ninterface IResizableProps {\r\n tableId: string;\r\n colKey: string;\r\n children: any;\r\n defaultWidth: string;\r\n}\r\n\r\nexport const Resizable = ({\r\n tableId,\r\n colKey,\r\n defaultWidth,\r\n children,\r\n}: IResizableProps) => {\r\n const [node, setNode] = React.useState<HTMLElement | null>(null);\r\n\r\n const [width, setWidth] = useState(() => {\r\n const storageKey = `datatable:${tableId}`;\r\n const storedData = localStorage.getItem(storageKey);\r\n const data = storedData ? JSON.parse(storedData) : {};\r\n\r\n const columnWidths = data.columnWidths || {};\r\n const storedWidth = columnWidths[colKey];\r\n return storedWidth ? storedWidth : defaultWidth;\r\n });\r\n\r\n //storing sizes\r\n useEffect(() => {\r\n const storageKey = `datatable:${tableId}`;\r\n const storedData = localStorage.getItem(storageKey);\r\n const data = storedData ? JSON.parse(storedData) : {};\r\n\r\n data.columnWidths = data.columnWidths || {};\r\n data.columnWidths[colKey] = width;\r\n\r\n localStorage.setItem(storageKey, JSON.stringify(data));\r\n }, [width, tableId, colKey, defaultWidth]);\r\n\r\n const ref = React.useCallback((nodeEle: HTMLElement) => {\r\n setNode(nodeEle);\r\n }, []);\r\n\r\n const handleMouseDown = React.useCallback(\r\n (e: MouseEvent) => {\r\n if (!node) {\r\n return;\r\n }\r\n\r\n const parent = node.parentElement;\r\n const startPos = {\r\n x: e.clientX,\r\n y: e.clientY,\r\n };\r\n // const styles = window.getComputedStyle(parent);\r\n const styles = parent ? window.getComputedStyle(parent) : null;\r\n\r\n const w = parseInt(styles?.width || \"0\", 10);\r\n\r\n const handleMouseMove = (e: MouseEvent) => {\r\n const dx = e.clientX - startPos.x;\r\n const newWidth = w + dx + \"px\";\r\n\r\n parent?.style.setProperty(\"width\", newWidth);\r\n setWidth(newWidth);\r\n };\r\n\r\n const handleMouseUp = () => {\r\n document.removeEventListener(\"mousemove\", handleMouseMove);\r\n document.removeEventListener(\"mouseup\", handleMouseUp);\r\n };\r\n\r\n document.addEventListener(\"mousemove\", handleMouseMove);\r\n document.addEventListener(\"mouseup\", handleMouseUp);\r\n },\r\n [node]\r\n );\r\n\r\n React.useEffect(() => {\r\n if (!node) {\r\n return;\r\n }\r\n\r\n const parent = node.parentElement;\r\n if (node.parentNode !== node.parentNode?.parentNode?.lastChild) {\r\n parent?.style.setProperty(\"width\", `${width}`);\r\n } else {\r\n parent?.style.setProperty(\"width\", `auto`);\r\n }\r\n\r\n node.addEventListener(\"mousedown\", handleMouseDown);\r\n\r\n return () => {\r\n node.removeEventListener(\"mousedown\", handleMouseDown);\r\n };\r\n }, [node, handleMouseDown, tableId]);\r\n\r\n return children({ ref });\r\n};\r\n"],"names":["React","e"],"mappings":";AASO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACrB,QAAM,CAAC,MAAM,OAAO,IAAIA,eAAM,SAA6B,IAAI;AAE/D,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,MAAM;AACjC,UAAA,aAAa,aAAa,OAAO;AACjC,UAAA,aAAa,aAAa,QAAQ,UAAU;AAClD,UAAM,OAAO,aAAa,KAAK,MAAM,UAAU,IAAI;AAE7C,UAAA,eAAe,KAAK,gBAAgB;AACpC,UAAA,cAAc,aAAa,MAAM;AACvC,WAAO,cAAc,cAAc;AAAA,EAAA,CACpC;AAGD,YAAU,MAAM;AACR,UAAA,aAAa,aAAa,OAAO;AACjC,UAAA,aAAa,aAAa,QAAQ,UAAU;AAClD,UAAM,OAAO,aAAa,KAAK,MAAM,UAAU,IAAI;AAE9C,SAAA,eAAe,KAAK,gBAAgB,CAAA;AACpC,SAAA,aAAa,MAAM,IAAI;AAE5B,iBAAa,QAAQ,YAAY,KAAK,UAAU,IAAI,CAAC;AAAA,KACpD,CAAC,OAAO,SAAS,QAAQ,YAAY,CAAC;AAEzC,QAAM,MAAMA,eAAM,YAAY,CAAC,YAAyB;AACtD,YAAQ,OAAO;AAAA,EACjB,GAAG,CAAE,CAAA;AAEL,QAAM,kBAAkBA,eAAM;AAAA,IAC5B,CAAC,MAAkB;AACjB,UAAI,CAAC,MAAM;AACT;AAAA,MACF;AAEA,YAAM,SAAS,KAAK;AACpB,YAAM,WAAW;AAAA,QACf,GAAG,EAAE;AAAA,QACL,GAAG,EAAE;AAAA,MAAA;AAGP,YAAM,SAAS,SAAS,OAAO,iBAAiB,MAAM,IAAI;AAE1D,YAAM,IAAI,UAAS,iCAAQ,UAAS,KAAK,EAAE;AAErC,YAAA,kBAAkB,CAACC,OAAkB;AACnC,cAAA,KAAKA,GAAE,UAAU,SAAS;AAC1B,cAAA,WAAW,IAAI,KAAK;AAElB,yCAAA,MAAM,YAAY,SAAS;
|
|
1
|
+
{"version":3,"file":"Resizable.js","sources":["../../../lib/components/datatable/Resizable.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\r\n\r\ninterface IResizableProps {\r\n tableId: string;\r\n colKey: string;\r\n children: any;\r\n defaultWidth: string;\r\n}\r\n\r\nexport const Resizable = ({\r\n tableId,\r\n colKey,\r\n defaultWidth,\r\n children,\r\n}: IResizableProps) => {\r\n const [node, setNode] = React.useState<HTMLElement | null>(null);\r\n\r\n const [width, setWidth] = useState(() => {\r\n const storageKey = `datatable:${tableId}`;\r\n const storedData = localStorage.getItem(storageKey);\r\n const data = storedData ? JSON.parse(storedData) : {};\r\n\r\n const columnWidths = data.columnWidths || {};\r\n const storedWidth = columnWidths[colKey];\r\n return storedWidth ? storedWidth : defaultWidth;\r\n });\r\n\r\n //storing sizes\r\n useEffect(() => {\r\n const storageKey = `datatable:${tableId}`;\r\n const storedData = localStorage.getItem(storageKey);\r\n const data = storedData ? JSON.parse(storedData) : {};\r\n\r\n data.columnWidths = data.columnWidths || {};\r\n data.columnWidths[colKey] = width;\r\n\r\n localStorage.setItem(storageKey, JSON.stringify(data));\r\n }, [width, tableId, colKey, defaultWidth]);\r\n\r\n const ref = React.useCallback((nodeEle: HTMLElement) => {\r\n setNode(nodeEle);\r\n }, []);\r\n\r\n const handleMouseDown = React.useCallback(\r\n (e: MouseEvent) => {\r\n if (!node) {\r\n return;\r\n }\r\n\r\n const parent = node.parentElement;\r\n const startPos = {\r\n x: e.clientX,\r\n y: e.clientY,\r\n };\r\n // const styles = window.getComputedStyle(parent);\r\n const styles = parent ? window.getComputedStyle(parent) : null;\r\n\r\n const w = parseInt(styles?.width || \"0\", 10);\r\n\r\n const handleMouseMove = (e: MouseEvent) => {\r\n const dx = e.clientX - startPos.x;\r\n const newWidth = w + dx + \"px\";\r\n\r\n parent?.style.setProperty(\"width\", newWidth);\r\n parent?.style.setProperty(\"min-width\", newWidth);\r\n setWidth(newWidth);\r\n };\r\n\r\n const handleMouseUp = () => {\r\n document.removeEventListener(\"mousemove\", handleMouseMove);\r\n document.removeEventListener(\"mouseup\", handleMouseUp);\r\n };\r\n\r\n document.addEventListener(\"mousemove\", handleMouseMove);\r\n document.addEventListener(\"mouseup\", handleMouseUp);\r\n },\r\n [node]\r\n );\r\n\r\n React.useEffect(() => {\r\n if (!node) {\r\n return;\r\n }\r\n\r\n const parent = node.parentElement;\r\n if (node.parentNode !== node.parentNode?.parentNode?.lastChild) {\r\n parent?.style.setProperty(\"width\", `${width}`);\r\n parent?.style.setProperty(\"min-width\", `${width}`);\r\n } else {\r\n parent?.style.setProperty(\"width\", `auto`);\r\n parent?.style.setProperty(\"min-width\", `auto`);\r\n }\r\n\r\n node.addEventListener(\"mousedown\", handleMouseDown);\r\n\r\n return () => {\r\n node.removeEventListener(\"mousedown\", handleMouseDown);\r\n };\r\n }, [node, handleMouseDown, tableId]);\r\n\r\n return children({ ref });\r\n};\r\n"],"names":["React","e"],"mappings":";AASO,MAAM,YAAY,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAuB;AACrB,QAAM,CAAC,MAAM,OAAO,IAAIA,eAAM,SAA6B,IAAI;AAE/D,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,MAAM;AACjC,UAAA,aAAa,aAAa,OAAO;AACjC,UAAA,aAAa,aAAa,QAAQ,UAAU;AAClD,UAAM,OAAO,aAAa,KAAK,MAAM,UAAU,IAAI;AAE7C,UAAA,eAAe,KAAK,gBAAgB;AACpC,UAAA,cAAc,aAAa,MAAM;AACvC,WAAO,cAAc,cAAc;AAAA,EAAA,CACpC;AAGD,YAAU,MAAM;AACR,UAAA,aAAa,aAAa,OAAO;AACjC,UAAA,aAAa,aAAa,QAAQ,UAAU;AAClD,UAAM,OAAO,aAAa,KAAK,MAAM,UAAU,IAAI;AAE9C,SAAA,eAAe,KAAK,gBAAgB,CAAA;AACpC,SAAA,aAAa,MAAM,IAAI;AAE5B,iBAAa,QAAQ,YAAY,KAAK,UAAU,IAAI,CAAC;AAAA,KACpD,CAAC,OAAO,SAAS,QAAQ,YAAY,CAAC;AAEzC,QAAM,MAAMA,eAAM,YAAY,CAAC,YAAyB;AACtD,YAAQ,OAAO;AAAA,EACjB,GAAG,CAAE,CAAA;AAEL,QAAM,kBAAkBA,eAAM;AAAA,IAC5B,CAAC,MAAkB;AACjB,UAAI,CAAC,MAAM;AACT;AAAA,MACF;AAEA,YAAM,SAAS,KAAK;AACpB,YAAM,WAAW;AAAA,QACf,GAAG,EAAE;AAAA,QACL,GAAG,EAAE;AAAA,MAAA;AAGP,YAAM,SAAS,SAAS,OAAO,iBAAiB,MAAM,IAAI;AAE1D,YAAM,IAAI,UAAS,iCAAQ,UAAS,KAAK,EAAE;AAErC,YAAA,kBAAkB,CAACC,OAAkB;AACnC,cAAA,KAAKA,GAAE,UAAU,SAAS;AAC1B,cAAA,WAAW,IAAI,KAAK;AAElB,yCAAA,MAAM,YAAY,SAAS;AAC3B,yCAAA,MAAM,YAAY,aAAa;AACvC,iBAAS,QAAQ;AAAA,MAAA;AAGnB,YAAM,gBAAgB,MAAM;AACjB,iBAAA,oBAAoB,aAAa,eAAe;AAChD,iBAAA,oBAAoB,WAAW,aAAa;AAAA,MAAA;AAG9C,eAAA,iBAAiB,aAAa,eAAe;AAC7C,eAAA,iBAAiB,WAAW,aAAa;AAAA,IACpD;AAAA,IACA,CAAC,IAAI;AAAA,EAAA;AAGPD,iBAAM,UAAU,MAAM;;AACpB,QAAI,CAAC,MAAM;AACT;AAAA,IACF;AAEA,UAAM,SAAS,KAAK;AACpB,QAAI,KAAK,iBAAe,gBAAK,eAAL,mBAAiB,eAAjB,mBAA6B,YAAW;AAC9D,uCAAQ,MAAM,YAAY,SAAS,GAAG,KAAK;AAC3C,uCAAQ,MAAM,YAAY,aAAa,GAAG,KAAK;AAAA,IAAE,OAC5C;AACG,uCAAA,MAAM,YAAY,SAAS;AAC3B,uCAAA,MAAM,YAAY,aAAa;AAAA,IACzC;AAEK,SAAA,iBAAiB,aAAa,eAAe;AAElD,WAAO,MAAM;AACN,WAAA,oBAAoB,aAAa,eAAe;AAAA,IAAA;AAAA,EAEtD,GAAA,CAAC,MAAM,iBAAiB,OAAO,CAAC;AAE5B,SAAA,SAAS,EAAE,IAAA,CAAK;AACzB;"}
|
|
@@ -62,6 +62,7 @@ export const Resizable = ({
|
|
|
62
62
|
const newWidth = w + dx + "px";
|
|
63
63
|
|
|
64
64
|
parent?.style.setProperty("width", newWidth);
|
|
65
|
+
parent?.style.setProperty("min-width", newWidth);
|
|
65
66
|
setWidth(newWidth);
|
|
66
67
|
};
|
|
67
68
|
|
|
@@ -84,8 +85,10 @@ export const Resizable = ({
|
|
|
84
85
|
const parent = node.parentElement;
|
|
85
86
|
if (node.parentNode !== node.parentNode?.parentNode?.lastChild) {
|
|
86
87
|
parent?.style.setProperty("width", `${width}`);
|
|
88
|
+
parent?.style.setProperty("min-width", `${width}`);
|
|
87
89
|
} else {
|
|
88
90
|
parent?.style.setProperty("width", `auto`);
|
|
91
|
+
parent?.style.setProperty("min-width", `auto`);
|
|
89
92
|
}
|
|
90
93
|
|
|
91
94
|
node.addEventListener("mousedown", handleMouseDown);
|