@onewelcome/react-lib-components 8.9.1 → 8.11.0

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

@@ -1 +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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"}
+{"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":["React"],"mappings":"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"}

package/dist/esm/DataGrid/DataGridFilters/DataGridDateFilter.esm.js

@@ -1,4 +1,4 @@
-import React, { useRef, useState, Fragment } from 'react';
+import React__default, { useRef, useState, Fragment } from 'react';
 import { DataGridFilterTag } from './DataGridFilterTag.esm.js';
 import { createPortal } from 'react-dom';
 import { DateTimePicker } from './DateTimePicker/DateTimePicker.esm.js';
@@ -26,9 +26,9 @@ const DataGridDateFilter = ({ domRoot, dateFilterValue, onDateFilterValueChange
     const { root } = useGetDomRoot(domRoot, wrappingDivRef);
     const [isOpen, setIsOpen] = useState(false);
     const [tagCaption, setTagCaption] = useState("Last 30 seconds");
-    return (React.createElement(Fragment, null,
-        React.createElement(DataGridFilterTag, { triggerRef: triggerRef, ref: wrappingDivRef, dateTagCaption: tagCaption, mode: "ADD_DATE", onFilterOpen: () => setIsOpen(true) }),
-        createPortal(React.createElement(DateTimePicker, { popoverRef: popoverRef, onTagCaptionChange: setTagCaption, anchorRef: wrappingDivRef, isOpen: isOpen, setPickerOpen: setIsOpen, dateFilterValue: dateFilterValue, onDateFilterValueChange: onDateFilterValueChange }), root)));
+    return (React__default.createElement(Fragment, null,
+        React__default.createElement(DataGridFilterTag, { triggerRef: triggerRef, ref: wrappingDivRef, dateTagCaption: tagCaption, mode: "ADD_DATE", onFilterOpen: () => setIsOpen(true) }),
+        createPortal(React__default.createElement(DateTimePicker, { popoverRef: popoverRef, onTagCaptionChange: setTagCaption, anchorRef: wrappingDivRef, isOpen: isOpen, setPickerOpen: setIsOpen, dateFilterValue: dateFilterValue, onDateFilterValueChange: onDateFilterValueChange }), root)));
 };
 
 export { DataGridDateFilter };

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridDateFilter.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridDateFilter.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, { Fragment, useRef, useState } from \"react\";\nimport { DataGridFilterTag } from \"./DataGridFilterTag\";\nimport { createPortal } from \"react-dom\";\nimport { DateTimePicker } from \"./DateTimePicker/DateTimePicker\";\nimport { useGetDomRoot } from \"../../../hooks/useGetDomRoot\";\nimport { DateTimeFilter } from \"./DataGridFilters.interfaces\";\n\ntype Props = {\n  domRoot?: HTMLElement;\n  dateFilterValue?: DateTimeFilter;\n  onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;\n};\n\nexport const DataGridDateFilter = ({\n  domRoot,\n  dateFilterValue,\n  onDateFilterValueChange\n}: Props) => {\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const wrappingDivRef = useRef<HTMLDivElement>(null);\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n  const [isOpen, setIsOpen] = useState(false);\n  const [tagCaption, setTagCaption] = useState(\"Last 30 seconds\");\n\n  return (\n    <Fragment>\n      <DataGridFilterTag\n        triggerRef={triggerRef}\n        ref={wrappingDivRef}\n        dateTagCaption={tagCaption}\n        mode={\"ADD_DATE\"}\n        onFilterOpen={() => setIsOpen(true)}\n      />\n      {createPortal(\n        <DateTimePicker\n          popoverRef={popoverRef}\n          onTagCaptionChange={setTagCaption}\n          anchorRef={wrappingDivRef}\n          isOpen={isOpen}\n          setPickerOpen={setIsOpen}\n          dateFilterValue={dateFilterValue}\n          onDateFilterValueChange={onDateFilterValueChange}\n        />,\n        root\n      )}\n    </Fragment>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAeI,MAAM,kBAAkB,GAAG,CAAC,EACjC,OAAO,EACP,eAAe,EACf,uBAAuB,EACjB,KAAI;AACV,IAAA,MAAM,UAAU,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;AACnD,IAAA,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAChD,IAAA,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACpD,MAAM,EAAE,IAAI,EAAE,GAAG,aAAa,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IAEhE,QACE,oBAAC,QAAQ,EAAA,IAAA;QACP,KAAC,CAAA,aAAA,CAAA,iBAAiB,EAChB,EAAA,UAAU,EAAE,UAAU,EACtB,GAAG,EAAE,cAAc,EACnB,cAAc,EAAE,UAAU,EAC1B,IAAI,EAAE,UAAU,EAChB,YAAY,EAAE,MAAM,SAAS,CAAC,IAAI,CAAC,EACnC,CAAA;AACD,QAAA,YAAY,CACX,KAAC,CAAA,aAAA,CAAA,cAAc,EACb,EAAA,UAAU,EAAE,UAAU,EACtB,kBAAkB,EAAE,aAAa,EACjC,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,SAAS,EACxB,eAAe,EAAE,eAAe,EAChC,uBAAuB,EAAE,uBAAuB,EAChD,CAAA,EACF,IAAI,CACL,CACQ,EACX;AACJ;;;;"}
+{"version":3,"file":"DataGridDateFilter.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridDateFilter.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, { Fragment, useRef, useState } from \"react\";\nimport { DataGridFilterTag } from \"./DataGridFilterTag\";\nimport { createPortal } from \"react-dom\";\nimport { DateTimePicker } from \"./DateTimePicker/DateTimePicker\";\nimport { useGetDomRoot } from \"../../../hooks/useGetDomRoot\";\nimport { DateTimeFilter } from \"./DataGridFilters.interfaces\";\n\ntype Props = {\n  domRoot?: HTMLElement;\n  dateFilterValue?: DateTimeFilter;\n  onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;\n};\n\nexport const DataGridDateFilter = ({\n  domRoot,\n  dateFilterValue,\n  onDateFilterValueChange\n}: Props) => {\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n  const wrappingDivRef = useRef<HTMLDivElement>(null);\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n  const [isOpen, setIsOpen] = useState(false);\n  const [tagCaption, setTagCaption] = useState(\"Last 30 seconds\");\n\n  return (\n    <Fragment>\n      <DataGridFilterTag\n        triggerRef={triggerRef}\n        ref={wrappingDivRef}\n        dateTagCaption={tagCaption}\n        mode={\"ADD_DATE\"}\n        onFilterOpen={() => setIsOpen(true)}\n      />\n      {createPortal(\n        <DateTimePicker\n          popoverRef={popoverRef}\n          onTagCaptionChange={setTagCaption}\n          anchorRef={wrappingDivRef}\n          isOpen={isOpen}\n          setPickerOpen={setIsOpen}\n          dateFilterValue={dateFilterValue}\n          onDateFilterValueChange={onDateFilterValueChange}\n        />,\n        root\n      )}\n    </Fragment>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAeI,MAAM,kBAAkB,GAAG,CAAC,EACjC,OAAO,EACP,eAAe,EACf,uBAAuB,EACjB,KAAI;AACV,IAAA,MAAM,UAAU,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;AACnD,IAAA,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;AAChD,IAAA,MAAM,cAAc,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IACpD,MAAM,EAAE,IAAI,EAAE,GAAG,aAAa,CAAC,OAAO,EAAE,cAAc,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IAEhE,QACEA,6BAAC,QAAQ,EAAA,IAAA;QACPA,cAAC,CAAA,aAAA,CAAA,iBAAiB,EAChB,EAAA,UAAU,EAAE,UAAU,EACtB,GAAG,EAAE,cAAc,EACnB,cAAc,EAAE,UAAU,EAC1B,IAAI,EAAE,UAAU,EAChB,YAAY,EAAE,MAAM,SAAS,CAAC,IAAI,CAAC,EACnC,CAAA;AACD,QAAA,YAAY,CACXA,cAAC,CAAA,aAAA,CAAA,cAAc,EACb,EAAA,UAAU,EAAE,UAAU,EACtB,kBAAkB,EAAE,aAAa,EACjC,SAAS,EAAE,cAAc,EACzB,MAAM,EAAE,MAAM,EACd,aAAa,EAAE,SAAS,EACxB,eAAe,EAAE,eAAe,EAChC,uBAAuB,EAAE,uBAAuB,EAChD,CAAA,EACF,IAAI,CACL,CACQ,EACX;AACJ;;;;"}

package/dist/esm/DataGrid/DataGridFilters/DataGridFilter.esm.js

@@ -1,4 +1,4 @@
-import React, { useRef, useState, Fragment } from 'react';
+import React__default, { useRef, useState, Fragment } from 'react';
 import { createPortal } from 'react-dom';
 import { useGetDomRoot } from '../../src/hooks/useGetDomRoot.esm.js';
 import { generateID } from '../../src/util/helper.esm.js';
@@ -55,9 +55,9 @@ const DataGridFilter = ({ mode, filter, domRoot, columnsMetadata, onFilterAdd, o
             initialiseFilterValues(filter);
         }
     };
-    return (React.createElement(Fragment, null,
-        React.createElement(DataGridFilterTag, { mode: mode, onFilterOpen: onFilterOpen, onFilterRemove: onFilterRemove, triggerRef: triggerRef, ref: wrappingDivRef, filter: filter, translations: tagTranslations, customEditTagContent: customEditTagContent }),
-        createPortal(React.createElement(DataGridFilterPopover, { popoverRef: popoverRef, anchorRef: wrappingDivRef, isOpen: filterOpen, translations: popoverTranslations, column: column, columnsMetadata: columnsMetadata, values: values, pickedValues: pickedValues, operator: operator, operators: operators, onFilterSubmit: onFilterSubmit, resetFields: resetFields, setFilterOpen: setFilterOpen, setColumn: setColumn, setOperator: setOperator, setOperators: setOperators, setValues: setValues, setPickedValues: setPickedValues }), root)));
+    return (React__default.createElement(Fragment, null,
+        React__default.createElement(DataGridFilterTag, { mode: mode, onFilterOpen: onFilterOpen, onFilterRemove: onFilterRemove, triggerRef: triggerRef, ref: wrappingDivRef, filter: filter, translations: tagTranslations, customEditTagContent: customEditTagContent }),
+        createPortal(React__default.createElement(DataGridFilterPopover, { popoverRef: popoverRef, anchorRef: wrappingDivRef, isOpen: filterOpen, translations: popoverTranslations, column: column, columnsMetadata: columnsMetadata, values: values, pickedValues: pickedValues, operator: operator, operators: operators, onFilterSubmit: onFilterSubmit, resetFields: resetFields, setFilterOpen: setFilterOpen, setColumn: setColumn, setOperator: setOperator, setOperators: setOperators, setValues: setValues, setPickedValues: setPickedValues }), root)));
 };
 
 export { DataGridFilter };

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridFilter.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridFilter.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, { Fragment, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useGetDomRoot } from \"../../../hooks/useGetDomRoot\";\nimport {\n  DataGridColumnMetadata,\n  Filter,\n  FilterEditorMode,\n  PopoverTranslations,\n  TagTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { generateID } from \"../../../util/helper\";\nimport { DataGridFilterTag } from \"./DataGridFilterTag\";\nimport { DataGridFilterPopover } from \"./DataGridFilterPopover\";\nimport { useDataGridFilter } from \"./DataGridFilterService\";\n\nexport type Props = {\n  mode: FilterEditorMode;\n  domRoot?: HTMLElement;\n  filter?: Filter;\n  columnsMetadata: DataGridColumnMetadata[];\n  onFilterAdd?: (filter: Filter) => void;\n  onFilterEdit?: (filter: Filter) => void;\n  onFilterDelete?: (id: string) => void;\n  tagTranslations?: TagTranslations;\n  popoverTranslations?: PopoverTranslations;\n  customEditTagContent?: React.ReactElement;\n};\n\nexport const DataGridFilter = ({\n  mode,\n  filter,\n  domRoot,\n  columnsMetadata,\n  onFilterAdd,\n  onFilterEdit,\n  onFilterDelete,\n  tagTranslations,\n  popoverTranslations,\n  customEditTagContent\n}: Props) => {\n  const wrappingDivRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n\n  const [filterOpen, setFilterOpen] = useState(false);\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n  const {\n    resetFields,\n    operator,\n    setOperator,\n    operators,\n    setOperators,\n    column,\n    setColumn,\n    values,\n    setValues,\n    pickedValues,\n    setPickedValues,\n    initialiseFilterValues\n  } = useDataGridFilter(mode, columnsMetadata);\n\n  const onFilterSubmit = () => {\n    if (mode === \"ADD\") {\n      const id = generateID();\n      onFilterAdd && onFilterAdd({ id, column, operator, value: pickedValues });\n    } else if (mode === \"EDIT\" && filter) {\n      const { id } = filter;\n      onFilterEdit && onFilterEdit({ id, column, operator, value: pickedValues });\n    }\n\n    resetFields();\n    setFilterOpen(false);\n  };\n\n  const onFilterRemove = () => {\n    if (!filter) {\n      return;\n    }\n\n    const { id } = filter;\n    onFilterDelete && onFilterDelete(id);\n\n    resetFields();\n    setFilterOpen(false);\n  };\n  const onFilterOpen = () => {\n    setFilterOpen(!filterOpen);\n    if (!filterOpen) {\n      initialiseFilterValues(filter);\n    }\n  };\n\n  return (\n    <Fragment>\n      <DataGridFilterTag\n        mode={mode}\n        onFilterOpen={onFilterOpen}\n        onFilterRemove={onFilterRemove}\n        triggerRef={triggerRef}\n        ref={wrappingDivRef}\n        filter={filter}\n        translations={tagTranslations}\n        customEditTagContent={customEditTagContent}\n      />\n      {createPortal(\n        <DataGridFilterPopover\n          popoverRef={popoverRef}\n          anchorRef={wrappingDivRef}\n          isOpen={filterOpen}\n          translations={popoverTranslations}\n          column={column}\n          columnsMetadata={columnsMetadata}\n          values={values}\n          pickedValues={pickedValues}\n          operator={operator}\n          operators={operators}\n          onFilterSubmit={onFilterSubmit}\n          resetFields={resetFields}\n          setFilterOpen={setFilterOpen}\n          setColumn={setColumn}\n          setOperator={setOperator}\n          setOperators={setOperators}\n          setValues={setValues}\n          setPickedValues={setPickedValues}\n        />,\n        root\n      )}\n    </Fragment>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGridFilter.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridFilter.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, { Fragment, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { useGetDomRoot } from \"../../../hooks/useGetDomRoot\";\nimport {\n  DataGridColumnMetadata,\n  Filter,\n  FilterEditorMode,\n  PopoverTranslations,\n  TagTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { generateID } from \"../../../util/helper\";\nimport { DataGridFilterTag } from \"./DataGridFilterTag\";\nimport { DataGridFilterPopover } from \"./DataGridFilterPopover\";\nimport { useDataGridFilter } from \"./DataGridFilterService\";\n\nexport type Props = {\n  mode: FilterEditorMode;\n  domRoot?: HTMLElement;\n  filter?: Filter;\n  columnsMetadata: DataGridColumnMetadata[];\n  onFilterAdd?: (filter: Filter) => void;\n  onFilterEdit?: (filter: Filter) => void;\n  onFilterDelete?: (id: string) => void;\n  tagTranslations?: TagTranslations;\n  popoverTranslations?: PopoverTranslations;\n  customEditTagContent?: React.ReactElement;\n};\n\nexport const DataGridFilter = ({\n  mode,\n  filter,\n  domRoot,\n  columnsMetadata,\n  onFilterAdd,\n  onFilterEdit,\n  onFilterDelete,\n  tagTranslations,\n  popoverTranslations,\n  customEditTagContent\n}: Props) => {\n  const wrappingDivRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const popoverRef = useRef<HTMLDivElement>(null);\n\n  const [filterOpen, setFilterOpen] = useState(false);\n  const { root } = useGetDomRoot(domRoot, wrappingDivRef);\n  const {\n    resetFields,\n    operator,\n    setOperator,\n    operators,\n    setOperators,\n    column,\n    setColumn,\n    values,\n    setValues,\n    pickedValues,\n    setPickedValues,\n    initialiseFilterValues\n  } = useDataGridFilter(mode, columnsMetadata);\n\n  const onFilterSubmit = () => {\n    if (mode === \"ADD\") {\n      const id = generateID();\n      onFilterAdd && onFilterAdd({ id, column, operator, value: pickedValues });\n    } else if (mode === \"EDIT\" && filter) {\n      const { id } = filter;\n      onFilterEdit && onFilterEdit({ id, column, operator, value: pickedValues });\n    }\n\n    resetFields();\n    setFilterOpen(false);\n  };\n\n  const onFilterRemove = () => {\n    if (!filter) {\n      return;\n    }\n\n    const { id } = filter;\n    onFilterDelete && onFilterDelete(id);\n\n    resetFields();\n    setFilterOpen(false);\n  };\n  const onFilterOpen = () => {\n    setFilterOpen(!filterOpen);\n    if (!filterOpen) {\n      initialiseFilterValues(filter);\n    }\n  };\n\n  return (\n    <Fragment>\n      <DataGridFilterTag\n        mode={mode}\n        onFilterOpen={onFilterOpen}\n        onFilterRemove={onFilterRemove}\n        triggerRef={triggerRef}\n        ref={wrappingDivRef}\n        filter={filter}\n        translations={tagTranslations}\n        customEditTagContent={customEditTagContent}\n      />\n      {createPortal(\n        <DataGridFilterPopover\n          popoverRef={popoverRef}\n          anchorRef={wrappingDivRef}\n          isOpen={filterOpen}\n          translations={popoverTranslations}\n          column={column}\n          columnsMetadata={columnsMetadata}\n          values={values}\n          pickedValues={pickedValues}\n          operator={operator}\n          operators={operators}\n          onFilterSubmit={onFilterSubmit}\n          resetFields={resetFields}\n          setFilterOpen={setFilterOpen}\n          setColumn={setColumn}\n          setOperator={setOperator}\n          setOperators={setOperators}\n          setValues={setValues}\n          setPickedValues={setPickedValues}\n        />,\n        root\n      )}\n    </Fragment>\n  );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/esm/DataGrid/DataGridFilters/DataGridFilter.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 */.DataGridFilter_sr-only_6dWwy{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DataGridFilter_hidden_6dWwy{display:none}.DataGridFilter_slide-in_6dWwy{animation:DataGridFilter_slide-in_6dWwy .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridFilter_slide-in_6dWwy{animation-duration:.1ms}}.DataGridFilter_slide-out_6dWwy{animation:DataGridFilter_slide-out_6dWwy .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridFilter_slide-out_6dWwy{animation-duration:.1ms}}@keyframes DataGridFilter_slide-in_6dWwy{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes DataGridFilter_slide-out_6dWwy{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.DataGridFilter_filter-wrapper_6dWwy{align-items:center;background-color:var(--color-blue-grey100);border-radius:3.125rem;display:flex;gap:.375rem;justify-content:center;min-height:1.5rem;padding:.25rem .75rem .25rem .5rem}.DataGridFilter_filter-wrapper_6dWwy:hover{background-color:var(--color-blue-grey200)}.DataGridFilter_filter-wrapper_6dWwy:active{background-color:var(--color-primary100)}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_filter-button_6dWwy{align-items:center;background:none;border:none;cursor:pointer;display:flex;gap:.375rem;justify-content:flex-start;padding:0 .25rem}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_filter-button_6dWwy:only-child{margin-right:-.25rem}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_filter-button_6dWwy:focus-visible{border-radius:var(--focus-border-radius);outline:.125rem solid var(--color-focus);outline-offset:0}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_remove-button_6dWwy{border-radius:1.25rem}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_caption_6dWwy{font-size:var(--font-size-data-grid);font-weight:400;line-height:var(--data-grid-line-height);margin:0}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_caption_6dWwy.DataGridFilter_bold_6dWwy{font-weight:600}.DataGridFilter_filter-wrapper_6dWwy .DataGridFilter_remove-icon_6dWwy{font-size:.6rem}.DataGridFilter_column-select-option_6dWwy{text-transform:capitalize}.DataGridFilter_popover_6dWwy{align-items:flex-start;display:flex;flex-direction:column;gap:1rem;min-width:40rem;padding:1rem .75rem}.DataGridFilter_popover_6dWwy .DataGridFilter_controls_6dWwy{display:flex;gap:1rem;width:100%}.DataGridFilter_popover_6dWwy .DataGridFilter_controls_6dWwy>:first-child{flex-grow:1.8;flex-shrink:0;margin-top:0}.DataGridFilter_popover_6dWwy .DataGridFilter_controls_6dWwy>:nth-child(2){flex-grow:1;flex-shrink:0;margin-top:0}.DataGridFilter_popover_6dWwy .DataGridFilter_controls_6dWwy>:last-child{flex-basis:15rem;flex-grow:1.8;flex-shrink:0;margin-top:0}.DataGridFilter_popover_6dWwy .DataGridFilter_actions_6dWwy{display:flex;gap:1rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkRmlsdGVyLm1vZHVsZS5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWVBOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRiw4QkFPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsNkJBQ0UsWUFDRixDQUVBLCtCQUNFLG9EQUNGLENBQ0EsdUNBQ0UsK0JBQ0UsdUJBQ0YsQ0FDRixDQUVBLGdDQUNFLHFEQUNGLENBQ0EsdUNBQ0UsZ0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLHlDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSwwQ0FDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGLENBQ0EscUNBR0Usa0JBQW1CLENBS25CLDBDQUEyQyxDQUQzQyxzQkFBdUIsQ0FOdkIsWUFBYSxDQUdiLFdBQWEsQ0FGYixzQkFBdUIsQ0FHdkIsaUJBQWtCLENBQ2xCLGtDQUdGLENBQ0EsMkNBQ0UsMENBQ0YsQ0FDQSw0Q0FDRSx3Q0FDRixDQUNBLHlFQUdFLGtCQUFtQixDQUVuQixlQUFnQixDQUNoQixXQUFZLENBRVosY0FBZSxDQVBmLFlBQWEsQ0FHYixXQUFhLENBRmIsMEJBQTJCLENBSzNCLGdCQUVGLENBQ0Esb0ZBQ0Usb0JBQ0YsQ0FDQSx1RkFHRSx3Q0FBeUMsQ0FGekMsd0NBQTBDLENBQzFDLGdCQUVGLENBQ0EseUVBQ0UscUJBQ0YsQ0FDQSxtRUFDRSxvQ0FBcUMsQ0FHckMsZUFBZ0IsQ0FGaEIsd0NBQXlDLENBQ3pDLFFBRUYsQ0FDQSw2RkFDRSxlQUNGLENBQ0EsdUVBQ0UsZUFDRixDQUVBLDJDQUNFLHlCQUNGLENBRUEsOEJBR0Usc0JBQXVCLENBRnZCLFlBQWEsQ0FDYixxQkFBc0IsQ0FFdEIsUUFBUyxDQUVULGVBQWdCLENBRGhCLG1CQUVGLENBQ0EsNkRBRUUsWUFBYSxDQUNiLFFBQVMsQ0FGVCxVQUdGLENBQ0EsMEVBQ0UsYUFBYyxDQUNkLGFBQWMsQ0FDZCxZQUNGLENBQ0EsMkVBQ0UsV0FBWSxDQUNaLGFBQWMsQ0FDZCxZQUNGLENBQ0EseUVBQ0UsZ0JBQWlCLENBQ2pCLGFBQWMsQ0FDZCxhQUFjLENBQ2QsWUFDRixDQUNBLDREQUNFLFlBQWEsQ0FDYixRQUNGIiwiZmlsZSI6IkRhdGFHcmlkRmlsdGVyLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLypcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uc3Itb25seSB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgd2lkdGg6IDFweDtcbiAgaGVpZ2h0OiAxcHg7XG4gIHBhZGRpbmc6IDA7XG4gIG1hcmdpbjogLTFweDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgY2xpcDogcmVjdCgwLCAwLCAwLCAwKTtcbiAgYm9yZGVyOiAwO1xufVxuXG4uaGlkZGVuIHtcbiAgZGlzcGxheTogbm9uZTtcbn1cblxuLnNsaWRlLWluIHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1pbiAwLjVzIGZvcndhcmRzO1xufVxuQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgLnNsaWRlLWluIHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbi5zbGlkZS1vdXQge1xuICBhbmltYXRpb246IHNsaWRlLW91dCAwLjVzIGZvcndhcmRzO1xufVxuQG1lZGlhIChwcmVmZXJzLXJlZHVjZWQtbW90aW9uOiByZWR1Y2UpIHtcbiAgLnNsaWRlLW91dCB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG5Aa2V5ZnJhbWVzIHNsaWRlLWluIHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDAlKTtcbiAgfVxufVxuQGtleWZyYW1lcyBzbGlkZS1vdXQge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDAlKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG59XG4uZmlsdGVyLXdyYXBwZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZ2FwOiAwLjM3NXJlbTtcbiAgbWluLWhlaWdodDogMS41cmVtO1xuICBwYWRkaW5nOiAwLjI1cmVtIDAuNzVyZW0gMC4yNXJlbSAwLjVyZW07XG4gIGJvcmRlci1yYWRpdXM6IDMuMTI1cmVtO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1ibHVlLWdyZXkxMDApO1xufVxuLmZpbHRlci13cmFwcGVyOmhvdmVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29sb3ItYmx1ZS1ncmV5MjAwKTtcbn1cbi5maWx0ZXItd3JhcHBlcjphY3RpdmUge1xuICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1jb2xvci1wcmltYXJ5MTAwKTtcbn1cbi5maWx0ZXItd3JhcHBlciAuZmlsdGVyLWJ1dHRvbiB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZ2FwOiAwLjM3NXJlbTtcbiAgYmFja2dyb3VuZDogbm9uZTtcbiAgYm9yZGVyOiBub25lO1xuICBwYWRkaW5nOiAwIDAuMjVyZW07XG4gIGN1cnNvcjogcG9pbnRlcjtcbn1cbi5maWx0ZXItd3JhcHBlciAuZmlsdGVyLWJ1dHRvbjpvbmx5LWNoaWxkIHtcbiAgbWFyZ2luLXJpZ2h0OiAtMC4yNXJlbTtcbn1cbi5maWx0ZXItd3JhcHBlciAuZmlsdGVyLWJ1dHRvbjpmb2N1cy12aXNpYmxlIHtcbiAgb3V0bGluZTogMC4xMjVyZW0gc29saWQgdmFyKC0tY29sb3ItZm9jdXMpO1xuICBvdXRsaW5lLW9mZnNldDogMDtcbiAgYm9yZGVyLXJhZGl1czogdmFyKC0tZm9jdXMtYm9yZGVyLXJhZGl1cyk7XG59XG4uZmlsdGVyLXdyYXBwZXIgLnJlbW92ZS1idXR0b24ge1xuICBib3JkZXItcmFkaXVzOiAxLjI1cmVtO1xufVxuLmZpbHRlci13cmFwcGVyIC5jYXB0aW9uIHtcbiAgZm9udC1zaXplOiB2YXIoLS1mb250LXNpemUtZGF0YS1ncmlkKTtcbiAgbGluZS1oZWlnaHQ6IHZhcigtLWRhdGEtZ3JpZC1saW5lLWhlaWdodCk7XG4gIG1hcmdpbjogMDtcbiAgZm9udC13ZWlnaHQ6IDQwMDtcbn1cbi5maWx0ZXItd3JhcHBlciAuY2FwdGlvbi5ib2xkIHtcbiAgZm9udC13ZWlnaHQ6IDYwMDtcbn1cbi5maWx0ZXItd3JhcHBlciAucmVtb3ZlLWljb24ge1xuICBmb250LXNpemU6IDAuNnJlbTtcbn1cblxuLmNvbHVtbi1zZWxlY3Qtb3B0aW9uIHtcbiAgdGV4dC10cmFuc2Zvcm06IGNhcGl0YWxpemU7XG59XG5cbi5wb3BvdmVyIHtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjtcbiAgYWxpZ24taXRlbXM6IGZsZXgtc3RhcnQ7XG4gIGdhcDogMXJlbTtcbiAgcGFkZGluZzogMXJlbSAwLjc1cmVtO1xuICBtaW4td2lkdGg6IDQwcmVtO1xufVxuLnBvcG92ZXIgLmNvbnRyb2xzIHtcbiAgd2lkdGg6IDEwMCU7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogMXJlbTtcbn1cbi5wb3BvdmVyIC5jb250cm9scyA+ICo6Zmlyc3QtY2hpbGQge1xuICBmbGV4LWdyb3c6IDEuODtcbiAgZmxleC1zaHJpbms6IDA7XG4gIG1hcmdpbi10b3A6IDA7XG59XG4ucG9wb3ZlciAuY29udHJvbHMgPiAqOm50aC1jaGlsZCgyKSB7XG4gIGZsZXgtZ3JvdzogMTtcbiAgZmxleC1zaHJpbms6IDA7XG4gIG1hcmdpbi10b3A6IDA7XG59XG4ucG9wb3ZlciAuY29udHJvbHMgPiAqOmxhc3QtY2hpbGQge1xuICBmbGV4LWJhc2lzOiAxNXJlbTtcbiAgZmxleC1ncm93OiAxLjg7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBtYXJnaW4tdG9wOiAwO1xufVxuLnBvcG92ZXIgLmFjdGlvbnMge1xuICBkaXNwbGF5OiBmbGV4O1xuICBnYXA6IDFyZW07XG59Il19 */";
-var classes = {"sr-only":"DataGridFilter_sr-only_6dWwy","hidden":"DataGridFilter_hidden_6dWwy","slide-in":"DataGridFilter_slide-in_6dWwy","slide-out":"DataGridFilter_slide-out_6dWwy","filter-wrapper":"DataGridFilter_filter-wrapper_6dWwy","filter-button":"DataGridFilter_filter-button_6dWwy","remove-button":"DataGridFilter_remove-button_6dWwy","caption":"DataGridFilter_caption_6dWwy","bold":"DataGridFilter_bold_6dWwy","remove-icon":"DataGridFilter_remove-icon_6dWwy","column-select-option":"DataGridFilter_column-select-option_6dWwy","popover":"DataGridFilter_popover_6dWwy","controls":"DataGridFilter_controls_6dWwy","actions":"DataGridFilter_actions_6dWwy"};
+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 */.DataGridFilter_sr-only_Pphm5{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DataGridFilter_hidden_Pphm5{display:none}.DataGridFilter_slide-in_Pphm5{animation:DataGridFilter_slide-in_Pphm5 .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridFilter_slide-in_Pphm5{animation-duration:.1ms}}.DataGridFilter_slide-out_Pphm5{animation:DataGridFilter_slide-out_Pphm5 .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridFilter_slide-out_Pphm5{animation-duration:.1ms}}@keyframes DataGridFilter_slide-in_Pphm5{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes DataGridFilter_slide-out_Pphm5{0%{transform:translateY(0)}to{transform:translateY(100vh)}}\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 */.DataGridFilter_filter-wrapper_Pphm5{align-items:center;background-color:var(--color-blue-grey100);border-radius:3.125rem;display:flex;gap:.375rem;justify-content:center;min-height:1.5rem;padding:.25rem .75rem .25rem .5rem}.DataGridFilter_filter-wrapper_Pphm5:hover{background-color:var(--color-blue-grey200)}.DataGridFilter_filter-wrapper_Pphm5:active{background-color:var(--color-primary100)}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_filter-button_Pphm5{align-items:center;background:none;border:none;cursor:pointer;display:flex;gap:.375rem;justify-content:flex-start;padding:0 .25rem}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_filter-button_Pphm5:only-child{margin-right:-.25rem}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_filter-button_Pphm5:focus-visible{border-radius:var(--focus-border-radius);outline:.125rem solid var(--color-focus);outline-offset:0}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_remove-button_Pphm5{border-radius:1.25rem}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_caption_Pphm5{font-size:var(--font-size-data-grid);font-weight:400;line-height:var(--data-grid-line-height);margin:0}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_caption_Pphm5.DataGridFilter_bold_Pphm5{font-weight:600}.DataGridFilter_filter-wrapper_Pphm5 .DataGridFilter_remove-icon_Pphm5{font-size:calc(var(--font-size)*.6)}.DataGridFilter_column-select-option_Pphm5{text-transform:capitalize}.DataGridFilter_popover_Pphm5{align-items:flex-start;display:flex;flex-direction:column;gap:1rem;min-width:40rem;padding:1rem .75rem}.DataGridFilter_popover_Pphm5 .DataGridFilter_controls_Pphm5{display:flex;gap:1rem;width:100%}.DataGridFilter_popover_Pphm5 .DataGridFilter_controls_Pphm5>:first-child{flex-grow:1.8;flex-shrink:0;margin-top:0}.DataGridFilter_popover_Pphm5 .DataGridFilter_controls_Pphm5>:nth-child(2){flex-grow:1;flex-shrink:0;margin-top:0}.DataGridFilter_popover_Pphm5 .DataGridFilter_controls_Pphm5>:last-child{flex-basis:15rem;flex-grow:1.8;flex-shrink:0;margin-top:0}.DataGridFilter_popover_Pphm5 .DataGridFilter_actions_Pphm5{display:flex;gap:1rem}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkRmlsdGVyLm1vZHVsZS5zY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWVBOzs7Ozs7Ozs7Ozs7OztFQWNFO0FBQ0Y7Ozs7Ozs7Ozs7Ozs7O0VBY0UsQ0FDRiw4QkFPRSxrQkFBc0IsQ0FDdEIsUUFBUyxDQUxULFVBQVcsQ0FFWCxXQUFZLENBQ1osZUFBZ0IsQ0FGaEIsU0FBVSxDQUhWLGlCQUFrQixDQUNsQixTQU9GLENBRUEsNkJBQ0UsWUFDRixDQUVBLCtCQUNFLG9EQUNGLENBQ0EsdUNBQ0UsK0JBQ0UsdUJBQ0YsQ0FDRixDQUVBLGdDQUNFLHFEQUNGLENBQ0EsdUNBQ0UsZ0NBQ0UsdUJBQ0YsQ0FDRixDQUVBLHlDQUNFLEdBQ0UsMkJBQ0YsQ0FDQSxHQUNFLHVCQUNGLENBQ0YsQ0FDQSwwQ0FDRSxHQUNFLHVCQUNGLENBQ0EsR0FDRSwyQkFDRixDQUNGO0FBQ0E7Ozs7Ozs7Ozs7Ozs7O0VBY0U7QUFFRjs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLHFDQUdFLGtCQUFtQixDQUtuQiwwQ0FBMkMsQ0FEM0Msc0JBQXVCLENBTnZCLFlBQWEsQ0FHYixXQUFhLENBRmIsc0JBQXVCLENBR3ZCLGlCQUFrQixDQUNsQixrQ0FHRixDQUNBLDJDQUNFLDBDQUNGLENBQ0EsNENBQ0Usd0NBQ0YsQ0FDQSx5RUFHRSxrQkFBbUIsQ0FFbkIsZUFBZ0IsQ0FDaEIsV0FBWSxDQUVaLGNBQWUsQ0FQZixZQUFhLENBR2IsV0FBYSxDQUZiLDBCQUEyQixDQUszQixnQkFFRixDQUNBLG9GQUNFLG9CQUNGLENBQ0EsdUZBR0Usd0NBQXlDLENBRnpDLHdDQUEwQyxDQUMxQyxnQkFFRixDQUNBLHlFQUNFLHFCQUNGLENBQ0EsbUVBQ0Usb0NBQXFDLENBR3JDLGVBQWdCLENBRmhCLHdDQUF5QyxDQUN6QyxRQUVGLENBQ0EsNkZBQ0UsZUFDRixDQUNBLHVFQUNFLG1DQUNGLENBRUEsMkNBQ0UseUJBQ0YsQ0FFQSw4QkFHRSxzQkFBdUIsQ0FGdkIsWUFBYSxDQUNiLHFCQUFzQixDQUV0QixRQUFTLENBRVQsZUFBZ0IsQ0FEaEIsbUJBRUYsQ0FDQSw2REFFRSxZQUFhLENBQ2IsUUFBUyxDQUZULFVBR0YsQ0FDQSwwRUFDRSxhQUFjLENBQ2QsYUFBYyxDQUNkLFlBQ0YsQ0FDQSwyRUFDRSxXQUFZLENBQ1osYUFBYyxDQUNkLFlBQ0YsQ0FDQSx5RUFDRSxnQkFBaUIsQ0FDakIsYUFBYyxDQUNkLGFBQWMsQ0FDZCxZQUNGLENBQ0EsNERBQ0UsWUFBYSxDQUNiLFFBQ0YiLCJmaWxlIjoiRGF0YUdyaWRGaWx0ZXIubW9kdWxlLnNjc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5zci1vbmx5IHtcbiAgcG9zaXRpb246IGFic29sdXRlO1xuICB3aWR0aDogMXB4O1xuICBoZWlnaHQ6IDFweDtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luOiAtMXB4O1xuICBvdmVyZmxvdzogaGlkZGVuO1xuICBjbGlwOiByZWN0KDAsIDAsIDAsIDApO1xuICBib3JkZXI6IDA7XG59XG5cbi5oaWRkZW4ge1xuICBkaXNwbGF5OiBub25lO1xufVxuXG4uc2xpZGUtaW4ge1xuICBhbmltYXRpb246IHNsaWRlLWluIDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtaW4ge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuLnNsaWRlLW91dCB7XG4gIGFuaW1hdGlvbjogc2xpZGUtb3V0IDAuNXMgZm9yd2FyZHM7XG59XG5AbWVkaWEgKHByZWZlcnMtcmVkdWNlZC1tb3Rpb246IHJlZHVjZSkge1xuICAuc2xpZGUtb3V0IHtcbiAgICBhbmltYXRpb24tZHVyYXRpb246IDAuMW1zO1xuICB9XG59XG5cbkBrZXlmcmFtZXMgc2xpZGUtaW4ge1xuICAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxuICAxMDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG59XG5Aa2V5ZnJhbWVzIHNsaWRlLW91dCB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMCUpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgxMDB2aCk7XG4gIH1cbn1cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiogQnJlYWtwb2ludHMgKiovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLmZpbHRlci13cmFwcGVyIHtcbiAgZGlzcGxheTogZmxleDtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGdhcDogMC4zNzVyZW07XG4gIG1pbi1oZWlnaHQ6IDEuNXJlbTtcbiAgcGFkZGluZzogMC4yNXJlbSAwLjc1cmVtIDAuMjVyZW0gMC41cmVtO1xuICBib3JkZXItcmFkaXVzOiAzLjEyNXJlbTtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29sb3ItYmx1ZS1ncmV5MTAwKTtcbn1cbi5maWx0ZXItd3JhcHBlcjpob3ZlciB7XG4gIGJhY2tncm91bmQtY29sb3I6IHZhcigtLWNvbG9yLWJsdWUtZ3JleTIwMCk7XG59XG4uZmlsdGVyLXdyYXBwZXI6YWN0aXZlIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tY29sb3ItcHJpbWFyeTEwMCk7XG59XG4uZmlsdGVyLXdyYXBwZXIgLmZpbHRlci1idXR0b24ge1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGdhcDogMC4zNzVyZW07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGJvcmRlcjogbm9uZTtcbiAgcGFkZGluZzogMCAwLjI1cmVtO1xuICBjdXJzb3I6IHBvaW50ZXI7XG59XG4uZmlsdGVyLXdyYXBwZXIgLmZpbHRlci1idXR0b246b25seS1jaGlsZCB7XG4gIG1hcmdpbi1yaWdodDogLTAuMjVyZW07XG59XG4uZmlsdGVyLXdyYXBwZXIgLmZpbHRlci1idXR0b246Zm9jdXMtdmlzaWJsZSB7XG4gIG91dGxpbmU6IDAuMTI1cmVtIHNvbGlkIHZhcigtLWNvbG9yLWZvY3VzKTtcbiAgb3V0bGluZS1vZmZzZXQ6IDA7XG4gIGJvcmRlci1yYWRpdXM6IHZhcigtLWZvY3VzLWJvcmRlci1yYWRpdXMpO1xufVxuLmZpbHRlci13cmFwcGVyIC5yZW1vdmUtYnV0dG9uIHtcbiAgYm9yZGVyLXJhZGl1czogMS4yNXJlbTtcbn1cbi5maWx0ZXItd3JhcHBlciAuY2FwdGlvbiB7XG4gIGZvbnQtc2l6ZTogdmFyKC0tZm9udC1zaXplLWRhdGEtZ3JpZCk7XG4gIGxpbmUtaGVpZ2h0OiB2YXIoLS1kYXRhLWdyaWQtbGluZS1oZWlnaHQpO1xuICBtYXJnaW46IDA7XG4gIGZvbnQtd2VpZ2h0OiA0MDA7XG59XG4uZmlsdGVyLXdyYXBwZXIgLmNhcHRpb24uYm9sZCB7XG4gIGZvbnQtd2VpZ2h0OiA2MDA7XG59XG4uZmlsdGVyLXdyYXBwZXIgLnJlbW92ZS1pY29uIHtcbiAgZm9udC1zaXplOiBjYWxjKDAuNiAqIHZhcigtLWZvbnQtc2l6ZSkpO1xufVxuXG4uY29sdW1uLXNlbGVjdC1vcHRpb24ge1xuICB0ZXh0LXRyYW5zZm9ybTogY2FwaXRhbGl6ZTtcbn1cblxuLnBvcG92ZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcbiAgZ2FwOiAxcmVtO1xuICBwYWRkaW5nOiAxcmVtIDAuNzVyZW07XG4gIG1pbi13aWR0aDogNDByZW07XG59XG4ucG9wb3ZlciAuY29udHJvbHMge1xuICB3aWR0aDogMTAwJTtcbiAgZGlzcGxheTogZmxleDtcbiAgZ2FwOiAxcmVtO1xufVxuLnBvcG92ZXIgLmNvbnRyb2xzID4gKjpmaXJzdC1jaGlsZCB7XG4gIGZsZXgtZ3JvdzogMS44O1xuICBmbGV4LXNocmluazogMDtcbiAgbWFyZ2luLXRvcDogMDtcbn1cbi5wb3BvdmVyIC5jb250cm9scyA+ICo6bnRoLWNoaWxkKDIpIHtcbiAgZmxleC1ncm93OiAxO1xuICBmbGV4LXNocmluazogMDtcbiAgbWFyZ2luLXRvcDogMDtcbn1cbi5wb3BvdmVyIC5jb250cm9scyA+ICo6bGFzdC1jaGlsZCB7XG4gIGZsZXgtYmFzaXM6IDE1cmVtO1xuICBmbGV4LWdyb3c6IDEuODtcbiAgZmxleC1zaHJpbms6IDA7XG4gIG1hcmdpbi10b3A6IDA7XG59XG4ucG9wb3ZlciAuYWN0aW9ucyB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGdhcDogMXJlbTtcbn0iXX0= */";
+var classes = {"sr-only":"DataGridFilter_sr-only_Pphm5","hidden":"DataGridFilter_hidden_Pphm5","slide-in":"DataGridFilter_slide-in_Pphm5","slide-out":"DataGridFilter_slide-out_Pphm5","filter-wrapper":"DataGridFilter_filter-wrapper_Pphm5","filter-button":"DataGridFilter_filter-button_Pphm5","remove-button":"DataGridFilter_remove-button_Pphm5","caption":"DataGridFilter_caption_Pphm5","bold":"DataGridFilter_bold_Pphm5","remove-icon":"DataGridFilter_remove-icon_Pphm5","column-select-option":"DataGridFilter_column-select-option_Pphm5","popover":"DataGridFilter_popover_Pphm5","controls":"DataGridFilter_controls_Pphm5","actions":"DataGridFilter_actions_Pphm5"};
 styleInject(css_248z);
 
 export { classes as default };

package/dist/esm/DataGrid/DataGridFilters/DataGridFilterPopover.esm.js

@@ -1,4 +1,4 @@
-import React, { useEffect } from 'react';
+import React__default, { useEffect } from 'react';
 import classes from './DataGridFilter.module.scss.esm.js';
 import { Button } from '../../Button/Button.esm.js';
 import { Option } from '../../Form/Select/SingleSelect/Option.esm.js';
@@ -35,10 +35,10 @@ const DataGridFilterPopover = ({ popoverRef, anchorRef, isOpen, column, columnsM
     }, [isOpen]);
     const columnMetadata = columnsMetadata.find(({ name }) => name === column);
     const disableAddNew = columnMetadata === null || columnMetadata === void 0 ? void 0 : columnMetadata.disableAddNew;
-    return (React.createElement(Popover, { tabIndex: -1, anchorEl: anchorRef, ref: popoverRef, show: isOpen, placement: { horizontal: "left", vertical: "bottom" }, transformOrigin: { horizontal: "left", vertical: "top" } },
-        React.createElement("div", { className: classes["popover"] },
-            React.createElement("div", { className: classes["controls"] },
-                React.createElement(SelectWrapper, { label: columnSelectLabel, value: column, name: "column", onChange: e => {
+    return (React__default.createElement(Popover, { tabIndex: -1, anchorEl: anchorRef, ref: popoverRef, show: isOpen, placement: { horizontal: "left", vertical: "bottom" }, transformOrigin: { horizontal: "left", vertical: "top" } },
+        React__default.createElement("div", { className: classes["popover"] },
+            React__default.createElement("div", { className: classes["controls"] },
+                React__default.createElement(SelectWrapper, { label: columnSelectLabel, value: column, name: "column", onChange: e => {
                         setColumn(e.target.value);
                         const columnMetadata = columnsMetadata.find(({ name }) => name === e.target.value);
                         if (columnMetadata === null || columnMetadata === void 0 ? void 0 : columnMetadata.operators) {
@@ -57,9 +57,9 @@ const DataGridFilterPopover = ({ popoverRef, anchorRef, isOpen, column, columnsM
                             setPickedValues([]);
                             setValues([]);
                         }
-                    } }, columnsMetadata.map(({ name, headline }) => (React.createElement(Option, { className: classes["column-select-option"], key: name, value: name }, headline)))),
-                React.createElement(SelectWrapper, { label: operatorSelectLabel, value: operator, name: "operator", onChange: e => setOperator(e.target.value) }, operators.map(operator => (React.createElement(Option, { key: operator, value: operator }, operator)))),
-                React.createElement(MultiSelectWrapper, { label: valueSelectLabel, name: "value", value: pickedValues, onChange: e => setPickedValues([...Array.from(e.target.options)]
+                    } }, columnsMetadata.map(({ name, headline }) => (React__default.createElement(Option, { className: classes["column-select-option"], key: name, value: name }, headline)))),
+                React__default.createElement(SelectWrapper, { label: operatorSelectLabel, value: operator, name: "operator", onChange: e => setOperator(e.target.value) }, operators.map(operator => (React__default.createElement(Option, { key: operator, value: operator }, operator)))),
+                React__default.createElement(MultiSelectWrapper, { label: valueSelectLabel, name: "value", value: pickedValues, onChange: e => setPickedValues([...Array.from(e.target.options)]
                         .filter(option => option.selected)
                         .map(option => option.value)), selectProps: {
                         addNew: disableAddNew
@@ -78,10 +78,10 @@ const DataGridFilterPopover = ({ popoverRef, anchorRef, isOpen, column, columnsM
                             enabled: true,
                             renderThreshold: 0
                         }
-                    } }, values.map(value => (React.createElement(MultiOption, { key: value, value: value }, value))))),
-            React.createElement("div", { className: classes["actions"] },
-                React.createElement(Button, { onClick: onFilterSubmit }, submitButtonTitle),
-                React.createElement(Button, { variant: "text", onClick: () => {
+                    } }, values.map(value => (React__default.createElement(MultiOption, { key: value, value: value }, value))))),
+            React__default.createElement("div", { className: classes["actions"] },
+                React__default.createElement(Button, { onClick: onFilterSubmit }, submitButtonTitle),
+                React__default.createElement(Button, { variant: "text", onClick: () => {
                         resetFields();
                         setFilterOpen(false);
                     } }, cancelButtonTitle)))));

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridFilterPopover.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridFilterPopover.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, { useEffect } from \"react\";\nimport classes from \"./DataGridFilter.module.scss\";\nimport { Button } from \"../../Button/Button\";\nimport { Option } from \"../../Form/Select/SingleSelect/Option\";\nimport { MultiOption } from \"../../Form/Select/MultiSelect/MultiOption\";\nimport { MultiSelectWrapper } from \"../../Form/Wrapper/MultiSelectWrapper/MultiSelectWrapper\";\nimport { SelectWrapper } from \"../../Form/Wrapper/SelectWrapper/SelectWrapper\";\nimport { Popover } from \"../../Popover/Popover\";\nimport {\n  DataGridColumnMetadata,\n  DefaultOperators,\n  PopoverTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { useRepeatFocus } from \"../../../hooks/useRepeatFocus\";\n\nexport type Props = {\n  popoverRef: React.RefObject<HTMLDivElement>;\n  anchorRef?: React.RefObject<HTMLDivElement>;\n  isOpen: boolean;\n  column: string;\n  columnsMetadata: DataGridColumnMetadata[];\n  values: string[];\n  pickedValues: string[];\n  operator: string;\n  operators: string[];\n  onFilterSubmit: () => void;\n  resetFields: () => void;\n  setFilterOpen: (value: React.SetStateAction<boolean>) => void;\n  setColumn: (column: React.SetStateAction<string>) => void;\n  setOperator: (operator: React.SetStateAction<string>) => void;\n  setOperators: (operators: React.SetStateAction<string[]>) => void;\n  setValues: (values: React.SetStateAction<string[]>) => void;\n  setPickedValues: (pickedValues: React.SetStateAction<string[]>) => void;\n  translations?: PopoverTranslations;\n};\n\nexport const DataGridFilterPopover = ({\n  popoverRef,\n  anchorRef,\n  isOpen,\n  column,\n  columnsMetadata,\n  values,\n  pickedValues,\n  operator,\n  operators,\n  onFilterSubmit,\n  resetFields,\n  setFilterOpen,\n  setColumn,\n  setOperator,\n  setOperators,\n  setValues,\n  setPickedValues,\n  translations\n}: Props) => {\n  const {\n    columnSelectLabel = \"Filter by\",\n    operatorSelectLabel = \"Operator\",\n    valueSelectLabel = \"Value\",\n    addNewValueLabel = \"Create new\",\n    addNewValueButtonTitle = \"Add new select value\",\n    submitButtonTitle = \"Apply\",\n    cancelButtonTitle = \"Cancel\"\n  } = translations || {};\n  useRepeatFocus(popoverRef);\n\n  useEffect(() => {\n    if (isOpen) {\n      popoverRef.current?.focus();\n    }\n  }, [isOpen]);\n\n  const columnMetadata = columnsMetadata.find(({ name }) => name === column);\n  const disableAddNew = columnMetadata?.disableAddNew;\n\n  return (\n    <Popover\n      tabIndex={-1}\n      anchorEl={anchorRef}\n      ref={popoverRef}\n      show={isOpen}\n      placement={{ horizontal: \"left\", vertical: \"bottom\" }}\n      transformOrigin={{ horizontal: \"left\", vertical: \"top\" }}\n    >\n      <div className={classes[\"popover\"]}>\n        <div className={classes[\"controls\"]}>\n          <SelectWrapper\n            label={columnSelectLabel}\n            value={column}\n            name={\"column\"}\n            onChange={e => {\n              setColumn(e.target.value);\n              const columnMetadata = columnsMetadata.find(({ name }) => name === e.target.value);\n\n              if (columnMetadata?.operators) {\n                setOperator(columnMetadata.operators[0]);\n                setOperators(columnMetadata.operators);\n              } else {\n                setOperator(Object.values(DefaultOperators)[0]);\n                setOperators(Object.values(DefaultOperators));\n              }\n\n              if (columnMetadata?.defaultValues) {\n                setPickedValues([]);\n                setValues(columnMetadata.defaultValues);\n              } else {\n                setPickedValues([]);\n                setValues([]);\n              }\n            }}\n          >\n            {columnsMetadata.map(({ name, headline }) => (\n              <Option className={classes[\"column-select-option\"]} key={name} value={name}>\n                {headline}\n              </Option>\n            ))}\n          </SelectWrapper>\n          <SelectWrapper\n            label={operatorSelectLabel}\n            value={operator}\n            name={\"operator\"}\n            onChange={e => setOperator(e.target.value)}\n          >\n            {operators.map(operator => (\n              <Option key={operator} value={operator}>\n                {operator}\n              </Option>\n            ))}\n          </SelectWrapper>\n          <MultiSelectWrapper\n            label={valueSelectLabel}\n            name={\"value\"}\n            value={pickedValues}\n            onChange={e =>\n              setPickedValues(\n                [...Array.from(e.target.options)]\n                  .filter(option => option.selected)\n                  .map(option => option.value)\n              )\n            }\n            selectProps={{\n              addNew: disableAddNew\n                ? undefined\n                : {\n                    label: addNewValueLabel,\n                    onAddNew: value => {\n                      if (value) {\n                        setValues(prev => [...prev, value]);\n                        setPickedValues(prev => [...prev, value]);\n                      }\n                    },\n                    btnProps: { title: addNewValueButtonTitle, type: \"button\" }\n                  },\n              search: {\n                enabled: true,\n                renderThreshold: 0\n              }\n            }}\n          >\n            {values.map(value => (\n              <MultiOption key={value} value={value}>\n                {value}\n              </MultiOption>\n            ))}\n          </MultiSelectWrapper>\n        </div>\n        <div className={classes[\"actions\"]}>\n          <Button onClick={onFilterSubmit}>{submitButtonTitle}</Button>\n          <Button\n            variant=\"text\"\n            onClick={() => {\n              resetFields();\n              setFilterOpen(false);\n            }}\n          >\n            {cancelButtonTitle}\n          </Button>\n        </div>\n      </div>\n    </Popover>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGridFilterPopover.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridFilterPopover.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, { useEffect } from \"react\";\nimport classes from \"./DataGridFilter.module.scss\";\nimport { Button } from \"../../Button/Button\";\nimport { Option } from \"../../Form/Select/SingleSelect/Option\";\nimport { MultiOption } from \"../../Form/Select/MultiSelect/MultiOption\";\nimport { MultiSelectWrapper } from \"../../Form/Wrapper/MultiSelectWrapper/MultiSelectWrapper\";\nimport { SelectWrapper } from \"../../Form/Wrapper/SelectWrapper/SelectWrapper\";\nimport { Popover } from \"../../Popover/Popover\";\nimport {\n  DataGridColumnMetadata,\n  DefaultOperators,\n  PopoverTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { useRepeatFocus } from \"../../../hooks/useRepeatFocus\";\n\nexport type Props = {\n  popoverRef: React.RefObject<HTMLDivElement>;\n  anchorRef?: React.RefObject<HTMLDivElement>;\n  isOpen: boolean;\n  column: string;\n  columnsMetadata: DataGridColumnMetadata[];\n  values: string[];\n  pickedValues: string[];\n  operator: string;\n  operators: string[];\n  onFilterSubmit: () => void;\n  resetFields: () => void;\n  setFilterOpen: (value: React.SetStateAction<boolean>) => void;\n  setColumn: (column: React.SetStateAction<string>) => void;\n  setOperator: (operator: React.SetStateAction<string>) => void;\n  setOperators: (operators: React.SetStateAction<string[]>) => void;\n  setValues: (values: React.SetStateAction<string[]>) => void;\n  setPickedValues: (pickedValues: React.SetStateAction<string[]>) => void;\n  translations?: PopoverTranslations;\n};\n\nexport const DataGridFilterPopover = ({\n  popoverRef,\n  anchorRef,\n  isOpen,\n  column,\n  columnsMetadata,\n  values,\n  pickedValues,\n  operator,\n  operators,\n  onFilterSubmit,\n  resetFields,\n  setFilterOpen,\n  setColumn,\n  setOperator,\n  setOperators,\n  setValues,\n  setPickedValues,\n  translations\n}: Props) => {\n  const {\n    columnSelectLabel = \"Filter by\",\n    operatorSelectLabel = \"Operator\",\n    valueSelectLabel = \"Value\",\n    addNewValueLabel = \"Create new\",\n    addNewValueButtonTitle = \"Add new select value\",\n    submitButtonTitle = \"Apply\",\n    cancelButtonTitle = \"Cancel\"\n  } = translations || {};\n  useRepeatFocus(popoverRef);\n\n  useEffect(() => {\n    if (isOpen) {\n      popoverRef.current?.focus();\n    }\n  }, [isOpen]);\n\n  const columnMetadata = columnsMetadata.find(({ name }) => name === column);\n  const disableAddNew = columnMetadata?.disableAddNew;\n\n  return (\n    <Popover\n      tabIndex={-1}\n      anchorEl={anchorRef}\n      ref={popoverRef}\n      show={isOpen}\n      placement={{ horizontal: \"left\", vertical: \"bottom\" }}\n      transformOrigin={{ horizontal: \"left\", vertical: \"top\" }}\n    >\n      <div className={classes[\"popover\"]}>\n        <div className={classes[\"controls\"]}>\n          <SelectWrapper\n            label={columnSelectLabel}\n            value={column}\n            name={\"column\"}\n            onChange={e => {\n              setColumn(e.target.value);\n              const columnMetadata = columnsMetadata.find(({ name }) => name === e.target.value);\n\n              if (columnMetadata?.operators) {\n                setOperator(columnMetadata.operators[0]);\n                setOperators(columnMetadata.operators);\n              } else {\n                setOperator(Object.values(DefaultOperators)[0]);\n                setOperators(Object.values(DefaultOperators));\n              }\n\n              if (columnMetadata?.defaultValues) {\n                setPickedValues([]);\n                setValues(columnMetadata.defaultValues);\n              } else {\n                setPickedValues([]);\n                setValues([]);\n              }\n            }}\n          >\n            {columnsMetadata.map(({ name, headline }) => (\n              <Option className={classes[\"column-select-option\"]} key={name} value={name}>\n                {headline}\n              </Option>\n            ))}\n          </SelectWrapper>\n          <SelectWrapper\n            label={operatorSelectLabel}\n            value={operator}\n            name={\"operator\"}\n            onChange={e => setOperator(e.target.value)}\n          >\n            {operators.map(operator => (\n              <Option key={operator} value={operator}>\n                {operator}\n              </Option>\n            ))}\n          </SelectWrapper>\n          <MultiSelectWrapper\n            label={valueSelectLabel}\n            name={\"value\"}\n            value={pickedValues}\n            onChange={e =>\n              setPickedValues(\n                [...Array.from(e.target.options)]\n                  .filter(option => option.selected)\n                  .map(option => option.value)\n              )\n            }\n            selectProps={{\n              addNew: disableAddNew\n                ? undefined\n                : {\n                    label: addNewValueLabel,\n                    onAddNew: value => {\n                      if (value) {\n                        setValues(prev => [...prev, value]);\n                        setPickedValues(prev => [...prev, value]);\n                      }\n                    },\n                    btnProps: { title: addNewValueButtonTitle, type: \"button\" }\n                  },\n              search: {\n                enabled: true,\n                renderThreshold: 0\n              }\n            }}\n          >\n            {values.map(value => (\n              <MultiOption key={value} value={value}>\n                {value}\n              </MultiOption>\n            ))}\n          </MultiSelectWrapper>\n        </div>\n        <div className={classes[\"actions\"]}>\n          <Button onClick={onFilterSubmit}>{submitButtonTitle}</Button>\n          <Button\n            variant=\"text\"\n            onClick={() => {\n              resetFields();\n              setFilterOpen(false);\n            }}\n          >\n            {cancelButtonTitle}\n          </Button>\n        </div>\n      </div>\n    </Popover>\n  );\n};\n"],"names":["React"],"mappings":"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"}

package/dist/esm/DataGrid/DataGridFilters/DataGridFilterTag.esm.js

@@ -1,4 +1,4 @@
-import React, { Fragment } from 'react';
+import React__default, { Fragment } from 'react';
 import { Icon, Icons } from '../../Icon/Icon.esm.js';
 import { RemoveButton } from '../../Tag/RemoveButton.esm.js';
 import { Typography } from '../../Typography/Typography.esm.js';
@@ -21,17 +21,17 @@ import classes from './DataGridFilter.module.scss.esm.js';
  */
 const EditTagContent = ({ filter, or, other }) => {
     const { column, operator, value } = filter;
-    return (React.createElement(Fragment, null,
+    return (React__default.createElement(Fragment, null,
         column,
         " ",
         operator,
         " ",
-        value.length > 0 && React.createElement("b", null, value[0]),
-        value.length >= 2 && (React.createElement(React.Fragment, null,
+        value.length > 0 && React__default.createElement("b", null, value[0]),
+        value.length >= 2 && (React__default.createElement(React__default.Fragment, null,
             " ",
             or,
             " ",
-            React.createElement("b", null,
+            React__default.createElement("b", null,
                 value.length - 1,
                 " ",
                 other)))));
@@ -41,21 +41,21 @@ const DataGridFilterTagComponent = ({ triggerRef, filter, mode, onFilterRemove,
     const shouldRenderAddTag = mode === "ADD";
     const shouldRenderEditTag = mode === "EDIT" && filter;
     const shouldRenderAddDateTag = mode === "ADD_DATE";
-    return (React.createElement("div", { ...rest, ref: ref, className: classes["filter-wrapper"] },
-        React.createElement("button", { ref: triggerRef, type: "button", className: classes["filter-button"], onClick: onFilterOpen },
-            shouldRenderAddTag && (React.createElement(Fragment, null,
-                React.createElement(Icon, { icon: Icons.AddCircle }),
-                React.createElement(Typography, { variant: "body", className: classes["caption"] }, addButtonCaption))),
-            shouldRenderEditTag && (React.createElement(Typography, { variant: "body", className: classes["caption"] }, customEditTagContent ? (React.cloneElement(customEditTagContent, { filter })) : (React.createElement(EditTagContent, { filter: filter, or: or, other: other })))),
-            shouldRenderAddDateTag && (React.createElement(Fragment, null,
-                React.createElement(Icon, { icon: Icons.Calendar }),
-                React.createElement(Typography, { variant: "body", className: classes["caption"] },
+    return (React__default.createElement("div", { ...rest, ref: ref, className: classes["filter-wrapper"] },
+        React__default.createElement("button", { ref: triggerRef, type: "button", className: classes["filter-button"], onClick: onFilterOpen },
+            shouldRenderAddTag && (React__default.createElement(Fragment, null,
+                React__default.createElement(Icon, { icon: Icons.AddCircle }),
+                React__default.createElement(Typography, { variant: "body", className: classes["caption"] }, addButtonCaption))),
+            shouldRenderEditTag && (React__default.createElement(Typography, { variant: "body", className: classes["caption"] }, customEditTagContent ? (React__default.cloneElement(customEditTagContent, { filter })) : (React__default.createElement(EditTagContent, { filter: filter, or: or, other: other })))),
+            shouldRenderAddDateTag && (React__default.createElement(Fragment, null,
+                React__default.createElement(Icon, { icon: Icons.Calendar }),
+                React__default.createElement(Typography, { variant: "body", className: classes["caption"] },
                     dateIs,
                     " ",
-                    React.createElement("b", null, dateTagCaption))))),
-        shouldRenderEditTag && (React.createElement(RemoveButton, { className: classes["remove-button"], onRemove: onFilterRemove }))));
+                    React__default.createElement("b", null, dateTagCaption))))),
+        shouldRenderEditTag && (React__default.createElement(RemoveButton, { className: classes["remove-button"], onRemove: onFilterRemove }))));
 };
-const DataGridFilterTag = React.forwardRef(DataGridFilterTagComponent);
+const DataGridFilterTag = React__default.forwardRef(DataGridFilterTagComponent);
 
 export { DataGridFilterTag, DataGridFilterTagComponent };
 //# sourceMappingURL=DataGridFilterTag.esm.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridFilterTag.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridFilterTag.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, ForwardRefRenderFunction, Fragment } from \"react\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport { RemoveButton } from \"../../Tag/RemoveButton\";\nimport { Typography } from \"../../Typography/Typography\";\nimport classes from \"./DataGridFilter.module.scss\";\nimport { Filter, FilterEditorMode, TagTranslations } from \"./DataGridFilters.interfaces\";\n\nexport interface DataGridFilterTagProps extends ComponentPropsWithRef<\"div\"> {\n  customEditTagContent?: React.ReactElement;\n  triggerRef: React.Ref<HTMLButtonElement>;\n  filter?: Filter;\n  mode: FilterEditorMode;\n  onFilterRemove?: () => void;\n  onFilterOpen: () => void;\n  translations?: TagTranslations;\n  dateTagCaption?: string;\n}\n\nconst EditTagContent = ({ filter, or, other }: { filter: Filter; or: string; other: string }) => {\n  const { column, operator, value } = filter;\n\n  return (\n    <Fragment>\n      {column} {operator} {value.length > 0 && <b>{value[0]}</b>}\n      {value.length >= 2 && (\n        <>\n          {\" \"}\n          {or}{\" \"}\n          <b>\n            {value.length - 1} {other}\n          </b>\n        </>\n      )}\n    </Fragment>\n  );\n};\n\nexport const DataGridFilterTagComponent: ForwardRefRenderFunction<\n  HTMLDivElement,\n  DataGridFilterTagProps\n> = (\n  {\n    triggerRef,\n    filter,\n    mode,\n    onFilterRemove,\n    onFilterOpen,\n    translations,\n    dateTagCaption,\n    customEditTagContent,\n    ...rest\n  }: DataGridFilterTagProps,\n  ref\n) => {\n  const {\n    addButtonCaption = \"Add filter\",\n    or = \"or\",\n    other = \"other\",\n    dateIs = \"Date is\"\n  } = translations || {};\n  const shouldRenderAddTag = mode === \"ADD\";\n  const shouldRenderEditTag = mode === \"EDIT\" && filter;\n  const shouldRenderAddDateTag = mode === \"ADD_DATE\";\n\n  return (\n    <div {...rest} ref={ref} className={classes[\"filter-wrapper\"]}>\n      <button\n        ref={triggerRef}\n        type=\"button\"\n        className={classes[\"filter-button\"]}\n        onClick={onFilterOpen}\n      >\n        {shouldRenderAddTag && (\n          <Fragment>\n            <Icon icon={Icons.AddCircle} />\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {addButtonCaption}\n            </Typography>\n          </Fragment>\n        )}\n        {shouldRenderEditTag && (\n          <Typography variant=\"body\" className={classes[\"caption\"]}>\n            {customEditTagContent ? (\n              React.cloneElement(customEditTagContent, { filter })\n            ) : (\n              <EditTagContent filter={filter} or={or} other={other} />\n            )}\n          </Typography>\n        )}\n        {shouldRenderAddDateTag && (\n          <Fragment>\n            <Icon icon={Icons.Calendar} />\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {dateIs} <b>{dateTagCaption}</b>\n            </Typography>\n          </Fragment>\n        )}\n      </button>\n      {shouldRenderEditTag && (\n        <RemoveButton className={classes[\"remove-button\"]} onRemove={onFilterRemove} />\n      )}\n    </div>\n  );\n};\n\nexport const DataGridFilterTag = React.forwardRef(DataGridFilterTagComponent);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGridFilterTag.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridFilterTag.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, ForwardRefRenderFunction, Fragment } from \"react\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport { RemoveButton } from \"../../Tag/RemoveButton\";\nimport { Typography } from \"../../Typography/Typography\";\nimport classes from \"./DataGridFilter.module.scss\";\nimport { Filter, FilterEditorMode, TagTranslations } from \"./DataGridFilters.interfaces\";\n\nexport interface DataGridFilterTagProps extends ComponentPropsWithRef<\"div\"> {\n  customEditTagContent?: React.ReactElement;\n  triggerRef: React.Ref<HTMLButtonElement>;\n  filter?: Filter;\n  mode: FilterEditorMode;\n  onFilterRemove?: () => void;\n  onFilterOpen: () => void;\n  translations?: TagTranslations;\n  dateTagCaption?: string;\n}\n\nconst EditTagContent = ({ filter, or, other }: { filter: Filter; or: string; other: string }) => {\n  const { column, operator, value } = filter;\n\n  return (\n    <Fragment>\n      {column} {operator} {value.length > 0 && <b>{value[0]}</b>}\n      {value.length >= 2 && (\n        <>\n          {\" \"}\n          {or}{\" \"}\n          <b>\n            {value.length - 1} {other}\n          </b>\n        </>\n      )}\n    </Fragment>\n  );\n};\n\nexport const DataGridFilterTagComponent: ForwardRefRenderFunction<\n  HTMLDivElement,\n  DataGridFilterTagProps\n> = (\n  {\n    triggerRef,\n    filter,\n    mode,\n    onFilterRemove,\n    onFilterOpen,\n    translations,\n    dateTagCaption,\n    customEditTagContent,\n    ...rest\n  }: DataGridFilterTagProps,\n  ref\n) => {\n  const {\n    addButtonCaption = \"Add filter\",\n    or = \"or\",\n    other = \"other\",\n    dateIs = \"Date is\"\n  } = translations || {};\n  const shouldRenderAddTag = mode === \"ADD\";\n  const shouldRenderEditTag = mode === \"EDIT\" && filter;\n  const shouldRenderAddDateTag = mode === \"ADD_DATE\";\n\n  return (\n    <div {...rest} ref={ref} className={classes[\"filter-wrapper\"]}>\n      <button\n        ref={triggerRef}\n        type=\"button\"\n        className={classes[\"filter-button\"]}\n        onClick={onFilterOpen}\n      >\n        {shouldRenderAddTag && (\n          <Fragment>\n            <Icon icon={Icons.AddCircle} />\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {addButtonCaption}\n            </Typography>\n          </Fragment>\n        )}\n        {shouldRenderEditTag && (\n          <Typography variant=\"body\" className={classes[\"caption\"]}>\n            {customEditTagContent ? (\n              React.cloneElement(customEditTagContent, { filter })\n            ) : (\n              <EditTagContent filter={filter} or={or} other={other} />\n            )}\n          </Typography>\n        )}\n        {shouldRenderAddDateTag && (\n          <Fragment>\n            <Icon icon={Icons.Calendar} />\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {dateIs} <b>{dateTagCaption}</b>\n            </Typography>\n          </Fragment>\n        )}\n      </button>\n      {shouldRenderEditTag && (\n        <RemoveButton className={classes[\"remove-button\"]} onRemove={onFilterRemove} />\n      )}\n    </div>\n  );\n};\n\nexport const DataGridFilterTag = React.forwardRef(DataGridFilterTagComponent);\n"],"names":["React"],"mappings":"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"}

package/dist/esm/DataGrid/DataGridFilters/DataGridSearchbar.esm.js

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React__default, { useState, useEffect } from 'react';
 import { InputWrapper } from '../../Form/Wrapper/InputWrapper/InputWrapper.esm.js';
 import { Icon, Icons } from '../../Icon/Icon.esm.js';
 import classes from './DataGridToolbar.module.scss.esm.js';
@@ -31,10 +31,10 @@ const DataGridSearchbar = ({ onSearch, initialSearchValue, debounceTime, inputWr
     useEffect(() => {
         initialSearchValue && setSearch(initialSearchValue);
     }, [initialSearchValue]);
-    return (React.createElement(InputWrapper, { ...inputWrapperProps, className: `${classes["searchbar"]} ${(_a = inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.className) !== null && _a !== void 0 ? _a : ""}`, label: (_b = inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.label) !== null && _b !== void 0 ? _b : "", onChange: onChange, type: "search", name: (_c = inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.name) !== null && _c !== void 0 ? _c : "searchbar", value: search, inputProps: {
+    return (React__default.createElement(InputWrapper, { ...inputWrapperProps, className: `${classes["searchbar"]} ${(_a = inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.className) !== null && _a !== void 0 ? _a : ""}`, label: (_b = inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.label) !== null && _b !== void 0 ? _b : "", onChange: onChange, type: "search", name: (_c = inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.name) !== null && _c !== void 0 ? _c : "searchbar", value: search, inputProps: {
             ...inputWrapperProps === null || inputWrapperProps === void 0 ? void 0 : inputWrapperProps.inputProps,
             type: "search",
-            prefix: React.createElement(Icon, { icon: Icons.Search }),
+            prefix: React__default.createElement(Icon, { icon: Icons.Search }),
             placeholder: placeholder !== null && placeholder !== void 0 ? placeholder : "Search items"
         } }));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridSearchbar.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridSearchbar.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, { useState, useEffect } from \"react\";\nimport {\n  InputWrapper,\n  Props as InputWrapperProps\n} from \"../../Form/Wrapper/InputWrapper/InputWrapper\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport classes from \"./DataGridToolbar.module.scss\";\nimport { useDebouncedCallback } from \"../../../hooks/useDebouncedCallback\";\n\nexport interface DataGridSearchbarProps {\n  onSearch: (value: string) => void;\n  initialSearchValue?: string;\n  debounceTime?: number;\n  placeholder?: string;\n  inputWrapperProps?: InputWrapperProps;\n}\n\nexport const DataGridSearchbar = ({\n  onSearch,\n  initialSearchValue,\n  debounceTime,\n  inputWrapperProps,\n  placeholder\n}: DataGridSearchbarProps) => {\n  const [search, setSearch] = useState(initialSearchValue ?? \"\");\n  const debouncedCallback = useDebouncedCallback(onSearch, debounceTime ?? 500);\n  const onSearchCallback = debounceTime ? debouncedCallback : onSearch;\n\n  const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    onSearchCallback(event.target.value);\n    setSearch(event.target.value);\n  };\n\n  useEffect(() => {\n    initialSearchValue && setSearch(initialSearchValue);\n  }, [initialSearchValue]);\n\n  return (\n    <InputWrapper\n      {...inputWrapperProps}\n      className={`${classes[\"searchbar\"]} ${inputWrapperProps?.className ?? \"\"}`}\n      label={inputWrapperProps?.label ?? \"\"}\n      onChange={onChange}\n      type=\"search\"\n      name={inputWrapperProps?.name ?? \"searchbar\"}\n      value={search}\n      inputProps={{\n        ...inputWrapperProps?.inputProps,\n        type: \"search\",\n        prefix: <Icon icon={Icons.Search} />,\n        placeholder: placeholder ?? \"Search items\"\n      }}\n    ></InputWrapper>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAmBU,MAAA,iBAAiB,GAAG,CAAC,EAChC,QAAQ,EACR,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACY,KAAI;;AAC3B,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAlB,KAAA,CAAA,GAAA,kBAAkB,GAAI,EAAE,CAAC,CAAC;AAC/D,IAAA,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,QAAQ,EAAE,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,KAAA,CAAA,GAAA,YAAY,GAAI,GAAG,CAAC,CAAC;IAC9E,MAAM,gBAAgB,GAAG,YAAY,GAAG,iBAAiB,GAAG,QAAQ,CAAC;AAErE,IAAA,MAAM,QAAQ,GAAG,CAAC,KAA0C,KAAI;AAC9D,QAAA,gBAAgB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;AACrC,QAAA,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;AAChC,KAAC,CAAC;IAEF,SAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,IAAI,SAAS,CAAC,kBAAkB,CAAC,CAAC;AACtD,KAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;AAEzB,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAA,GACP,iBAAiB,EACrB,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,WAAW,CAAC,CAAI,CAAA,EAAA,CAAA,EAAA,GAAA,iBAAiB,KAAA,IAAA,IAAjB,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjB,iBAAiB,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,EAAE,CAAA,CAAE,EAC1E,KAAK,EAAE,CAAA,EAAA,GAAA,iBAAiB,KAAjB,IAAA,IAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,iBAAiB,CAAE,KAAK,MAAI,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAA,EAAE,EACrC,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,CAAA,EAAA,GAAA,iBAAiB,KAAjB,IAAA,IAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,iBAAiB,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,WAAW,EAC5C,KAAK,EAAE,MAAM,EACb,UAAU,EAAE;AACV,YAAA,GAAG,iBAAiB,KAAjB,IAAA,IAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,iBAAiB,CAAE,UAAU;AAChC,YAAA,IAAI,EAAE,QAAQ;YACd,MAAM,EAAE,oBAAC,IAAI,EAAA,EAAC,IAAI,EAAE,KAAK,CAAC,MAAM,EAAI,CAAA;AACpC,YAAA,WAAW,EAAE,WAAW,KAAA,IAAA,IAAX,WAAW,KAAX,KAAA,CAAA,GAAA,WAAW,GAAI,cAAc;AAC3C,SAAA,EAAA,CACa,EAChB;AACJ;;;;"}
+{"version":3,"file":"DataGridSearchbar.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridSearchbar.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, { useState, useEffect } from \"react\";\nimport {\n  InputWrapper,\n  Props as InputWrapperProps\n} from \"../../Form/Wrapper/InputWrapper/InputWrapper\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport classes from \"./DataGridToolbar.module.scss\";\nimport { useDebouncedCallback } from \"../../../hooks/useDebouncedCallback\";\n\nexport interface DataGridSearchbarProps {\n  onSearch: (value: string) => void;\n  initialSearchValue?: string;\n  debounceTime?: number;\n  placeholder?: string;\n  inputWrapperProps?: InputWrapperProps;\n}\n\nexport const DataGridSearchbar = ({\n  onSearch,\n  initialSearchValue,\n  debounceTime,\n  inputWrapperProps,\n  placeholder\n}: DataGridSearchbarProps) => {\n  const [search, setSearch] = useState(initialSearchValue ?? \"\");\n  const debouncedCallback = useDebouncedCallback(onSearch, debounceTime ?? 500);\n  const onSearchCallback = debounceTime ? debouncedCallback : onSearch;\n\n  const onChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    onSearchCallback(event.target.value);\n    setSearch(event.target.value);\n  };\n\n  useEffect(() => {\n    initialSearchValue && setSearch(initialSearchValue);\n  }, [initialSearchValue]);\n\n  return (\n    <InputWrapper\n      {...inputWrapperProps}\n      className={`${classes[\"searchbar\"]} ${inputWrapperProps?.className ?? \"\"}`}\n      label={inputWrapperProps?.label ?? \"\"}\n      onChange={onChange}\n      type=\"search\"\n      name={inputWrapperProps?.name ?? \"searchbar\"}\n      value={search}\n      inputProps={{\n        ...inputWrapperProps?.inputProps,\n        type: \"search\",\n        prefix: <Icon icon={Icons.Search} />,\n        placeholder: placeholder ?? \"Search items\"\n      }}\n    ></InputWrapper>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAmBU,MAAA,iBAAiB,GAAG,CAAC,EAChC,QAAQ,EACR,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,EACjB,WAAW,EACY,KAAI;;AAC3B,IAAA,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,kBAAkB,KAAA,IAAA,IAAlB,kBAAkB,KAAlB,KAAA,CAAA,GAAA,kBAAkB,GAAI,EAAE,CAAC,CAAC;AAC/D,IAAA,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,QAAQ,EAAE,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,KAAA,CAAA,GAAA,YAAY,GAAI,GAAG,CAAC,CAAC;IAC9E,MAAM,gBAAgB,GAAG,YAAY,GAAG,iBAAiB,GAAG,QAAQ,CAAC;AAErE,IAAA,MAAM,QAAQ,GAAG,CAAC,KAA0C,KAAI;AAC9D,QAAA,gBAAgB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;AACrC,QAAA,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;AAChC,KAAC,CAAC;IAEF,SAAS,CAAC,MAAK;AACb,QAAA,kBAAkB,IAAI,SAAS,CAAC,kBAAkB,CAAC,CAAC;AACtD,KAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;AAEzB,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,YAAY,EAAA,EAAA,GACP,iBAAiB,EACrB,SAAS,EAAE,CAAG,EAAA,OAAO,CAAC,WAAW,CAAC,CAAI,CAAA,EAAA,CAAA,EAAA,GAAA,iBAAiB,KAAA,IAAA,IAAjB,iBAAiB,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAjB,iBAAiB,CAAE,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,EAAE,CAAA,CAAE,EAC1E,KAAK,EAAE,CAAA,EAAA,GAAA,iBAAiB,KAAjB,IAAA,IAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,iBAAiB,CAAE,KAAK,MAAI,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAA,EAAE,EACrC,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,CAAA,EAAA,GAAA,iBAAiB,KAAjB,IAAA,IAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,iBAAiB,CAAE,IAAI,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,WAAW,EAC5C,KAAK,EAAE,MAAM,EACb,UAAU,EAAE;AACV,YAAA,GAAG,iBAAiB,KAAjB,IAAA,IAAA,iBAAiB,KAAjB,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,iBAAiB,CAAE,UAAU;AAChC,YAAA,IAAI,EAAE,QAAQ;YACd,MAAM,EAAEA,6BAAC,IAAI,EAAA,EAAC,IAAI,EAAE,KAAK,CAAC,MAAM,EAAI,CAAA;AACpC,YAAA,WAAW,EAAE,WAAW,KAAA,IAAA,IAAX,WAAW,KAAX,KAAA,CAAA,GAAA,WAAW,GAAI,cAAc;AAC3C,SAAA,EAAA,CACa,EAChB;AACJ;;;;"}

package/dist/esm/DataGrid/DataGridFilters/DataGridToolbar.esm.js

@@ -1,4 +1,4 @@
-import React, { Fragment } from 'react';
+import React__default, { Fragment } from 'react';
 import { DataGridFilter } from './DataGridFilter.esm.js';
 import classes from './DataGridToolbar.module.scss.esm.js';
 import { Typography } from '../../Typography/Typography.esm.js';
@@ -23,26 +23,26 @@ import { DataGridDateFilter } from './DataGridDateFilter.esm.js';
 const DataGridToolbar = ({ columnsMetadata, filterValues, translations, onFilterAdd, onFilterEdit, onFilterDelete, dateFilterValue, onDateFilterValueChange, onFiltersClear, customEditTagContent }) => {
     const { state, addFilter, editFilter, deleteFilter, clearFilters } = useFiltersReducer(filterValues);
     const { clearButtonCaption = "Clear all filters" } = (translations === null || translations === void 0 ? void 0 : translations.toolbar) || {};
-    return (React.createElement(Fragment, null,
+    return (React__default.createElement(Fragment, null,
         columnsMetadata &&
-            state.filters.map(filter => (React.createElement(DataGridFilter, { mode: "EDIT", key: filter.id, filter: filter, columnsMetadata: columnsMetadata, onFilterEdit: filter => {
+            state.filters.map(filter => (React__default.createElement(DataGridFilter, { mode: "EDIT", key: filter.id, filter: filter, columnsMetadata: columnsMetadata, onFilterEdit: filter => {
                     editFilter(filter);
                     onFilterEdit && onFilterEdit(filter);
                 }, onFilterDelete: id => {
                     deleteFilter(id);
                     onFilterDelete && onFilterDelete(id);
                 }, tagTranslations: translations === null || translations === void 0 ? void 0 : translations.tag, popoverTranslations: translations === null || translations === void 0 ? void 0 : translations.popover, customEditTagContent: customEditTagContent }))),
-        React.createElement("div", { className: classes["actions-wrapper"] },
-            columnsMetadata && (React.createElement(DataGridFilter, { mode: "ADD", customEditTagContent: customEditTagContent, columnsMetadata: columnsMetadata, onFilterAdd: filter => {
+        React__default.createElement("div", { className: classes["actions-wrapper"] },
+            columnsMetadata && (React__default.createElement(DataGridFilter, { mode: "ADD", customEditTagContent: customEditTagContent, columnsMetadata: columnsMetadata, onFilterAdd: filter => {
                     addFilter(filter);
                     onFilterAdd && onFilterAdd(filter);
                 }, tagTranslations: translations === null || translations === void 0 ? void 0 : translations.tag, popoverTranslations: translations === null || translations === void 0 ? void 0 : translations.popover })),
-            columnsMetadata && state.filters.length >= 1 && (React.createElement("button", { type: "button", className: classes["clear-button"], onClick: () => {
+            columnsMetadata && state.filters.length >= 1 && (React__default.createElement("button", { type: "button", className: classes["clear-button"], onClick: () => {
                     clearFilters();
                     onFiltersClear && onFiltersClear();
                 } },
-                React.createElement(Typography, { variant: "body", className: classes["caption"] }, clearButtonCaption))),
-            dateFilterValue && (React.createElement(DataGridDateFilter, { dateFilterValue: dateFilterValue, onDateFilterValueChange: onDateFilterValueChange })))));
+                React__default.createElement(Typography, { variant: "body", className: classes["caption"] }, clearButtonCaption))),
+            dateFilterValue && (React__default.createElement(DataGridDateFilter, { dateFilterValue: dateFilterValue, onDateFilterValueChange: onDateFilterValueChange })))));
 };
 
 export { DataGridToolbar };

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridToolbar.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridToolbar.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, { Fragment } from \"react\";\nimport { DataGridFilter } from \"./DataGridFilter\";\nimport classes from \"./DataGridToolbar.module.scss\";\nimport {\n  DataGridColumnMetadata,\n  DateTimeFilter,\n  Filter,\n  FiltersTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { Typography } from \"../../Typography/Typography\";\nimport { useFiltersReducer } from \"./useFiltersReducer\";\nimport { DataGridDateFilter } from \"./DataGridDateFilter\";\n\nexport interface DataGridToolbarProps {\n  columnsMetadata?: DataGridColumnMetadata[];\n  customEditTagContent?: React.ReactElement;\n  dateFilterValue?: DateTimeFilter;\n  onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;\n  filterValues?: Filter[];\n  translations?: FiltersTranslations;\n  onFilterAdd?: (filter: Filter) => void;\n  onFilterEdit?: (filter: Filter) => void;\n  onFilterDelete?: (id: string) => void;\n  onFiltersClear?: () => void;\n}\n\nexport const DataGridToolbar = ({\n  columnsMetadata,\n  filterValues,\n  translations,\n  onFilterAdd,\n  onFilterEdit,\n  onFilterDelete,\n  dateFilterValue,\n  onDateFilterValueChange,\n  onFiltersClear,\n  customEditTagContent\n}: DataGridToolbarProps) => {\n  const { state, addFilter, editFilter, deleteFilter, clearFilters } =\n    useFiltersReducer(filterValues);\n  const { clearButtonCaption = \"Clear all filters\" } = translations?.toolbar || {};\n  return (\n    <Fragment>\n      {columnsMetadata &&\n        state.filters.map(filter => (\n          <DataGridFilter\n            mode=\"EDIT\"\n            key={filter.id}\n            filter={filter}\n            columnsMetadata={columnsMetadata}\n            onFilterEdit={filter => {\n              editFilter(filter);\n              onFilterEdit && onFilterEdit(filter);\n            }}\n            onFilterDelete={id => {\n              deleteFilter(id);\n              onFilterDelete && onFilterDelete(id);\n            }}\n            tagTranslations={translations?.tag}\n            popoverTranslations={translations?.popover}\n            customEditTagContent={customEditTagContent}\n          />\n        ))}\n      <div className={classes[\"actions-wrapper\"]}>\n        {columnsMetadata && (\n          <DataGridFilter\n            mode=\"ADD\"\n            customEditTagContent={customEditTagContent}\n            columnsMetadata={columnsMetadata}\n            onFilterAdd={filter => {\n              addFilter(filter);\n              onFilterAdd && onFilterAdd(filter);\n            }}\n            tagTranslations={translations?.tag}\n            popoverTranslations={translations?.popover}\n          />\n        )}\n        {columnsMetadata && state.filters.length >= 1 && (\n          <button\n            type=\"button\"\n            className={classes[\"clear-button\"]}\n            onClick={() => {\n              clearFilters();\n              onFiltersClear && onFiltersClear();\n            }}\n          >\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {clearButtonCaption}\n            </Typography>\n          </button>\n        )}\n\n        {dateFilterValue && (\n          <DataGridDateFilter\n            dateFilterValue={dateFilterValue}\n            onDateFilterValueChange={onDateFilterValueChange}\n          />\n        )}\n      </div>\n    </Fragment>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGridToolbar.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridToolbar.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, { Fragment } from \"react\";\nimport { DataGridFilter } from \"./DataGridFilter\";\nimport classes from \"./DataGridToolbar.module.scss\";\nimport {\n  DataGridColumnMetadata,\n  DateTimeFilter,\n  Filter,\n  FiltersTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { Typography } from \"../../Typography/Typography\";\nimport { useFiltersReducer } from \"./useFiltersReducer\";\nimport { DataGridDateFilter } from \"./DataGridDateFilter\";\n\nexport interface DataGridToolbarProps {\n  columnsMetadata?: DataGridColumnMetadata[];\n  customEditTagContent?: React.ReactElement;\n  dateFilterValue?: DateTimeFilter;\n  onDateFilterValueChange?: (dateTimeFilter: DateTimeFilter) => void;\n  filterValues?: Filter[];\n  translations?: FiltersTranslations;\n  onFilterAdd?: (filter: Filter) => void;\n  onFilterEdit?: (filter: Filter) => void;\n  onFilterDelete?: (id: string) => void;\n  onFiltersClear?: () => void;\n}\n\nexport const DataGridToolbar = ({\n  columnsMetadata,\n  filterValues,\n  translations,\n  onFilterAdd,\n  onFilterEdit,\n  onFilterDelete,\n  dateFilterValue,\n  onDateFilterValueChange,\n  onFiltersClear,\n  customEditTagContent\n}: DataGridToolbarProps) => {\n  const { state, addFilter, editFilter, deleteFilter, clearFilters } =\n    useFiltersReducer(filterValues);\n  const { clearButtonCaption = \"Clear all filters\" } = translations?.toolbar || {};\n  return (\n    <Fragment>\n      {columnsMetadata &&\n        state.filters.map(filter => (\n          <DataGridFilter\n            mode=\"EDIT\"\n            key={filter.id}\n            filter={filter}\n            columnsMetadata={columnsMetadata}\n            onFilterEdit={filter => {\n              editFilter(filter);\n              onFilterEdit && onFilterEdit(filter);\n            }}\n            onFilterDelete={id => {\n              deleteFilter(id);\n              onFilterDelete && onFilterDelete(id);\n            }}\n            tagTranslations={translations?.tag}\n            popoverTranslations={translations?.popover}\n            customEditTagContent={customEditTagContent}\n          />\n        ))}\n      <div className={classes[\"actions-wrapper\"]}>\n        {columnsMetadata && (\n          <DataGridFilter\n            mode=\"ADD\"\n            customEditTagContent={customEditTagContent}\n            columnsMetadata={columnsMetadata}\n            onFilterAdd={filter => {\n              addFilter(filter);\n              onFilterAdd && onFilterAdd(filter);\n            }}\n            tagTranslations={translations?.tag}\n            popoverTranslations={translations?.popover}\n          />\n        )}\n        {columnsMetadata && state.filters.length >= 1 && (\n          <button\n            type=\"button\"\n            className={classes[\"clear-button\"]}\n            onClick={() => {\n              clearFilters();\n              onFiltersClear && onFiltersClear();\n            }}\n          >\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {clearButtonCaption}\n            </Typography>\n          </button>\n        )}\n\n        {dateFilterValue && (\n          <DataGridDateFilter\n            dateFilterValue={dateFilterValue}\n            onDateFilterValueChange={onDateFilterValueChange}\n          />\n        )}\n      </div>\n    </Fragment>\n  );\n};\n"],"names":["React"],"mappings":"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"}