@veeqo/ui 14.14.0-beta-1 → 14.14.0

package/dist/components/DataTable/hooks/useCellWidths.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useCellWidths.cjs","sources":["../../../../src/components/DataTable/hooks/useCellWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState, useCallback } from 'react';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nexport function useCellWidths(\n  tableRef: RefObject<HTMLElement>,\n  containerRef: RefObject<HTMLElement>,\n) {\n  const [cellWidths, setCellWidths] = useState<number[]>([]);\n\n  const updateCellWidths = useCallback(() => {\n    if (!tableRef.current) return;\n\n    requestAnimationFrame(() => {\n      const cells = tableRef.current?.querySelectorAll('tbody tr:first-child td');\n      if (!cells) return;\n\n      const widths = Array.from(cells).map((cell) => cell.getBoundingClientRect().width);\n      setCellWidths(widths);\n    });\n  }, [tableRef]);\n\n  useEffect(() => {\n    updateCellWidths();\n  }, [updateCellWidths]);\n\n  useEffect(() => {\n    if (!containerRef.current) return undefined;\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      if (entries[0].contentRect) {\n        updateCellWidths();\n      }\n    });\n\n    resizeObserver.observe(containerRef.current);\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [containerRef, updateCellWidths]);\n\n  return cellWidths;\n}\n"],"names":["useState","useCallback","useEffect","ResizeObserver"],"mappings":";;;;;;;;;AAGM,SAAU,aAAa,CAC3B,QAAgC,EAChC,YAAoC,EAAA;IAEpC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAW,EAAE,CAAC;AAE1D,IAAA,MAAM,gBAAgB,GAAGC,iBAAW,CAAC,MAAK;QACxC,IAAI,CAAC,QAAQ,CAAC,OAAO;YAAE;QAEvB,qBAAqB,CAAC,MAAK;;YACzB,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,gBAAgB,CAAC,yBAAyB,CAAC;AAC3E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;YAClF,aAAa,CAAC,MAAM,CAAC;AACvB,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEdC,eAAS,CAAC,MAAK;AACb,QAAA,gBAAgB,EAAE;AACpB,IAAA,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAEtBA,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,YAAY,CAAC,OAAO;AAAE,YAAA,OAAO,SAAS;QAE3C,MAAM,cAAc,GAAG,IAAIC,+BAAc,CAAC,CAAC,OAAO,KAAI;AACpD,YAAA,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE;AAC1B,gBAAA,gBAAgB,EAAE;AACnB,YAAA;AACH,QAAA,CAAC,CAAC;AAEF,QAAA,cAAc,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;AAE5C,QAAA,OAAO,MAAK;YACV,cAAc,CAAC,UAAU,EAAE;AAC7B,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC;AAEpC,IAAA,OAAO,UAAU;AACnB;;;;"}
+{"version":3,"file":"useCellWidths.cjs","sources":["../../../../src/components/DataTable/hooks/useCellWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState, useCallback } from 'react';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nexport function useCellWidths(\n  tableRef: RefObject<HTMLElement | null>,\n  containerRef: RefObject<HTMLElement | null>,\n) {\n  const [cellWidths, setCellWidths] = useState<number[]>([]);\n\n  const updateCellWidths = useCallback(() => {\n    if (!tableRef.current) return;\n\n    requestAnimationFrame(() => {\n      const cells = tableRef.current?.querySelectorAll('tbody tr:first-child td');\n      if (!cells) return;\n\n      const widths = Array.from(cells).map((cell) => cell.getBoundingClientRect().width);\n      setCellWidths(widths);\n    });\n  }, [tableRef]);\n\n  useEffect(() => {\n    updateCellWidths();\n  }, [updateCellWidths]);\n\n  useEffect(() => {\n    if (!containerRef.current) return undefined;\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      if (entries[0].contentRect) {\n        updateCellWidths();\n      }\n    });\n\n    resizeObserver.observe(containerRef.current);\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [containerRef, updateCellWidths]);\n\n  return cellWidths;\n}\n"],"names":["useState","useCallback","useEffect","ResizeObserver"],"mappings":";;;;;;;;;AAGM,SAAU,aAAa,CAC3B,QAAuC,EACvC,YAA2C,EAAA;IAE3C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGA,cAAQ,CAAW,EAAE,CAAC;AAE1D,IAAA,MAAM,gBAAgB,GAAGC,iBAAW,CAAC,MAAK;QACxC,IAAI,CAAC,QAAQ,CAAC,OAAO;YAAE;QAEvB,qBAAqB,CAAC,MAAK;;YACzB,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,gBAAgB,CAAC,yBAAyB,CAAC;AAC3E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;YAClF,aAAa,CAAC,MAAM,CAAC;AACvB,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEdC,eAAS,CAAC,MAAK;AACb,QAAA,gBAAgB,EAAE;AACpB,IAAA,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAEtBA,eAAS,CAAC,MAAK;QACb,IAAI,CAAC,YAAY,CAAC,OAAO;AAAE,YAAA,OAAO,SAAS;QAE3C,MAAM,cAAc,GAAG,IAAIC,+BAAc,CAAC,CAAC,OAAO,KAAI;AACpD,YAAA,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE;AAC1B,gBAAA,gBAAgB,EAAE;AACnB,YAAA;AACH,QAAA,CAAC,CAAC;AAEF,QAAA,cAAc,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;AAE5C,QAAA,OAAO,MAAK;YACV,cAAc,CAAC,UAAU,EAAE;AAC7B,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC;AAEpC,IAAA,OAAO,UAAU;AACnB;;;;"}

package/dist/components/DataTable/hooks/useCellWidths.d.ts

@@ -1,2 +1,2 @@
 import { RefObject } from 'react';
-export declare function useCellWidths(tableRef: RefObject<HTMLElement>, containerRef: RefObject<HTMLElement>): number[];
+export declare function useCellWidths(tableRef: RefObject<HTMLElement | null>, containerRef: RefObject<HTMLElement | null>): number[];

package/dist/components/DataTable/hooks/useCellWidths.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCellWidths.js","sources":["../../../../src/components/DataTable/hooks/useCellWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState, useCallback } from 'react';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nexport function useCellWidths(\n  tableRef: RefObject<HTMLElement>,\n  containerRef: RefObject<HTMLElement>,\n) {\n  const [cellWidths, setCellWidths] = useState<number[]>([]);\n\n  const updateCellWidths = useCallback(() => {\n    if (!tableRef.current) return;\n\n    requestAnimationFrame(() => {\n      const cells = tableRef.current?.querySelectorAll('tbody tr:first-child td');\n      if (!cells) return;\n\n      const widths = Array.from(cells).map((cell) => cell.getBoundingClientRect().width);\n      setCellWidths(widths);\n    });\n  }, [tableRef]);\n\n  useEffect(() => {\n    updateCellWidths();\n  }, [updateCellWidths]);\n\n  useEffect(() => {\n    if (!containerRef.current) return undefined;\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      if (entries[0].contentRect) {\n        updateCellWidths();\n      }\n    });\n\n    resizeObserver.observe(containerRef.current);\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [containerRef, updateCellWidths]);\n\n  return cellWidths;\n}\n"],"names":[],"mappings":";;;AAGM,SAAU,aAAa,CAC3B,QAAgC,EAChC,YAAoC,EAAA;IAEpC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAW,EAAE,CAAC;AAE1D,IAAA,MAAM,gBAAgB,GAAG,WAAW,CAAC,MAAK;QACxC,IAAI,CAAC,QAAQ,CAAC,OAAO;YAAE;QAEvB,qBAAqB,CAAC,MAAK;;YACzB,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,gBAAgB,CAAC,yBAAyB,CAAC;AAC3E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;YAClF,aAAa,CAAC,MAAM,CAAC;AACvB,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,SAAS,CAAC,MAAK;AACb,QAAA,gBAAgB,EAAE;AACpB,IAAA,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAEtB,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,YAAY,CAAC,OAAO;AAAE,YAAA,OAAO,SAAS;QAE3C,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,CAAC,OAAO,KAAI;AACpD,YAAA,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE;AAC1B,gBAAA,gBAAgB,EAAE;AACnB,YAAA;AACH,QAAA,CAAC,CAAC;AAEF,QAAA,cAAc,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;AAE5C,QAAA,OAAO,MAAK;YACV,cAAc,CAAC,UAAU,EAAE;AAC7B,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC;AAEpC,IAAA,OAAO,UAAU;AACnB;;;;"}
+{"version":3,"file":"useCellWidths.js","sources":["../../../../src/components/DataTable/hooks/useCellWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState, useCallback } from 'react';\nimport ResizeObserver from 'resize-observer-polyfill';\n\nexport function useCellWidths(\n  tableRef: RefObject<HTMLElement | null>,\n  containerRef: RefObject<HTMLElement | null>,\n) {\n  const [cellWidths, setCellWidths] = useState<number[]>([]);\n\n  const updateCellWidths = useCallback(() => {\n    if (!tableRef.current) return;\n\n    requestAnimationFrame(() => {\n      const cells = tableRef.current?.querySelectorAll('tbody tr:first-child td');\n      if (!cells) return;\n\n      const widths = Array.from(cells).map((cell) => cell.getBoundingClientRect().width);\n      setCellWidths(widths);\n    });\n  }, [tableRef]);\n\n  useEffect(() => {\n    updateCellWidths();\n  }, [updateCellWidths]);\n\n  useEffect(() => {\n    if (!containerRef.current) return undefined;\n\n    const resizeObserver = new ResizeObserver((entries) => {\n      if (entries[0].contentRect) {\n        updateCellWidths();\n      }\n    });\n\n    resizeObserver.observe(containerRef.current);\n\n    return () => {\n      resizeObserver.disconnect();\n    };\n  }, [containerRef, updateCellWidths]);\n\n  return cellWidths;\n}\n"],"names":[],"mappings":";;;AAGM,SAAU,aAAa,CAC3B,QAAuC,EACvC,YAA2C,EAAA;IAE3C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAW,EAAE,CAAC;AAE1D,IAAA,MAAM,gBAAgB,GAAG,WAAW,CAAC,MAAK;QACxC,IAAI,CAAC,QAAQ,CAAC,OAAO;YAAE;QAEvB,qBAAqB,CAAC,MAAK;;YACzB,MAAM,KAAK,GAAG,CAAA,EAAA,GAAA,QAAQ,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,gBAAgB,CAAC,yBAAyB,CAAC;AAC3E,YAAA,IAAI,CAAC,KAAK;gBAAE;YAEZ,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,qBAAqB,EAAE,CAAC,KAAK,CAAC;YAClF,aAAa,CAAC,MAAM,CAAC;AACvB,QAAA,CAAC,CAAC;AACJ,IAAA,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC;IAEd,SAAS,CAAC,MAAK;AACb,QAAA,gBAAgB,EAAE;AACpB,IAAA,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC;IAEtB,SAAS,CAAC,MAAK;QACb,IAAI,CAAC,YAAY,CAAC,OAAO;AAAE,YAAA,OAAO,SAAS;QAE3C,MAAM,cAAc,GAAG,IAAI,cAAc,CAAC,CAAC,OAAO,KAAI;AACpD,YAAA,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE;AAC1B,gBAAA,gBAAgB,EAAE;AACnB,YAAA;AACH,QAAA,CAAC,CAAC;AAEF,QAAA,cAAc,CAAC,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC;AAE5C,QAAA,OAAO,MAAK;YACV,cAAc,CAAC,UAAU,EAAE;AAC7B,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC;AAEpC,IAAA,OAAO,UAAU;AACnB;;;;"}

package/dist/components/DataTable/hooks/useColumnWidths.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useColumnWidths.cjs","sources":["../../../../src/components/DataTable/hooks/useColumnWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState } from 'react';\nimport {\n  ColumnConfig,\n  ColumnConfigs,\n  ColumnWidthsType,\n  ColumnWidthHandler,\n  ColumnWidthType,\n  ColumnId,\n} from '../types';\nimport { customEventEmitter } from '../utils/customEventEmitter';\n\nexport const useColumnWidths = ({\n  tableRef,\n  columns,\n  columnIds,\n  columnWidths: initialColumnWidths,\n}: {\n  tableRef: RefObject<HTMLElement>;\n  columns: ColumnConfigs;\n  columnIds: ColumnId[];\n  columnWidths?: ColumnWidthsType;\n}) => {\n  const getColumnWidths = (cols: ColumnConfigs) =>\n    cols.reduce((obj: ColumnWidthsType, item: ColumnConfig) => {\n      // eslint-disable-next-line no-param-reassign\n      obj[item.id] = item.width;\n      return obj;\n    }, {});\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidthsType>(initialColumnWidths || {});\n\n  const setColumnWidth: ColumnWidthHandler = ({ columnId, width }) => {\n    const calculateWidth = (column: ColumnConfig, lastColumn: boolean) => {\n      if (lastColumn) return columnWidths[column.id] || column.width;\n      const val: ColumnWidthType =\n        columnWidths[column.id] ||\n        column.width ||\n        tableRef.current?.querySelector(`th[data-columnid=\"${column.id}\"]`)?.getBoundingClientRect()\n          ?.width ||\n        undefined;\n      return val;\n    };\n\n    const newColumnWidths: ColumnWidthsType = { ...columnWidths };\n    columns.forEach((column, i) => {\n      const lastColumn = i === columns.length - 1;\n      const newWidth = column.id === columnId ? width : calculateWidth(column, lastColumn);\n\n      newColumnWidths[column.id] = newWidth;\n    });\n    setColumnWidths(newColumnWidths);\n    customEventEmitter('columnWidthUpdated', {\n      tableRef,\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      columnWidths: newColumnWidths,\n    });\n    return newColumnWidths;\n  };\n\n  useEffect(() => {\n    const widths = getColumnWidths(columns);\n    const newColumnWidths = initialColumnWidths ? { ...columnWidths } : widths;\n    Object.keys(widths).forEach((key) => {\n      if (typeof columnWidths[key] === undefined) {\n        newColumnWidths[key] = widths[key];\n      }\n    });\n    setColumnWidths(newColumnWidths);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(columnIds)]);\n\n  /** This is used to set column widths when new columns are passed into the DataTable, is used when persisting table widths */\n  useEffect(() => {\n    if (!initialColumnWidths) return;\n    setColumnWidths(initialColumnWidths);\n  }, [initialColumnWidths]);\n\n  return {\n    setColumnWidth,\n    columnWidths,\n  };\n};\n"],"names":["useState","customEventEmitter","useEffect"],"mappings":"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"}
+{"version":3,"file":"useColumnWidths.cjs","sources":["../../../../src/components/DataTable/hooks/useColumnWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState } from 'react';\nimport {\n  ColumnConfig,\n  ColumnConfigs,\n  ColumnWidthsType,\n  ColumnWidthHandler,\n  ColumnWidthType,\n  ColumnId,\n} from '../types';\nimport { customEventEmitter } from '../utils/customEventEmitter';\n\nexport const useColumnWidths = ({\n  tableRef,\n  columns,\n  columnIds,\n  columnWidths: initialColumnWidths,\n}: {\n  tableRef: RefObject<HTMLElement | null>;\n  columns: ColumnConfigs;\n  columnIds: ColumnId[];\n  columnWidths?: ColumnWidthsType;\n}) => {\n  const getColumnWidths = (cols: ColumnConfigs) =>\n    cols.reduce((obj: ColumnWidthsType, item: ColumnConfig) => {\n      // eslint-disable-next-line no-param-reassign\n      obj[item.id] = item.width;\n      return obj;\n    }, {});\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidthsType>(initialColumnWidths || {});\n\n  const setColumnWidth: ColumnWidthHandler = ({ columnId, width }) => {\n    const calculateWidth = (column: ColumnConfig, lastColumn: boolean) => {\n      if (lastColumn) return columnWidths[column.id] || column.width;\n      const val: ColumnWidthType =\n        columnWidths[column.id] ||\n        column.width ||\n        tableRef.current?.querySelector(`th[data-columnid=\"${column.id}\"]`)?.getBoundingClientRect()\n          ?.width ||\n        undefined;\n      return val;\n    };\n\n    const newColumnWidths: ColumnWidthsType = { ...columnWidths };\n    columns.forEach((column, i) => {\n      const lastColumn = i === columns.length - 1;\n      const newWidth = column.id === columnId ? width : calculateWidth(column, lastColumn);\n\n      newColumnWidths[column.id] = newWidth;\n    });\n    setColumnWidths(newColumnWidths);\n    customEventEmitter('columnWidthUpdated', {\n      tableRef,\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      columnWidths: newColumnWidths,\n    });\n    return newColumnWidths;\n  };\n\n  useEffect(() => {\n    const widths = getColumnWidths(columns);\n    const newColumnWidths = initialColumnWidths ? { ...columnWidths } : widths;\n    Object.keys(widths).forEach((key) => {\n      if (typeof columnWidths[key] === undefined) {\n        newColumnWidths[key] = widths[key];\n      }\n    });\n    setColumnWidths(newColumnWidths);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(columnIds)]);\n\n  /** This is used to set column widths when new columns are passed into the DataTable, is used when persisting table widths */\n  useEffect(() => {\n    if (!initialColumnWidths) return;\n    setColumnWidths(initialColumnWidths);\n  }, [initialColumnWidths]);\n\n  return {\n    setColumnWidth,\n    columnWidths,\n  };\n};\n"],"names":["useState","customEventEmitter","useEffect"],"mappings":"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"}

package/dist/components/DataTable/hooks/useColumnWidths.d.ts

@@ -1,7 +1,7 @@
 import { RefObject } from 'react';
 import { ColumnConfigs, ColumnWidthsType, ColumnWidthHandler, ColumnId } from '../types';
 export declare const useColumnWidths: ({ tableRef, columns, columnIds, columnWidths: initialColumnWidths, }: {
-    tableRef: RefObject<HTMLElement>;
+    tableRef: RefObject<HTMLElement | null>;
     columns: ColumnConfigs;
     columnIds: ColumnId[];
     columnWidths?: ColumnWidthsType | undefined;

package/dist/components/DataTable/hooks/useColumnWidths.js.map

@@ -1 +1 @@
-{"version":3,"file":"useColumnWidths.js","sources":["../../../../src/components/DataTable/hooks/useColumnWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState } from 'react';\nimport {\n  ColumnConfig,\n  ColumnConfigs,\n  ColumnWidthsType,\n  ColumnWidthHandler,\n  ColumnWidthType,\n  ColumnId,\n} from '../types';\nimport { customEventEmitter } from '../utils/customEventEmitter';\n\nexport const useColumnWidths = ({\n  tableRef,\n  columns,\n  columnIds,\n  columnWidths: initialColumnWidths,\n}: {\n  tableRef: RefObject<HTMLElement>;\n  columns: ColumnConfigs;\n  columnIds: ColumnId[];\n  columnWidths?: ColumnWidthsType;\n}) => {\n  const getColumnWidths = (cols: ColumnConfigs) =>\n    cols.reduce((obj: ColumnWidthsType, item: ColumnConfig) => {\n      // eslint-disable-next-line no-param-reassign\n      obj[item.id] = item.width;\n      return obj;\n    }, {});\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidthsType>(initialColumnWidths || {});\n\n  const setColumnWidth: ColumnWidthHandler = ({ columnId, width }) => {\n    const calculateWidth = (column: ColumnConfig, lastColumn: boolean) => {\n      if (lastColumn) return columnWidths[column.id] || column.width;\n      const val: ColumnWidthType =\n        columnWidths[column.id] ||\n        column.width ||\n        tableRef.current?.querySelector(`th[data-columnid=\"${column.id}\"]`)?.getBoundingClientRect()\n          ?.width ||\n        undefined;\n      return val;\n    };\n\n    const newColumnWidths: ColumnWidthsType = { ...columnWidths };\n    columns.forEach((column, i) => {\n      const lastColumn = i === columns.length - 1;\n      const newWidth = column.id === columnId ? width : calculateWidth(column, lastColumn);\n\n      newColumnWidths[column.id] = newWidth;\n    });\n    setColumnWidths(newColumnWidths);\n    customEventEmitter('columnWidthUpdated', {\n      tableRef,\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      columnWidths: newColumnWidths,\n    });\n    return newColumnWidths;\n  };\n\n  useEffect(() => {\n    const widths = getColumnWidths(columns);\n    const newColumnWidths = initialColumnWidths ? { ...columnWidths } : widths;\n    Object.keys(widths).forEach((key) => {\n      if (typeof columnWidths[key] === undefined) {\n        newColumnWidths[key] = widths[key];\n      }\n    });\n    setColumnWidths(newColumnWidths);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(columnIds)]);\n\n  /** This is used to set column widths when new columns are passed into the DataTable, is used when persisting table widths */\n  useEffect(() => {\n    if (!initialColumnWidths) return;\n    setColumnWidths(initialColumnWidths);\n  }, [initialColumnWidths]);\n\n  return {\n    setColumnWidth,\n    columnWidths,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"useColumnWidths.js","sources":["../../../../src/components/DataTable/hooks/useColumnWidths.ts"],"sourcesContent":["import { RefObject, useEffect, useState } from 'react';\nimport {\n  ColumnConfig,\n  ColumnConfigs,\n  ColumnWidthsType,\n  ColumnWidthHandler,\n  ColumnWidthType,\n  ColumnId,\n} from '../types';\nimport { customEventEmitter } from '../utils/customEventEmitter';\n\nexport const useColumnWidths = ({\n  tableRef,\n  columns,\n  columnIds,\n  columnWidths: initialColumnWidths,\n}: {\n  tableRef: RefObject<HTMLElement | null>;\n  columns: ColumnConfigs;\n  columnIds: ColumnId[];\n  columnWidths?: ColumnWidthsType;\n}) => {\n  const getColumnWidths = (cols: ColumnConfigs) =>\n    cols.reduce((obj: ColumnWidthsType, item: ColumnConfig) => {\n      // eslint-disable-next-line no-param-reassign\n      obj[item.id] = item.width;\n      return obj;\n    }, {});\n\n  const [columnWidths, setColumnWidths] = useState<ColumnWidthsType>(initialColumnWidths || {});\n\n  const setColumnWidth: ColumnWidthHandler = ({ columnId, width }) => {\n    const calculateWidth = (column: ColumnConfig, lastColumn: boolean) => {\n      if (lastColumn) return columnWidths[column.id] || column.width;\n      const val: ColumnWidthType =\n        columnWidths[column.id] ||\n        column.width ||\n        tableRef.current?.querySelector(`th[data-columnid=\"${column.id}\"]`)?.getBoundingClientRect()\n          ?.width ||\n        undefined;\n      return val;\n    };\n\n    const newColumnWidths: ColumnWidthsType = { ...columnWidths };\n    columns.forEach((column, i) => {\n      const lastColumn = i === columns.length - 1;\n      const newWidth = column.id === columnId ? width : calculateWidth(column, lastColumn);\n\n      newColumnWidths[column.id] = newWidth;\n    });\n    setColumnWidths(newColumnWidths);\n    customEventEmitter('columnWidthUpdated', {\n      tableRef,\n      // eslint-disable-next-line @typescript-eslint/no-shadow\n      columnWidths: newColumnWidths,\n    });\n    return newColumnWidths;\n  };\n\n  useEffect(() => {\n    const widths = getColumnWidths(columns);\n    const newColumnWidths = initialColumnWidths ? { ...columnWidths } : widths;\n    Object.keys(widths).forEach((key) => {\n      if (typeof columnWidths[key] === undefined) {\n        newColumnWidths[key] = widths[key];\n      }\n    });\n    setColumnWidths(newColumnWidths);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(columnIds)]);\n\n  /** This is used to set column widths when new columns are passed into the DataTable, is used when persisting table widths */\n  useEffect(() => {\n    if (!initialColumnWidths) return;\n    setColumnWidths(initialColumnWidths);\n  }, [initialColumnWidths]);\n\n  return {\n    setColumnWidth,\n    columnWidths,\n  };\n};\n"],"names":[],"mappings":"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"}

package/dist/components/DataTable/hooks/useColumns.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useColumns.cjs","sources":["../../../../src/components/DataTable/hooks/useColumns.ts"],"sourcesContent":["import { RefObject, useCallback } from 'react';\nimport { ColumnConfigs, ColumnWidthState, ColumnWidthsType, ResizeColumnData } from '../types';\nimport { useColumnWidths } from './useColumnWidths';\n\nexport function useColumns(\n  columns: ColumnConfigs,\n  tableRef: RefObject<HTMLElement>,\n  onResizeColumns?: (columnWidths: ResizeColumnData) => void,\n  columnWidths?: ColumnWidthsType,\n) {\n  const { columnWidths: finalColumnWidths, setColumnWidth: originalSetColumnWidth } =\n    useColumnWidths({\n      tableRef,\n      columns,\n      columnIds: columns.map(({ id }) => id),\n      columnWidths,\n    });\n\n  const setColumnWidth = useCallback(\n    ({ columnId, width }: ColumnWidthState) => {\n      const updatedColumnWidths = originalSetColumnWidth({ columnId, width });\n\n      if (onResizeColumns) {\n        onResizeColumns(updatedColumnWidths || finalColumnWidths);\n      }\n    },\n    [originalSetColumnWidth, onResizeColumns, finalColumnWidths],\n  );\n\n  const visible = columns.filter((col) => col.hidden !== true);\n  const pinnedLeft = visible.filter((col) => col.pinned === 'left');\n  const pinnedRight = visible.filter((col) => col.pinned === 'right');\n  const notPinned = visible.filter((col) => col.pinned === 'none' || !col.pinned);\n\n  return {\n    visible: [...pinnedLeft, ...notPinned, ...pinnedRight],\n    columnWidths: finalColumnWidths,\n    pinnedLeft,\n    pinnedRight,\n    setColumnWidth,\n  };\n}\n"],"names":["useColumnWidths","useCallback"],"mappings":";;;;;AAIM,SAAU,UAAU,CACxB,OAAsB,EACtB,QAAgC,EAChC,eAA0D,EAC1D,YAA+B,EAAA;IAE/B,MAAM,EAAE,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,sBAAsB,EAAE,GAC/EA,+BAAe,CAAC;QACd,QAAQ;QACR,OAAO;AACP,QAAA,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC;QACtC,YAAY;AACb,KAAA,CAAC;IAEJ,MAAM,cAAc,GAAGC,iBAAW,CAChC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAoB,KAAI;QACxC,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;AAEvE,QAAA,IAAI,eAAe,EAAE;AACnB,YAAA,eAAe,CAAC,mBAAmB,IAAI,iBAAiB,CAAC;AAC1D,QAAA;IACH,CAAC,EACD,CAAC,sBAAsB,EAAE,eAAe,EAAE,iBAAiB,CAAC,CAC7D;AAED,IAAA,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,IAAI,CAAC;AAC5D,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,CAAC;AACjE,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,OAAO,CAAC;IACnE,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;IAE/E,OAAO;QACL,OAAO,EAAE,CAAC,GAAG,UAAU,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;AACtD,QAAA,YAAY,EAAE,iBAAiB;QAC/B,UAAU;QACV,WAAW;QACX,cAAc;KACf;AACH;;;;"}
+{"version":3,"file":"useColumns.cjs","sources":["../../../../src/components/DataTable/hooks/useColumns.ts"],"sourcesContent":["import { RefObject, useCallback } from 'react';\nimport { ColumnConfigs, ColumnWidthState, ColumnWidthsType, ResizeColumnData } from '../types';\nimport { useColumnWidths } from './useColumnWidths';\n\nexport function useColumns(\n  columns: ColumnConfigs,\n  tableRef: RefObject<HTMLElement | null>,\n  onResizeColumns?: (columnWidths: ResizeColumnData) => void,\n  columnWidths?: ColumnWidthsType,\n) {\n  const { columnWidths: finalColumnWidths, setColumnWidth: originalSetColumnWidth } =\n    useColumnWidths({\n      tableRef,\n      columns,\n      columnIds: columns.map(({ id }) => id),\n      columnWidths,\n    });\n\n  const setColumnWidth = useCallback(\n    ({ columnId, width }: ColumnWidthState) => {\n      const updatedColumnWidths = originalSetColumnWidth({ columnId, width });\n\n      if (onResizeColumns) {\n        onResizeColumns(updatedColumnWidths || finalColumnWidths);\n      }\n    },\n    [originalSetColumnWidth, onResizeColumns, finalColumnWidths],\n  );\n\n  const visible = columns.filter((col) => col.hidden !== true);\n  const pinnedLeft = visible.filter((col) => col.pinned === 'left');\n  const pinnedRight = visible.filter((col) => col.pinned === 'right');\n  const notPinned = visible.filter((col) => col.pinned === 'none' || !col.pinned);\n\n  return {\n    visible: [...pinnedLeft, ...notPinned, ...pinnedRight],\n    columnWidths: finalColumnWidths,\n    pinnedLeft,\n    pinnedRight,\n    setColumnWidth,\n  };\n}\n"],"names":["useColumnWidths","useCallback"],"mappings":";;;;;AAIM,SAAU,UAAU,CACxB,OAAsB,EACtB,QAAuC,EACvC,eAA0D,EAC1D,YAA+B,EAAA;IAE/B,MAAM,EAAE,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,sBAAsB,EAAE,GAC/EA,+BAAe,CAAC;QACd,QAAQ;QACR,OAAO;AACP,QAAA,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC;QACtC,YAAY;AACb,KAAA,CAAC;IAEJ,MAAM,cAAc,GAAGC,iBAAW,CAChC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAoB,KAAI;QACxC,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;AAEvE,QAAA,IAAI,eAAe,EAAE;AACnB,YAAA,eAAe,CAAC,mBAAmB,IAAI,iBAAiB,CAAC;AAC1D,QAAA;IACH,CAAC,EACD,CAAC,sBAAsB,EAAE,eAAe,EAAE,iBAAiB,CAAC,CAC7D;AAED,IAAA,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,IAAI,CAAC;AAC5D,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,CAAC;AACjE,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,OAAO,CAAC;IACnE,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;IAE/E,OAAO;QACL,OAAO,EAAE,CAAC,GAAG,UAAU,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;AACtD,QAAA,YAAY,EAAE,iBAAiB;QAC/B,UAAU;QACV,WAAW;QACX,cAAc;KACf;AACH;;;;"}

package/dist/components/DataTable/hooks/useColumns.d.ts

@@ -1,6 +1,6 @@
 import { RefObject } from 'react';
 import { ColumnConfigs, ColumnWidthState, ColumnWidthsType, ResizeColumnData } from '../types';
-export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<HTMLElement>, onResizeColumns?: (columnWidths: ResizeColumnData) => void, columnWidths?: ColumnWidthsType): {
+export declare function useColumns(columns: ColumnConfigs, tableRef: RefObject<HTMLElement | null>, onResizeColumns?: (columnWidths: ResizeColumnData) => void, columnWidths?: ColumnWidthsType): {
     visible: import("../types").ColumnConfig[];
     columnWidths: ColumnWidthsType;
     pinnedLeft: import("../types").ColumnConfig[];

package/dist/components/DataTable/hooks/useColumns.js.map

@@ -1 +1 @@
-{"version":3,"file":"useColumns.js","sources":["../../../../src/components/DataTable/hooks/useColumns.ts"],"sourcesContent":["import { RefObject, useCallback } from 'react';\nimport { ColumnConfigs, ColumnWidthState, ColumnWidthsType, ResizeColumnData } from '../types';\nimport { useColumnWidths } from './useColumnWidths';\n\nexport function useColumns(\n  columns: ColumnConfigs,\n  tableRef: RefObject<HTMLElement>,\n  onResizeColumns?: (columnWidths: ResizeColumnData) => void,\n  columnWidths?: ColumnWidthsType,\n) {\n  const { columnWidths: finalColumnWidths, setColumnWidth: originalSetColumnWidth } =\n    useColumnWidths({\n      tableRef,\n      columns,\n      columnIds: columns.map(({ id }) => id),\n      columnWidths,\n    });\n\n  const setColumnWidth = useCallback(\n    ({ columnId, width }: ColumnWidthState) => {\n      const updatedColumnWidths = originalSetColumnWidth({ columnId, width });\n\n      if (onResizeColumns) {\n        onResizeColumns(updatedColumnWidths || finalColumnWidths);\n      }\n    },\n    [originalSetColumnWidth, onResizeColumns, finalColumnWidths],\n  );\n\n  const visible = columns.filter((col) => col.hidden !== true);\n  const pinnedLeft = visible.filter((col) => col.pinned === 'left');\n  const pinnedRight = visible.filter((col) => col.pinned === 'right');\n  const notPinned = visible.filter((col) => col.pinned === 'none' || !col.pinned);\n\n  return {\n    visible: [...pinnedLeft, ...notPinned, ...pinnedRight],\n    columnWidths: finalColumnWidths,\n    pinnedLeft,\n    pinnedRight,\n    setColumnWidth,\n  };\n}\n"],"names":[],"mappings":";;;AAIM,SAAU,UAAU,CACxB,OAAsB,EACtB,QAAgC,EAChC,eAA0D,EAC1D,YAA+B,EAAA;IAE/B,MAAM,EAAE,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,sBAAsB,EAAE,GAC/E,eAAe,CAAC;QACd,QAAQ;QACR,OAAO;AACP,QAAA,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC;QACtC,YAAY;AACb,KAAA,CAAC;IAEJ,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAoB,KAAI;QACxC,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;AAEvE,QAAA,IAAI,eAAe,EAAE;AACnB,YAAA,eAAe,CAAC,mBAAmB,IAAI,iBAAiB,CAAC;AAC1D,QAAA;IACH,CAAC,EACD,CAAC,sBAAsB,EAAE,eAAe,EAAE,iBAAiB,CAAC,CAC7D;AAED,IAAA,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,IAAI,CAAC;AAC5D,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,CAAC;AACjE,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,OAAO,CAAC;IACnE,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;IAE/E,OAAO;QACL,OAAO,EAAE,CAAC,GAAG,UAAU,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;AACtD,QAAA,YAAY,EAAE,iBAAiB;QAC/B,UAAU;QACV,WAAW;QACX,cAAc;KACf;AACH;;;;"}
+{"version":3,"file":"useColumns.js","sources":["../../../../src/components/DataTable/hooks/useColumns.ts"],"sourcesContent":["import { RefObject, useCallback } from 'react';\nimport { ColumnConfigs, ColumnWidthState, ColumnWidthsType, ResizeColumnData } from '../types';\nimport { useColumnWidths } from './useColumnWidths';\n\nexport function useColumns(\n  columns: ColumnConfigs,\n  tableRef: RefObject<HTMLElement | null>,\n  onResizeColumns?: (columnWidths: ResizeColumnData) => void,\n  columnWidths?: ColumnWidthsType,\n) {\n  const { columnWidths: finalColumnWidths, setColumnWidth: originalSetColumnWidth } =\n    useColumnWidths({\n      tableRef,\n      columns,\n      columnIds: columns.map(({ id }) => id),\n      columnWidths,\n    });\n\n  const setColumnWidth = useCallback(\n    ({ columnId, width }: ColumnWidthState) => {\n      const updatedColumnWidths = originalSetColumnWidth({ columnId, width });\n\n      if (onResizeColumns) {\n        onResizeColumns(updatedColumnWidths || finalColumnWidths);\n      }\n    },\n    [originalSetColumnWidth, onResizeColumns, finalColumnWidths],\n  );\n\n  const visible = columns.filter((col) => col.hidden !== true);\n  const pinnedLeft = visible.filter((col) => col.pinned === 'left');\n  const pinnedRight = visible.filter((col) => col.pinned === 'right');\n  const notPinned = visible.filter((col) => col.pinned === 'none' || !col.pinned);\n\n  return {\n    visible: [...pinnedLeft, ...notPinned, ...pinnedRight],\n    columnWidths: finalColumnWidths,\n    pinnedLeft,\n    pinnedRight,\n    setColumnWidth,\n  };\n}\n"],"names":[],"mappings":";;;AAIM,SAAU,UAAU,CACxB,OAAsB,EACtB,QAAuC,EACvC,eAA0D,EAC1D,YAA+B,EAAA;IAE/B,MAAM,EAAE,YAAY,EAAE,iBAAiB,EAAE,cAAc,EAAE,sBAAsB,EAAE,GAC/E,eAAe,CAAC;QACd,QAAQ;QACR,OAAO;AACP,QAAA,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC;QACtC,YAAY;AACb,KAAA,CAAC;IAEJ,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAoB,KAAI;QACxC,MAAM,mBAAmB,GAAG,sBAAsB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC;AAEvE,QAAA,IAAI,eAAe,EAAE;AACnB,YAAA,eAAe,CAAC,mBAAmB,IAAI,iBAAiB,CAAC;AAC1D,QAAA;IACH,CAAC,EACD,CAAC,sBAAsB,EAAE,eAAe,EAAE,iBAAiB,CAAC,CAC7D;AAED,IAAA,MAAM,OAAO,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,IAAI,CAAC;AAC5D,IAAA,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,CAAC;AACjE,IAAA,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,OAAO,CAAC;IACnE,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,MAAM,KAAK,MAAM,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;IAE/E,OAAO;QACL,OAAO,EAAE,CAAC,GAAG,UAAU,EAAE,GAAG,SAAS,EAAE,GAAG,WAAW,CAAC;AACtD,QAAA,YAAY,EAAE,iBAAiB;QAC/B,UAAU;QACV,WAAW;QACX,cAAc;KACf;AACH;;;;"}

package/dist/components/DateInputField/types.d.ts

@@ -21,8 +21,8 @@ type CommonDateInputProps = FormComponentProps & {
     'aria-label'?: string;
     'aria-labelledby'?: string;
     'aria-describedby'?: string;
-    rangeRef?: React.RefObject<HTMLDivElement>;
-    rightActionRef?: React.RefObject<HTMLButtonElement>;
+    rangeRef?: React.RefObject<HTMLDivElement | null>;
+    rightActionRef?: React.RefObject<HTMLButtonElement | null>;
 } & DateValidationProps;
 type DateInputRangeProps = CommonDateInputProps & {
     isRangeInput: true;

package/dist/components/DimensionsInput/DimensionsInput.d.ts

@@ -8,18 +8,19 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     title?: string | undefined;
     pattern?: string | undefined;
     list?: string | undefined;
-    className?: string | undefined;
-    children?: React.ReactNode;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
     suppressHydrationWarning?: boolean | undefined;
     accessKey?: string | undefined;
+    autoCapitalize?: (string & {}) | "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined;
     autoFocus?: boolean | undefined;
-    contentEditable?: (boolean | "true" | "false") | "inherit" | undefined;
+    className?: string | undefined;
+    contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
     contextMenu?: string | undefined;
     dir?: string | undefined;
     draggable?: (boolean | "true" | "false") | undefined;
+    enterKeyHint?: "search" | "enter" | "done" | "go" | "next" | "previous" | "send" | undefined;
     hidden?: boolean | undefined;
     id?: string | undefined;
     lang?: string | undefined;
@@ -39,7 +40,6 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     rev?: string | undefined;
     typeof?: string | undefined;
     vocab?: string | undefined;
-    autoCapitalize?: string | undefined;
     autoCorrect?: string | undefined;
     autoSave?: string | undefined;
     color?: string | undefined;
@@ -50,57 +50,69 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     itemRef?: string | undefined;
     results?: number | undefined;
     security?: string | undefined;
-    unselectable?: "on" | "off" | undefined;
-    inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
+    unselectable?: "off" | "on" | undefined;
+    popover?: "" | "auto" | "manual" | "hint" | undefined;
+    popoverTargetAction?: "toggle" | "show" | "hide" | undefined;
+    popoverTarget?: string | undefined;
+    inert?: boolean | undefined;
+    inputMode?: "search" | "text" | "none" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
     is?: string | undefined;
-    'aria-activedescendant'?: string | undefined;
-    'aria-atomic'?: (boolean | "true" | "false") | undefined;
-    'aria-autocomplete'?: "list" | "none" | "inline" | "both" | undefined;
-    'aria-busy'?: (boolean | "true" | "false") | undefined;
-    'aria-checked'?: boolean | "true" | "false" | "mixed" | undefined;
-    'aria-colcount'?: number | undefined;
-    'aria-colindex'?: number | undefined;
-    'aria-colspan'?: number | undefined;
-    'aria-controls'?: string | undefined;
-    'aria-current'?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
-    'aria-describedby'?: string | undefined;
-    'aria-details'?: string | undefined;
-    'aria-disabled'?: (boolean | "true" | "false") | undefined;
-    'aria-dropeffect'?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
-    'aria-errormessage'?: string | undefined;
-    'aria-expanded'?: (boolean | "true" | "false") | undefined;
-    'aria-flowto'?: string | undefined;
-    'aria-grabbed'?: (boolean | "true" | "false") | undefined;
-    'aria-haspopup'?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
-    'aria-hidden'?: (boolean | "true" | "false") | undefined;
-    'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
-    'aria-keyshortcuts'?: string | undefined;
-    'aria-label'?: string | undefined;
-    'aria-labelledby'?: string | undefined;
-    'aria-level'?: number | undefined;
-    'aria-live'?: "off" | "assertive" | "polite" | undefined;
-    'aria-modal'?: (boolean | "true" | "false") | undefined;
-    'aria-multiline'?: (boolean | "true" | "false") | undefined;
-    'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
-    'aria-orientation'?: "horizontal" | "vertical" | undefined;
-    'aria-owns'?: string | undefined;
-    'aria-placeholder'?: string | undefined;
-    'aria-posinset'?: number | undefined;
-    'aria-pressed'?: boolean | "true" | "false" | "mixed" | undefined;
-    'aria-readonly'?: (boolean | "true" | "false") | undefined;
-    'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
-    'aria-required'?: (boolean | "true" | "false") | undefined;
-    'aria-roledescription'?: string | undefined;
-    'aria-rowcount'?: number | undefined;
-    'aria-rowindex'?: number | undefined;
-    'aria-rowspan'?: number | undefined;
-    'aria-selected'?: (boolean | "true" | "false") | undefined;
-    'aria-setsize'?: number | undefined;
-    'aria-sort'?: "other" | "none" | "ascending" | "descending" | undefined;
-    'aria-valuemax'?: number | undefined;
-    'aria-valuemin'?: number | undefined;
-    'aria-valuenow'?: number | undefined;
-    'aria-valuetext'?: string | undefined;
+    exportparts?: string | undefined;
+    part?: string | undefined;
+    "aria-activedescendant"?: string | undefined;
+    "aria-atomic"?: (boolean | "true" | "false") | undefined;
+    "aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
+    "aria-braillelabel"?: string | undefined;
+    "aria-brailleroledescription"?: string | undefined;
+    "aria-busy"?: (boolean | "true" | "false") | undefined;
+    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-colcount"?: number | undefined;
+    "aria-colindex"?: number | undefined;
+    "aria-colindextext"?: string | undefined;
+    "aria-colspan"?: number | undefined;
+    "aria-controls"?: string | undefined;
+    "aria-current"?: boolean | "time" | "true" | "false" | "page" | "step" | "location" | "date" | undefined;
+    "aria-describedby"?: string | undefined;
+    "aria-description"?: string | undefined;
+    "aria-details"?: string | undefined;
+    "aria-disabled"?: (boolean | "true" | "false") | undefined;
+    "aria-dropeffect"?: "link" | "none" | "copy" | "move" | "execute" | "popup" | undefined;
+    "aria-errormessage"?: string | undefined;
+    "aria-expanded"?: (boolean | "true" | "false") | undefined;
+    "aria-flowto"?: string | undefined;
+    "aria-grabbed"?: (boolean | "true" | "false") | undefined;
+    "aria-haspopup"?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree" | undefined;
+    "aria-hidden"?: (boolean | "true" | "false") | undefined;
+    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-keyshortcuts"?: string | undefined;
+    "aria-label"?: string | undefined;
+    "aria-labelledby"?: string | undefined;
+    "aria-level"?: number | undefined;
+    "aria-live"?: "off" | "assertive" | "polite" | undefined;
+    "aria-modal"?: (boolean | "true" | "false") | undefined;
+    "aria-multiline"?: (boolean | "true" | "false") | undefined;
+    "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
+    "aria-orientation"?: "horizontal" | "vertical" | undefined;
+    "aria-owns"?: string | undefined;
+    "aria-placeholder"?: string | undefined;
+    "aria-posinset"?: number | undefined;
+    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-readonly"?: (boolean | "true" | "false") | undefined;
+    "aria-relevant"?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-required"?: (boolean | "true" | "false") | undefined;
+    "aria-roledescription"?: string | undefined;
+    "aria-rowcount"?: number | undefined;
+    "aria-rowindex"?: number | undefined;
+    "aria-rowindextext"?: string | undefined;
+    "aria-rowspan"?: number | undefined;
+    "aria-selected"?: (boolean | "true" | "false") | undefined;
+    "aria-setsize"?: number | undefined;
+    "aria-sort"?: "other" | "none" | "ascending" | "descending" | undefined;
+    "aria-valuemax"?: number | undefined;
+    "aria-valuemin"?: number | undefined;
+    "aria-valuenow"?: number | undefined;
+    "aria-valuetext"?: string | undefined;
+    children?: React.ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined;
@@ -120,17 +132,17 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     onFocusCapture?: (React.FocusEventHandler<HTMLInputElement> & React.FocusEventHandler<HTMLTextAreaElement>) | undefined;
     onBlur?: (React.FocusEventHandler<HTMLInputElement> & React.FocusEventHandler<HTMLTextAreaElement>) | undefined;
     onBlurCapture?: (React.FocusEventHandler<HTMLInputElement> & React.FocusEventHandler<HTMLTextAreaElement>) | undefined;
-    onChangeCapture?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onBeforeInput?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onBeforeInputCapture?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onInput?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onInputCapture?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onReset?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onResetCapture?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onSubmit?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onSubmitCapture?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onInvalid?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
-    onInvalidCapture?: (React.FormEventHandler<HTMLInputElement> & React.FormEventHandler<HTMLTextAreaElement>) | undefined;
+    onChangeCapture?: (React.ChangeEventHandler<HTMLInputElement, Element> & React.ChangeEventHandler<HTMLTextAreaElement, Element>) | undefined;
+    onBeforeInput?: (React.InputEventHandler<HTMLInputElement> & React.InputEventHandler<HTMLTextAreaElement>) | undefined;
+    onBeforeInputCapture?: (React.InputEventHandler<HTMLInputElement> & React.InputEventHandler<HTMLTextAreaElement>) | undefined;
+    onInput?: (React.InputEventHandler<HTMLInputElement> & React.InputEventHandler<HTMLTextAreaElement>) | undefined;
+    onInputCapture?: (React.InputEventHandler<HTMLInputElement> & React.InputEventHandler<HTMLTextAreaElement>) | undefined;
+    onReset?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
+    onResetCapture?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
+    onSubmit?: (React.SubmitEventHandler<HTMLInputElement> & React.SubmitEventHandler<HTMLTextAreaElement>) | undefined;
+    onSubmitCapture?: (React.SubmitEventHandler<HTMLInputElement> & React.SubmitEventHandler<HTMLTextAreaElement>) | undefined;
+    onInvalid?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
+    onInvalidCapture?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
     onLoad?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
     onLoadCapture?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
     onError?: (React.ReactEventHandler<HTMLInputElement> & React.ReactEventHandler<HTMLTextAreaElement>) | undefined;
@@ -240,9 +252,7 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     onPointerCancel?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onPointerCancelCapture?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onPointerEnter?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
-    onPointerEnterCapture?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onPointerLeave?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
-    onPointerLeaveCapture?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onPointerOver?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onPointerOverCapture?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onPointerOut?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
@@ -253,6 +263,8 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     onLostPointerCaptureCapture?: (React.PointerEventHandler<HTMLInputElement> & React.PointerEventHandler<HTMLTextAreaElement>) | undefined;
     onScroll?: (React.UIEventHandler<HTMLInputElement> & React.UIEventHandler<HTMLTextAreaElement>) | undefined;
     onScrollCapture?: (React.UIEventHandler<HTMLInputElement> & React.UIEventHandler<HTMLTextAreaElement>) | undefined;
+    onScrollEnd?: (React.UIEventHandler<HTMLInputElement> & React.UIEventHandler<HTMLTextAreaElement>) | undefined;
+    onScrollEndCapture?: (React.UIEventHandler<HTMLInputElement> & React.UIEventHandler<HTMLTextAreaElement>) | undefined;
     onWheel?: (React.WheelEventHandler<HTMLInputElement> & React.WheelEventHandler<HTMLTextAreaElement>) | undefined;
     onWheelCapture?: (React.WheelEventHandler<HTMLInputElement> & React.WheelEventHandler<HTMLTextAreaElement>) | undefined;
     onAnimationStart?: (React.AnimationEventHandler<HTMLInputElement> & React.AnimationEventHandler<HTMLTextAreaElement>) | undefined;
@@ -261,10 +273,18 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     onAnimationEndCapture?: (React.AnimationEventHandler<HTMLInputElement> & React.AnimationEventHandler<HTMLTextAreaElement>) | undefined;
     onAnimationIteration?: (React.AnimationEventHandler<HTMLInputElement> & React.AnimationEventHandler<HTMLTextAreaElement>) | undefined;
     onAnimationIterationCapture?: (React.AnimationEventHandler<HTMLInputElement> & React.AnimationEventHandler<HTMLTextAreaElement>) | undefined;
+    onToggle?: (React.ToggleEventHandler<HTMLInputElement> & React.ToggleEventHandler<HTMLTextAreaElement>) | undefined;
+    onBeforeToggle?: (React.ToggleEventHandler<HTMLInputElement> & React.ToggleEventHandler<HTMLTextAreaElement>) | undefined;
+    onTransitionCancel?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
+    onTransitionCancelCapture?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
     onTransitionEnd?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
     onTransitionEndCapture?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
+    onTransitionRun?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
+    onTransitionRunCapture?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
+    onTransitionStart?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
+    onTransitionStartCapture?: (React.TransitionEventHandler<HTMLInputElement> & React.TransitionEventHandler<HTMLTextAreaElement>) | undefined;
     disabled?: boolean | undefined;
-    formAction?: string | undefined;
+    formAction?: string | ((formData: FormData) => void | Promise<void>) | undefined;
     formEncType?: string | undefined;
     formMethod?: string | undefined;
     formNoValidate?: boolean | undefined;
@@ -274,7 +294,6 @@ export declare const DimensionsInput: React.ForwardRefExoticComponent<{
     accept?: string | undefined;
     capture?: boolean | "user" | "environment" | undefined;
     checked?: boolean | undefined;
-    enterKeyHint?: "search" | "previous" | "next" | "enter" | "done" | "go" | "send" | undefined;
     multiple?: boolean | undefined;
     cols?: number | undefined;
     dirName?: string | undefined;

package/dist/components/Flex/FlexCol/FlexCol.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { FlexDefaultProps } from '../types';
 export declare const FLEX_COL_DEFAULT_PROPS: FlexDefaultProps;
 export declare const FlexCol: React.ForwardRefExoticComponent<{
-    alignItems?: ("baseline" | "center" | "flex-start" | "flex-end" | "stretch") | undefined;
+    alignItems?: ("center" | "baseline" | "flex-start" | "flex-end" | "stretch") | undefined;
     justifyContent?: ("center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly") | undefined;
     gap?: keyof import("../../../theme/modules/sizes").SizeScale | undefined;
     flexWrap?: ("nowrap" | "wrap" | "wrap-reverse") | undefined;

package/dist/components/Flex/FlexRow/FlexRow.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { FlexDefaultProps } from '../types';
 export declare const FLEX_ROW_DEFAULT_PROPS: FlexDefaultProps;
 export declare const FlexRow: React.ForwardRefExoticComponent<{
-    alignItems?: ("baseline" | "center" | "flex-start" | "flex-end" | "stretch") | undefined;
+    alignItems?: ("center" | "baseline" | "flex-start" | "flex-end" | "stretch") | undefined;
     justifyContent?: ("center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly") | undefined;
     gap?: keyof import("../../../theme/modules/sizes").SizeScale | undefined;
     flexWrap?: ("nowrap" | "wrap" | "wrap-reverse") | undefined;

package/dist/components/LegacyDataTable/StickyHeader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"StickyHeader.cjs","sources":["../../../src/components/LegacyDataTable/StickyHeader.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { FakeHeaderTable, StickyHeaderWrapper } from './styled';\nimport { useStickyHeader } from './utils/hooks';\n\ntype StickyHeaderPropTypes = {\n  tableRef: React.RefObject<HTMLTableElement>;\n  wrapperRef: React.RefObject<HTMLDivElement>;\n  isFixedLayout: boolean;\n  renderHeader: (offset?: number) => React.ReactNode;\n  wrapperStyle?: React.CSSProperties;\n};\n\nexport const StickyHeader = ({\n  renderHeader,\n  tableRef,\n  wrapperRef,\n  isFixedLayout,\n  wrapperStyle,\n}: StickyHeaderPropTypes) => {\n  const [headerWrapperRef, setHeaderWrapperRef] = useState<HTMLDivElement | null>(null);\n  const { isSticky } = useStickyHeader(\n    tableRef,\n    parseInt(\n      typeof wrapperStyle?.top === 'string' ? wrapperStyle?.top : `${wrapperStyle?.top}`,\n      10,\n    ),\n  );\n\n  // here we use 2, because we also have borders on each side by 1 px\n  const wrapperWidth = (wrapperRef.current?.getBoundingClientRect().width || 0) - 2;\n\n  // Re-render when the wrapper scrolls so the sticky header stays in sync.\n  // This replaces the previous `useScroll(wrapperRef)` from react-use which\n  // was only used for its re-render side effect (return value was discarded).\n  const [, setScrollTick] = useState(0);\n  const frameRef = useRef(0);\n\n  useEffect(() => {\n    const el = wrapperRef.current;\n    if (!el) return;\n\n    const handler = () => {\n      cancelAnimationFrame(frameRef.current);\n      frameRef.current = requestAnimationFrame(() => {\n        setScrollTick((t) => t + 1);\n      });\n    };\n\n    el.addEventListener('scroll', handler, { passive: true });\n    // eslint-disable-next-line consistent-return\n    return () => {\n      el.removeEventListener('scroll', handler);\n      cancelAnimationFrame(frameRef.current);\n    };\n  }, [wrapperRef]);\n\n  const updateScroll = (ref?: HTMLDivElement | null) => {\n    const scrollLeft = wrapperRef.current?.scrollLeft || 0;\n\n    if (ref) {\n      // eslint-disable-next-line no-param-reassign\n      ref.scrollLeft = scrollLeft;\n      return;\n    }\n\n    if (headerWrapperRef) headerWrapperRef.scrollLeft = scrollLeft;\n  };\n\n  updateScroll();\n\n  return isSticky ? (\n    <StickyHeaderWrapper\n      ref={(ref: HTMLDivElement | null) => {\n        setHeaderWrapperRef(ref);\n        updateScroll(ref);\n      }}\n      style={{ width: wrapperWidth, ...wrapperStyle }}\n    >\n      <FakeHeaderTable style={{ tableLayout: isFixedLayout ? 'fixed' : 'auto' }}>\n        {renderHeader()}\n      </FakeHeaderTable>\n    </StickyHeaderWrapper>\n  ) : null;\n};\n"],"names":["useState","useStickyHeader","useRef","useEffect","React","StickyHeaderWrapper","FakeHeaderTable"],"mappings":"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"}
+{"version":3,"file":"StickyHeader.cjs","sources":["../../../src/components/LegacyDataTable/StickyHeader.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { FakeHeaderTable, StickyHeaderWrapper } from './styled';\nimport { useStickyHeader } from './utils/hooks';\n\ntype StickyHeaderPropTypes = {\n  tableRef: React.RefObject<HTMLTableElement | null>;\n  wrapperRef: React.RefObject<HTMLDivElement | null>;\n  isFixedLayout: boolean;\n  renderHeader: (offset?: number) => React.ReactNode;\n  wrapperStyle?: React.CSSProperties;\n};\n\nexport const StickyHeader = ({\n  renderHeader,\n  tableRef,\n  wrapperRef,\n  isFixedLayout,\n  wrapperStyle,\n}: StickyHeaderPropTypes) => {\n  const [headerWrapperRef, setHeaderWrapperRef] = useState<HTMLDivElement | null>(null);\n  const { isSticky } = useStickyHeader(\n    tableRef,\n    parseInt(\n      typeof wrapperStyle?.top === 'string' ? wrapperStyle?.top : `${wrapperStyle?.top}`,\n      10,\n    ),\n  );\n\n  // here we use 2, because we also have borders on each side by 1 px\n  const wrapperWidth = (wrapperRef.current?.getBoundingClientRect().width || 0) - 2;\n\n  // Re-render when the wrapper scrolls so the sticky header stays in sync.\n  // This replaces the previous `useScroll(wrapperRef)` from react-use which\n  // was only used for its re-render side effect (return value was discarded).\n  const [, setScrollTick] = useState(0);\n  const frameRef = useRef(0);\n\n  useEffect(() => {\n    const el = wrapperRef.current;\n    if (!el) return;\n\n    const handler = () => {\n      cancelAnimationFrame(frameRef.current);\n      frameRef.current = requestAnimationFrame(() => {\n        setScrollTick((t) => t + 1);\n      });\n    };\n\n    el.addEventListener('scroll', handler, { passive: true });\n    // eslint-disable-next-line consistent-return\n    return () => {\n      el.removeEventListener('scroll', handler);\n      cancelAnimationFrame(frameRef.current);\n    };\n  }, [wrapperRef]);\n\n  const updateScroll = (ref?: HTMLDivElement | null) => {\n    const scrollLeft = wrapperRef.current?.scrollLeft || 0;\n\n    if (ref) {\n      // eslint-disable-next-line no-param-reassign\n      ref.scrollLeft = scrollLeft;\n      return;\n    }\n\n    if (headerWrapperRef) headerWrapperRef.scrollLeft = scrollLeft;\n  };\n\n  updateScroll();\n\n  return isSticky ? (\n    <StickyHeaderWrapper\n      ref={(ref: HTMLDivElement | null) => {\n        setHeaderWrapperRef(ref);\n        updateScroll(ref);\n      }}\n      style={{ width: wrapperWidth, ...wrapperStyle }}\n    >\n      <FakeHeaderTable style={{ tableLayout: isFixedLayout ? 'fixed' : 'auto' }}>\n        {renderHeader()}\n      </FakeHeaderTable>\n    </StickyHeaderWrapper>\n  ) : null;\n};\n"],"names":["useState","useStickyHeader","useRef","useEffect","React","StickyHeaderWrapper","FakeHeaderTable"],"mappings":"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"}

package/dist/components/LegacyDataTable/StickyHeader.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 type StickyHeaderPropTypes = {
-    tableRef: React.RefObject<HTMLTableElement>;
-    wrapperRef: React.RefObject<HTMLDivElement>;
+    tableRef: React.RefObject<HTMLTableElement | null>;
+    wrapperRef: React.RefObject<HTMLDivElement | null>;
     isFixedLayout: boolean;
     renderHeader: (offset?: number) => React.ReactNode;
     wrapperStyle?: React.CSSProperties;

package/dist/components/LegacyDataTable/StickyHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"StickyHeader.js","sources":["../../../src/components/LegacyDataTable/StickyHeader.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { FakeHeaderTable, StickyHeaderWrapper } from './styled';\nimport { useStickyHeader } from './utils/hooks';\n\ntype StickyHeaderPropTypes = {\n  tableRef: React.RefObject<HTMLTableElement>;\n  wrapperRef: React.RefObject<HTMLDivElement>;\n  isFixedLayout: boolean;\n  renderHeader: (offset?: number) => React.ReactNode;\n  wrapperStyle?: React.CSSProperties;\n};\n\nexport const StickyHeader = ({\n  renderHeader,\n  tableRef,\n  wrapperRef,\n  isFixedLayout,\n  wrapperStyle,\n}: StickyHeaderPropTypes) => {\n  const [headerWrapperRef, setHeaderWrapperRef] = useState<HTMLDivElement | null>(null);\n  const { isSticky } = useStickyHeader(\n    tableRef,\n    parseInt(\n      typeof wrapperStyle?.top === 'string' ? wrapperStyle?.top : `${wrapperStyle?.top}`,\n      10,\n    ),\n  );\n\n  // here we use 2, because we also have borders on each side by 1 px\n  const wrapperWidth = (wrapperRef.current?.getBoundingClientRect().width || 0) - 2;\n\n  // Re-render when the wrapper scrolls so the sticky header stays in sync.\n  // This replaces the previous `useScroll(wrapperRef)` from react-use which\n  // was only used for its re-render side effect (return value was discarded).\n  const [, setScrollTick] = useState(0);\n  const frameRef = useRef(0);\n\n  useEffect(() => {\n    const el = wrapperRef.current;\n    if (!el) return;\n\n    const handler = () => {\n      cancelAnimationFrame(frameRef.current);\n      frameRef.current = requestAnimationFrame(() => {\n        setScrollTick((t) => t + 1);\n      });\n    };\n\n    el.addEventListener('scroll', handler, { passive: true });\n    // eslint-disable-next-line consistent-return\n    return () => {\n      el.removeEventListener('scroll', handler);\n      cancelAnimationFrame(frameRef.current);\n    };\n  }, [wrapperRef]);\n\n  const updateScroll = (ref?: HTMLDivElement | null) => {\n    const scrollLeft = wrapperRef.current?.scrollLeft || 0;\n\n    if (ref) {\n      // eslint-disable-next-line no-param-reassign\n      ref.scrollLeft = scrollLeft;\n      return;\n    }\n\n    if (headerWrapperRef) headerWrapperRef.scrollLeft = scrollLeft;\n  };\n\n  updateScroll();\n\n  return isSticky ? (\n    <StickyHeaderWrapper\n      ref={(ref: HTMLDivElement | null) => {\n        setHeaderWrapperRef(ref);\n        updateScroll(ref);\n      }}\n      style={{ width: wrapperWidth, ...wrapperStyle }}\n    >\n      <FakeHeaderTable style={{ tableLayout: isFixedLayout ? 'fixed' : 'auto' }}>\n        {renderHeader()}\n      </FakeHeaderTable>\n    </StickyHeaderWrapper>\n  ) : null;\n};\n"],"names":["React"],"mappings":";;;;AAYO,MAAM,YAAY,GAAG,CAAC,EAC3B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,aAAa,EACb,YAAY,GACU,KAAI;;IAC1B,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;IACrF,MAAM,EAAE,QAAQ,EAAE,GAAG,eAAe,CAClC,QAAQ,EACR,QAAQ,CACN,QAAO,YAAY,KAAA,IAAA,IAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,GAAG,CAAA,KAAK,QAAQ,GAAG,YAAY,KAAA,IAAA,IAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,GAAG,GAAG,CAAA,EAAG,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,GAAG,EAAE,EAClF,EAAE,CACH,CACF;;AAGD,IAAA,MAAM,YAAY,GAAG,CAAC,CAAA,CAAA,EAAA,GAAA,UAAU,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,qBAAqB,GAAG,KAAK,KAAI,CAAC,IAAI,CAAC;;;;IAKjF,MAAM,GAAG,aAAa,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC;AACrC,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC;IAE1B,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,EAAE,GAAG,UAAU,CAAC,OAAO;AAC7B,QAAA,IAAI,CAAC,EAAE;YAAE;QAET,MAAM,OAAO,GAAG,MAAK;AACnB,YAAA,oBAAoB,CAAC,QAAQ,CAAC,OAAO,CAAC;AACtC,YAAA,QAAQ,CAAC,OAAO,GAAG,qBAAqB,CAAC,MAAK;gBAC5C,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AAC7B,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC;AAED,QAAA,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;;AAEzD,QAAA,OAAO,MAAK;AACV,YAAA,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC;AACzC,YAAA,oBAAoB,CAAC,QAAQ,CAAC,OAAO,CAAC;AACxC,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;AAEhB,IAAA,MAAM,YAAY,GAAG,CAAC,GAA2B,KAAI;;QACnD,MAAM,UAAU,GAAG,CAAA,CAAA,EAAA,GAAA,UAAU,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,UAAU,KAAI,CAAC;AAEtD,QAAA,IAAI,GAAG,EAAE;;AAEP,YAAA,GAAG,CAAC,UAAU,GAAG,UAAU;YAC3B;AACD,QAAA;AAED,QAAA,IAAI,gBAAgB;AAAE,YAAA,gBAAgB,CAAC,UAAU,GAAG,UAAU;AAChE,IAAA,CAAC;AAED,IAAA,YAAY,EAAE;AAEd,IAAA,OAAO,QAAQ,IACbA,cAAA,CAAA,aAAA,CAAC,mBAAmB,EAAA,EAClB,GAAG,EAAE,CAAC,GAA0B,KAAI;YAClC,mBAAmB,CAAC,GAAG,CAAC;YACxB,YAAY,CAAC,GAAG,CAAC;QACnB,CAAC,EACD,KAAK,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,YAAY,EAAE,EAAA;QAE/CA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,aAAa,GAAG,OAAO,GAAG,MAAM,EAAE,EAAA,EACtE,YAAY,EAAE,CACC,CACE,IACpB,IAAI;AACV;;;;"}
+{"version":3,"file":"StickyHeader.js","sources":["../../../src/components/LegacyDataTable/StickyHeader.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\nimport { FakeHeaderTable, StickyHeaderWrapper } from './styled';\nimport { useStickyHeader } from './utils/hooks';\n\ntype StickyHeaderPropTypes = {\n  tableRef: React.RefObject<HTMLTableElement | null>;\n  wrapperRef: React.RefObject<HTMLDivElement | null>;\n  isFixedLayout: boolean;\n  renderHeader: (offset?: number) => React.ReactNode;\n  wrapperStyle?: React.CSSProperties;\n};\n\nexport const StickyHeader = ({\n  renderHeader,\n  tableRef,\n  wrapperRef,\n  isFixedLayout,\n  wrapperStyle,\n}: StickyHeaderPropTypes) => {\n  const [headerWrapperRef, setHeaderWrapperRef] = useState<HTMLDivElement | null>(null);\n  const { isSticky } = useStickyHeader(\n    tableRef,\n    parseInt(\n      typeof wrapperStyle?.top === 'string' ? wrapperStyle?.top : `${wrapperStyle?.top}`,\n      10,\n    ),\n  );\n\n  // here we use 2, because we also have borders on each side by 1 px\n  const wrapperWidth = (wrapperRef.current?.getBoundingClientRect().width || 0) - 2;\n\n  // Re-render when the wrapper scrolls so the sticky header stays in sync.\n  // This replaces the previous `useScroll(wrapperRef)` from react-use which\n  // was only used for its re-render side effect (return value was discarded).\n  const [, setScrollTick] = useState(0);\n  const frameRef = useRef(0);\n\n  useEffect(() => {\n    const el = wrapperRef.current;\n    if (!el) return;\n\n    const handler = () => {\n      cancelAnimationFrame(frameRef.current);\n      frameRef.current = requestAnimationFrame(() => {\n        setScrollTick((t) => t + 1);\n      });\n    };\n\n    el.addEventListener('scroll', handler, { passive: true });\n    // eslint-disable-next-line consistent-return\n    return () => {\n      el.removeEventListener('scroll', handler);\n      cancelAnimationFrame(frameRef.current);\n    };\n  }, [wrapperRef]);\n\n  const updateScroll = (ref?: HTMLDivElement | null) => {\n    const scrollLeft = wrapperRef.current?.scrollLeft || 0;\n\n    if (ref) {\n      // eslint-disable-next-line no-param-reassign\n      ref.scrollLeft = scrollLeft;\n      return;\n    }\n\n    if (headerWrapperRef) headerWrapperRef.scrollLeft = scrollLeft;\n  };\n\n  updateScroll();\n\n  return isSticky ? (\n    <StickyHeaderWrapper\n      ref={(ref: HTMLDivElement | null) => {\n        setHeaderWrapperRef(ref);\n        updateScroll(ref);\n      }}\n      style={{ width: wrapperWidth, ...wrapperStyle }}\n    >\n      <FakeHeaderTable style={{ tableLayout: isFixedLayout ? 'fixed' : 'auto' }}>\n        {renderHeader()}\n      </FakeHeaderTable>\n    </StickyHeaderWrapper>\n  ) : null;\n};\n"],"names":["React"],"mappings":";;;;AAYO,MAAM,YAAY,GAAG,CAAC,EAC3B,YAAY,EACZ,QAAQ,EACR,UAAU,EACV,aAAa,EACb,YAAY,GACU,KAAI;;IAC1B,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;IACrF,MAAM,EAAE,QAAQ,EAAE,GAAG,eAAe,CAClC,QAAQ,EACR,QAAQ,CACN,QAAO,YAAY,KAAA,IAAA,IAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,GAAG,CAAA,KAAK,QAAQ,GAAG,YAAY,KAAA,IAAA,IAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,GAAG,GAAG,CAAA,EAAG,YAAY,aAAZ,YAAY,KAAA,MAAA,GAAA,MAAA,GAAZ,YAAY,CAAE,GAAG,EAAE,EAClF,EAAE,CACH,CACF;;AAGD,IAAA,MAAM,YAAY,GAAG,CAAC,CAAA,CAAA,EAAA,GAAA,UAAU,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,qBAAqB,GAAG,KAAK,KAAI,CAAC,IAAI,CAAC;;;;IAKjF,MAAM,GAAG,aAAa,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC;AACrC,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC;IAE1B,SAAS,CAAC,MAAK;AACb,QAAA,MAAM,EAAE,GAAG,UAAU,CAAC,OAAO;AAC7B,QAAA,IAAI,CAAC,EAAE;YAAE;QAET,MAAM,OAAO,GAAG,MAAK;AACnB,YAAA,oBAAoB,CAAC,QAAQ,CAAC,OAAO,CAAC;AACtC,YAAA,QAAQ,CAAC,OAAO,GAAG,qBAAqB,CAAC,MAAK;gBAC5C,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AAC7B,YAAA,CAAC,CAAC;AACJ,QAAA,CAAC;AAED,QAAA,EAAE,CAAC,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;;AAEzD,QAAA,OAAO,MAAK;AACV,YAAA,EAAE,CAAC,mBAAmB,CAAC,QAAQ,EAAE,OAAO,CAAC;AACzC,YAAA,oBAAoB,CAAC,QAAQ,CAAC,OAAO,CAAC;AACxC,QAAA,CAAC;AACH,IAAA,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;AAEhB,IAAA,MAAM,YAAY,GAAG,CAAC,GAA2B,KAAI;;QACnD,MAAM,UAAU,GAAG,CAAA,CAAA,EAAA,GAAA,UAAU,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,MAAA,GAAA,EAAA,CAAE,UAAU,KAAI,CAAC;AAEtD,QAAA,IAAI,GAAG,EAAE;;AAEP,YAAA,GAAG,CAAC,UAAU,GAAG,UAAU;YAC3B;AACD,QAAA;AAED,QAAA,IAAI,gBAAgB;AAAE,YAAA,gBAAgB,CAAC,UAAU,GAAG,UAAU;AAChE,IAAA,CAAC;AAED,IAAA,YAAY,EAAE;AAEd,IAAA,OAAO,QAAQ,IACbA,cAAA,CAAA,aAAA,CAAC,mBAAmB,EAAA,EAClB,GAAG,EAAE,CAAC,GAA0B,KAAI;YAClC,mBAAmB,CAAC,GAAG,CAAC;YACxB,YAAY,CAAC,GAAG,CAAC;QACnB,CAAC,EACD,KAAK,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,YAAY,EAAE,EAAA;QAE/CA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,aAAa,GAAG,OAAO,GAAG,MAAM,EAAE,EAAA,EACtE,YAAY,EAAE,CACC,CACE,IACpB,IAAI;AACV;;;;"}

package/dist/components/Loader/Loader.cjs

@@ -12,18 +12,18 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-const Loader = ({ className, height = 24, width = 24, type = 'TailSpin', }) => {
+const Loader = ({ className, height = 24, width = 24, type = 'TailSpin', label, }) => {
     const classNames = buildClassnames.buildClassnames([loader_module.loader, className]);
     switch (type) {
         case 'Grid': {
-            return React__default.default.createElement(Grid.Grid, { className: classNames, height: height, width: width });
+            return React__default.default.createElement(Grid.Grid, { className: classNames, height: height, width: width, label: label });
         }
         case 'ThreeDots': {
-            return React__default.default.createElement(ThreeDots.ThreeDots, { className: classNames, height: height, width: width });
+            return React__default.default.createElement(ThreeDots.ThreeDots, { className: classNames, height: height, width: width, label: label });
         }
         case 'TailSpin':
         default: {
-            return React__default.default.createElement(TailSpin.TailSpin, { className: classNames, height: height, width: width });
+            return React__default.default.createElement(TailSpin.TailSpin, { className: classNames, height: height, width: width, label: label });
         }
     }
 };

package/dist/components/Loader/Loader.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.cjs","sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../utils';\nimport { Grid } from './Grid';\nimport { TailSpin } from './TailSpin';\nimport { ThreeDots } from './ThreeDots';\nimport styles from './loader.module.scss';\n\nimport { LoaderProps } from './loaderTypes';\n\nexport const Loader = ({\n  className,\n  height = 24,\n  width = 24,\n  type = 'TailSpin',\n}: LoaderProps) => {\n  const classNames = buildClassnames([styles.loader, className]);\n\n  switch (type) {\n    case 'Grid': {\n      return <Grid className={classNames} height={height} width={width} />;\n    }\n    case 'ThreeDots': {\n      return <ThreeDots className={classNames} height={height} width={width} />;\n    }\n    case 'TailSpin':\n    default: {\n      return <TailSpin className={classNames} height={height} width={width} />;\n    }\n  }\n};\n"],"names":["buildClassnames","styles","React","Grid","ThreeDots","TailSpin"],"mappings":";;;;;;;;;;;;;;MAUa,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,MAAM,GAAG,EAAE,EACX,KAAK,GAAG,EAAE,EACV,IAAI,GAAG,UAAU,GACL,KAAI;AAChB,IAAA,MAAM,UAAU,GAAGA,+BAAe,CAAC,CAACC,aAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE9D,IAAA,QAAQ,IAAI;QACV,KAAK,MAAM,EAAE;AACX,YAAA,OAAOC,sBAAA,CAAA,aAAA,CAACC,SAAI,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAI;AACrE,QAAA;QACD,KAAK,WAAW,EAAE;AAChB,YAAA,OAAOD,sBAAA,CAAA,aAAA,CAACE,mBAAS,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAI;AAC1E,QAAA;AACD,QAAA,KAAK,UAAU;AACf,QAAA,SAAS;AACP,YAAA,OAAOF,sBAAA,CAAA,aAAA,CAACG,iBAAQ,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAI;AACzE,QAAA;AACF;AACH;;;;"}
+{"version":3,"file":"Loader.cjs","sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../utils';\nimport { Grid } from './Grid';\nimport { TailSpin } from './TailSpin';\nimport { ThreeDots } from './ThreeDots';\nimport styles from './loader.module.scss';\n\nimport { LoaderProps } from './loaderTypes';\n\nexport const Loader = ({\n  className,\n  height = 24,\n  width = 24,\n  type = 'TailSpin',\n  label,\n}: LoaderProps) => {\n  const classNames = buildClassnames([styles.loader, className]);\n\n  switch (type) {\n    case 'Grid': {\n      return <Grid className={classNames} height={height} width={width} label={label} />;\n    }\n    case 'ThreeDots': {\n      return <ThreeDots className={classNames} height={height} width={width} label={label} />;\n    }\n    case 'TailSpin':\n    default: {\n      return <TailSpin className={classNames} height={height} width={width} label={label} />;\n    }\n  }\n};\n"],"names":["buildClassnames","styles","React","Grid","ThreeDots","TailSpin"],"mappings":";;;;;;;;;;;;;;MAUa,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,MAAM,GAAG,EAAE,EACX,KAAK,GAAG,EAAE,EACV,IAAI,GAAG,UAAU,EACjB,KAAK,GACO,KAAI;AAChB,IAAA,MAAM,UAAU,GAAGA,+BAAe,CAAC,CAACC,aAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE9D,IAAA,QAAQ,IAAI;QACV,KAAK,MAAM,EAAE;AACX,YAAA,OAAOC,qCAACC,SAAI,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;AACnF,QAAA;QACD,KAAK,WAAW,EAAE;AAChB,YAAA,OAAOD,qCAACE,mBAAS,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;AACxF,QAAA;AACD,QAAA,KAAK,UAAU;AACf,QAAA,SAAS;AACP,YAAA,OAAOF,qCAACG,iBAAQ,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;AACvF,QAAA;AACF;AACH;;;;"}

package/dist/components/Loader/Loader.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { LoaderProps } from './loaderTypes';
-export declare const Loader: ({ className, height, width, type, }: LoaderProps) => React.JSX.Element;
+export declare const Loader: ({ className, height, width, type, label, }: LoaderProps) => React.JSX.Element;

package/dist/components/Loader/Loader.js

@@ -6,18 +6,18 @@ import { TailSpin } from './TailSpin.js';
 import { ThreeDots } from './ThreeDots.js';
 import styles from './loader.module.scss.js';
 
-const Loader = ({ className, height = 24, width = 24, type = 'TailSpin', }) => {
+const Loader = ({ className, height = 24, width = 24, type = 'TailSpin', label, }) => {
     const classNames = buildClassnames([styles.loader, className]);
     switch (type) {
         case 'Grid': {
-            return React__default.createElement(Grid, { className: classNames, height: height, width: width });
+            return React__default.createElement(Grid, { className: classNames, height: height, width: width, label: label });
         }
         case 'ThreeDots': {
-            return React__default.createElement(ThreeDots, { className: classNames, height: height, width: width });
+            return React__default.createElement(ThreeDots, { className: classNames, height: height, width: width, label: label });
         }
         case 'TailSpin':
         default: {
-            return React__default.createElement(TailSpin, { className: classNames, height: height, width: width });
+            return React__default.createElement(TailSpin, { className: classNames, height: height, width: width, label: label });
         }
     }
 };

package/dist/components/Loader/Loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"Loader.js","sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../utils';\nimport { Grid } from './Grid';\nimport { TailSpin } from './TailSpin';\nimport { ThreeDots } from './ThreeDots';\nimport styles from './loader.module.scss';\n\nimport { LoaderProps } from './loaderTypes';\n\nexport const Loader = ({\n  className,\n  height = 24,\n  width = 24,\n  type = 'TailSpin',\n}: LoaderProps) => {\n  const classNames = buildClassnames([styles.loader, className]);\n\n  switch (type) {\n    case 'Grid': {\n      return <Grid className={classNames} height={height} width={width} />;\n    }\n    case 'ThreeDots': {\n      return <ThreeDots className={classNames} height={height} width={width} />;\n    }\n    case 'TailSpin':\n    default: {\n      return <TailSpin className={classNames} height={height} width={width} />;\n    }\n  }\n};\n"],"names":["React"],"mappings":";;;;;;;;MAUa,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,MAAM,GAAG,EAAE,EACX,KAAK,GAAG,EAAE,EACV,IAAI,GAAG,UAAU,GACL,KAAI;AAChB,IAAA,MAAM,UAAU,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE9D,IAAA,QAAQ,IAAI;QACV,KAAK,MAAM,EAAE;AACX,YAAA,OAAOA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAI;AACrE,QAAA;QACD,KAAK,WAAW,EAAE;AAChB,YAAA,OAAOA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAI;AAC1E,QAAA;AACD,QAAA,KAAK,UAAU;AACf,QAAA,SAAS;AACP,YAAA,OAAOA,cAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,GAAI;AACzE,QAAA;AACF;AACH;;;;"}
+{"version":3,"file":"Loader.js","sources":["../../../src/components/Loader/Loader.tsx"],"sourcesContent":["import React from 'react';\n\nimport { buildClassnames } from '../../utils';\nimport { Grid } from './Grid';\nimport { TailSpin } from './TailSpin';\nimport { ThreeDots } from './ThreeDots';\nimport styles from './loader.module.scss';\n\nimport { LoaderProps } from './loaderTypes';\n\nexport const Loader = ({\n  className,\n  height = 24,\n  width = 24,\n  type = 'TailSpin',\n  label,\n}: LoaderProps) => {\n  const classNames = buildClassnames([styles.loader, className]);\n\n  switch (type) {\n    case 'Grid': {\n      return <Grid className={classNames} height={height} width={width} label={label} />;\n    }\n    case 'ThreeDots': {\n      return <ThreeDots className={classNames} height={height} width={width} label={label} />;\n    }\n    case 'TailSpin':\n    default: {\n      return <TailSpin className={classNames} height={height} width={width} label={label} />;\n    }\n  }\n};\n"],"names":["React"],"mappings":";;;;;;;;MAUa,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,MAAM,GAAG,EAAE,EACX,KAAK,GAAG,EAAE,EACV,IAAI,GAAG,UAAU,EACjB,KAAK,GACO,KAAI;AAChB,IAAA,MAAM,UAAU,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE9D,IAAA,QAAQ,IAAI;QACV,KAAK,MAAM,EAAE;AACX,YAAA,OAAOA,6BAAC,IAAI,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;AACnF,QAAA;QACD,KAAK,WAAW,EAAE;AAChB,YAAA,OAAOA,6BAAC,SAAS,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;AACxF,QAAA;AACD,QAAA,KAAK,UAAU;AACf,QAAA,SAAS;AACP,YAAA,OAAOA,6BAAC,QAAQ,EAAA,EAAC,SAAS,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,GAAI;AACvF,QAAA;AACF;AACH;;;;"}

package/dist/components/Loader/TailSpin.cjs

@@ -6,11 +6,9 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
 
 var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
-const TailSpin = ({ width, height, className, label }) => (React__default.default.createElement("svg", { width: width, height: height, className: className, viewBox: "0 0 38 38", xmlns: "http://www.w3.org/2000/svg", "aria-label": label },
-    React__default.default.createElement("g", { fill: "none", fillRule: "evenodd" },
-        React__default.default.createElement("g", { transform: "translate(1 1)" },
-            React__default.default.createElement("path", { d: "M36 18c0-9.94-8.06-18-18-18", id: "Oval-2", stroke: "currentColor", strokeWidth: "3" },
-                React__default.default.createElement("animateTransform", { attributeName: "transform", type: "rotate", from: "0 18 18", to: "360 18 18", dur: "0.9s", repeatCount: "indefinite" }))))));
+const TailSpin = ({ width, height, className, label }) => (React__default.default.createElement("svg", { width: width, height: height, className: className, viewBox: "-2.5 -2.5 41 41", xmlns: "http://www.w3.org/2000/svg", role: label ? 'img' : undefined, "aria-label": label || undefined, "aria-hidden": !label || undefined },
+    React__default.default.createElement("path", { d: "M18 0 A18 18 0 1 1 0 18", fill: "none", stroke: "currentColor", strokeWidth: "3.3", strokeLinecap: "round" },
+        React__default.default.createElement("animateTransform", { attributeName: "transform", type: "rotate", from: "0 18 18", to: "360 18 18", dur: "0.9s", repeatCount: "indefinite" }))));
 
 exports.TailSpin = TailSpin;
 //# sourceMappingURL=TailSpin.cjs.map