@xyo-network/react-shared 2.25.70 → 2.25.71

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 (15) hide show
  1. package/dist/esm/components/TableCell/EllipsisTableCell.js +5 -3
  2. package/dist/esm/components/TableCell/EllipsisTableCell.js.map +1 -1
  3. package/dist/esm/components/TableCell/getRemainingRowWidth.js +1 -2
  4. package/dist/esm/components/TableCell/getRemainingRowWidth.js.map +1 -1
  5. package/dist/esm/lib/getActualPaddingX.d.ts +13 -0
  6. package/dist/esm/lib/getActualPaddingX.js +63 -0
  7. package/dist/esm/lib/getActualPaddingX.js.map +1 -0
  8. package/dist/esm/lib/index.d.ts +1 -0
  9. package/dist/esm/lib/index.js +1 -0
  10. package/dist/esm/lib/index.js.map +1 -1
  11. package/package.json +1 -1
  12. package/src/components/TableCell/EllipsisTableCell.tsx +6 -2
  13. package/src/components/TableCell/getRemainingRowWidth.ts +1 -2
  14. package/src/lib/getActualPaddingX.ts +61 -0
  15. package/src/lib/index.ts +1 -0
package/dist/esm/components/TableCell/EllipsisTableCell.js CHANGED
@@ -1,7 +1,8 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
- import { TableCell, Typography, useTheme } from '@mui/material';
2
+ import { TableCell, Typography } from '@mui/material';
3
3
  import { LinkEx } from '@xylabs/react-common';
4
4
  import { useEffect, useRef, useState } from 'react';
5
+ import { getActualPaddingX } from '../../lib';
5
6
  import { findParent } from './findParent';
6
7
  import { getRemainingRowWidth } from './getRemainingRowWidth';
7
8
  import { getSmallestParentWidth } from './getSmallestParentWidth';
@@ -18,7 +19,6 @@ const TableCellValue = ({ style, hashCellWidth, value, ...props }) => {
18
19
  export const EllipsisTableCell = ({ value, to, href, ...props }) => {
19
20
  const [calcCellWidth, setCalcCellWidth] = useState(0);
20
21
  const hashDivRef = useRef(null);
21
- const theme = useTheme();
22
22
  useEffect(() => {
23
23
  const currentElement = hashDivRef.current?.parentElement;
24
24
  const cell = findParent('td', currentElement);
@@ -26,7 +26,9 @@ export const EllipsisTableCell = ({ value, to, href, ...props }) => {
26
26
  const checkWidth = (cell) => {
27
27
  const smallestParentWidth = getSmallestParentWidth(cell);
28
28
  if (smallestParentWidth && row) {
29
- const remainderWidth = smallestParentWidth - getRemainingRowWidth(row) - parseInt(theme.spacing(4).substring(0, -2)) * 4;
29
+ const remainingWidth = getRemainingRowWidth(row);
30
+ const actualPaddingX = getActualPaddingX(cell);
31
+ const remainderWidth = smallestParentWidth - remainingWidth - actualPaddingX;
30
32
  setCalcCellWidth(remainderWidth);
31
33
  }
32
34
  };
package/dist/esm/components/TableCell/EllipsisTableCell.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"EllipsisTableCell.js","sourceRoot":"","sources":["../../../../src/components/TableCell/EllipsisTableCell.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"EllipsisTableCell.js","sourceRoot":"","sources":["../../../../src/components/TableCell/EllipsisTableCell.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAkB,UAAU,EAA6B,MAAM,eAAe,CAAA;AAChG,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAA;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAGnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AACzC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAA;AAOjE,MAAM,cAAc,GAAkC,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAClG,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAC,OAAO,EACf,UAAU,EAAC,WAAW,EACtB,KAAK,EAAE;YACL,OAAO,EAAE,OAAO;YAChB,QAAQ,EAAE,aAAa;YACvB,QAAQ,EAAE,QAAQ;YAClB,YAAY,EAAE,UAAU;YACxB,UAAU,EAAE,QAAQ;YACpB,GAAG,KAAK;SACT,KACG,KAAK,YAER,KAAK,GACK,CACd,CAAA;AACH,CAAC,CAAA;AAQD,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACnG,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAS,CAAC,CAAC,CAAA;IAC7D,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAE/C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,EAAE,aAAa,CAAA;QACxD,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,EAAE,cAAc,CAAC,CAAA;QAC7C,MAAM,GAAG,GAAG,UAAU,CAAC,IAAI,EAAE,cAAc,CAAC,CAAA;QAE5C,MAAM,UAAU,GAAG,CAAC,IAAiB,EAAE,EAAE;YACvC,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,IAAI,CAAC,CAAA;YACxD,IAAI,mBAAmB,IAAI,GAAG,EAAE;gBAC9B,MAAM,cAAc,GAAG,oBAAoB,CAAC,GAAG,CAAC,CAAA;gBAChD,MAAM,cAAc,GAAG,iBAAiB,CAAC,IAAI,CAAC,CAAA;gBAC9C,MAAM,cAAc,GAAG,mBAAmB,GAAG,cAAc,GAAG,cAAc,CAAA;gBAC5E,gBAAgB,CAAC,cAAc,CAAC,CAAA;aACjC;QACH,CAAC,CAAA;QAED,MAAM,QAAQ,GAAG,GAAG,EAAE;YACpB,IAAI,IAAI,EAAE;gBACR,UAAU,CAAC,IAAI,CAAC,CAAA;aACjB;QACH,CAAC,CAAA;QAED,IAAI,IAAI,EAAE;YACR,UAAU,CAAC,IAAI,CAAC,CAAA;YAChB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;SAC5C;QACD,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAA;QAChD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,OAAO,CACL,KAAC,SAAS,OAAK,KAAK,YAClB,cACE,GAAG,EAAE,UAAU,EACf,KAAK,EAAE;gBACL,OAAO,EAAE,OAAO;gBAChB,QAAQ,EAAE,aAAa;gBACvB,QAAQ,EAAE,QAAQ;gBAClB,YAAY,EAAE,UAAU;gBACxB,UAAU,EAAE,QAAQ;aACrB,YAEA,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,CACZ,KAAC,MAAM,IAAC,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,YAC7D,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,aAAa,GAAI,GACvD,CACV,CAAC,CAAC,CAAC,CACF,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,EAAE,aAAa,EAAE,aAAa,GAAI,CAC/D,GACG,GACI,CACb,CAAA;AACH,CAAC,CAAA"}
package/dist/esm/components/TableCell/getRemainingRowWidth.js CHANGED
@@ -5,8 +5,7 @@ export const getRemainingRowWidth = (row, forCell = 0) => {
5
5
  const item = row?.children.item(i);
6
6
  if (item) {
7
7
  if (i !== forCell) {
8
- const boundingRect = item?.getBoundingClientRect();
9
- width += boundingRect?.width ?? 0;
8
+ width += item?.clientWidth ?? 0;
10
9
  }
11
10
  }
12
11
  }
package/dist/esm/components/TableCell/getRemainingRowWidth.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"getRemainingRowWidth.js","sourceRoot":"","sources":["../../../../src/components/TableCell/getRemainingRowWidth.ts"],"names":[],"mappings":"AAAA,mIAAmI;AACnI,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,GAAgB,EAAE,OAAO,GAAG,CAAC,EAAE,EAAE;IACpE,IAAI,KAAK,GAAG,CAAC,CAAA;IACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,EAAE,iBAAiB,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACtD,MAAM,IAAI,GAAG,GAAG,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;QAClC,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,KAAK,OAAO,EAAE;gBACjB,MAAM,YAAY,GAAG,IAAI,EAAE,qBAAqB,EAAE,CAAA;gBAClD,KAAK,IAAI,YAAY,EAAE,KAAK,IAAI,CAAC,CAAA;aAClC;SACF;KACF;IAED,OAAO,KAAK,CAAA;AACd,CAAC,CAAA"}
1
+ {"version":3,"file":"getRemainingRowWidth.js","sourceRoot":"","sources":["../../../../src/components/TableCell/getRemainingRowWidth.ts"],"names":[],"mappings":"AAAA,mIAAmI;AACnI,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,GAAgB,EAAE,OAAO,GAAG,CAAC,EAAE,EAAE;IACpE,IAAI,KAAK,GAAG,CAAC,CAAA;IACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,EAAE,iBAAiB,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACtD,MAAM,IAAI,GAAG,GAAG,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;QAClC,IAAI,IAAI,EAAE;YACR,IAAI,CAAC,KAAK,OAAO,EAAE;gBACjB,KAAK,IAAI,IAAI,EAAE,WAAW,IAAI,CAAC,CAAA;aAChC;SACF;KACF;IAED,OAAO,KAAK,CAAA;AACd,CAAC,CAAA"}
package/dist/esm/lib/getActualPaddingX.d.ts ADDED
@@ -0,0 +1,13 @@
1
+ export declare const parseMeausureString: (measure?: string, absolute?: number) => number | undefined;
2
+ export declare const parsePadding: (padding: string) => {
3
+ bottom: string;
4
+ left: string;
5
+ right: string;
6
+ top: string;
7
+ } | {
8
+ bottom: string;
9
+ right: string;
10
+ top: string;
11
+ left?: undefined;
12
+ } | undefined;
13
+ export declare const getActualPaddingX: (element: HTMLElement) => number;
package/dist/esm/lib/getActualPaddingX.js ADDED
@@ -0,0 +1,63 @@
1
+ export const parseMeausureString = (measure, absolute) => {
2
+ if (measure !== undefined && measure !== null && measure.length > 0) {
3
+ if (measure.endsWith('px')) {
4
+ return parseFloat(measure.substring(0, measure.length - 2));
5
+ }
6
+ else if (measure.endsWith('%')) {
7
+ if (absolute !== undefined) {
8
+ return (parseFloat(measure.substring(0, measure.length - 1)) / 100) * absolute;
9
+ }
10
+ throw Error('Error Parsing Measure [missing absolute]');
11
+ }
12
+ else if (measure.endsWith('vw')) {
13
+ return (parseFloat(measure.substring(0, measure.length - 2)) / 100) * window.innerWidth;
14
+ }
15
+ else if (measure.endsWith('vh')) {
16
+ return (parseFloat(measure.substring(0, measure.length - 2)) / 100) * window.innerHeight;
17
+ }
18
+ throw Error(`Error Parsing Measure [${measure}]`);
19
+ }
20
+ };
21
+ export const parsePadding = (padding) => {
22
+ const parts = padding.split(' ');
23
+ switch (parts.length) {
24
+ case 4: {
25
+ return {
26
+ bottom: parts[2],
27
+ left: parts[3],
28
+ right: parts[1],
29
+ top: parts[0],
30
+ };
31
+ }
32
+ case 3: {
33
+ return {
34
+ bottom: parts[2],
35
+ right: parts[1],
36
+ top: parts[0],
37
+ };
38
+ }
39
+ case 2: {
40
+ return {
41
+ bottom: parts[0],
42
+ left: parts[1],
43
+ right: parts[1],
44
+ top: parts[0],
45
+ };
46
+ }
47
+ case 1: {
48
+ return {
49
+ bottom: parts[0],
50
+ left: parts[0],
51
+ right: parts[0],
52
+ top: parts[0],
53
+ };
54
+ }
55
+ }
56
+ };
57
+ export const getActualPaddingX = (element) => {
58
+ const padding = parsePadding(window.getComputedStyle(element, null).getPropertyValue('padding'));
59
+ const paddingLeft = parseMeausureString(window.getComputedStyle(element, null).getPropertyValue('padding-left') ?? padding?.left, element.clientWidth) ?? 0;
60
+ const paddingRight = parseMeausureString(window.getComputedStyle(element, null).getPropertyValue('padding-right') ?? padding?.right, element.clientWidth) ?? 0;
61
+ return paddingLeft + paddingRight;
62
+ };
63
+ //# sourceMappingURL=getActualPaddingX.js.map
package/dist/esm/lib/getActualPaddingX.js.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getActualPaddingX.js","sourceRoot":"","sources":["../../../src/lib/getActualPaddingX.ts"],"names":[],"mappings":"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"}
package/dist/esm/lib/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  export * from './archivistPresets';
2
2
  export * from './assertDefinedEx';
3
3
  export * from './divinerPresets';
4
+ export * from './getActualPaddingX';
4
5
  export * from './networkComponents';
package/dist/esm/lib/index.js CHANGED
@@ -1,5 +1,6 @@
1
1
  export * from './archivistPresets';
2
2
  export * from './assertDefinedEx';
3
3
  export * from './divinerPresets';
4
+ export * from './getActualPaddingX';
4
5
  export * from './networkComponents';
5
6
  //# sourceMappingURL=index.js.map
package/dist/esm/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,qBAAqB,CAAA"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,qBAAqB,CAAA;AACnC,cAAc,qBAAqB,CAAA"}
package/package.json CHANGED
@@ -88,6 +88,6 @@
88
88
  },
89
89
  "sideEffects": false,
90
90
  "types": "dist/esm/index.d.ts",
91
- "version": "2.25.70",
91
+ "version": "2.25.71",
92
92
  "packageManager": "yarn@3.1.1"
93
93
  }
package/src/components/TableCell/EllipsisTableCell.tsx CHANGED
@@ -3,6 +3,7 @@ import { LinkEx } from '@xylabs/react-common'
3
3
  import { useEffect, useRef, useState } from 'react'
4
4
  import { To } from 'react-router-dom'
5
5
 
6
+ import { getActualPaddingX } from '../../lib'
6
7
  import { findParent } from './findParent'
7
8
  import { getRemainingRowWidth } from './getRemainingRowWidth'
8
9
  import { getSmallestParentWidth } from './getSmallestParentWidth'
@@ -41,7 +42,6 @@ export interface EllipsisTableCellProps extends TableCellProps {
41
42
  export const EllipsisTableCell: React.FC<EllipsisTableCellProps> = ({ value, to, href, ...props }) => {
42
43
  const [calcCellWidth, setCalcCellWidth] = useState<number>(0)
43
44
  const hashDivRef = useRef<HTMLDivElement>(null)
44
- const theme = useTheme()
45
45
 
46
46
  useEffect(() => {
47
47
  const currentElement = hashDivRef.current?.parentElement
@@ -51,7 +51,9 @@ export const EllipsisTableCell: React.FC<EllipsisTableCellProps> = ({ value, to,
51
51
  const checkWidth = (cell: HTMLElement) => {
52
52
  const smallestParentWidth = getSmallestParentWidth(cell)
53
53
  if (smallestParentWidth && row) {
54
- const remainderWidth = smallestParentWidth - getRemainingRowWidth(row) - parseInt(theme.spacing(4).substring(0, -2)) * 4
54
+ const remainingWidth = getRemainingRowWidth(row)
55
+ const actualPaddingX = getActualPaddingX(cell)
56
+ const remainderWidth = smallestParentWidth - remainingWidth - actualPaddingX
55
57
  setCalcCellWidth(remainderWidth)
56
58
  }
57
59
  }
@@ -64,9 +66,11 @@ export const EllipsisTableCell: React.FC<EllipsisTableCellProps> = ({ value, to,
64
66
 
65
67
  if (cell) {
66
68
  checkWidth(cell)
69
+ row?.addEventListener('resize', onResize)
67
70
  window.addEventListener('resize', onResize)
68
71
  }
69
72
  return () => {
73
+ row?.removeEventListener('resize', onResize)
70
74
  window.removeEventListener('resize', onResize)
71
75
  }
72
76
  }, [hashDivRef])
package/src/components/TableCell/getRemainingRowWidth.ts CHANGED
@@ -5,8 +5,7 @@ export const getRemainingRowWidth = (row: HTMLElement, forCell = 0) => {
5
5
  const item = row?.children.item(i)
6
6
  if (item) {
7
7
  if (i !== forCell) {
8
- const boundingRect = item?.getBoundingClientRect()
9
- width += boundingRect?.width ?? 0
8
+ width += item?.clientWidth ?? 0
10
9
  }
11
10
  }
12
11
  }
package/src/lib/getActualPaddingX.ts ADDED
@@ -0,0 +1,61 @@
1
+ export const parseMeausureString = (measure?: string, absolute?: number) => {
2
+ if (measure !== undefined && measure !== null && measure.length > 0) {
3
+ if (measure.endsWith('px')) {
4
+ return parseFloat(measure.substring(0, measure.length - 2))
5
+ } else if (measure.endsWith('%')) {
6
+ if (absolute !== undefined) {
7
+ return (parseFloat(measure.substring(0, measure.length - 1)) / 100) * absolute
8
+ }
9
+ throw Error('Error Parsing Measure [missing absolute]')
10
+ } else if (measure.endsWith('vw')) {
11
+ return (parseFloat(measure.substring(0, measure.length - 2)) / 100) * window.innerWidth
12
+ } else if (measure.endsWith('vh')) {
13
+ return (parseFloat(measure.substring(0, measure.length - 2)) / 100) * window.innerHeight
14
+ }
15
+ throw Error(`Error Parsing Measure [${measure}]`)
16
+ }
17
+ }
18
+
19
+ export const parsePadding = (padding: string) => {
20
+ const parts = padding.split(' ')
21
+ switch (parts.length) {
22
+ case 4: {
23
+ return {
24
+ bottom: parts[2],
25
+ left: parts[3],
26
+ right: parts[1],
27
+ top: parts[0],
28
+ }
29
+ }
30
+ case 3: {
31
+ return {
32
+ bottom: parts[2],
33
+ right: parts[1],
34
+ top: parts[0],
35
+ }
36
+ }
37
+ case 2: {
38
+ return {
39
+ bottom: parts[0],
40
+ left: parts[1],
41
+ right: parts[1],
42
+ top: parts[0],
43
+ }
44
+ }
45
+ case 1: {
46
+ return {
47
+ bottom: parts[0],
48
+ left: parts[0],
49
+ right: parts[0],
50
+ top: parts[0],
51
+ }
52
+ }
53
+ }
54
+ }
55
+
56
+ export const getActualPaddingX = (element: HTMLElement) => {
57
+ const padding = parsePadding(window.getComputedStyle(element, null).getPropertyValue('padding'))
58
+ const paddingLeft = parseMeausureString(window.getComputedStyle(element, null).getPropertyValue('padding-left') ?? padding?.left, element.clientWidth) ?? 0
59
+ const paddingRight = parseMeausureString(window.getComputedStyle(element, null).getPropertyValue('padding-right') ?? padding?.right, element.clientWidth) ?? 0
60
+ return paddingLeft + paddingRight
61
+ }
package/src/lib/index.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  export * from './archivistPresets'
2
2
  export * from './assertDefinedEx'
3
3
  export * from './divinerPresets'
4
+ export * from './getActualPaddingX'
4
5
  export * from './networkComponents'