@onewelcome/react-lib-components 8.1.2 → 8.2.0

package/dist/cjs/src/components/DataGrid/DataGridFilters/DataGridFilters.interfaces.d.ts

@@ -34,6 +34,7 @@ export interface DataGridColumnMetadata {
     headline: string;
     operators?: string[];
     defaultValues?: string[];
+    disableAddNew?: boolean;
 }
 export interface PopoverTranslations {
     columnSelectLabel?: string;

package/dist/cjs/src/components/DataGrid/DataGridHeader/DataGridHeader.d.ts

@@ -5,6 +5,7 @@ export interface Props extends ComponentPropsWithRef<"thead"> {
     initialSort?: Sort;
     onSort?: OnSortFunction;
     enableExpandableRow?: boolean;
+    enableNestedRows?: boolean;
     disableContextMenuColumn?: boolean;
     enableMultiSorting?: boolean;
     spacing?: React.CSSProperties;

package/dist/esm/DataGrid/DataGrid.esm.js

@@ -24,7 +24,7 @@ import { DataGridSearchbar } from './DataGridFilters/DataGridSearchbar.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const DataGridInner = ({ children, data, initialSort, onSort, headers, actions = {}, paginationProps, disableContextMenuColumn, enableExpandableRow, filters, search, toolbarButtons, isLoading, enableMultiSorting, emptyLabel, spacing, style, ...rest }, ref) => {
+const DataGridInner = ({ children, data, initialSort, onSort, headers, actions = {}, paginationProps, nestedRowConfig, disableContextMenuColumn, enableExpandableRow, filters, search, toolbarButtons, isLoading, enableMultiSorting, emptyLabel, spacing, style, ...rest }, ref) => {
     var _a;
     if (!headers) {
         throw new Error("Headers definition has to be provided");
@@ -74,8 +74,8 @@ const DataGridInner = ({ children, data, initialSort, onSort, headers, actions =
             }, headers: internalHeaders, onColumnToggled: onColumnToggled })),
         React.createElement("div", { className: classes["table-wrapper"] },
             React.createElement("table", { className: classes["table"] },
-                React.createElement(DataGridHeader, { headers: internalHeaders, initialSort: initialSort, onSort: onSort, disableContextMenuColumn: disableContextMenuColumn, enableExpandableRow: enableExpandableRow, enableMultiSorting: enableMultiSorting, spacing: styleWithSpacing }),
-                React.createElement(DataGridBody, { data: data, headers: internalHeaders, isLoading: isLoading, disableContextMenuColumn: disableContextMenuColumn, emptyLabel: emptyLabel, spacing: styleWithSpacing, searchValue: search === null || search === void 0 ? void 0 : search.initialSearchValue }, children))),
+                React.createElement(DataGridHeader, { headers: internalHeaders, initialSort: initialSort, onSort: onSort, disableContextMenuColumn: disableContextMenuColumn, enableExpandableRow: enableExpandableRow, enableNestedRows: !!nestedRowConfig, enableMultiSorting: enableMultiSorting, spacing: styleWithSpacing }),
+                React.createElement(DataGridBody, { data: data, headers: internalHeaders, isLoading: isLoading, disableContextMenuColumn: disableContextMenuColumn, nestedRowConfig: nestedRowConfig, emptyLabel: emptyLabel, spacing: styleWithSpacing, searchValue: search === null || search === void 0 ? void 0 : search.initialSearchValue }, children))),
         paginationProps && !isLoading && (React.createElement(Pagination, { ...paginationProps, style: {
                 ...paginationProps.style,
                 paddingLeft: styleWithSpacing === null || styleWithSpacing === void 0 ? void 0 : styleWithSpacing.paddingLeft,

package/dist/esm/DataGrid/DataGrid.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataGrid.esm.js","sources":["../../../../../src/components/DataGrid/DataGrid.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ComponentPropsWithRef,\n  Fragment,\n  ReactElement,\n  Ref,\n  useEffect,\n  useState\n} from \"react\";\nimport { Button, Props as ButtonProps } from \"../Button/Button\";\nimport classes from \"./DataGrid.module.scss\";\nimport { DataGridHeader } from \"./DataGridHeader/DataGridHeader\";\nimport { DataGridActions } from \"./DataGridActions/DataGridActions\";\nimport { DataGridBody } from \"./DataGridBody/DataGridBody\";\nimport { HeaderCell, OnSortFunction, Sort } from \"./datagrid.interfaces\";\nimport { Pagination, Props as PaginationProps } from \"../Pagination/Pagination\";\nimport { Spacing, useSpacing } from \"../../hooks/useSpacing\";\nimport { DataGridToolbar, DataGridToolbarProps } from \"./DataGridFilters/DataGridToolbar\";\nimport { DataGridToolbarWrapper } from \"./DataGridFilters/DataGridToolbarWrapper\";\nimport { DataGridSearchbar, DataGridSearchbarProps } from \"./DataGridFilters/DataGridSearchbar\";\n\nexport interface Props<T> extends Omit<ComponentPropsWithRef<\"div\">, \"children\"> {\n  children: ({ item, index }: { item: T; index: number }) => ReactElement;\n  data?: T[];\n  initialSort?: Sort;\n  onSort?: OnSortFunction;\n  headers: HeaderCell[];\n  /**\n   * @deprecated use the `toolbarButtons` prop instead\n   */\n  actions?: {\n    enableAddBtn?: boolean;\n    enableColumnsBtn?: boolean;\n    enableSearchBtn?: boolean;\n    addBtnProps?: ButtonProps;\n    columnsBtnProps?: ButtonProps;\n    searchBtnProps?: ButtonProps;\n    searchIconBtnProps?: ButtonProps;\n  };\n  emptyLabel?: string;\n  paginationProps?: PaginationProps;\n  disableContextMenuColumn?: boolean;\n  enableExpandableRow?: boolean;\n  filters?: DataGridToolbarProps;\n  search?: DataGridSearchbarProps;\n  toolbarButtons?:\n    | ReactElement<ButtonProps, typeof Button>\n    | ReactElement<ButtonProps, typeof Button>[];\n  isLoading?: boolean;\n  enableMultiSorting?: boolean;\n  spacing?: Spacing;\n}\n\nconst DataGridInner = <T extends {}>(\n  {\n    children,\n    data,\n    initialSort,\n    onSort,\n    headers,\n    actions = {},\n    paginationProps,\n    disableContextMenuColumn,\n    enableExpandableRow,\n    filters,\n    search,\n    toolbarButtons,\n    isLoading,\n    enableMultiSorting,\n    emptyLabel,\n    spacing,\n    style,\n    ...rest\n  }: Props<T>,\n  ref: Ref<HTMLDivElement>\n) => {\n  if (!headers) {\n    throw new Error(\"Headers definition has to be provided\");\n  }\n  if (!children) {\n    throw new Error(\"DataGridBody should be provided with a template how to render rows\");\n  }\n\n  const [internalHeaders, setInternalHeaders] = useState(headers);\n  const styleWithSpacing = useSpacing(spacing, style);\n\n  useEffect(() => setInternalHeaders(headers), [headers]);\n\n  const onColumnToggled = (colName: string) => {\n    setInternalHeaders(\n      internalHeaders.map(item =>\n        item.name !== colName ? item : { ...item, hidden: !item.hidden }\n      )\n    );\n  };\n\n  if (styleWithSpacing?.padding) {\n    const splitPaddings = styleWithSpacing.padding.toString().split(\" \");\n\n    let paddingLeftIndex: number = 0;\n\n    if (splitPaddings.length >= 2) {\n      paddingLeftIndex = 1;\n    }\n    if (splitPaddings.length === 4) {\n      paddingLeftIndex = 3;\n    }\n\n    Object.defineProperties(styleWithSpacing, {\n      paddingTop: {\n        value: splitPaddings[0]\n      },\n      paddingRight: {\n        value: splitPaddings[splitPaddings.length - 1 > 0 ? 1 : 0]\n      },\n      paddingBottom: {\n        value: splitPaddings[splitPaddings.length / 3 >= 1 ? 2 : 0]\n      },\n      paddingLeft: {\n        value: splitPaddings[paddingLeftIndex]\n      }\n    });\n  }\n\n  return (\n    <div\n      {...rest}\n      className={classes[\"grid-wrapper\"]}\n      ref={ref}\n      style={{\n        paddingTop: styleWithSpacing?.paddingTop,\n        paddingBottom: styleWithSpacing?.paddingBottom\n      }}\n    >\n      {filters || search || toolbarButtons ? (\n        <DataGridToolbarWrapper\n          filters={\n            <Fragment>\n              {search && <DataGridSearchbar {...search} />}\n              {filters && <DataGridToolbar {...filters} />}\n            </Fragment>\n          }\n          buttons={toolbarButtons}\n        />\n      ) : (\n        <DataGridActions\n          {...actions}\n          style={{\n            paddingLeft: styleWithSpacing?.paddingLeft,\n            paddingRight: styleWithSpacing?.paddingRight\n          }}\n          headers={internalHeaders}\n          onColumnToggled={onColumnToggled}\n        />\n      )}\n\n      <div className={classes[\"table-wrapper\"]}>\n        <table className={classes[\"table\"]}>\n          <DataGridHeader\n            headers={internalHeaders}\n            initialSort={initialSort}\n            onSort={onSort}\n            disableContextMenuColumn={disableContextMenuColumn}\n            enableExpandableRow={enableExpandableRow}\n            enableMultiSorting={enableMultiSorting}\n            spacing={styleWithSpacing}\n          />\n          <DataGridBody\n            data={data}\n            headers={internalHeaders}\n            isLoading={isLoading}\n            disableContextMenuColumn={disableContextMenuColumn}\n            emptyLabel={emptyLabel}\n            spacing={styleWithSpacing}\n            searchValue={search?.initialSearchValue}\n          >\n            {children}\n          </DataGridBody>\n        </table>\n      </div>\n      {paginationProps && !isLoading && (\n        <Pagination\n          {...paginationProps}\n          style={{\n            ...paginationProps.style,\n            paddingLeft: styleWithSpacing?.paddingLeft,\n            paddingRight: styleWithSpacing?.paddingRight\n          }}\n          className={`${classes[\"pagination\"]} ${paginationProps.className ?? \"\"}`}\n        />\n      )}\n    </div>\n  );\n};\n\nexport const DataGrid = React.forwardRef(DataGridInner) as <T extends {}>(\n  p: Props<T> & { ref?: Ref<HTMLDivElement> }\n) => ReactElement;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGrid.esm.js","sources":["../../../../../src/components/DataGrid/DataGrid.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ComponentPropsWithRef,\n  Fragment,\n  ReactElement,\n  Ref,\n  useEffect,\n  useState\n} from \"react\";\nimport { Button, Props as ButtonProps } from \"../Button/Button\";\nimport classes from \"./DataGrid.module.scss\";\nimport { DataGridHeader } from \"./DataGridHeader/DataGridHeader\";\nimport { DataGridActions } from \"./DataGridActions/DataGridActions\";\nimport { DataGridBody } from \"./DataGridBody/DataGridBody\";\nimport { HeaderCell, OnSortFunction, Sort } from \"./datagrid.interfaces\";\nimport { Pagination, Props as PaginationProps } from \"../Pagination/Pagination\";\nimport { Spacing, useSpacing } from \"../../hooks/useSpacing\";\nimport { DataGridToolbar, DataGridToolbarProps } from \"./DataGridFilters/DataGridToolbar\";\nimport { DataGridToolbarWrapper } from \"./DataGridFilters/DataGridToolbarWrapper\";\nimport { DataGridSearchbar, DataGridSearchbarProps } from \"./DataGridFilters/DataGridSearchbar\";\n\nexport interface Props<T> extends Omit<ComponentPropsWithRef<\"div\">, \"children\"> {\n  children: ({ item, index }: { item: T; index: number }) => ReactElement;\n  data?: T[];\n  initialSort?: Sort;\n  onSort?: OnSortFunction;\n  headers: HeaderCell[];\n  /**\n   * @deprecated use the `toolbarButtons` prop instead\n   */\n  actions?: {\n    enableAddBtn?: boolean;\n    enableColumnsBtn?: boolean;\n    enableSearchBtn?: boolean;\n    addBtnProps?: ButtonProps;\n    columnsBtnProps?: ButtonProps;\n    searchBtnProps?: ButtonProps;\n    searchIconBtnProps?: ButtonProps;\n  };\n  nestedRowConfig?: {\n    nestedItemsKey?: keyof T;\n  };\n  emptyLabel?: string;\n  paginationProps?: PaginationProps;\n  disableContextMenuColumn?: boolean;\n  enableExpandableRow?: boolean;\n  filters?: DataGridToolbarProps;\n  search?: DataGridSearchbarProps;\n  toolbarButtons?:\n    | ReactElement<ButtonProps, typeof Button>\n    | ReactElement<ButtonProps, typeof Button>[];\n  isLoading?: boolean;\n  enableMultiSorting?: boolean;\n  spacing?: Spacing;\n}\n\nconst DataGridInner = <T extends {}>(\n  {\n    children,\n    data,\n    initialSort,\n    onSort,\n    headers,\n    actions = {},\n    paginationProps,\n    nestedRowConfig,\n    disableContextMenuColumn,\n    enableExpandableRow,\n    filters,\n    search,\n    toolbarButtons,\n    isLoading,\n    enableMultiSorting,\n    emptyLabel,\n    spacing,\n    style,\n    ...rest\n  }: Props<T>,\n  ref: Ref<HTMLDivElement>\n) => {\n  if (!headers) {\n    throw new Error(\"Headers definition has to be provided\");\n  }\n  if (!children) {\n    throw new Error(\"DataGridBody should be provided with a template how to render rows\");\n  }\n\n  const [internalHeaders, setInternalHeaders] = useState(headers);\n  const styleWithSpacing = useSpacing(spacing, style);\n\n  useEffect(() => setInternalHeaders(headers), [headers]);\n\n  const onColumnToggled = (colName: string) => {\n    setInternalHeaders(\n      internalHeaders.map(item =>\n        item.name !== colName ? item : { ...item, hidden: !item.hidden }\n      )\n    );\n  };\n\n  if (styleWithSpacing?.padding) {\n    const splitPaddings = styleWithSpacing.padding.toString().split(\" \");\n\n    let paddingLeftIndex: number = 0;\n\n    if (splitPaddings.length >= 2) {\n      paddingLeftIndex = 1;\n    }\n    if (splitPaddings.length === 4) {\n      paddingLeftIndex = 3;\n    }\n\n    Object.defineProperties(styleWithSpacing, {\n      paddingTop: {\n        value: splitPaddings[0]\n      },\n      paddingRight: {\n        value: splitPaddings[splitPaddings.length - 1 > 0 ? 1 : 0]\n      },\n      paddingBottom: {\n        value: splitPaddings[splitPaddings.length / 3 >= 1 ? 2 : 0]\n      },\n      paddingLeft: {\n        value: splitPaddings[paddingLeftIndex]\n      }\n    });\n  }\n\n  return (\n    <div\n      {...rest}\n      className={classes[\"grid-wrapper\"]}\n      ref={ref}\n      style={{\n        paddingTop: styleWithSpacing?.paddingTop,\n        paddingBottom: styleWithSpacing?.paddingBottom\n      }}\n    >\n      {filters || search || toolbarButtons ? (\n        <DataGridToolbarWrapper\n          filters={\n            <Fragment>\n              {search && <DataGridSearchbar {...search} />}\n              {filters && <DataGridToolbar {...filters} />}\n            </Fragment>\n          }\n          buttons={toolbarButtons}\n        />\n      ) : (\n        <DataGridActions\n          {...actions}\n          style={{\n            paddingLeft: styleWithSpacing?.paddingLeft,\n            paddingRight: styleWithSpacing?.paddingRight\n          }}\n          headers={internalHeaders}\n          onColumnToggled={onColumnToggled}\n        />\n      )}\n\n      <div className={classes[\"table-wrapper\"]}>\n        <table className={classes[\"table\"]}>\n          <DataGridHeader\n            headers={internalHeaders}\n            initialSort={initialSort}\n            onSort={onSort}\n            disableContextMenuColumn={disableContextMenuColumn}\n            enableExpandableRow={enableExpandableRow}\n            enableNestedRows={!!nestedRowConfig}\n            enableMultiSorting={enableMultiSorting}\n            spacing={styleWithSpacing}\n          />\n          <DataGridBody\n            data={data}\n            headers={internalHeaders}\n            isLoading={isLoading}\n            disableContextMenuColumn={disableContextMenuColumn}\n            nestedRowConfig={nestedRowConfig}\n            emptyLabel={emptyLabel}\n            spacing={styleWithSpacing}\n            searchValue={search?.initialSearchValue}\n          >\n            {children}\n          </DataGridBody>\n        </table>\n      </div>\n      {paginationProps && !isLoading && (\n        <Pagination\n          {...paginationProps}\n          style={{\n            ...paginationProps.style,\n            paddingLeft: styleWithSpacing?.paddingLeft,\n            paddingRight: styleWithSpacing?.paddingRight\n          }}\n          className={`${classes[\"pagination\"]} ${paginationProps.className ?? \"\"}`}\n        />\n      )}\n    </div>\n  );\n};\n\nexport const DataGrid = React.forwardRef(DataGridInner) as <T extends {}>(\n  p: Props<T> & { ref?: Ref<HTMLDivElement> }\n) => ReactElement;\n"],"names":[],"mappings":"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"}

package/dist/esm/DataGrid/DataGridBody/DataGridBody.esm.js

@@ -20,7 +20,7 @@ import { Typography } from '../../Typography/Typography.esm.js';
  *    limitations under the License.
  */
 const skeletonLoadingRows = 9;
-const DataGridBodyInner = ({ children, data, headers, isLoading, disableContextMenuColumn, emptyLabel, spacing, searchValue, ...rest }, ref) => {
+const DataGridBodyInner = ({ children, data, headers, nestedRowConfig, isLoading, disableContextMenuColumn, emptyLabel, spacing, searchValue, ...rest }, ref) => {
     const renderContent = () => {
         const visibleColumns = headers.filter(header => !header.hidden).length;
         if (isLoading) {
@@ -39,7 +39,14 @@ const DataGridBodyInner = ({ children, data, headers, isLoading, disableContextM
                 searchValue: searchValue,
                 headers,
                 spacing,
-                disableContextMenuColumn
+                item,
+                disableContextMenuColumn,
+                nestedRowProps: {
+                    rowTemplate: children,
+                    enableNestedRow: !!nestedRowConfig,
+                    nestedItemsKey: nestedRowConfig === null || nestedRowConfig === void 0 ? void 0 : nestedRowConfig.nestedItemsKey,
+                    isLastChild: index + 1 === data.length
+                }
             });
         });
     };

package/dist/esm/DataGrid/DataGridBody/DataGridBody.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataGridBody.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridBody/DataGridBody.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentPropsWithRef, ReactElement, Ref } from \"react\";\nimport { HeaderCell } from \"../datagrid.interfaces\";\nimport { DataGridCell } from \"./DataGridCell/DataGridCell\";\nimport { DataGridRow } from \"./DataGridRow/DataGridRow\";\nimport classes from \"./DataGridBody.module.scss\";\nimport { Typography } from \"../../Typography/Typography\";\n\nexport interface Props<T> extends Omit<ComponentPropsWithRef<\"tbody\">, \"children\"> {\n  children: ({ item, index }: { item: T; index: number }) => ReactElement;\n  data?: T[];\n  headers: HeaderCell[];\n  isLoading?: boolean;\n  disableContextMenuColumn?: boolean;\n  searchValue?: string;\n  emptyLabel?: string;\n  spacing?: React.CSSProperties;\n}\n\nconst skeletonLoadingRows = 9;\n\nconst DataGridBodyInner = <T extends {}>(\n  {\n    children,\n    data,\n    headers,\n    isLoading,\n    disableContextMenuColumn,\n    emptyLabel,\n    spacing,\n    searchValue,\n    ...rest\n  }: Props<T>,\n  ref: Ref<HTMLTableSectionElement>\n) => {\n  const renderContent = () => {\n    const visibleColumns = headers.filter(header => !header.hidden).length;\n    if (isLoading) {\n      return Array.from(Array(skeletonLoadingRows)).map((_, rowIdx) => (\n        <DataGridRow key={rowIdx} isLoading>\n          {Array.from(Array(visibleColumns)).map((__, colIdx) => (\n            <DataGridCell key={colIdx} isLoading></DataGridCell>\n          ))}\n          {!disableContextMenuColumn && <DataGridCell></DataGridCell>}\n        </DataGridRow>\n      ));\n    }\n\n    const emptyData = !data || data.length === 0;\n    if (emptyData) {\n      return (\n        <tr>\n          <td\n            className={classes[\"empty\"]}\n            colSpan={visibleColumns + (disableContextMenuColumn ? 0 : 1)}\n          >\n            <Typography variant=\"body\" spacing={{ margin: 0 }}>\n              {emptyLabel}\n            </Typography>\n          </td>\n        </tr>\n      );\n    }\n\n    return data?.map((item, index) => {\n      return React.cloneElement(children({ item, index }), {\n        searchValue: searchValue,\n        headers,\n        spacing,\n        disableContextMenuColumn\n      });\n    });\n  };\n\n  return (\n    <tbody {...rest} ref={ref}>\n      {renderContent()}\n    </tbody>\n  );\n};\n\nexport const DataGridBody = React.forwardRef(DataGridBodyInner) as <T extends {}>(\n  p: Props<T> & { ref?: Ref<HTMLTableSectionElement> }\n) => ReactElement;\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAoBH,MAAM,mBAAmB,GAAG,CAAC,CAAC;AAE9B,MAAM,iBAAiB,GAAG,CACxB,EACE,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAS,EACT,wBAAwB,EACxB,UAAU,EACV,OAAO,EACP,WAAW,EACX,GAAG,IAAI,EACE,EACX,GAAiC,KAC/B;IACF,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,MAAM,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC;QACvE,IAAI,SAAS,EAAE;YACb,OAAO,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,MAAM,MAC1D,KAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAA,IAAA,EAAA;AAChC,gBAAA,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,MAAM,MAChD,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAA,IAAA,EAAA,CAAgB,CACrD,CAAC;gBACD,CAAC,wBAAwB,IAAI,KAAC,CAAA,aAAA,CAAA,YAAY,OAAgB,CAC/C,CACf,CAAC,CAAC;SACJ;QAED,MAAM,SAAS,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,CAAC;QAC7C,IAAI,SAAS,EAAE;AACb,YAAA,QACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA;gBACE,KACE,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,EAC3B,OAAO,EAAE,cAAc,IAAI,wBAAwB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAA;AAE5D,oBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EAC9C,EAAA,UAAU,CACA,CACV,CACF,EACL;SACH;AAED,QAAA,OAAO,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAJ,IAAI,CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC/B,YAAA,OAAO,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE;AACnD,gBAAA,WAAW,EAAE,WAAW;gBACxB,OAAO;gBACP,OAAO;gBACP,wBAAwB;AACzB,aAAA,CAAC,CAAC;AACL,SAAC,CAAC,CAAC;AACL,KAAC,CAAC;AAEF,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,GAAW,IAAI,EAAE,GAAG,EAAE,GAAG,EAAA,EACtB,aAAa,EAAE,CACV,EACR;AACJ,CAAC,CAAC;AAEW,MAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,iBAAiB;;;;"}
+{"version":3,"file":"DataGridBody.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridBody/DataGridBody.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentPropsWithRef, ReactElement, Ref } from \"react\";\nimport { HeaderCell } from \"../datagrid.interfaces\";\nimport { DataGridCell } from \"./DataGridCell/DataGridCell\";\nimport { DataGridRow } from \"./DataGridRow/DataGridRow\";\nimport classes from \"./DataGridBody.module.scss\";\nimport { Typography } from \"../../Typography/Typography\";\n\nexport interface Props<T> extends Omit<ComponentPropsWithRef<\"tbody\">, \"children\"> {\n  children: ({ item, index }: { item: T; index: number }) => ReactElement;\n  data?: T[];\n  nestedRowConfig?: {\n    nestedItemsKey?: keyof T;\n  };\n  headers: HeaderCell[];\n  isLoading?: boolean;\n  disableContextMenuColumn?: boolean;\n  searchValue?: string;\n  emptyLabel?: string;\n  spacing?: React.CSSProperties;\n}\n\nconst skeletonLoadingRows = 9;\n\nconst DataGridBodyInner = <T extends {}>(\n  {\n    children,\n    data,\n    headers,\n    nestedRowConfig,\n    isLoading,\n    disableContextMenuColumn,\n    emptyLabel,\n    spacing,\n    searchValue,\n    ...rest\n  }: Props<T>,\n  ref: Ref<HTMLTableSectionElement>\n) => {\n  const renderContent = () => {\n    const visibleColumns = headers.filter(header => !header.hidden).length;\n    if (isLoading) {\n      return Array.from(Array(skeletonLoadingRows)).map((_, rowIdx) => (\n        <DataGridRow key={rowIdx} isLoading>\n          {Array.from(Array(visibleColumns)).map((__, colIdx) => (\n            <DataGridCell key={colIdx} isLoading></DataGridCell>\n          ))}\n          {!disableContextMenuColumn && <DataGridCell></DataGridCell>}\n        </DataGridRow>\n      ));\n    }\n\n    const emptyData = !data || data.length === 0;\n    if (emptyData) {\n      return (\n        <tr>\n          <td\n            className={classes[\"empty\"]}\n            colSpan={visibleColumns + (disableContextMenuColumn ? 0 : 1)}\n          >\n            <Typography variant=\"body\" spacing={{ margin: 0 }}>\n              {emptyLabel}\n            </Typography>\n          </td>\n        </tr>\n      );\n    }\n\n    return data?.map((item, index) => {\n      return React.cloneElement(children({ item, index }), {\n        searchValue: searchValue,\n        headers,\n        spacing,\n        item,\n        disableContextMenuColumn,\n        nestedRowProps: {\n          rowTemplate: children,\n          enableNestedRow: !!nestedRowConfig,\n          nestedItemsKey: nestedRowConfig?.nestedItemsKey,\n          isLastChild: index + 1 === data.length\n        }\n      });\n    });\n  };\n\n  return (\n    <tbody {...rest} ref={ref}>\n      {renderContent()}\n    </tbody>\n  );\n};\n\nexport const DataGridBody = React.forwardRef(DataGridBodyInner) as <T extends {}>(\n  p: Props<T> & { ref?: Ref<HTMLTableSectionElement> }\n) => ReactElement;\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAuBH,MAAM,mBAAmB,GAAG,CAAC,CAAC;AAE9B,MAAM,iBAAiB,GAAG,CACxB,EACE,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,eAAe,EACf,SAAS,EACT,wBAAwB,EACxB,UAAU,EACV,OAAO,EACP,WAAW,EACX,GAAG,IAAI,EACE,EACX,GAAiC,KAC/B;IACF,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,MAAM,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,MAAM,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC;QACvE,IAAI,SAAS,EAAE;YACb,OAAO,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,mBAAmB,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,MAAM,MAC1D,KAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAA,IAAA,EAAA;AAChC,gBAAA,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,MAAM,MAChD,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAC,GAAG,EAAE,MAAM,EAAE,SAAS,EAAA,IAAA,EAAA,CAAgB,CACrD,CAAC;gBACD,CAAC,wBAAwB,IAAI,KAAC,CAAA,aAAA,CAAA,YAAY,OAAgB,CAC/C,CACf,CAAC,CAAC;SACJ;QAED,MAAM,SAAS,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,KAAK,CAAC,CAAC;QAC7C,IAAI,SAAS,EAAE;AACb,YAAA,QACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAA;gBACE,KACE,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,OAAO,CAAC,EAC3B,OAAO,EAAE,cAAc,IAAI,wBAAwB,GAAG,CAAC,GAAG,CAAC,CAAC,EAAA;AAE5D,oBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,OAAO,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,EAC9C,EAAA,UAAU,CACA,CACV,CACF,EACL;SACH;AAED,QAAA,OAAO,IAAI,KAAA,IAAA,IAAJ,IAAI,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAJ,IAAI,CAAE,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,KAAI;AAC/B,YAAA,OAAO,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE;AACnD,gBAAA,WAAW,EAAE,WAAW;gBACxB,OAAO;gBACP,OAAO;gBACP,IAAI;gBACJ,wBAAwB;AACxB,gBAAA,cAAc,EAAE;AACd,oBAAA,WAAW,EAAE,QAAQ;oBACrB,eAAe,EAAE,CAAC,CAAC,eAAe;AAClC,oBAAA,cAAc,EAAE,eAAe,KAAA,IAAA,IAAf,eAAe,KAAf,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,eAAe,CAAE,cAAc;AAC/C,oBAAA,WAAW,EAAE,KAAK,GAAG,CAAC,KAAK,IAAI,CAAC,MAAM;AACvC,iBAAA;AACF,aAAA,CAAC,CAAC;AACL,SAAC,CAAC,CAAC;AACL,KAAC,CAAC;AAEF,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAA,GAAW,IAAI,EAAE,GAAG,EAAE,GAAG,EAAA,EACtB,aAAa,EAAE,CACV,EACR;AACJ,CAAC,CAAC;AAEW,MAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,iBAAiB;;;;"}

package/dist/esm/DataGrid/DataGridBody/DataGridCell/DataGridCell.esm.js

@@ -17,7 +17,7 @@ import classes from './DataGridCell.module.scss.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const DataGridCellComponent = ({ children, className, isLoading, spacing, searchValue, cellIndex, columnLength, disableContextMenuColumn, ...rest }, ref) => {
+const DataGridCellComponent = ({ children, className, isLoading, spacing, prefixElement, searchValue, cellIndex, columnLength, disableContextMenuColumn, ...rest }, ref) => {
     let cellStyle = {};
     if (cellIndex === 0) {
         cellStyle.paddingLeft = spacing === null || spacing === void 0 ? void 0 : spacing.paddingLeft;
@@ -45,9 +45,12 @@ const DataGridCellComponent = ({ children, className, isLoading, spacing, search
         }
         return children;
     };
-    return (React.createElement("td", { ...rest, ref: ref, style: { ...rest.style, ...cellStyle }, className: `${classes["cell"]} ${className !== null && className !== void 0 ? className : ""}` },
-        isLoading && React.createElement("div", { className: classes["loading"], "aria-busy": "true", "aria-live": "polite" }),
-        !isLoading && (React.createElement(Typography, { className: classes["text"], variant: "body", tag: "span" }, renderContent()))));
+    return (React.createElement("td", { ...rest, ref: ref, style: { ...rest.style, ...cellStyle }, className: `${classes["cell"]} ${className !== null && className !== void 0 ? className : ""}` }, prefixElement ? (React.createElement("div", { className: classes["content-wrapper"] },
+        prefixElement,
+        isLoading && (React.createElement("div", { className: classes["loading"], "aria-busy": "true", "aria-live": "polite" })),
+        !isLoading && (React.createElement(Typography, { className: classes["text"], variant: "body", tag: "span", spacing: { marginBottom: 0 } }, renderContent())))) : (React.createElement(React.Fragment, null,
+        isLoading && (React.createElement("div", { className: classes["loading"], "aria-busy": "true", "aria-live": "polite" })),
+        !isLoading && (React.createElement(Typography, { className: classes["text"], variant: "body", tag: "span" }, renderContent()))))));
 };
 const DataGridCell = React.forwardRef(DataGridCellComponent);
 

package/dist/esm/DataGrid/DataGridBody/DataGridCell/DataGridCell.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataGridCell.esm.js","sources":["../../../../../../../src/components/DataGrid/DataGridBody/DataGridCell/DataGridCell.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ForwardRefRenderFunction,\n  ComponentPropsWithRef,\n  ReactElement,\n  Fragment\n} from \"react\";\nimport { Typography } from \"../../../Typography/Typography\";\nimport classes from \"./DataGridCell.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"td\"> {\n  children?: ReactElement | string | number;\n  isLoading?: boolean;\n  spacing?: React.CSSProperties;\n  searchValue?: string;\n  cellIndex?: number;\n  columnLength?: number;\n  disableContextMenuColumn?: boolean;\n}\n\nconst DataGridCellComponent: ForwardRefRenderFunction<HTMLTableCellElement, Props> = (\n  {\n    children,\n    className,\n    isLoading,\n    spacing,\n    searchValue,\n    cellIndex,\n    columnLength,\n    disableContextMenuColumn,\n    ...rest\n  }: Props,\n  ref\n) => {\n  let cellStyle: React.CSSProperties = {};\n\n  if (cellIndex === 0) {\n    cellStyle.paddingLeft = spacing?.paddingLeft;\n  }\n  if (\n    (cellIndex === columnLength && !disableContextMenuColumn) ||\n    (columnLength && cellIndex === columnLength - 1 && disableContextMenuColumn)\n  ) {\n    cellStyle.paddingRight = spacing?.paddingRight;\n  }\n\n  //NOTE: we might want to migrate to Highlight API once it's supported by Firefox\n  const renderContent = () => {\n    if (typeof children === \"string\" && searchValue) {\n      if (!children.toLowerCase().includes(searchValue.toLowerCase())) {\n        return children;\n      }\n\n      const matchingSequence = new RegExp(searchValue, \"i\").exec(children);\n\n      const parts = children.split(matchingSequence?.[0] ?? \"\");\n      return parts.map((part, i) => {\n        if (i === parts.length - 1) return <Fragment key={`${part}-${i}`}>{part}</Fragment>;\n\n        return (\n          <Fragment key={`${part}-${i}`}>\n            {part}\n            <mark data-testid={`${matchingSequence}-mark`}>{matchingSequence}</mark>\n          </Fragment>\n        );\n      });\n    }\n\n    return children;\n  };\n\n  return (\n    <td\n      {...rest}\n      ref={ref}\n      style={{ ...rest.style, ...cellStyle }}\n      className={`${classes[\"cell\"]} ${className ?? \"\"}`}\n    >\n      {isLoading && <div className={classes[\"loading\"]} aria-busy=\"true\" aria-live=\"polite\"></div>}\n      {!isLoading && (\n        <Typography className={classes[\"text\"]} variant=\"body\" tag=\"span\">\n          {renderContent()}\n        </Typography>\n      )}\n    </td>\n  );\n};\n\nexport const DataGridCell = React.forwardRef(DataGridCellComponent);\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAqBH,MAAM,qBAAqB,GAA0D,CACnF,EACE,QAAQ,EACR,SAAS,EACT,SAAS,EACT,OAAO,EACP,WAAW,EACX,SAAS,EACT,YAAY,EACZ,wBAAwB,EACxB,GAAG,IAAI,EACD,EACR,GAAG,KACD;IACF,IAAI,SAAS,GAAwB,EAAE,CAAC;AAExC,IAAA,IAAI,SAAS,KAAK,CAAC,EAAE;QACnB,SAAS,CAAC,WAAW,GAAG,OAAO,KAAA,IAAA,IAAP,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,OAAO,CAAE,WAAW,CAAC;KAC9C;AACD,IAAA,IACE,CAAC,SAAS,KAAK,YAAY,IAAI,CAAC,wBAAwB;SACvD,YAAY,IAAI,SAAS,KAAK,YAAY,GAAG,CAAC,IAAI,wBAAwB,CAAC,EAC5E;QACA,SAAS,CAAC,YAAY,GAAG,OAAO,KAAA,IAAA,IAAP,OAAO,KAAP,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,OAAO,CAAE,YAAY,CAAC;KAChD;;IAGD,MAAM,aAAa,GAAG,MAAK;;AACzB,QAAA,IAAI,OAAO,QAAQ,KAAK,QAAQ,IAAI,WAAW,EAAE;AAC/C,YAAA,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,WAAW,CAAC,WAAW,EAAE,CAAC,EAAE;AAC/D,gBAAA,OAAO,QAAQ,CAAC;aACjB;AAED,YAAA,MAAM,gBAAgB,GAAG,IAAI,MAAM,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;AAErE,YAAA,MAAM,KAAK,GAAG,QAAQ,CAAC,KAAK,CAAC,MAAA,gBAAgB,KAAA,IAAA,IAAhB,gBAAgB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAhB,gBAAgB,CAAG,CAAC,CAAC,MAAI,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAA,EAAE,CAAC,CAAC;YAC1D,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAI;AAC3B,gBAAA,IAAI,CAAC,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC;AAAE,oBAAA,OAAO,KAAC,CAAA,aAAA,CAAA,QAAQ,EAAC,EAAA,GAAG,EAAE,CAAA,EAAG,IAAI,CAAA,CAAA,EAAI,CAAC,CAAA,CAAE,EAAG,EAAA,IAAI,CAAY,CAAC;gBAEpF,QACE,KAAC,CAAA,aAAA,CAAA,QAAQ,EAAC,EAAA,GAAG,EAAE,CAAG,EAAA,IAAI,CAAI,CAAA,EAAA,CAAC,CAAE,CAAA,EAAA;oBAC1B,IAAI;oBACL,KAAmB,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,aAAA,EAAA,CAAA,EAAG,gBAAgB,CAAO,KAAA,CAAA,EAAA,EAAG,gBAAgB,CAAQ,CAC/D,EACX;AACJ,aAAC,CAAC,CAAC;SACJ;AAED,QAAA,OAAO,QAAQ,CAAC;AAClB,KAAC,CAAC;AAEF,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GACM,IAAI,EACR,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,EAAE,GAAG,IAAI,CAAC,KAAK,EAAE,GAAG,SAAS,EAAE,EACtC,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,MAAM,CAAC,CAAI,CAAA,EAAA,SAAS,aAAT,SAAS,KAAA,KAAA,CAAA,GAAT,SAAS,GAAI,EAAE,CAAE,CAAA,EAAA;AAEjD,QAAA,SAAS,IAAI,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAY,WAAA,EAAA,MAAM,EAAW,WAAA,EAAA,QAAQ,EAAO,CAAA;QAC3F,CAAC,SAAS,KACT,KAAC,CAAA,aAAA,CAAA,UAAU,EAAC,EAAA,SAAS,EAAE,OAAO,CAAC,MAAM,CAAC,EAAE,OAAO,EAAC,MAAM,EAAC,GAAG,EAAC,MAAM,EAAA,EAC9D,aAAa,EAAE,CACL,CACd,CACE,EACL;AACJ,CAAC,CAAC;AAEW,MAAA,YAAY,GAAG,KAAK,CAAC,UAAU,CAAC,qBAAqB;;;;"}
+{"version":3,"file":"DataGridCell.esm.js","sources":["../../../../../../../src/components/DataGrid/DataGridBody/DataGridCell/DataGridCell.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, {\n  ForwardRefRenderFunction,\n  ComponentPropsWithRef,\n  ReactElement,\n  Fragment\n} from \"react\";\nimport { Typography } from \"../../../Typography/Typography\";\nimport classes from \"./DataGridCell.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"td\"> {\n  children?: ReactElement | string | number;\n  prefixElement?: ReactElement;\n  isLoading?: boolean;\n  spacing?: React.CSSProperties;\n  searchValue?: string;\n  cellIndex?: number;\n  columnLength?: number;\n  disableContextMenuColumn?: boolean;\n}\n\nconst DataGridCellComponent: ForwardRefRenderFunction<HTMLTableCellElement, Props> = (\n  {\n    children,\n    className,\n    isLoading,\n    spacing,\n    prefixElement,\n    searchValue,\n    cellIndex,\n    columnLength,\n    disableContextMenuColumn,\n    ...rest\n  }: Props,\n  ref\n) => {\n  let cellStyle: React.CSSProperties = {};\n\n  if (cellIndex === 0) {\n    cellStyle.paddingLeft = spacing?.paddingLeft;\n  }\n  if (\n    (cellIndex === columnLength && !disableContextMenuColumn) ||\n    (columnLength && cellIndex === columnLength - 1 && disableContextMenuColumn)\n  ) {\n    cellStyle.paddingRight = spacing?.paddingRight;\n  }\n\n  //NOTE: we might want to migrate to Highlight API once it's supported by Firefox\n  const renderContent = () => {\n    if (typeof children === \"string\" && searchValue) {\n      if (!children.toLowerCase().includes(searchValue.toLowerCase())) {\n        return children;\n      }\n\n      const matchingSequence = new RegExp(searchValue, \"i\").exec(children);\n\n      const parts = children.split(matchingSequence?.[0] ?? \"\");\n      return parts.map((part, i) => {\n        if (i === parts.length - 1) return <Fragment key={`${part}-${i}`}>{part}</Fragment>;\n\n        return (\n          <Fragment key={`${part}-${i}`}>\n            {part}\n            <mark data-testid={`${matchingSequence}-mark`}>{matchingSequence}</mark>\n          </Fragment>\n        );\n      });\n    }\n\n    return children;\n  };\n\n  return (\n    <td\n      {...rest}\n      ref={ref}\n      style={{ ...rest.style, ...cellStyle }}\n      className={`${classes[\"cell\"]} ${className ?? \"\"}`}\n    >\n      {prefixElement ? (\n        <div className={classes[\"content-wrapper\"]}>\n          {prefixElement}\n          {isLoading && (\n            <div className={classes[\"loading\"]} aria-busy=\"true\" aria-live=\"polite\"></div>\n          )}\n          {!isLoading && (\n            <Typography\n              className={classes[\"text\"]}\n              variant=\"body\"\n              tag=\"span\"\n              spacing={{ marginBottom: 0 }}\n            >\n              {renderContent()}\n            </Typography>\n          )}\n        </div>\n      ) : (\n        <>\n          {isLoading && (\n            <div className={classes[\"loading\"]} aria-busy=\"true\" aria-live=\"polite\"></div>\n          )}\n          {!isLoading && (\n            <Typography className={classes[\"text\"]} variant=\"body\" tag=\"span\">\n              {renderContent()}\n            </Typography>\n          )}\n        </>\n      )}\n    </td>\n  );\n};\n\nexport const DataGridCell = React.forwardRef(DataGridCellComponent);\n"],"names":[],"mappings":"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"}

package/dist/esm/DataGrid/DataGridBody/DataGridCell/DataGridCell.module.scss.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.DataGridCell-module_sr-only__S8j0D{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DataGridCell-module_hidden__0hgMX{display:none}.DataGridCell-module_slide-in__lMiX0{animation:DataGridCell-module_slide-in__lMiX0 .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridCell-module_slide-in__lMiX0{animation-duration:.1ms}}.DataGridCell-module_slide-out__05Ta1{animation:DataGridCell-module_slide-out__05Ta1 .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridCell-module_slide-out__05Ta1{animation-duration:.1ms}}@keyframes DataGridCell-module_slide-in__lMiX0{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes DataGridCell-module_slide-out__05Ta1{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.DataGridCell-module_cell__3aXoR{height:2.75rem;padding:.25rem 1rem}.DataGridCell-module_cell__3aXoR:first-child{padding-left:1rem}.DataGridCell-module_cell__3aXoR:last-child{padding-right:1rem}.DataGridCell-module_cell__3aXoR .DataGridCell-module_text__wbAjs{font-size:var(--font-size-data-grid);line-height:var(--data-grid-line-height)}.DataGridCell-module_cell__3aXoR .DataGridCell-module_loading__Pg1Ao{background-color:var(--skeleton-background-color);border-radius:.5rem;height:1.25rem;margin:.625rem 0;overflow:hidden;position:relative}.DataGridCell-module_cell__3aXoR .DataGridCell-module_loading__Pg1Ao:after{animation:DataGridCell-module_shimmer__P-85D 2s infinite;background-image:linear-gradient(90deg,rgba(var(--skeleton-animation-color-rgb),0) 0,rgba(var(--skeleton-animation-color-rgb),.2) 20%,rgba(var(--skeleton-animation-color-rgb),.5) 60%,rgba(var(--skeleton-animation-color-rgb),0));bottom:0;content:\"\";left:0;position:absolute;right:0;top:0;transform:translateX(-100%)}@media (prefers-reduced-motion:reduce){.DataGridCell-module_cell__3aXoR .DataGridCell-module_loading__Pg1Ao:after{animation:none}}@keyframes DataGridCell-module_shimmer__P-85D{to{transform:translateX(100%)}}@media only screen and (min-width:50em){.DataGridCell-module_cell__3aXoR:first-child{padding-left:1.25rem}.DataGridCell-module_cell__3aXoR:last-child{padding-right:1.25rem}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkQ2VsbC5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRixvQ0FPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsbUNBQ0UsWUFDRixDQUVBLHFDQUNFLDBEQUNGLENBQ0EsdUNBQ0UscUNBQ0UsdUJBQ0YsQ0FDRixDQUVBLHNDQUNFLDJEQUNGLENBQ0EsdUNBQ0Usc0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLCtDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSxnREFDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGLENBQ0EsaUNBQ0UsY0FBZSxDQUNmLG1CQUNGLENBQ0EsNkNBQ0UsaUJBQ0YsQ0FDQSw0Q0FDRSxrQkFDRixDQUNBLGtFQUNFLG9DQUFxQyxDQUNyQyx3Q0FDRixDQUNBLHFFQUdFLGlEQUFrRCxDQUNsRCxtQkFBcUIsQ0FDckIsY0FBZSxDQUNmLGdCQUFrQixDQUpsQixlQUFnQixDQURoQixpQkFNRixDQUNBLDJFQVNFLHdEQUE4QixDQUY5QixtT0FBOE8sQ0FIOU8sUUFBUyxDQUlULFVBQVcsQ0FIWCxNQUFPLENBSlAsaUJBQWtCLENBRWxCLE9BQVEsQ0FEUixLQUFNLENBSU4sMkJBSUYsQ0FDQSx1Q0FDRSwyRUFDRSxjQUNGLENBQ0YsQ0FDQSw4Q0FDRSxHQUNFLDBCQUNGLENBQ0YsQ0FFQSx3Q0FDRSw2Q0FDRSxvQkFDRixDQUNBLDRDQUNFLHFCQUNGLENBQ0YiLCJmaWxlIjoiRGF0YUdyaWRDZWxsLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNyLW9ubHkge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IC0xcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGNsaXA6IHJlY3QoMCwgMCwgMCwgMCk7XG4gIGJvcmRlcjogMDtcbn1cblxuLmhpZGRlbiB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5zbGlkZS1pbiB7XG4gIGFuaW1hdGlvbjogc2xpZGUtaW4gMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG4uc2xpZGUtb3V0IHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1vdXQgMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuQGtleWZyYW1lcyBzbGlkZS1pbiB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtb3V0IHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxufVxuLmNlbGwge1xuICBoZWlnaHQ6IDIuNzVyZW07XG4gIHBhZGRpbmc6IDAuMjVyZW0gMXJlbTtcbn1cbi5jZWxsOmZpcnN0LWNoaWxkIHtcbiAgcGFkZGluZy1sZWZ0OiAxcmVtO1xufVxuLmNlbGw6bGFzdC1jaGlsZCB7XG4gIHBhZGRpbmctcmlnaHQ6IDFyZW07XG59XG4uY2VsbCAudGV4dCB7XG4gIGZvbnQtc2l6ZTogdmFyKC0tZm9udC1zaXplLWRhdGEtZ3JpZCk7XG4gIGxpbmUtaGVpZ2h0OiB2YXIoLS1kYXRhLWdyaWQtbGluZS1oZWlnaHQpO1xufVxuLmNlbGwgLmxvYWRpbmcge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXNrZWxldG9uLWJhY2tncm91bmQtY29sb3IpO1xuICBib3JkZXItcmFkaXVzOiAwLjVyZW07XG4gIGhlaWdodDogMS4yNXJlbTtcbiAgbWFyZ2luOiAwLjYyNXJlbSAwO1xufVxuLmNlbGwgLmxvYWRpbmc6OmFmdGVyIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIHJpZ2h0OiAwO1xuICBib3R0b206IDA7XG4gIGxlZnQ6IDA7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtMTAwJSk7XG4gIGJhY2tncm91bmQtaW1hZ2U6IGxpbmVhci1ncmFkaWVudCg5MGRlZywgcmdiYSh2YXIoLS1za2VsZXRvbi1hbmltYXRpb24tY29sb3ItcmdiKSwgMCkgMCwgcmdiYSh2YXIoLS1za2VsZXRvbi1hbmltYXRpb24tY29sb3ItcmdiKSwgMC4yKSAyMCUsIHJnYmEodmFyKC0tc2tlbGV0b24tYW5pbWF0aW9uLWNvbG9yLXJnYiksIDAuNSkgNjAlLCByZ2JhKHZhcigtLXNrZWxldG9uLWFuaW1hdGlvbi1jb2xvci1yZ2IpLCAwKSk7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGFuaW1hdGlvbjogc2hpbW1lciAycyBpbmZpbml0ZTtcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5jZWxsIC5sb2FkaW5nOjphZnRlciB7XG4gICAgYW5pbWF0aW9uOiBub25lO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNoaW1tZXIge1xuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7XG4gIH1cbn1cblxuQG1lZGlhIG9ubHkgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA1MGVtKSB7XG4gIC5jZWxsOmZpcnN0LWNoaWxkIHtcbiAgICBwYWRkaW5nLWxlZnQ6IDEuMjVyZW07XG4gIH1cbiAgLmNlbGw6bGFzdC1jaGlsZCB7XG4gICAgcGFkZGluZy1yaWdodDogMS4yNXJlbTtcbiAgfVxufSJdfQ== */";
-var classes = {"sr-only":"DataGridCell-module_sr-only__S8j0D","hidden":"DataGridCell-module_hidden__0hgMX","slide-in":"DataGridCell-module_slide-in__lMiX0","slide-out":"DataGridCell-module_slide-out__05Ta1","cell":"DataGridCell-module_cell__3aXoR","text":"DataGridCell-module_text__wbAjs","loading":"DataGridCell-module_loading__Pg1Ao","shimmer":"DataGridCell-module_shimmer__P-85D"};
+var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.DataGridCell-module_sr-only__S8j0D{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DataGridCell-module_hidden__0hgMX{display:none}.DataGridCell-module_slide-in__lMiX0{animation:DataGridCell-module_slide-in__lMiX0 .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridCell-module_slide-in__lMiX0{animation-duration:.1ms}}.DataGridCell-module_slide-out__05Ta1{animation:DataGridCell-module_slide-out__05Ta1 .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridCell-module_slide-out__05Ta1{animation-duration:.1ms}}@keyframes DataGridCell-module_slide-in__lMiX0{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes DataGridCell-module_slide-out__05Ta1{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.DataGridCell-module_cell__3aXoR{height:2.75rem;padding:.25rem 1rem}.DataGridCell-module_cell__3aXoR:first-child{padding-left:1rem}.DataGridCell-module_cell__3aXoR:last-child{padding-right:1rem}.DataGridCell-module_cell__3aXoR .DataGridCell-module_content-wrapper__SutuS{align-items:center;display:flex;gap:6px}.DataGridCell-module_cell__3aXoR .DataGridCell-module_text__wbAjs{font-size:var(--font-size-data-grid);line-height:var(--data-grid-line-height)}.DataGridCell-module_cell__3aXoR .DataGridCell-module_loading__Pg1Ao{background-color:var(--skeleton-background-color);border-radius:.5rem;height:1.25rem;margin:.625rem 0;overflow:hidden;position:relative}.DataGridCell-module_cell__3aXoR .DataGridCell-module_loading__Pg1Ao:after{animation:DataGridCell-module_shimmer__P-85D 2s infinite;background-image:linear-gradient(90deg,rgba(var(--skeleton-animation-color-rgb),0) 0,rgba(var(--skeleton-animation-color-rgb),.2) 20%,rgba(var(--skeleton-animation-color-rgb),.5) 60%,rgba(var(--skeleton-animation-color-rgb),0));bottom:0;content:\"\";left:0;position:absolute;right:0;top:0;transform:translateX(-100%)}@media (prefers-reduced-motion:reduce){.DataGridCell-module_cell__3aXoR .DataGridCell-module_loading__Pg1Ao:after{animation:none}}@keyframes DataGridCell-module_shimmer__P-85D{to{transform:translateX(100%)}}@media only screen and (min-width:50em){.DataGridCell-module_cell__3aXoR:first-child{padding-left:1.25rem}.DataGridCell-module_cell__3aXoR:last-child{padding-right:1.25rem}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkQ2VsbC5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRixvQ0FPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsbUNBQ0UsWUFDRixDQUVBLHFDQUNFLDBEQUNGLENBQ0EsdUNBQ0UscUNBQ0UsdUJBQ0YsQ0FDRixDQUVBLHNDQUNFLDJEQUNGLENBQ0EsdUNBQ0Usc0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLCtDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSxnREFDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGLENBQ0EsaUNBQ0UsY0FBZSxDQUNmLG1CQUNGLENBQ0EsNkNBQ0UsaUJBQ0YsQ0FDQSw0Q0FDRSxrQkFDRixDQUNBLDZFQUVFLGtCQUFtQixDQURuQixZQUFhLENBRWIsT0FDRixDQUNBLGtFQUNFLG9DQUFxQyxDQUNyQyx3Q0FDRixDQUNBLHFFQUdFLGlEQUFrRCxDQUNsRCxtQkFBcUIsQ0FDckIsY0FBZSxDQUNmLGdCQUFrQixDQUpsQixlQUFnQixDQURoQixpQkFNRixDQUNBLDJFQVNFLHdEQUE4QixDQUY5QixtT0FBOE8sQ0FIOU8sUUFBUyxDQUlULFVBQVcsQ0FIWCxNQUFPLENBSlAsaUJBQWtCLENBRWxCLE9BQVEsQ0FEUixLQUFNLENBSU4sMkJBSUYsQ0FDQSx1Q0FDRSwyRUFDRSxjQUNGLENBQ0YsQ0FDQSw4Q0FDRSxHQUNFLDBCQUNGLENBQ0YsQ0FFQSx3Q0FDRSw2Q0FDRSxvQkFDRixDQUNBLDRDQUNFLHFCQUNGLENBQ0YiLCJmaWxlIjoiRGF0YUdyaWRDZWxsLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNyLW9ubHkge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IC0xcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGNsaXA6IHJlY3QoMCwgMCwgMCwgMCk7XG4gIGJvcmRlcjogMDtcbn1cblxuLmhpZGRlbiB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5zbGlkZS1pbiB7XG4gIGFuaW1hdGlvbjogc2xpZGUtaW4gMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG4uc2xpZGUtb3V0IHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1vdXQgMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuQGtleWZyYW1lcyBzbGlkZS1pbiB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtb3V0IHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxufVxuLmNlbGwge1xuICBoZWlnaHQ6IDIuNzVyZW07XG4gIHBhZGRpbmc6IDAuMjVyZW0gMXJlbTtcbn1cbi5jZWxsOmZpcnN0LWNoaWxkIHtcbiAgcGFkZGluZy1sZWZ0OiAxcmVtO1xufVxuLmNlbGw6bGFzdC1jaGlsZCB7XG4gIHBhZGRpbmctcmlnaHQ6IDFyZW07XG59XG4uY2VsbCAuY29udGVudC13cmFwcGVyIHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZ2FwOiA2cHg7XG59XG4uY2VsbCAudGV4dCB7XG4gIGZvbnQtc2l6ZTogdmFyKC0tZm9udC1zaXplLWRhdGEtZ3JpZCk7XG4gIGxpbmUtaGVpZ2h0OiB2YXIoLS1kYXRhLWdyaWQtbGluZS1oZWlnaHQpO1xufVxuLmNlbGwgLmxvYWRpbmcge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXNrZWxldG9uLWJhY2tncm91bmQtY29sb3IpO1xuICBib3JkZXItcmFkaXVzOiAwLjVyZW07XG4gIGhlaWdodDogMS4yNXJlbTtcbiAgbWFyZ2luOiAwLjYyNXJlbSAwO1xufVxuLmNlbGwgLmxvYWRpbmc6OmFmdGVyIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB0b3A6IDA7XG4gIHJpZ2h0OiAwO1xuICBib3R0b206IDA7XG4gIGxlZnQ6IDA7XG4gIHRyYW5zZm9ybTogdHJhbnNsYXRlWCgtMTAwJSk7XG4gIGJhY2tncm91bmQtaW1hZ2U6IGxpbmVhci1ncmFkaWVudCg5MGRlZywgcmdiYSh2YXIoLS1za2VsZXRvbi1hbmltYXRpb24tY29sb3ItcmdiKSwgMCkgMCwgcmdiYSh2YXIoLS1za2VsZXRvbi1hbmltYXRpb24tY29sb3ItcmdiKSwgMC4yKSAyMCUsIHJnYmEodmFyKC0tc2tlbGV0b24tYW5pbWF0aW9uLWNvbG9yLXJnYiksIDAuNSkgNjAlLCByZ2JhKHZhcigtLXNrZWxldG9uLWFuaW1hdGlvbi1jb2xvci1yZ2IpLCAwKSk7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGFuaW1hdGlvbjogc2hpbW1lciAycyBpbmZpbml0ZTtcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5jZWxsIC5sb2FkaW5nOjphZnRlciB7XG4gICAgYW5pbWF0aW9uOiBub25lO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNoaW1tZXIge1xuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7XG4gIH1cbn1cblxuQG1lZGlhIG9ubHkgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA1MGVtKSB7XG4gIC5jZWxsOmZpcnN0LWNoaWxkIHtcbiAgICBwYWRkaW5nLWxlZnQ6IDEuMjVyZW07XG4gIH1cbiAgLmNlbGw6bGFzdC1jaGlsZCB7XG4gICAgcGFkZGluZy1yaWdodDogMS4yNXJlbTtcbiAgfVxufSJdfQ== */";
+var classes = {"sr-only":"DataGridCell-module_sr-only__S8j0D","hidden":"DataGridCell-module_hidden__0hgMX","slide-in":"DataGridCell-module_slide-in__lMiX0","slide-out":"DataGridCell-module_slide-out__05Ta1","cell":"DataGridCell-module_cell__3aXoR","content-wrapper":"DataGridCell-module_content-wrapper__SutuS","text":"DataGridCell-module_text__wbAjs","loading":"DataGridCell-module_loading__Pg1Ao","shimmer":"DataGridCell-module_shimmer__P-85D"};
 styleInject(css_248z);
 
 export { classes as default };

package/dist/esm/DataGrid/DataGridBody/DataGridRow/DataGridRow.esm.js

@@ -5,6 +5,7 @@ import { Icon, Icons } from '../../../Icon/Icon.esm.js';
 import { DataGridCell } from '../DataGridCell/DataGridCell.esm.js';
 import { DataGridDrawer } from '../DataGridDrawer/DataGridDrawer.esm.js';
 import { generateID } from '../../../src/util/helper.esm.js';
+import { useNestedRow } from './useNestedRow.esm.js';
 
 /*
  * Copyright 2022 OneWelcome B.V.
@@ -21,38 +22,67 @@ import { generateID } from '../../../src/util/helper.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const DataGridRowComponent = ({ children, className, headers, searchValue, isLoading, spacing, expandableRowProps, disableContextMenuColumn, ...rest }, ref) => {
+const DataGridRowComponent = ({ item, children, className, headers, searchValue, isLoading, spacing, expandableRowProps, disableContextMenuColumn, nestedRowProps, ...rest }, ref) => {
     const { enableExpandableRow = false, expandButtonId = `ID-${generateID()}`, expandButtonTitle = "Expand row", drawerId = `ID-${generateID()}`, expandableRowContent } = expandableRowProps || {};
+    const { indentationLevels, indentationLevel = 0, nestedItemsKey, enableNestedRow, rowTemplate } = nestedRowProps || {};
     const [isRowExpanded, setIsRowExpanded] = useState(false);
+    const { renderNestedRowConnectors, renderNestedRow, getNestedChildSpacing, hasNestedChildren } = useNestedRow({
+        indentationLevels,
+        indentationLevel,
+        item,
+        nestedItemsKey,
+        rowTemplate,
+        isRowExpanded,
+        enableNestedRow,
+        rowProps: {
+            searchValue,
+            headers,
+            spacing,
+            disableContextMenuColumn
+        }
+    });
+    const classNames = [classes["row"]];
+    const rowBorderClass = enableNestedRow
+        ? classes[`border-${indentationLevel}`]
+        : classes[`border`];
+    className && classNames.push(className);
+    enableExpandableRow
+        ? !isRowExpanded && classNames.push(classes["border-drawer"])
+        : classNames.push(rowBorderClass);
+    isLoading && classNames.push(classes["loading"]);
+    const getPrefixButton = (hasNestedChildren) => hasNestedChildren ? (React.createElement(IconButton, { id: expandButtonId, title: expandButtonTitle, "aria-expanded": isRowExpanded, onClick: () => setIsRowExpanded(!isRowExpanded) },
+        React.createElement(Icon, { size: "0.75rem", icon: isRowExpanded ? Icons.ChevronUp : Icons.ChevronDown }))) : null;
     const visibleCells = React.Children.map(children, (child, index) => {
+        const childSpacing = enableNestedRow ? getNestedChildSpacing(spacing, index) : spacing;
+        const prefixElement = enableNestedRow && index === 0 ? (React.createElement(React.Fragment, null,
+            getPrefixButton(!!hasNestedChildren),
+            renderNestedRowConnectors())) : null;
         if (child) {
             const cellWithSpacing = React.cloneElement(child, {
                 searchValue,
-                spacing: spacing,
+                spacing: childSpacing,
                 cellIndex: index,
                 columnLength: headers === null || headers === void 0 ? void 0 : headers.length,
-                disableContextMenuColumn
+                disableContextMenuColumn,
+                prefixElement
             });
             const visible = headers && headers.length > index ? !headers[index].hidden : true;
             return visible && cellWithSpacing;
         }
         return null;
     });
-    const classNames = [classes["row"]];
-    className && classNames.push(className);
-    enableExpandableRow
-        ? !isRowExpanded && classNames.push(classes["border-drawer"])
-        : classNames.push(classes["border"]);
-    isLoading && classNames.push(classes["loading"]);
     return (React.createElement(Fragment, null,
         React.createElement("tr", { ...rest, ref: ref, className: classNames.join(" ") },
-            enableExpandableRow && (React.createElement(DataGridCell, { className: classes["expand-button-cell"], onClick: () => setIsRowExpanded(!isRowExpanded), style: { width: "1px" } },
+            enableExpandableRow && (React.createElement(DataGridCell, { className: classes["expand-button-cell"], onClick: () => setIsRowExpanded(!isRowExpanded), style: {
+                    width: "1px"
+                } },
                 React.createElement(IconButton, { id: expandButtonId, title: expandButtonTitle, "aria-expanded": isRowExpanded, "aria-controls": drawerId },
                     React.createElement(Icon, { size: "0.75rem", icon: isRowExpanded ? Icons.ChevronUp : Icons.ChevronDown })))),
             visibleCells),
         enableExpandableRow && (React.createElement("tr", { className: `${classes["row"]} ${isRowExpanded ? classes["border-drawer"] : ""}` },
             React.createElement("td", { colSpan: visibleCells.length + 1 },
-                React.createElement(DataGridDrawer, { id: drawerId, role: "region", "aria-labelledby": expandButtonId, isExpanded: isRowExpanded }, expandableRowContent))))));
+                React.createElement(DataGridDrawer, { id: drawerId, role: "region", "aria-labelledby": expandButtonId, isExpanded: isRowExpanded }, expandableRowContent)))),
+        enableNestedRow && renderNestedRow()));
 };
 const DataGridRow = React.forwardRef(DataGridRowComponent);
 

package/dist/esm/DataGrid/DataGridBody/DataGridRow/DataGridRow.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataGridRow.esm.js","sources":["../../../../../../../src/components/DataGrid/DataGridBody/DataGridRow/DataGridRow.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentPropsWithRef, useState, Fragment, ForwardRefRenderFunction } from \"react\";\nimport { HeaderCell } from \"../../datagrid.interfaces\";\nimport classes from \"./DataGridRow.module.scss\";\nimport { IconButton } from \"../../../Button/IconButton\";\nimport { Icon, Icons } from \"../../../Icon/Icon\";\nimport { DataGridCell } from \"../DataGridCell/DataGridCell\";\nimport { DataGridDrawer } from \"../DataGridDrawer/DataGridDrawer\";\nimport { generateID } from \"../../../../util/helper\";\n\nexport interface Props extends ComponentPropsWithRef<\"tr\"> {\n  headers?: HeaderCell[];\n  isLoading?: boolean;\n  spacing?: React.CSSProperties;\n  searchValue?: string;\n  disableContextMenuColumn?: boolean;\n  expandableRowProps?: {\n    enableExpandableRow: boolean;\n    expandableRowContent: React.ReactNode;\n    expandButtonTitle?: string;\n    expandButtonId?: string;\n    drawerId?: string;\n  };\n}\n\nconst DataGridRowComponent: ForwardRefRenderFunction<HTMLTableRowElement, Props> = (\n  {\n    children,\n    className,\n    headers,\n    searchValue,\n    isLoading,\n    spacing,\n    expandableRowProps,\n    disableContextMenuColumn,\n    ...rest\n  },\n  ref\n) => {\n  const {\n    enableExpandableRow = false,\n    expandButtonId = `ID-${generateID()}`,\n    expandButtonTitle = \"Expand row\",\n    drawerId = `ID-${generateID()}`,\n    expandableRowContent\n  } = expandableRowProps || {};\n  const [isRowExpanded, setIsRowExpanded] = useState(false);\n  const visibleCells = React.Children.map(children as React.ReactElement[], (child, index) => {\n    if (child) {\n      const cellWithSpacing = React.cloneElement(child, {\n        searchValue,\n        spacing: spacing,\n        cellIndex: index,\n        columnLength: headers?.length,\n        disableContextMenuColumn\n      });\n\n      const visible = headers && headers.length > index ? !headers[index].hidden : true;\n      return visible && cellWithSpacing;\n    }\n    return null;\n  });\n\n  const classNames = [classes[\"row\"]];\n  className && classNames.push(className);\n  enableExpandableRow\n    ? !isRowExpanded && classNames.push(classes[\"border-drawer\"])\n    : classNames.push(classes[\"border\"]);\n  isLoading && classNames.push(classes[\"loading\"]);\n\n  return (\n    <Fragment>\n      <tr {...rest} ref={ref} className={classNames.join(\" \")}>\n        {enableExpandableRow && (\n          <DataGridCell\n            className={classes[\"expand-button-cell\"]}\n            onClick={() => setIsRowExpanded(!isRowExpanded)}\n            style={{ width: \"1px\" }}\n          >\n            <IconButton\n              id={expandButtonId}\n              title={expandButtonTitle}\n              aria-expanded={isRowExpanded}\n              aria-controls={drawerId}\n            >\n              <Icon size=\"0.75rem\" icon={isRowExpanded ? Icons.ChevronUp : Icons.ChevronDown} />\n            </IconButton>\n          </DataGridCell>\n        )}\n        {visibleCells}\n      </tr>\n      {enableExpandableRow && (\n        <tr className={`${classes[\"row\"]} ${isRowExpanded ? classes[\"border-drawer\"] : \"\"}`}>\n          <td colSpan={visibleCells.length + 1}>\n            <DataGridDrawer\n              id={drawerId}\n              role=\"region\"\n              aria-labelledby={expandButtonId}\n              isExpanded={isRowExpanded}\n            >\n              {expandableRowContent}\n            </DataGridDrawer>\n          </td>\n        </tr>\n      )}\n    </Fragment>\n  );\n};\n\nexport const DataGridRow = React.forwardRef(DataGridRowComponent);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGridRow.esm.js","sources":["../../../../../../../src/components/DataGrid/DataGridBody/DataGridRow/DataGridRow.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ComponentPropsWithRef, useState, Fragment, Ref, ReactElement } from \"react\";\nimport { HeaderCell } from \"../../datagrid.interfaces\";\nimport classes from \"./DataGridRow.module.scss\";\nimport { IconButton } from \"../../../Button/IconButton\";\nimport { Icon, Icons } from \"../../../Icon/Icon\";\nimport { DataGridCell } from \"../DataGridCell/DataGridCell\";\nimport { DataGridDrawer } from \"../DataGridDrawer/DataGridDrawer\";\nimport { generateID } from \"../../../../util/helper\";\nimport { useNestedRow } from \"./useNestedRow\";\n\nexport interface Props<T> extends ComponentPropsWithRef<\"tr\"> {\n  item?: T;\n  headers?: HeaderCell[];\n  isLoading?: boolean;\n  spacing?: React.CSSProperties;\n  searchValue?: string;\n  disableContextMenuColumn?: boolean;\n  nestedRowProps?: {\n    rowTemplate?: ({ item, index }: { item: T; index: number }) => ReactElement;\n    indentationLevel?: number;\n    indentationLevels?: { level: number; isLastChild: boolean }[];\n    enableNestedRow?: boolean;\n    nestedItemsKey?: keyof T;\n  };\n  expandableRowProps?: {\n    enableExpandableRow: boolean;\n    expandableRowContent: React.ReactNode;\n    expandButtonTitle?: string;\n    expandButtonId?: string;\n    drawerId?: string;\n  };\n}\n\nconst DataGridRowComponent = <T,>(\n  {\n    item,\n    children,\n    className,\n    headers,\n    searchValue,\n    isLoading,\n    spacing,\n    expandableRowProps,\n    disableContextMenuColumn,\n    nestedRowProps,\n    ...rest\n  }: Props<T>,\n  ref: Ref<HTMLTableRowElement>\n) => {\n  const {\n    enableExpandableRow = false,\n    expandButtonId = `ID-${generateID()}`,\n    expandButtonTitle = \"Expand row\",\n    drawerId = `ID-${generateID()}`,\n    expandableRowContent\n  } = expandableRowProps || {};\n  const {\n    indentationLevels,\n    indentationLevel = 0,\n    nestedItemsKey,\n    enableNestedRow,\n    rowTemplate\n  } = nestedRowProps || {};\n  const [isRowExpanded, setIsRowExpanded] = useState(false);\n  const { renderNestedRowConnectors, renderNestedRow, getNestedChildSpacing, hasNestedChildren } =\n    useNestedRow({\n      indentationLevels,\n      indentationLevel,\n      item,\n      nestedItemsKey,\n      rowTemplate,\n      isRowExpanded,\n      enableNestedRow,\n      rowProps: {\n        searchValue,\n        headers,\n        spacing,\n        disableContextMenuColumn\n      }\n    });\n\n  const classNames = [classes[\"row\"]];\n  const rowBorderClass = enableNestedRow\n    ? classes[`border-${indentationLevel}`]\n    : classes[`border`];\n\n  className && classNames.push(className);\n  enableExpandableRow\n    ? !isRowExpanded && classNames.push(classes[\"border-drawer\"])\n    : classNames.push(rowBorderClass);\n  isLoading && classNames.push(classes[\"loading\"]);\n\n  const getPrefixButton = (hasNestedChildren: boolean) =>\n    hasNestedChildren ? (\n      <IconButton\n        id={expandButtonId}\n        title={expandButtonTitle}\n        aria-expanded={isRowExpanded}\n        onClick={() => setIsRowExpanded(!isRowExpanded)}\n      >\n        <Icon size=\"0.75rem\" icon={isRowExpanded ? Icons.ChevronUp : Icons.ChevronDown} />\n      </IconButton>\n    ) : null;\n\n  const visibleCells = React.Children.map(children as React.ReactElement[], (child, index) => {\n    const childSpacing = enableNestedRow ? getNestedChildSpacing(spacing, index) : spacing;\n\n    const prefixElement =\n      enableNestedRow && index === 0 ? (\n        <>\n          {getPrefixButton(!!hasNestedChildren)}\n          {renderNestedRowConnectors()}\n        </>\n      ) : null;\n\n    if (child) {\n      const cellWithSpacing = React.cloneElement(child, {\n        searchValue,\n        spacing: childSpacing,\n        cellIndex: index,\n        columnLength: headers?.length,\n        disableContextMenuColumn,\n        prefixElement\n      });\n\n      const visible = headers && headers.length > index ? !headers[index].hidden : true;\n      return visible && cellWithSpacing;\n    }\n    return null;\n  });\n\n  return (\n    <Fragment>\n      <tr {...rest} ref={ref} className={classNames.join(\" \")}>\n        {enableExpandableRow && (\n          <DataGridCell\n            className={classes[\"expand-button-cell\"]}\n            onClick={() => setIsRowExpanded(!isRowExpanded)}\n            style={{\n              width: \"1px\"\n            }}\n          >\n            <IconButton\n              id={expandButtonId}\n              title={expandButtonTitle}\n              aria-expanded={isRowExpanded}\n              aria-controls={drawerId}\n            >\n              <Icon size=\"0.75rem\" icon={isRowExpanded ? Icons.ChevronUp : Icons.ChevronDown} />\n            </IconButton>\n          </DataGridCell>\n        )}\n        {visibleCells}\n      </tr>\n      {enableExpandableRow && (\n        <tr className={`${classes[\"row\"]} ${isRowExpanded ? classes[\"border-drawer\"] : \"\"}`}>\n          <td colSpan={visibleCells.length + 1}>\n            <DataGridDrawer\n              id={drawerId}\n              role=\"region\"\n              aria-labelledby={expandButtonId}\n              isExpanded={isRowExpanded}\n            >\n              {expandableRowContent}\n            </DataGridDrawer>\n          </td>\n        </tr>\n      )}\n      {enableNestedRow && renderNestedRow()}\n    </Fragment>\n  );\n};\n\nexport const DataGridRow = React.forwardRef(DataGridRowComponent) as <T extends {}>(\n  p: Props<T> & { ref?: Ref<HTMLTableRowElement> }\n) => ReactElement;\n"],"names":[],"mappings":"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"}

package/dist/esm/DataGrid/DataGridBody/DataGridRow/DataGridRow.module.scss.esm.js

@@ -1,7 +1,7 @@
 import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.esm.js';
 
-var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.DataGridRow-module_row__yQDVO{background-color:var(--data-grid-row-background-color);position:relative}.DataGridRow-module_row__yQDVO:not(.DataGridRow-module_loading__-xjr0):hover{background-color:var(--data-grid-row-hover-background-color)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-drawer__W2hWL:not(:last-child):not(:nth-last-child(2)):after,.DataGridRow-module_row__yQDVO.DataGridRow-module_border__wLIZi:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:0;position:absolute;width:100%}.DataGridRow-module_expand-button-cell__P2myT{padding:0}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkUm93Lm1vZHVsZS5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7OztFQWNFLENBQ0YsK0JBRUUsc0RBQXVELENBRHZELGlCQUVGLENBQ0EsNkVBQ0UsNERBQ0YsQ0FTQSw2TUFNRSxnREFBaUQsQ0FEakQsUUFBUyxDQUpULFVBQVcsQ0FHWCxNQUFPLENBRlAsaUJBQWtCLENBQ2xCLFVBSUYsQ0FFQSw4Q0FDRSxTQUNGIiwiZmlsZSI6IkRhdGFHcmlkUm93Lm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5yb3cge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWRhdGEtZ3JpZC1yb3ctYmFja2dyb3VuZC1jb2xvcik7XG59XG4ucm93Om5vdCgubG9hZGluZyk6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1kYXRhLWdyaWQtcm93LWhvdmVyLWJhY2tncm91bmQtY29sb3IpO1xufVxuLnJvdy5ib3JkZXI6bm90KDpsYXN0LWNoaWxkKTo6YWZ0ZXIge1xuICBjb250ZW50OiBcIlwiO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxMDAlO1xuICBsZWZ0OiAwO1xuICBib3R0b206IDA7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB2YXIoLS1saWdodC1ncmV5LWJvcmRlcik7XG59XG4ucm93LmJvcmRlci1kcmF3ZXI6bm90KDpsYXN0LWNoaWxkKTpub3QoOm50aC1sYXN0LWNoaWxkKDIpKTo6YWZ0ZXIge1xuICBjb250ZW50OiBcIlwiO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxMDAlO1xuICBsZWZ0OiAwO1xuICBib3R0b206IDA7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB2YXIoLS1saWdodC1ncmV5LWJvcmRlcik7XG59XG5cbi5leHBhbmQtYnV0dG9uLWNlbGwge1xuICBwYWRkaW5nOiAwO1xufSJdfQ== */";
-var classes = {"row":"DataGridRow-module_row__yQDVO","loading":"DataGridRow-module_loading__-xjr0","border":"DataGridRow-module_border__wLIZi","border-drawer":"DataGridRow-module_border-drawer__W2hWL","expand-button-cell":"DataGridRow-module_expand-button-cell__P2myT"};
+var css_248z = "/*!\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */.DataGridRow-module_row__yQDVO{background-color:var(--data-grid-row-background-color);position:relative}.DataGridRow-module_row__yQDVO:not(.DataGridRow-module_loading__-xjr0):hover{background-color:var(--data-grid-row-hover-background-color)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-0__Q6D3Q:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:3.0625rem;position:absolute;width:calc(100% - 3.0625rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-1__7cp-V:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:7.1875rem;position:absolute;width:calc(100% - 7.1875rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-2__QCBIg:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:11.3125rem;position:absolute;width:calc(100% - 11.3125rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-3__fHSOf:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:15.4375rem;position:absolute;width:calc(100% - 15.4375rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-4__tEXsB:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:19.5625rem;position:absolute;width:calc(100% - 19.5625rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-5__MyQd6:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:23.6875rem;position:absolute;width:calc(100% - 23.6875rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-6__-lMJ-:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:27.8125rem;position:absolute;width:calc(100% - 27.8125rem)}.DataGridRow-module_row__yQDVO.DataGridRow-module_border-drawer__W2hWL:not(:last-child):not(:nth-last-child(2)):after,.DataGridRow-module_row__yQDVO.DataGridRow-module_border__wLIZi:not(:last-child):after{border-bottom:1px solid var(--light-grey-border);bottom:0;content:\"\";left:0;position:absolute;width:100%}.DataGridRow-module_expand-button-cell__P2myT{padding:0}.DataGridRow-module_connector__wakAv{height:3.25rem;left:0;position:absolute;top:0;width:2.875rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-0__k2RYD{left:0}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-1__4zXM7{left:4.125rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-2__eAiPP{left:8.25rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-3__aObOx{left:12.375rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-4__oU26v{left:16.5rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-5__-SY5P{left:20.625rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_offset-left-6__V16HL{left:24.75rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_vertical__SSnAv:before{background-color:var(--color-blue-grey200);content:\"\";height:100%;left:50%;position:absolute;width:.0625rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_t-shape__r3AMf:before{background-color:var(--color-blue-grey200);content:\"\";height:3.25rem;left:50%;position:absolute;width:.0625rem}.DataGridRow-module_connector__wakAv.DataGridRow-module_t-shape__r3AMf:after{background-color:var(--color-blue-grey200);content:\"\";height:.0625rem;left:50%;position:absolute;top:50%;width:100%}.DataGridRow-module_connector__wakAv.DataGridRow-module_line__DNtsj:before{background-color:var(--color-blue-grey200);content:\"\";height:50%;left:50%;position:absolute;width:1px}.DataGridRow-module_connector__wakAv.DataGridRow-module_line__DNtsj:after{background-color:var(--color-blue-grey200);content:\"\";height:1px;left:50%;position:absolute;top:50%;width:100%}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkUm93Lm1vZHVsZS5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOzs7Ozs7Ozs7Ozs7OztFQWNFLENBQ0YsK0JBRUUsc0RBQXVELENBRHZELGlCQUVGLENBQ0EsNkVBQ0UsNERBQ0YsQ0FDQSx5RkFNRSxnREFBaUQsQ0FEakQsUUFBUyxDQUpULFVBQVcsQ0FHWCxjQUFlLENBRmYsaUJBQWtCLENBQ2xCLDRCQUlGLENBQ0EseUZBTUUsZ0RBQWlELENBRGpELFFBQVMsQ0FKVCxVQUFXLENBR1gsY0FBZSxDQUZmLGlCQUFrQixDQUNsQiw0QkFJRixDQUNBLHlGQU1FLGdEQUFpRCxDQURqRCxRQUFTLENBSlQsVUFBVyxDQUdYLGVBQWdCLENBRmhCLGlCQUFrQixDQUNsQiw2QkFJRixDQUNBLHlGQU1FLGdEQUFpRCxDQURqRCxRQUFTLENBSlQsVUFBVyxDQUdYLGVBQWdCLENBRmhCLGlCQUFrQixDQUNsQiw2QkFJRixDQUNBLHlGQU1FLGdEQUFpRCxDQURqRCxRQUFTLENBSlQsVUFBVyxDQUdYLGVBQWdCLENBRmhCLGlCQUFrQixDQUNsQiw2QkFJRixDQUNBLHlGQU1FLGdEQUFpRCxDQURqRCxRQUFTLENBSlQsVUFBVyxDQUdYLGVBQWdCLENBRmhCLGlCQUFrQixDQUNsQiw2QkFJRixDQUNBLHlGQU1FLGdEQUFpRCxDQURqRCxRQUFTLENBSlQsVUFBVyxDQUdYLGVBQWdCLENBRmhCLGlCQUFrQixDQUNsQiw2QkFJRixDQVNBLDZNQUZFLGdEQUFpRCxDQURqRCxRQUFTLENBSlQsVUFBVyxDQUdYLE1BQU8sQ0FGUCxpQkFBa0IsQ0FDbEIsVUFZRixDQUVBLDhDQUNFLFNBQ0YsQ0FFQSxxQ0FLRSxjQUFlLENBRmYsTUFBTyxDQUZQLGlCQUFrQixDQUNsQixLQUFNLENBRU4sY0FFRixDQUNBLDZFQUNFLE1BQ0YsQ0FDQSw2RUFDRSxhQUNGLENBQ0EsNkVBQ0UsWUFDRixDQUNBLDZFQUNFLGNBQ0YsQ0FDQSw2RUFDRSxZQUNGLENBQ0EsNkVBQ0UsY0FDRixDQUNBLDZFQUNFLGFBQ0YsQ0FDQSwrRUFNRSwwQ0FBMkMsQ0FKM0MsVUFBVyxDQUVYLFdBQVksQ0FEWixRQUFTLENBRlQsaUJBQWtCLENBSWxCLGNBRUYsQ0FDQSw4RUFNRSwwQ0FBMkMsQ0FKM0MsVUFBVyxDQUVYLGNBQWUsQ0FEZixRQUFTLENBRlQsaUJBQWtCLENBSWxCLGNBRUYsQ0FDQSw2RUFPRSwwQ0FBMkMsQ0FMM0MsVUFBVyxDQUdYLGVBQWlCLENBRGpCLFFBQVMsQ0FIVCxpQkFBa0IsQ0FFbEIsT0FBUSxDQUdSLFVBRUYsQ0FDQSwyRUFNRSwwQ0FBMkMsQ0FKM0MsVUFBVyxDQUVYLFVBQVcsQ0FEWCxRQUFTLENBRlQsaUJBQWtCLENBSWxCLFNBRUYsQ0FDQSwwRUFPRSwwQ0FBMkMsQ0FMM0MsVUFBVyxDQUdYLFVBQVcsQ0FEWCxRQUFTLENBSFQsaUJBQWtCLENBRWxCLE9BQVEsQ0FHUixVQUVGIiwiZmlsZSI6IkRhdGFHcmlkUm93Lm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5yb3cge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWRhdGEtZ3JpZC1yb3ctYmFja2dyb3VuZC1jb2xvcik7XG59XG4ucm93Om5vdCgubG9hZGluZyk6aG92ZXIge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1kYXRhLWdyaWQtcm93LWhvdmVyLWJhY2tncm91bmQtY29sb3IpO1xufVxuLnJvdy5ib3JkZXItMDpub3QoOmxhc3QtY2hpbGQpOjphZnRlciB7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IGNhbGMoMTAwJSAtIDMuMDYyNXJlbSk7XG4gIGxlZnQ6IDMuMDYyNXJlbTtcbiAgYm90dG9tOiAwO1xuICBib3JkZXItYm90dG9tOiAxcHggc29saWQgdmFyKC0tbGlnaHQtZ3JleS1ib3JkZXIpO1xufVxuLnJvdy5ib3JkZXItMTpub3QoOmxhc3QtY2hpbGQpOjphZnRlciB7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IGNhbGMoMTAwJSAtIDcuMTg3NXJlbSk7XG4gIGxlZnQ6IDcuMTg3NXJlbTtcbiAgYm90dG9tOiAwO1xuICBib3JkZXItYm90dG9tOiAxcHggc29saWQgdmFyKC0tbGlnaHQtZ3JleS1ib3JkZXIpO1xufVxuLnJvdy5ib3JkZXItMjpub3QoOmxhc3QtY2hpbGQpOjphZnRlciB7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IGNhbGMoMTAwJSAtIDExLjMxMjVyZW0pO1xuICBsZWZ0OiAxMS4zMTI1cmVtO1xuICBib3R0b206IDA7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB2YXIoLS1saWdodC1ncmV5LWJvcmRlcik7XG59XG4ucm93LmJvcmRlci0zOm5vdCg6bGFzdC1jaGlsZCk6OmFmdGVyIHtcbiAgY29udGVudDogXCJcIjtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogY2FsYygxMDAlIC0gMTUuNDM3NXJlbSk7XG4gIGxlZnQ6IDE1LjQzNzVyZW07XG4gIGJvdHRvbTogMDtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkIHZhcigtLWxpZ2h0LWdyZXktYm9yZGVyKTtcbn1cbi5yb3cuYm9yZGVyLTQ6bm90KDpsYXN0LWNoaWxkKTo6YWZ0ZXIge1xuICBjb250ZW50OiBcIlwiO1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiBjYWxjKDEwMCUgLSAxOS41NjI1cmVtKTtcbiAgbGVmdDogMTkuNTYyNXJlbTtcbiAgYm90dG9tOiAwO1xuICBib3JkZXItYm90dG9tOiAxcHggc29saWQgdmFyKC0tbGlnaHQtZ3JleS1ib3JkZXIpO1xufVxuLnJvdy5ib3JkZXItNTpub3QoOmxhc3QtY2hpbGQpOjphZnRlciB7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IGNhbGMoMTAwJSAtIDIzLjY4NzVyZW0pO1xuICBsZWZ0OiAyMy42ODc1cmVtO1xuICBib3R0b206IDA7XG4gIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCB2YXIoLS1saWdodC1ncmV5LWJvcmRlcik7XG59XG4ucm93LmJvcmRlci02Om5vdCg6bGFzdC1jaGlsZCk6OmFmdGVyIHtcbiAgY29udGVudDogXCJcIjtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogY2FsYygxMDAlIC0gMjcuODEyNXJlbSk7XG4gIGxlZnQ6IDI3LjgxMjVyZW07XG4gIGJvdHRvbTogMDtcbiAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkIHZhcigtLWxpZ2h0LWdyZXktYm9yZGVyKTtcbn1cbi5yb3cuYm9yZGVyOm5vdCg6bGFzdC1jaGlsZCk6OmFmdGVyIHtcbiAgY29udGVudDogXCJcIjtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMTAwJTtcbiAgbGVmdDogMDtcbiAgYm90dG9tOiAwO1xuICBib3JkZXItYm90dG9tOiAxcHggc29saWQgdmFyKC0tbGlnaHQtZ3JleS1ib3JkZXIpO1xufVxuLnJvdy5ib3JkZXItZHJhd2VyOm5vdCg6bGFzdC1jaGlsZCk6bm90KDpudGgtbGFzdC1jaGlsZCgyKSk6OmFmdGVyIHtcbiAgY29udGVudDogXCJcIjtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMTAwJTtcbiAgbGVmdDogMDtcbiAgYm90dG9tOiAwO1xuICBib3JkZXItYm90dG9tOiAxcHggc29saWQgdmFyKC0tbGlnaHQtZ3JleS1ib3JkZXIpO1xufVxuXG4uZXhwYW5kLWJ1dHRvbi1jZWxsIHtcbiAgcGFkZGluZzogMDtcbn1cblxuLmNvbm5lY3RvciB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAwO1xuICBsZWZ0OiAwO1xuICB3aWR0aDogMi44NzVyZW07XG4gIGhlaWdodDogMy4yNXJlbTtcbn1cbi5jb25uZWN0b3Iub2Zmc2V0LWxlZnQtMCB7XG4gIGxlZnQ6IDByZW07XG59XG4uY29ubmVjdG9yLm9mZnNldC1sZWZ0LTEge1xuICBsZWZ0OiA0LjEyNXJlbTtcbn1cbi5jb25uZWN0b3Iub2Zmc2V0LWxlZnQtMiB7XG4gIGxlZnQ6IDguMjVyZW07XG59XG4uY29ubmVjdG9yLm9mZnNldC1sZWZ0LTMge1xuICBsZWZ0OiAxMi4zNzVyZW07XG59XG4uY29ubmVjdG9yLm9mZnNldC1sZWZ0LTQge1xuICBsZWZ0OiAxNi41cmVtO1xufVxuLmNvbm5lY3Rvci5vZmZzZXQtbGVmdC01IHtcbiAgbGVmdDogMjAuNjI1cmVtO1xufVxuLmNvbm5lY3Rvci5vZmZzZXQtbGVmdC02IHtcbiAgbGVmdDogMjQuNzVyZW07XG59XG4uY29ubmVjdG9yLnZlcnRpY2FsOjpiZWZvcmUge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGxlZnQ6IDUwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICB3aWR0aDogMC4wNjI1cmVtO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1ibHVlLWdyZXkyMDApO1xufVxuLmNvbm5lY3Rvci50LXNoYXBlOjpiZWZvcmUge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGxlZnQ6IDUwJTtcbiAgaGVpZ2h0OiAzLjI1cmVtO1xuICB3aWR0aDogMC4wNjI1cmVtO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1ibHVlLWdyZXkyMDApO1xufVxuLmNvbm5lY3Rvci50LXNoYXBlOjphZnRlciB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgY29udGVudDogXCJcIjtcbiAgdG9wOiA1MCU7XG4gIGxlZnQ6IDUwJTtcbiAgaGVpZ2h0OiAwLjA2MjVyZW07XG4gIHdpZHRoOiAxMDAlO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1ibHVlLWdyZXkyMDApO1xufVxuLmNvbm5lY3Rvci5saW5lOjpiZWZvcmUge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIGNvbnRlbnQ6IFwiXCI7XG4gIGxlZnQ6IDUwJTtcbiAgaGVpZ2h0OiA1MCU7XG4gIHdpZHRoOiAxcHg7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLWJsdWUtZ3JleTIwMCk7XG59XG4uY29ubmVjdG9yLmxpbmU6OmFmdGVyIHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICBjb250ZW50OiBcIlwiO1xuICB0b3A6IDUwJTtcbiAgbGVmdDogNTAlO1xuICBoZWlnaHQ6IDFweDtcbiAgd2lkdGg6IDEwMCU7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLWJsdWUtZ3JleTIwMCk7XG59Il19 */";
+var classes = {"row":"DataGridRow-module_row__yQDVO","loading":"DataGridRow-module_loading__-xjr0","border-0":"DataGridRow-module_border-0__Q6D3Q","border-1":"DataGridRow-module_border-1__7cp-V","border-2":"DataGridRow-module_border-2__QCBIg","border-3":"DataGridRow-module_border-3__fHSOf","border-4":"DataGridRow-module_border-4__tEXsB","border-5":"DataGridRow-module_border-5__MyQd6","border-6":"DataGridRow-module_border-6__-lMJ-","border":"DataGridRow-module_border__wLIZi","border-drawer":"DataGridRow-module_border-drawer__W2hWL","expand-button-cell":"DataGridRow-module_expand-button-cell__P2myT","connector":"DataGridRow-module_connector__wakAv","offset-left-0":"DataGridRow-module_offset-left-0__k2RYD","offset-left-1":"DataGridRow-module_offset-left-1__4zXM7","offset-left-2":"DataGridRow-module_offset-left-2__eAiPP","offset-left-3":"DataGridRow-module_offset-left-3__aObOx","offset-left-4":"DataGridRow-module_offset-left-4__oU26v","offset-left-5":"DataGridRow-module_offset-left-5__-SY5P","offset-left-6":"DataGridRow-module_offset-left-6__V16HL","vertical":"DataGridRow-module_vertical__SSnAv","t-shape":"DataGridRow-module_t-shape__r3AMf","line":"DataGridRow-module_line__DNtsj"};
 styleInject(css_248z);
 
 export { classes as default };

package/dist/esm/DataGrid/DataGridBody/DataGridRow/useNestedRow.esm.js

@@ -0,0 +1,92 @@
+import React from 'react';
+import classes from './DataGridRow.module.scss.esm.js';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const useNestedRow = ({ indentationLevels, item, nestedItemsKey, rowTemplate, isRowExpanded, indentationLevel, enableNestedRow, rowProps: { searchValue, headers, spacing, disableContextMenuColumn } }) => {
+    const hasNestedChildren = item && nestedItemsKey && item[nestedItemsKey];
+    const getNestedChildSpacing = (spacing, index) => {
+        const expandButtonWidth = 46;
+        const nestedChildOffset = !hasNestedChildren ? expandButtonWidth : 0;
+        const connectorWidth = 68;
+        const nestedChildIndentation = `${nestedChildOffset + indentationLevel * connectorWidth}`;
+        const gap = 4;
+        const notIndentedWithNoChildrenOffset = indentationLevel === 0 && !hasNestedChildren ? expandButtonWidth + gap : gap;
+        const childIndentation = `${indentationLevel ? nestedChildIndentation : notIndentedWithNoChildrenOffset}px`;
+        if (spacing) {
+            return {
+                ...spacing,
+                paddingLeft: index === 0 ? childIndentation : spacing.paddingLeft
+            };
+        }
+        return {
+            paddingLeft: index === 0 ? childIndentation : ""
+        };
+    };
+    const renderNestedRowConnectors = () => {
+        if (indentationLevels) {
+            return indentationLevels.map(({ level, isLastChild }) => renderNestedRowConnector(level, isLastChild, indentationLevels.length));
+        }
+        return null;
+    };
+    const renderNestedRowConnector = (level, isLastChild, levelsLength) => {
+        const offsetLeftClass = classes[`offset-left-${level - 1}`];
+        if (level === levelsLength) {
+            const variant = isLastChild ? "line" : "t-shape";
+            return (React.createElement("div", { key: level, "data-testid": "dataGridRowConnector", className: `${classes["connector"]} ${classes[variant]} ${offsetLeftClass}` }));
+        }
+        else if (!isLastChild) {
+            return (React.createElement("div", { key: level, "data-testid": "dataGridRowConnector", className: `${classes["connector"]} ${classes["vertical"]}  ${offsetLeftClass}` }));
+        }
+        return null;
+    };
+    const renderNestedRow = () => {
+        if (rowTemplate && item && nestedItemsKey && item[nestedItemsKey] && isRowExpanded) {
+            const nestedItemsArray = item[nestedItemsKey];
+            const getIndentationLevel = (index) => ({
+                level: indentationLevel + 1,
+                isLastChild: index + 1 === nestedItemsArray.length
+            });
+            return nestedItemsArray.map((item, index) => {
+                return React.cloneElement(rowTemplate({ item, index }), {
+                    searchValue,
+                    headers,
+                    spacing,
+                    disableContextMenuColumn,
+                    item,
+                    nestedRowProps: {
+                        rowTemplate,
+                        enableNestedRow,
+                        nestedItemsKey,
+                        indentationLevel: indentationLevel + 1,
+                        indentationLevels: indentationLevels && nestedItemsArray
+                            ? [...indentationLevels, getIndentationLevel(index)]
+                            : [getIndentationLevel(index)]
+                    }
+                });
+            });
+        }
+    };
+    return {
+        renderNestedRow,
+        renderNestedRowConnectors,
+        getNestedChildSpacing,
+        hasNestedChildren
+    };
+};
+
+export { useNestedRow };
+//# sourceMappingURL=useNestedRow.esm.js.map

package/dist/esm/DataGrid/DataGridBody/DataGridRow/useNestedRow.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useNestedRow.esm.js","sources":["../../../../../../../src/components/DataGrid/DataGridBody/DataGridRow/useNestedRow.tsx"],"sourcesContent":["/*\n * Copyright 2022 OneWelcome B.V.\n *\n *    Licensed under the Apache License, Version 2.0 (the \"License\");\n *    you may not use this file except in compliance with the License.\n *    You may obtain a copy of the License at\n *\n *        http://www.apache.org/licenses/LICENSE-2.0\n *\n *    Unless required by applicable law or agreed to in writing, software\n *    distributed under the License is distributed on an \"AS IS\" BASIS,\n *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *    See the License for the specific language governing permissions and\n *    limitations under the License.\n */\n\nimport React, { ReactElement } from \"react\";\nimport classes from \"./DataGridRow.module.scss\";\nimport { HeaderCell } from \"../../datagrid.interfaces\";\n\nexport interface UseNestedRowProps<T> {\n  indentationLevels?: { level: number; isLastChild: boolean }[];\n  item?: T;\n  nestedItemsKey?: keyof T;\n  rowTemplate?: ({ item, index }: { item: T; index: number }) => ReactElement;\n  isRowExpanded?: boolean;\n  indentationLevel: number;\n  enableNestedRow?: boolean;\n  rowProps: {\n    searchValue?: string;\n    headers?: HeaderCell[];\n    spacing?: React.CSSProperties;\n    disableContextMenuColumn?: boolean;\n  };\n}\n\nexport const useNestedRow = <T,>({\n  indentationLevels,\n  item,\n  nestedItemsKey,\n  rowTemplate,\n  isRowExpanded,\n  indentationLevel,\n  enableNestedRow,\n  rowProps: { searchValue, headers, spacing, disableContextMenuColumn }\n}: UseNestedRowProps<T>) => {\n  const hasNestedChildren = item && nestedItemsKey && item[nestedItemsKey];\n\n  const getNestedChildSpacing = (spacing: React.CSSProperties | undefined, index: number) => {\n    const expandButtonWidth = 46;\n    const nestedChildOffset = !hasNestedChildren ? expandButtonWidth : 0;\n\n    const connectorWidth = 68;\n    const nestedChildIndentation = `${nestedChildOffset + indentationLevel * connectorWidth}`;\n\n    const gap = 4;\n    const notIndentedWithNoChildrenOffset =\n      indentationLevel === 0 && !hasNestedChildren ? expandButtonWidth + gap : gap;\n    const childIndentation = `${indentationLevel ? nestedChildIndentation : notIndentedWithNoChildrenOffset}px`;\n\n    if (spacing) {\n      return {\n        ...spacing,\n        paddingLeft: index === 0 ? childIndentation : spacing.paddingLeft\n      };\n    }\n    return {\n      paddingLeft: index === 0 ? childIndentation : \"\"\n    };\n  };\n\n  const renderNestedRowConnectors = () => {\n    if (indentationLevels) {\n      return indentationLevels.map(({ level, isLastChild }) =>\n        renderNestedRowConnector(level, isLastChild, indentationLevels.length)\n      );\n    }\n\n    return null;\n  };\n\n  const renderNestedRowConnector = (level: number, isLastChild: boolean, levelsLength: number) => {\n    const offsetLeftClass = classes[`offset-left-${level - 1}`];\n\n    if (level === levelsLength) {\n      const variant = isLastChild ? \"line\" : \"t-shape\";\n\n      return (\n        <div\n          key={level}\n          data-testid=\"dataGridRowConnector\"\n          className={`${classes[\"connector\"]} ${classes[variant]} ${offsetLeftClass}`}\n        />\n      );\n    } else if (!isLastChild) {\n      return (\n        <div\n          key={level}\n          data-testid=\"dataGridRowConnector\"\n          className={`${classes[\"connector\"]} ${classes[\"vertical\"]}  ${offsetLeftClass}`}\n        />\n      );\n    }\n    return null;\n  };\n\n  const renderNestedRow = () => {\n    if (rowTemplate && item && nestedItemsKey && item[nestedItemsKey] && isRowExpanded) {\n      const nestedItemsArray: T[] = item[nestedItemsKey] as T[];\n      const getIndentationLevel = (index: number) => ({\n        level: indentationLevel + 1,\n        isLastChild: index + 1 === nestedItemsArray.length\n      });\n\n      return nestedItemsArray.map((item, index) => {\n        return React.cloneElement(rowTemplate({ item, index }), {\n          searchValue,\n          headers,\n          spacing,\n          disableContextMenuColumn,\n          item,\n          nestedRowProps: {\n            rowTemplate,\n            enableNestedRow,\n            nestedItemsKey,\n            indentationLevel: indentationLevel + 1,\n            indentationLevels:\n              indentationLevels && nestedItemsArray\n                ? [...indentationLevels, getIndentationLevel(index)]\n                : [getIndentationLevel(index)]\n          }\n        });\n      });\n    }\n  };\n\n  return {\n    renderNestedRow,\n    renderNestedRowConnectors,\n    getNestedChildSpacing,\n    hasNestedChildren\n  };\n};\n"],"names":[],"mappings":"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"}