@onewelcome/react-lib-components 8.0.0 → 8.1.1

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 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\";\n\nexport type Props = {\n  anchorRef?: React.RefObject<HTMLOrSVGElement>;\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  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  return (\n    <Popover\n      anchorEl={anchorRef}\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: {\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  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: {\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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"}

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

@@ -28,25 +28,23 @@ const EditTagContent = ({ filter }) => {
         " ",
         value.length > 0 && React.createElement("b", null, value[0]),
         value.length >= 2 && (React.createElement(React.Fragment, null,
-            " ",
             "or ",
             React.createElement("b", null,
                 " ",
                 value.length - 1,
                 " other")))));
 };
-const DataGridFilterTagComponent = ({ triggerRef, filter, mode, onFilterRemove, onFilterOpen, translations, ...rest }, ref) => {
+const DataGridFilterTagComponent = ({ triggerRef, filter, mode, onFilterRemove, onFilterOpen, translations, customEditTagContent, ...rest }, ref) => {
     const { addButtonCaption = "Add filter" } = translations || {};
     const shouldRenderAddTag = mode === "ADD";
     const shouldRenderEditTag = mode === "EDIT" && filter;
-    return (React.createElement("div", { ...rest, ref: triggerRef, className: classes["filter-wrapper"] },
-        React.createElement("button", { type: "button", className: classes["filter-button"], onClick: onFilterOpen },
+    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"] },
-                React.createElement(EditTagContent, { filter: filter })))),
-        shouldRenderEditTag && React.createElement(RemoveButton, { onRemove: onFilterRemove })));
+            shouldRenderEditTag && (React.createElement(Typography, { variant: "body", className: classes["caption"] }, customEditTagContent ? (React.cloneElement(customEditTagContent, { filter })) : (React.createElement(EditTagContent, { filter: filter }))))),
+        shouldRenderEditTag && (React.createElement(RemoveButton, { className: classes["remove-button"], onRemove: onFilterRemove }))));
 };
 const DataGridFilterTag = React.forwardRef(DataGridFilterTagComponent);
 

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  triggerRef: React.Ref<HTMLDivElement>;\n  filter?: Filter;\n  mode: FilterEditorMode;\n  onFilterRemove: () => void;\n  onFilterOpen: () => void;\n  translations?: TagTranslations;\n}\n\nconst EditTagContent = ({ filter }: { filter: Filter }) => {\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 <b> {value.length - 1} other</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\n    ...rest\n  }: DataGridFilterTagProps,\n  ref\n) => {\n  const { addButtonCaption = \"Add filter\" } = translations || {};\n  const shouldRenderAddTag = mode === \"ADD\";\n  const shouldRenderEditTag = mode === \"EDIT\" && filter;\n\n  return (\n    <div {...rest} ref={triggerRef} className={classes[\"filter-wrapper\"]}>\n      <button type=\"button\" className={classes[\"filter-button\"]} onClick={onFilterOpen}>\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            <EditTagContent filter={filter} />\n          </Typography>\n        )}\n      </button>\n      {shouldRenderEditTag && <RemoveButton onRemove={onFilterRemove} />}\n    </div>\n  );\n};\n\nexport const DataGridFilterTag = React.forwardRef(DataGridFilterTagComponent);\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAkBH,MAAM,cAAc,GAAG,CAAC,EAAE,MAAM,EAAsB,KAAI;IACxD,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC;IAE3C,QACE,oBAAC,QAAQ,EAAA,IAAA;QACN,MAAM;;QAAG,QAAQ;;QAAG,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,+BAAI,KAAK,CAAC,CAAC,CAAC,CAAK;AACzD,QAAA,KAAK,CAAC,MAAM,IAAI,CAAC,KAChB,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;YACG,GAAG;;AACD,YAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,IAAA;;gBAAK,KAAK,CAAC,MAAM,GAAG,CAAC;yBAAW,CAClC,CACJ,CACQ,EACX;AACJ,CAAC,CAAC;AAEW,MAAA,0BAA0B,GAGnC,CACF,EACE,UAAU,EACV,MAAM,EACN,IAAI,EACJ,cAAc,EACd,YAAY,EACZ,YAAY,EAEZ,GAAG,IAAI,EACgB,EACzB,GAAG,KACD;IACF,MAAM,EAAE,gBAAgB,GAAG,YAAY,EAAE,GAAG,YAAY,IAAI,EAAE,CAAC;AAC/D,IAAA,MAAM,kBAAkB,GAAG,IAAI,KAAK,KAAK,CAAC;AAC1C,IAAA,MAAM,mBAAmB,GAAG,IAAI,KAAK,MAAM,IAAI,MAAM,CAAC;AAEtD,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAS,IAAI,EAAE,GAAG,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAA;AAClE,QAAA,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,IAAI,EAAC,QAAQ,EAAC,SAAS,EAAE,OAAO,CAAC,eAAe,CAAC,EAAE,OAAO,EAAE,YAAY,EAAA;YAC7E,kBAAkB,KACjB,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;AACP,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAE,KAAK,CAAC,SAAS,EAAI,CAAA;AAC/B,gBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA,EACrD,gBAAgB,CACN,CACJ,CACZ;AACA,YAAA,mBAAmB,KAClB,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA;gBACtD,KAAC,CAAA,aAAA,CAAA,cAAc,IAAC,MAAM,EAAE,MAAM,EAAI,CAAA,CACvB,CACd,CACM;QACR,mBAAmB,IAAI,KAAC,CAAA,aAAA,CAAA,YAAY,EAAC,EAAA,QAAQ,EAAE,cAAc,EAAA,CAAI,CAC9D,EACN;AACJ,EAAE;AAEW,MAAA,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAAC,0BAA0B;;;;"}
+{"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}\n\nconst EditTagContent = ({ filter }: { filter: Filter }) => {\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          or <b> {value.length - 1} other</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    customEditTagContent,\n    ...rest\n  }: DataGridFilterTagProps,\n  ref\n) => {\n  const { addButtonCaption = \"Add filter\" } = translations || {};\n  const shouldRenderAddTag = mode === \"ADD\";\n  const shouldRenderEditTag = mode === \"EDIT\" && filter;\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} />\n            )}\n          </Typography>\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":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;AAmBH,MAAM,cAAc,GAAG,CAAC,EAAE,MAAM,EAAsB,KAAI;IACxD,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC;IAE3C,QACE,oBAAC,QAAQ,EAAA,IAAA;QACN,MAAM;;QAAG,QAAQ;;QAAG,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,+BAAI,KAAK,CAAC,CAAC,CAAC,CAAK;AACzD,QAAA,KAAK,CAAC,MAAM,IAAI,CAAC,KAChB,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;;AACK,YAAA,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,IAAA;;gBAAK,KAAK,CAAC,MAAM,GAAG,CAAC;yBAAW,CAClC,CACJ,CACQ,EACX;AACJ,CAAC,CAAC;AAEW,MAAA,0BAA0B,GAGnC,CACF,EACE,UAAU,EACV,MAAM,EACN,IAAI,EACJ,cAAc,EACd,YAAY,EACZ,YAAY,EACZ,oBAAoB,EACpB,GAAG,IAAI,EACgB,EACzB,GAAG,KACD;IACF,MAAM,EAAE,gBAAgB,GAAG,YAAY,EAAE,GAAG,YAAY,IAAI,EAAE,CAAC;AAC/D,IAAA,MAAM,kBAAkB,GAAG,IAAI,KAAK,KAAK,CAAC;AAC1C,IAAA,MAAM,mBAAmB,GAAG,IAAI,KAAK,MAAM,IAAI,MAAM,CAAC;AAEtD,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAS,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAA;AAC3D,QAAA,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,GAAG,EAAE,UAAU,EACf,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,OAAO,CAAC,eAAe,CAAC,EACnC,OAAO,EAAE,YAAY,EAAA;YAEpB,kBAAkB,KACjB,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;AACP,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAE,KAAK,CAAC,SAAS,EAAI,CAAA;AAC/B,gBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,EAAA,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA,EACrD,gBAAgB,CACN,CACJ,CACZ;YACA,mBAAmB,KAClB,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA,EACrD,oBAAoB,IACnB,KAAK,CAAC,YAAY,CAAC,oBAAoB,EAAE,EAAE,MAAM,EAAE,CAAC,KAEpD,KAAC,CAAA,aAAA,CAAA,cAAc,IAAC,MAAM,EAAE,MAAM,EAAI,CAAA,CACnC,CACU,CACd,CACM;AACR,QAAA,mBAAmB,KAClB,KAAA,CAAA,aAAA,CAAC,YAAY,EAAC,EAAA,SAAS,EAAE,OAAO,CAAC,eAAe,CAAC,EAAE,QAAQ,EAAE,cAAc,GAAI,CAChF,CACG,EACN;AACJ,EAAE;AAEW,MAAA,iBAAiB,GAAG,KAAK,CAAC,UAAU,CAAC,0BAA0B;;;;"}

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

@@ -1,7 +1,8 @@
-import React, { useReducer, Fragment } from 'react';
+import React, { Fragment } from 'react';
 import { DataGridFilter } from './DataGridFilter.esm.js';
 import classes from './DataGridToolbar.module.scss.esm.js';
 import { Typography } from '../../Typography/Typography.esm.js';
+import { useFiltersReducer } from './useFiltersReducer.esm.js';
 
 /*
  * Copyright 2022 OneWelcome B.V.
@@ -18,40 +19,24 @@ import { Typography } from '../../Typography/Typography.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const filtersReducer = (state, action) => {
-    switch (action.type) {
-        case "add":
-            return { ...state, filters: [...state.filters, { ...action.payload }] };
-        case "edit":
-            return {
-                ...state,
-                filters: [
-                    ...state.filters.map(value => {
-                        if (value.id === action.payload.id) {
-                            return action.payload;
-                        }
-                        return value;
-                    })
-                ]
-            };
-        case "remove":
-            return {
-                ...state,
-                filters: [...state.filters.filter(value => value.id !== action.payload.id)]
-            };
-        case "clear":
-            return { ...state, filters: [] };
-    }
-};
-const DataGridToolbar = ({ columnsMetadata, filterValues, translations, onFilterAdd, onFilterEdit, onFilterDelete, onFiltersClear }) => {
-    const [state, dispatch] = useReducer(filtersReducer, { filters: filterValues || [] });
+const DataGridToolbar = ({ columnsMetadata, filterValues, translations, onFilterAdd, onFilterEdit, onFilterDelete, 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,
-        state.filters.map(filter => (React.createElement(DataGridFilter, { mode: "EDIT", key: filter.id, filter: filter, columnsMetadata: columnsMetadata, dispatch: dispatch, onFilterEdit: onFilterEdit, onFilterDelete: onFilterDelete, tagTranslations: translations === null || translations === void 0 ? void 0 : translations.tag, popoverTranslations: translations === null || translations === void 0 ? void 0 : translations.popover }))),
+        state.filters.map(filter => (React.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"] },
-            React.createElement(DataGridFilter, { mode: "ADD", columnsMetadata: columnsMetadata, dispatch: dispatch, onFilterAdd: onFilterAdd, tagTranslations: translations === null || translations === void 0 ? void 0 : translations.tag, popoverTranslations: translations === null || translations === void 0 ? void 0 : translations.popover }),
+            React.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 }),
             state.filters.length >= 1 && (React.createElement("button", { type: "button", className: classes["clear-button"], onClick: () => {
-                    dispatch({ type: "clear" });
+                    clearFilters();
                     onFiltersClear && onFiltersClear();
                 } },
                 React.createElement(Typography, { variant: "body", className: classes["caption"] }, clearButtonCaption))))));

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, useReducer } from \"react\";\nimport { DataGridFilter } from \"./DataGridFilter\";\nimport classes from \"./DataGridToolbar.module.scss\";\nimport {\n  DataGridColumnMetadata,\n  Filter,\n  FiltersAction,\n  FiltersState,\n  FiltersTranslations\n} from \"./DataGridFilters.interfaces\";\nimport { Typography } from \"../../Typography/Typography\";\n\nexport interface DataGridToolbarProps {\n  columnsMetadata: DataGridColumnMetadata[];\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\nconst filtersReducer = (state: FiltersState, action: FiltersAction): FiltersState => {\n  switch (action.type) {\n    case \"add\":\n      return { ...state, filters: [...state.filters, { ...action.payload }] };\n    case \"edit\":\n      return {\n        ...state,\n        filters: [\n          ...state.filters.map(value => {\n            if (value.id === action.payload.id) {\n              return action.payload;\n            }\n            return value;\n          })\n        ]\n      };\n    case \"remove\":\n      return {\n        ...state,\n        filters: [...state.filters.filter(value => value.id !== action.payload.id)]\n      };\n    case \"clear\":\n      return { ...state, filters: [] };\n  }\n};\n\nexport const DataGridToolbar = ({\n  columnsMetadata,\n  filterValues,\n  translations,\n  onFilterAdd,\n  onFilterEdit,\n  onFilterDelete,\n  onFiltersClear\n}: DataGridToolbarProps) => {\n  const [state, dispatch] = useReducer(filtersReducer, { filters: filterValues || [] });\n  const { clearButtonCaption = \"Clear all filters\" } = translations?.toolbar || {};\n  return (\n    <Fragment>\n      {state.filters.map(filter => (\n        <DataGridFilter\n          mode=\"EDIT\"\n          key={filter.id}\n          filter={filter}\n          columnsMetadata={columnsMetadata}\n          dispatch={dispatch}\n          onFilterEdit={onFilterEdit}\n          onFilterDelete={onFilterDelete}\n          tagTranslations={translations?.tag}\n          popoverTranslations={translations?.popover}\n        />\n      ))}\n      <div className={classes[\"actions-wrapper\"]}>\n        <DataGridFilter\n          mode=\"ADD\"\n          columnsMetadata={columnsMetadata}\n          dispatch={dispatch}\n          onFilterAdd={onFilterAdd}\n          tagTranslations={translations?.tag}\n          popoverTranslations={translations?.popover}\n        />\n        {state.filters.length >= 1 && (\n          <button\n            type=\"button\"\n            className={classes[\"clear-button\"]}\n            onClick={() => {\n              dispatch({ type: \"clear\" });\n              onFiltersClear && onFiltersClear();\n            }}\n          >\n            <Typography variant=\"body\" className={classes[\"caption\"]}>\n              {clearButtonCaption}\n            </Typography>\n          </button>\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 { DataGridColumnMetadata, Filter, FiltersTranslations } from \"./DataGridFilters.interfaces\";\nimport { Typography } from \"../../Typography/Typography\";\nimport { useFiltersReducer } from \"./useFiltersReducer\";\n\nexport interface DataGridToolbarProps {\n  columnsMetadata: DataGridColumnMetadata[];\n  customEditTagContent?: React.ReactElement;\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  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      {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        <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        {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      </div>\n    </Fragment>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAAA;;;;;;;;;;;;;;AAcG;MAoBU,eAAe,GAAG,CAAC,EAC9B,eAAe,EACf,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,YAAY,EACZ,cAAc,EACd,cAAc,EACd,oBAAoB,EACC,KAAI;AACzB,IAAA,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,YAAY,EAAE,GAChE,iBAAiB,CAAC,YAAY,CAAC,CAAC;AAClC,IAAA,MAAM,EAAE,kBAAkB,GAAG,mBAAmB,EAAE,GAAG,CAAA,YAAY,KAAZ,IAAA,IAAA,YAAY,uBAAZ,YAAY,CAAE,OAAO,KAAI,EAAE,CAAC;IACjF,QACE,oBAAC,QAAQ,EAAA,IAAA;AACN,QAAA,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,KACvB,KAAC,CAAA,aAAA,CAAA,cAAc,EACb,EAAA,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,MAAM,CAAC,EAAE,EACd,MAAM,EAAE,MAAM,EACd,eAAe,EAAE,eAAe,EAChC,YAAY,EAAE,MAAM,IAAG;gBACrB,UAAU,CAAC,MAAM,CAAC,CAAC;AACnB,gBAAA,YAAY,IAAI,YAAY,CAAC,MAAM,CAAC,CAAC;AACvC,aAAC,EACD,cAAc,EAAE,EAAE,IAAG;gBACnB,YAAY,CAAC,EAAE,CAAC,CAAC;AACjB,gBAAA,cAAc,IAAI,cAAc,CAAC,EAAE,CAAC,CAAC;aACtC,EACD,eAAe,EAAE,YAAY,KAAA,IAAA,IAAZ,YAAY,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAZ,YAAY,CAAE,GAAG,EAClC,mBAAmB,EAAE,YAAY,KAAZ,IAAA,IAAA,YAAY,KAAZ,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,YAAY,CAAE,OAAO,EAC1C,oBAAoB,EAAE,oBAAoB,EAC1C,CAAA,CACH,CAAC;AACF,QAAA,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,OAAO,CAAC,iBAAiB,CAAC,EAAA;AACxC,YAAA,KAAA,CAAA,aAAA,CAAC,cAAc,EACb,EAAA,IAAI,EAAC,KAAK,EACV,oBAAoB,EAAE,oBAAoB,EAC1C,eAAe,EAAE,eAAe,EAChC,WAAW,EAAE,MAAM,IAAG;oBACpB,SAAS,CAAC,MAAM,CAAC,CAAC;AAClB,oBAAA,WAAW,IAAI,WAAW,CAAC,MAAM,CAAC,CAAC;iBACpC,EACD,eAAe,EAAE,YAAY,aAAZ,YAAY,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAZ,YAAY,CAAE,GAAG,EAClC,mBAAmB,EAAE,YAAY,KAAZ,IAAA,IAAA,YAAY,uBAAZ,YAAY,CAAE,OAAO,EAC1C,CAAA;YACD,KAAK,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,KACxB,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,OAAO,CAAC,cAAc,CAAC,EAClC,OAAO,EAAE,MAAK;AACZ,oBAAA,YAAY,EAAE,CAAC;oBACf,cAAc,IAAI,cAAc,EAAE,CAAC;iBACpC,EAAA;gBAED,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,OAAO,EAAC,MAAM,EAAC,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAA,EACrD,kBAAkB,CACR,CACN,CACV,CACG,CACG,EACX;AACJ;;;;"}

package/dist/esm/DataGrid/DataGridFilters/DataGridToolbar.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 */.DataGridToolbar-module_sr-only__Xirwy{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DataGridToolbar-module_hidden__cjs5x{display:none}.DataGridToolbar-module_slide-in__t3lbD{animation:DataGridToolbar-module_slide-in__t3lbD .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridToolbar-module_slide-in__t3lbD{animation-duration:.1ms}}.DataGridToolbar-module_slide-out__-mEfY{animation:DataGridToolbar-module_slide-out__-mEfY .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridToolbar-module_slide-out__-mEfY{animation-duration:.1ms}}@keyframes DataGridToolbar-module_slide-in__t3lbD{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes DataGridToolbar-module_slide-out__-mEfY{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.DataGridToolbar-module_wrapper__wEHlo{align-items:center;display:flex;flex-wrap:wrap;gap:.5rem;justify-content:flex-start;padding-bottom:1rem;width:100%}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_searchbar__PnKiv{flex-basis:15rem;min-width:7rem}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_actions-wrapper__oEYeN{align-items:center;display:flex;gap:.5rem;justify-content:flex-start}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_clear-button__4Zdc7{background:none;border:none;cursor:pointer}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_clear-button__4Zdc7:focus-visible{border-radius:var(--focus-border-radius);outline:.125rem solid var(--color-focus);outline-offset:0}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_clear-button__4Zdc7 .DataGridToolbar-module_caption__Jf-jO{color:var(--color-primary500);font-size:var(--font-size-data-grid);line-height:var(--data-grid-line-height);margin:0;text-decoration:underline}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkVG9vbGJhci5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFLENBQ0YsdUNBT0Usa0JBQXNCLENBQ3RCLFFBQVMsQ0FMVCxVQUFXLENBRVgsV0FBWSxDQUNaLGVBQWdCLENBRmhCLFNBQVUsQ0FIVixpQkFBa0IsQ0FDbEIsU0FPRixDQUVBLHNDQUNFLFlBQ0YsQ0FFQSx3Q0FDRSw2REFDRixDQUNBLHVDQUNFLHdDQUNFLHVCQUNGLENBQ0YsQ0FFQSx5Q0FDRSw4REFDRixDQUNBLHVDQUNFLHlDQUNFLHVCQUNGLENBQ0YsQ0FFQSxrREFDRSxHQUNFLDJCQUNGLENBQ0EsR0FDRSx1QkFDRixDQUNGLENBQ0EsbURBQ0UsR0FDRSx1QkFDRixDQUNBLEdBQ0UsMkJBQ0YsQ0FDRixDQUNBLHVDQUVFLGtCQUFtQixDQURuQixZQUFhLENBR2IsY0FBZSxDQUNmLFNBQVcsQ0FGWCwwQkFBMkIsQ0FJM0IsbUJBQW9CLENBRHBCLFVBRUYsQ0FDQSxnRkFFRSxnQkFBaUIsQ0FEakIsY0FFRixDQUNBLHNGQUVFLGtCQUFtQixDQURuQixZQUFhLENBR2IsU0FBVyxDQURYLDBCQUVGLENBQ0EsbUZBQ0UsZUFBZ0IsQ0FDaEIsV0FBWSxDQUNaLGNBQ0YsQ0FDQSxpR0FHRSx3Q0FBeUMsQ0FGekMsd0NBQTBDLENBQzFDLGdCQUVGLENBQ0EsMEhBS0UsNkJBQThCLENBSDlCLG9DQUFxQyxDQUNyQyx3Q0FBeUMsQ0FGekMsUUFBUyxDQUdULHlCQUVGIiwiZmlsZSI6IkRhdGFHcmlkVG9vbGJhci5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNyLW9ubHkge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IC0xcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGNsaXA6IHJlY3QoMCwgMCwgMCwgMCk7XG4gIGJvcmRlcjogMDtcbn1cblxuLmhpZGRlbiB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5zbGlkZS1pbiB7XG4gIGFuaW1hdGlvbjogc2xpZGUtaW4gMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG4uc2xpZGUtb3V0IHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1vdXQgMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuQGtleWZyYW1lcyBzbGlkZS1pbiB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtb3V0IHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxufVxuLndyYXBwZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gIGZsZXgtd3JhcDogd3JhcDtcbiAgZ2FwOiAwLjVyZW07XG4gIHdpZHRoOiAxMDAlO1xuICBwYWRkaW5nLWJvdHRvbTogMXJlbTtcbn1cbi53cmFwcGVyIC5zZWFyY2hiYXIge1xuICBtaW4td2lkdGg6IDdyZW07XG4gIGZsZXgtYmFzaXM6IDE1cmVtO1xufVxuLndyYXBwZXIgLmFjdGlvbnMtd3JhcHBlciB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogZmxleC1zdGFydDtcbiAgZ2FwOiAwLjVyZW07XG59XG4ud3JhcHBlciAuY2xlYXItYnV0dG9uIHtcbiAgYmFja2dyb3VuZDogbm9uZTtcbiAgYm9yZGVyOiBub25lO1xuICBjdXJzb3I6IHBvaW50ZXI7XG59XG4ud3JhcHBlciAuY2xlYXItYnV0dG9uOmZvY3VzLXZpc2libGUge1xuICBvdXRsaW5lOiAwLjEyNXJlbSBzb2xpZCB2YXIoLS1jb2xvci1mb2N1cyk7XG4gIG91dGxpbmUtb2Zmc2V0OiAwO1xuICBib3JkZXItcmFkaXVzOiB2YXIoLS1mb2N1cy1ib3JkZXItcmFkaXVzKTtcbn1cbi53cmFwcGVyIC5jbGVhci1idXR0b24gLmNhcHRpb24ge1xuICBtYXJnaW46IDA7XG4gIGZvbnQtc2l6ZTogdmFyKC0tZm9udC1zaXplLWRhdGEtZ3JpZCk7XG4gIGxpbmUtaGVpZ2h0OiB2YXIoLS1kYXRhLWdyaWQtbGluZS1oZWlnaHQpO1xuICB0ZXh0LWRlY29yYXRpb246IHVuZGVybGluZTtcbiAgY29sb3I6IHZhcigtLWNvbG9yLXByaW1hcnk1MDApO1xufSJdfQ== */";
-var classes = {"sr-only":"DataGridToolbar-module_sr-only__Xirwy","hidden":"DataGridToolbar-module_hidden__cjs5x","slide-in":"DataGridToolbar-module_slide-in__t3lbD","slide-out":"DataGridToolbar-module_slide-out__-mEfY","wrapper":"DataGridToolbar-module_wrapper__wEHlo","searchbar":"DataGridToolbar-module_searchbar__PnKiv","actions-wrapper":"DataGridToolbar-module_actions-wrapper__oEYeN","clear-button":"DataGridToolbar-module_clear-button__4Zdc7","caption":"DataGridToolbar-module_caption__Jf-jO"};
+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 */.DataGridToolbar-module_sr-only__Xirwy{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.DataGridToolbar-module_hidden__cjs5x{display:none}.DataGridToolbar-module_slide-in__t3lbD{animation:DataGridToolbar-module_slide-in__t3lbD .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridToolbar-module_slide-in__t3lbD{animation-duration:.1ms}}.DataGridToolbar-module_slide-out__-mEfY{animation:DataGridToolbar-module_slide-out__-mEfY .5s forwards}@media (prefers-reduced-motion:reduce){.DataGridToolbar-module_slide-out__-mEfY{animation-duration:.1ms}}@keyframes DataGridToolbar-module_slide-in__t3lbD{0%{transform:translateY(100vh)}to{transform:translateY(0)}}@keyframes DataGridToolbar-module_slide-out__-mEfY{0%{transform:translateY(0)}to{transform:translateY(100vh)}}.DataGridToolbar-module_wrapper__wEHlo{align-items:flex-start;display:flex;gap:.5rem;justify-content:space-between;padding-bottom:1rem;width:100%}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_filter-section__G4nGc{align-items:center;display:flex;flex-grow:1;flex-wrap:wrap;gap:.5rem;justify-content:flex-start;width:100%}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_filter-section__G4nGc .DataGridToolbar-module_searchbar__PnKiv{flex-basis:15rem;min-width:7rem}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_filter-section__G4nGc .DataGridToolbar-module_actions-wrapper__oEYeN{align-items:center;display:flex;gap:.5rem;justify-content:flex-start}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_filter-section__G4nGc .DataGridToolbar-module_clear-button__4Zdc7{background:none;border:none;cursor:pointer}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_filter-section__G4nGc .DataGridToolbar-module_clear-button__4Zdc7:focus-visible{border-radius:var(--focus-border-radius);outline:.125rem solid var(--color-focus);outline-offset:0}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_filter-section__G4nGc .DataGridToolbar-module_clear-button__4Zdc7 .DataGridToolbar-module_caption__Jf-jO{color:var(--color-primary500);font-size:var(--font-size-data-grid);line-height:var(--data-grid-line-height);margin:0;text-decoration:underline}.DataGridToolbar-module_wrapper__wEHlo .DataGridToolbar-module_button-section__eyZvY{align-items:center;display:flex;flex-shrink:0;gap:.5rem;justify-content:center}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkVG9vbGJhci5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFlQTs7Ozs7Ozs7Ozs7Ozs7RUFjRTtBQUNGOzs7Ozs7Ozs7Ozs7OztFQWNFLENBQ0YsdUNBT0Usa0JBQXNCLENBQ3RCLFFBQVMsQ0FMVCxVQUFXLENBRVgsV0FBWSxDQUNaLGVBQWdCLENBRmhCLFNBQVUsQ0FIVixpQkFBa0IsQ0FDbEIsU0FPRixDQUVBLHNDQUNFLFlBQ0YsQ0FFQSx3Q0FDRSw2REFDRixDQUNBLHVDQUNFLHdDQUNFLHVCQUNGLENBQ0YsQ0FFQSx5Q0FDRSw4REFDRixDQUNBLHVDQUNFLHlDQUNFLHVCQUNGLENBQ0YsQ0FFQSxrREFDRSxHQUNFLDJCQUNGLENBQ0EsR0FDRSx1QkFDRixDQUNGLENBQ0EsbURBQ0UsR0FDRSx1QkFDRixDQUNBLEdBQ0UsMkJBQ0YsQ0FDRixDQUNBLHVDQUVFLHNCQUF1QixDQUR2QixZQUFhLENBR2IsU0FBVyxDQURYLDZCQUE4QixDQUc5QixtQkFBb0IsQ0FEcEIsVUFFRixDQUNBLHFGQUVFLGtCQUFtQixDQURuQixZQUFhLENBTWIsV0FBWSxDQUhaLGNBQWUsQ0FDZixTQUFXLENBRlgsMEJBQTJCLENBRzNCLFVBRUYsQ0FDQSw4SEFFRSxnQkFBaUIsQ0FEakIsY0FFRixDQUNBLG9JQUVFLGtCQUFtQixDQURuQixZQUFhLENBR2IsU0FBVyxDQURYLDBCQUVGLENBQ0EsaUlBQ0UsZUFBZ0IsQ0FDaEIsV0FBWSxDQUNaLGNBQ0YsQ0FDQSwrSUFHRSx3Q0FBeUMsQ0FGekMsd0NBQTBDLENBQzFDLGdCQUVGLENBQ0Esd0tBS0UsNkJBQThCLENBSDlCLG9DQUFxQyxDQUNyQyx3Q0FBeUMsQ0FGekMsUUFBUyxDQUdULHlCQUVGLENBQ0EscUZBSUUsa0JBQW1CLENBRm5CLFlBQWEsQ0FEYixhQUFjLENBSWQsU0FBVyxDQUZYLHNCQUdGIiwiZmlsZSI6IkRhdGFHcmlkVG9vbGJhci5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4vKiFcbiAqIENvcHlyaWdodCAyMDIyIE9uZVdlbGNvbWUgQi5WLlxuICpcbiAqICAgIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiAgICB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiAgICBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogICAgVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogICAgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogICAgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiAgICBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiAgICBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqL1xuLnNyLW9ubHkge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHdpZHRoOiAxcHg7XG4gIGhlaWdodDogMXB4O1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IC0xcHg7XG4gIG92ZXJmbG93OiBoaWRkZW47XG4gIGNsaXA6IHJlY3QoMCwgMCwgMCwgMCk7XG4gIGJvcmRlcjogMDtcbn1cblxuLmhpZGRlbiB7XG4gIGRpc3BsYXk6IG5vbmU7XG59XG5cbi5zbGlkZS1pbiB7XG4gIGFuaW1hdGlvbjogc2xpZGUtaW4gMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1pbiB7XG4gICAgYW5pbWF0aW9uLWR1cmF0aW9uOiAwLjFtcztcbiAgfVxufVxuXG4uc2xpZGUtb3V0IHtcbiAgYW5pbWF0aW9uOiBzbGlkZS1vdXQgMC41cyBmb3J3YXJkcztcbn1cbkBtZWRpYSAocHJlZmVycy1yZWR1Y2VkLW1vdGlvbjogcmVkdWNlKSB7XG4gIC5zbGlkZS1vdXQge1xuICAgIGFuaW1hdGlvbi1kdXJhdGlvbjogMC4xbXM7XG4gIH1cbn1cblxuQGtleWZyYW1lcyBzbGlkZS1pbiB7XG4gIDAlIHtcbiAgICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwdmgpO1xuICB9XG4gIDEwMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbn1cbkBrZXlmcmFtZXMgc2xpZGUtb3V0IHtcbiAgMCUge1xuICAgIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwJSk7XG4gIH1cbiAgMTAwJSB7XG4gICAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMHZoKTtcbiAgfVxufVxuLndyYXBwZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogZmxleC1zdGFydDtcbiAganVzdGlmeS1jb250ZW50OiBzcGFjZS1iZXR3ZWVuO1xuICBnYXA6IDAuNXJlbTtcbiAgd2lkdGg6IDEwMCU7XG4gIHBhZGRpbmctYm90dG9tOiAxcmVtO1xufVxuLndyYXBwZXIgLmZpbHRlci1zZWN0aW9uIHtcbiAgZGlzcGxheTogZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAganVzdGlmeS1jb250ZW50OiBmbGV4LXN0YXJ0O1xuICBmbGV4LXdyYXA6IHdyYXA7XG4gIGdhcDogMC41cmVtO1xuICB3aWR0aDogMTAwJTtcbiAgZmxleC1ncm93OiAxO1xufVxuLndyYXBwZXIgLmZpbHRlci1zZWN0aW9uIC5zZWFyY2hiYXIge1xuICBtaW4td2lkdGg6IDdyZW07XG4gIGZsZXgtYmFzaXM6IDE1cmVtO1xufVxuLndyYXBwZXIgLmZpbHRlci1zZWN0aW9uIC5hY3Rpb25zLXdyYXBwZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtc3RhcnQ7XG4gIGdhcDogMC41cmVtO1xufVxuLndyYXBwZXIgLmZpbHRlci1zZWN0aW9uIC5jbGVhci1idXR0b24ge1xuICBiYWNrZ3JvdW5kOiBub25lO1xuICBib3JkZXI6IG5vbmU7XG4gIGN1cnNvcjogcG9pbnRlcjtcbn1cbi53cmFwcGVyIC5maWx0ZXItc2VjdGlvbiAuY2xlYXItYnV0dG9uOmZvY3VzLXZpc2libGUge1xuICBvdXRsaW5lOiAwLjEyNXJlbSBzb2xpZCB2YXIoLS1jb2xvci1mb2N1cyk7XG4gIG91dGxpbmUtb2Zmc2V0OiAwO1xuICBib3JkZXItcmFkaXVzOiB2YXIoLS1mb2N1cy1ib3JkZXItcmFkaXVzKTtcbn1cbi53cmFwcGVyIC5maWx0ZXItc2VjdGlvbiAuY2xlYXItYnV0dG9uIC5jYXB0aW9uIHtcbiAgbWFyZ2luOiAwO1xuICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZS1kYXRhLWdyaWQpO1xuICBsaW5lLWhlaWdodDogdmFyKC0tZGF0YS1ncmlkLWxpbmUtaGVpZ2h0KTtcbiAgdGV4dC1kZWNvcmF0aW9uOiB1bmRlcmxpbmU7XG4gIGNvbG9yOiB2YXIoLS1jb2xvci1wcmltYXJ5NTAwKTtcbn1cbi53cmFwcGVyIC5idXR0b24tc2VjdGlvbiB7XG4gIGZsZXgtc2hyaW5rOiAwO1xuICBkaXNwbGF5OiBmbGV4O1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgZ2FwOiAwLjVyZW07XG59Il19 */";
+var classes = {"sr-only":"DataGridToolbar-module_sr-only__Xirwy","hidden":"DataGridToolbar-module_hidden__cjs5x","slide-in":"DataGridToolbar-module_slide-in__t3lbD","slide-out":"DataGridToolbar-module_slide-out__-mEfY","wrapper":"DataGridToolbar-module_wrapper__wEHlo","filter-section":"DataGridToolbar-module_filter-section__G4nGc","searchbar":"DataGridToolbar-module_searchbar__PnKiv","actions-wrapper":"DataGridToolbar-module_actions-wrapper__oEYeN","clear-button":"DataGridToolbar-module_clear-button__4Zdc7","caption":"DataGridToolbar-module_caption__Jf-jO","button-section":"DataGridToolbar-module_button-section__eyZvY"};
 styleInject(css_248z);
 
 export { classes as default };

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

@@ -16,8 +16,10 @@ import classes from './DataGridToolbar.module.scss.esm.js';
  *    See the License for the specific language governing permissions and
  *    limitations under the License.
  */
-const DataGridToolbarWrapperComponent = ({ children, ...rest }, ref) => {
-    return (React.createElement("div", { ref: ref, className: classes["wrapper"], ...rest }, children));
+const DataGridToolbarWrapperComponent = ({ children, filters, buttons, ...rest }, ref) => {
+    return (React.createElement("div", { ref: ref, className: classes["wrapper"], ...rest },
+        React.createElement("div", { className: classes["filter-section"] }, filters),
+        React.createElement("div", { className: classes["button-section"] }, buttons)));
 };
 const DataGridToolbarWrapper = React.forwardRef(DataGridToolbarWrapperComponent);
 

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridToolbarWrapper.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridToolbarWrapper.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 } from \"react\";\nimport classes from \"./DataGridToolbar.module.scss\";\n\ntype Props = ComponentPropsWithRef<\"div\">;\n\nexport const DataGridToolbarWrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, ...rest },\n  ref\n) => {\n  return (\n    <div ref={ref} className={classes[\"wrapper\"]} {...rest}>\n      {children}\n    </div>\n  );\n};\n\nexport const DataGridToolbarWrapper = React.forwardRef(DataGridToolbarWrapperComponent);\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAOI,MAAM,+BAA+B,GAAoD,CAC9F,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EACrB,GAAG,KACD;AACF,IAAA,QACE,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,EAAM,GAAA,IAAI,IACnD,QAAQ,CACL,EACN;AACJ,EAAE;AAEW,MAAA,sBAAsB,GAAG,KAAK,CAAC,UAAU,CAAC,+BAA+B;;;;"}
+{"version":3,"file":"DataGridToolbarWrapper.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/DataGridToolbarWrapper.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, ReactElement } from \"react\";\nimport classes from \"./DataGridToolbar.module.scss\";\nimport { Button } from \"../../Button/Button\";\nimport { ButtonProps } from \"../../..\";\ninterface Props extends ComponentPropsWithRef<\"div\"> {\n  filters?: React.JSX.Element;\n  buttons?: ReactElement<ButtonProps, typeof Button> | ReactElement<ButtonProps, typeof Button>[];\n}\n\nexport const DataGridToolbarWrapperComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { children, filters, buttons, ...rest },\n  ref\n) => {\n  return (\n    <div ref={ref} className={classes[\"wrapper\"]} {...rest}>\n      <div className={classes[\"filter-section\"]}>{filters}</div>\n      <div className={classes[\"button-section\"]}>{buttons}</div>\n    </div>\n  );\n};\n\nexport const DataGridToolbarWrapper = React.forwardRef(DataGridToolbarWrapperComponent);\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;AAcG;AAWU,MAAA,+BAA+B,GAAoD,CAC9F,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EACvC,GAAG,KACD;AACF,IAAA,QACE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,CAAC,KAAM,IAAI,EAAA;QACpD,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAA,EAAG,OAAO,CAAO;QAC1D,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,gBAAgB,CAAC,EAAA,EAAG,OAAO,CAAO,CACtD,EACN;AACJ,EAAE;AAEW,MAAA,sBAAsB,GAAG,KAAK,CAAC,UAAU,CAAC,+BAA+B;;;;"}

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

@@ -0,0 +1,59 @@
+import { useReducer } from 'react';
+
+/*
+ * Copyright 2022 OneWelcome B.V.
+ *
+ *    Licensed under the Apache License, Version 2.0 (the "License");
+ *    you may not use this file except in compliance with the License.
+ *    You may obtain a copy of the License at
+ *
+ *        http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *    Unless required by applicable law or agreed to in writing, software
+ *    distributed under the License is distributed on an "AS IS" BASIS,
+ *    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *    See the License for the specific language governing permissions and
+ *    limitations under the License.
+ */
+const useFiltersReducer = (filterValues) => {
+    const filtersReducer = (state, action) => {
+        switch (action.type) {
+            case "add":
+                return { ...state, filters: [...state.filters, { ...action.payload }] };
+            case "edit":
+                return {
+                    ...state,
+                    filters: [
+                        ...state.filters.map(value => {
+                            if (value.id === action.payload.id) {
+                                return action.payload;
+                            }
+                            return value;
+                        })
+                    ]
+                };
+            case "remove":
+                return {
+                    ...state,
+                    filters: [...state.filters.filter(value => value.id !== action.payload.id)]
+                };
+            case "clear":
+                return { ...state, filters: [] };
+        }
+    };
+    const [state, dispatch] = useReducer(filtersReducer, { filters: filterValues || [] });
+    const addFilter = (filter) => dispatch({
+        type: "add",
+        payload: filter
+    });
+    const editFilter = (filter) => dispatch({
+        type: "edit",
+        payload: filter
+    });
+    const deleteFilter = (id) => dispatch({ type: "remove", payload: { id } });
+    const clearFilters = () => dispatch({ type: "clear" });
+    return { state, addFilter, deleteFilter, editFilter, clearFilters };
+};
+
+export { useFiltersReducer };
+//# sourceMappingURL=useFiltersReducer.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useFiltersReducer.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridFilters/useFiltersReducer.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 { useReducer } from \"react\";\nimport { Filter, FiltersAction, FiltersState } from \"./DataGridFilters.interfaces\";\n\nexport const useFiltersReducer = (filterValues: Filter[] | undefined) => {\n  const filtersReducer = (state: FiltersState, action: FiltersAction): FiltersState => {\n    switch (action.type) {\n      case \"add\":\n        return { ...state, filters: [...state.filters, { ...action.payload }] };\n      case \"edit\":\n        return {\n          ...state,\n          filters: [\n            ...state.filters.map(value => {\n              if (value.id === action.payload.id) {\n                return action.payload;\n              }\n              return value;\n            })\n          ]\n        };\n      case \"remove\":\n        return {\n          ...state,\n          filters: [...state.filters.filter(value => value.id !== action.payload.id)]\n        };\n      case \"clear\":\n        return { ...state, filters: [] };\n    }\n  };\n\n  const [state, dispatch] = useReducer(filtersReducer, { filters: filterValues || [] });\n\n  const addFilter = (filter: Filter) =>\n    dispatch({\n      type: \"add\",\n      payload: filter\n    });\n\n  const editFilter = (filter: Filter) =>\n    dispatch({\n      type: \"edit\",\n      payload: filter\n    });\n\n  const deleteFilter = (id: string) => dispatch({ type: \"remove\", payload: { id } });\n\n  const clearFilters = () => dispatch({ type: \"clear\" });\n\n  return { state, addFilter, deleteFilter, editFilter, clearFilters };\n};\n"],"names":[],"mappings":";;AAAA;;;;;;;;;;;;;;AAcG;AAKU,MAAA,iBAAiB,GAAG,CAAC,YAAkC,KAAI;AACtE,IAAA,MAAM,cAAc,GAAG,CAAC,KAAmB,EAAE,MAAqB,KAAkB;AAClF,QAAA,QAAQ,MAAM,CAAC,IAAI;AACjB,YAAA,KAAK,KAAK;gBACR,OAAO,EAAE,GAAG,KAAK,EAAE,OAAO,EAAE,CAAC,GAAG,KAAK,CAAC,OAAO,EAAE,EAAE,GAAG,MAAM,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC;AAC1E,YAAA,KAAK,MAAM;gBACT,OAAO;AACL,oBAAA,GAAG,KAAK;AACR,oBAAA,OAAO,EAAE;wBACP,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,IAAG;4BAC3B,IAAI,KAAK,CAAC,EAAE,KAAK,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE;gCAClC,OAAO,MAAM,CAAC,OAAO,CAAC;6BACvB;AACD,4BAAA,OAAO,KAAK,CAAC;AACf,yBAAC,CAAC;AACH,qBAAA;iBACF,CAAC;AACJ,YAAA,KAAK,QAAQ;gBACX,OAAO;AACL,oBAAA,GAAG,KAAK;oBACR,OAAO,EAAE,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,EAAE,KAAK,MAAM,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;iBAC5E,CAAC;AACJ,YAAA,KAAK,OAAO;gBACV,OAAO,EAAE,GAAG,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC;SACpC;AACH,KAAC,CAAC;AAEF,IAAA,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,cAAc,EAAE,EAAE,OAAO,EAAE,YAAY,IAAI,EAAE,EAAE,CAAC,CAAC;IAEtF,MAAM,SAAS,GAAG,CAAC,MAAc,KAC/B,QAAQ,CAAC;AACP,QAAA,IAAI,EAAE,KAAK;AACX,QAAA,OAAO,EAAE,MAAM;AAChB,KAAA,CAAC,CAAC;IAEL,MAAM,UAAU,GAAG,CAAC,MAAc,KAChC,QAAQ,CAAC;AACP,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,OAAO,EAAE,MAAM;AAChB,KAAA,CAAC,CAAC;IAEL,MAAM,YAAY,GAAG,CAAC,EAAU,KAAK,QAAQ,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;AAEnF,IAAA,MAAM,YAAY,GAAG,MAAM,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC,CAAC;IAEvD,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC;AACtE;;;;"}

package/dist/esm/DataGrid/DataGridHeader/DataGridHeaderCell.esm.js

@@ -26,15 +26,13 @@ const DataGridHeaderCellComponent = ({ headline, name, disableSorting, activeSor
         onSort === null || onSort === void 0 ? void 0 : onSort(name);
     };
     const sortingIndicator = () => {
-        const getSortingIndicatorClasses = (direction) => {
+        const getSortingIndicatorClasses = () => {
             const sortingIndicatorClasses = [classes["indicator"]];
             activeSortDirection &&
-                sortingIndicatorClasses.push(activeSortDirection === direction ? classes["active"] : classes["hidden"]);
+                sortingIndicatorClasses.push(activeSortDirection === "ASC" ? classes["ascending"] : classes["descending"]);
             return sortingIndicatorClasses;
         };
-        return (React.createElement(Fragment, null,
-            React.createElement(Icon, { className: getSortingIndicatorClasses("ASC").join(" "), icon: Icons.TriangleUp }),
-            React.createElement(Icon, { className: getSortingIndicatorClasses("DESC").join(" "), icon: Icons.TriangleDown })));
+        return React.createElement(Icon, { className: getSortingIndicatorClasses().join(" "), icon: Icons.ArrowUp });
     };
     const innerContent = (React.createElement(Fragment, null,
         React.createElement("span", { className: classes["headline"] }, headline),

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

@@ -1 +1 @@
-{"version":3,"file":"DataGridHeaderCell.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridHeader/DataGridHeaderCell.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, { ForwardRefRenderFunction, ComponentPropsWithRef, Fragment } from \"react\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport { Direction } from \"../datagrid.interfaces\";\nimport classes from \"./DataGridHeaderCell.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"th\"> {\n  headline: string;\n  name: string;\n  disableSorting?: boolean;\n  activeSortDirection?: Direction;\n  onSort?: (name: string) => void;\n}\n\nconst ariaSortMapping = {\n  ASC: \"ascending\",\n  DESC: \"descending\"\n} as const;\n\nconst DataGridHeaderCellComponent: ForwardRefRenderFunction<HTMLTableCellElement, Props> = (\n  { headline, name, disableSorting, activeSortDirection, onSort, ...rest }: Props,\n  ref\n) => {\n  const onCellClick = () => {\n    onSort?.(name);\n  };\n\n  const sortingIndicator = () => {\n    const getSortingIndicatorClasses = (direction: Direction) => {\n      const sortingIndicatorClasses = [classes[\"indicator\"]];\n      activeSortDirection &&\n        sortingIndicatorClasses.push(\n          activeSortDirection === direction ? classes[\"active\"] : classes[\"hidden\"]\n        );\n      return sortingIndicatorClasses;\n    };\n\n    return (\n      <Fragment>\n        <Icon className={getSortingIndicatorClasses(\"ASC\").join(\" \")} icon={Icons.TriangleUp} />\n        <Icon className={getSortingIndicatorClasses(\"DESC\").join(\" \")} icon={Icons.TriangleDown} />\n      </Fragment>\n    );\n  };\n\n  const innerContent = (\n    <Fragment>\n      <span className={classes[\"headline\"]}>{headline}</span>\n      {!disableSorting && (\n        <div className={classes[\"sorting-indicator-container\"]}>{sortingIndicator()}</div>\n      )}\n    </Fragment>\n  );\n\n  return (\n    <th\n      {...rest}\n      ref={ref}\n      className={classes[\"header-cell\"]}\n      aria-sort={activeSortDirection && ariaSortMapping[activeSortDirection]}\n    >\n      {disableSorting ? (\n        <div key={name}>{innerContent}</div>\n      ) : (\n        <button key={name} onClick={onCellClick}>\n          {innerContent}\n        </button>\n      )}\n    </th>\n  );\n};\n\nexport const DataGridHeaderCell = React.forwardRef(DataGridHeaderCellComponent);\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAeH,MAAM,eAAe,GAAG;AACtB,IAAA,GAAG,EAAE,WAAW;AAChB,IAAA,IAAI,EAAE,YAAY;CACV,CAAC;AAEX,MAAM,2BAA2B,GAA0D,CACzF,EAAE,QAAQ,EAAE,IAAI,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,EAAE,GAAG,IAAI,EAAS,EAC/E,GAAG,KACD;IACF,MAAM,WAAW,GAAG,MAAK;AACvB,QAAA,MAAM,aAAN,MAAM,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAN,MAAM,CAAG,IAAI,CAAC,CAAC;AACjB,KAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;AAC5B,QAAA,MAAM,0BAA0B,GAAG,CAAC,SAAoB,KAAI;YAC1D,MAAM,uBAAuB,GAAG,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;YACvD,mBAAmB;gBACjB,uBAAuB,CAAC,IAAI,CAC1B,mBAAmB,KAAK,SAAS,GAAG,OAAO,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,QAAQ,CAAC,CAC1E,CAAC;AACJ,YAAA,OAAO,uBAAuB,CAAC;AACjC,SAAC,CAAC;QAEF,QACE,oBAAC,QAAQ,EAAA,IAAA;AACP,YAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,SAAS,EAAE,0BAA0B,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,UAAU,EAAI,CAAA;YACxF,KAAC,CAAA,aAAA,CAAA,IAAI,IAAC,SAAS,EAAE,0BAA0B,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,YAAY,EAAA,CAAI,CAClF,EACX;AACJ,KAAC,CAAC;AAEF,IAAA,MAAM,YAAY,IAChB,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;QACP,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,UAAU,CAAC,EAAA,EAAG,QAAQ,CAAQ;AACtD,QAAA,CAAC,cAAc,KACd,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,6BAA6B,CAAC,IAAG,gBAAgB,EAAE,CAAO,CACnF,CACQ,CACZ,CAAC;IAEF,QACE,KACM,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAA,IAAI,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAAC,aAAa,CAAC,EAAA,WAAA,EACtB,mBAAmB,IAAI,eAAe,CAAC,mBAAmB,CAAC,EAAA,EAErE,cAAc,IACb,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,IAAI,EAAG,EAAA,YAAY,CAAO,KAEpC,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EACpC,EAAA,YAAY,CACN,CACV,CACE,EACL;AACJ,CAAC,CAAC;AAEW,MAAA,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAC,2BAA2B;;;;"}
+{"version":3,"file":"DataGridHeaderCell.esm.js","sources":["../../../../../../src/components/DataGrid/DataGridHeader/DataGridHeaderCell.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, { ForwardRefRenderFunction, ComponentPropsWithRef, Fragment } from \"react\";\nimport { Icon, Icons } from \"../../Icon/Icon\";\nimport { Direction } from \"../datagrid.interfaces\";\nimport classes from \"./DataGridHeaderCell.module.scss\";\n\nexport interface Props extends ComponentPropsWithRef<\"th\"> {\n  headline: string;\n  name: string;\n  disableSorting?: boolean;\n  activeSortDirection?: Direction;\n  onSort?: (name: string) => void;\n}\n\nconst ariaSortMapping = {\n  ASC: \"ascending\",\n  DESC: \"descending\"\n} as const;\n\nconst DataGridHeaderCellComponent: ForwardRefRenderFunction<HTMLTableCellElement, Props> = (\n  { headline, name, disableSorting, activeSortDirection, onSort, ...rest }: Props,\n  ref\n) => {\n  const onCellClick = () => {\n    onSort?.(name);\n  };\n\n  const sortingIndicator = () => {\n    const getSortingIndicatorClasses = () => {\n      const sortingIndicatorClasses = [classes[\"indicator\"]];\n      activeSortDirection &&\n        sortingIndicatorClasses.push(\n          activeSortDirection === \"ASC\" ? classes[\"ascending\"] : classes[\"descending\"]\n        );\n      return sortingIndicatorClasses;\n    };\n\n    return <Icon className={getSortingIndicatorClasses().join(\" \")} icon={Icons.ArrowUp} />;\n  };\n\n  const innerContent = (\n    <Fragment>\n      <span className={classes[\"headline\"]}>{headline}</span>\n      {!disableSorting && (\n        <div className={classes[\"sorting-indicator-container\"]}>{sortingIndicator()}</div>\n      )}\n    </Fragment>\n  );\n\n  return (\n    <th\n      {...rest}\n      ref={ref}\n      className={classes[\"header-cell\"]}\n      aria-sort={activeSortDirection && ariaSortMapping[activeSortDirection]}\n    >\n      {disableSorting ? (\n        <div key={name}>{innerContent}</div>\n      ) : (\n        <button key={name} onClick={onCellClick}>\n          {innerContent}\n        </button>\n      )}\n    </th>\n  );\n};\n\nexport const DataGridHeaderCell = React.forwardRef(DataGridHeaderCellComponent);\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;AAcG;AAeH,MAAM,eAAe,GAAG;AACtB,IAAA,GAAG,EAAE,WAAW;AAChB,IAAA,IAAI,EAAE,YAAY;CACV,CAAC;AAEX,MAAM,2BAA2B,GAA0D,CACzF,EAAE,QAAQ,EAAE,IAAI,EAAE,cAAc,EAAE,mBAAmB,EAAE,MAAM,EAAE,GAAG,IAAI,EAAS,EAC/E,GAAG,KACD;IACF,MAAM,WAAW,GAAG,MAAK;AACvB,QAAA,MAAM,aAAN,MAAM,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAN,MAAM,CAAG,IAAI,CAAC,CAAC;AACjB,KAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;QAC5B,MAAM,0BAA0B,GAAG,MAAK;YACtC,MAAM,uBAAuB,GAAG,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,CAAC;YACvD,mBAAmB;gBACjB,uBAAuB,CAAC,IAAI,CAC1B,mBAAmB,KAAK,KAAK,GAAG,OAAO,CAAC,WAAW,CAAC,GAAG,OAAO,CAAC,YAAY,CAAC,CAC7E,CAAC;AACJ,YAAA,OAAO,uBAAuB,CAAC;AACjC,SAAC,CAAC;AAEF,QAAA,OAAO,oBAAC,IAAI,EAAA,EAAC,SAAS,EAAE,0BAA0B,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,OAAO,GAAI,CAAC;AAC1F,KAAC,CAAC;AAEF,IAAA,MAAM,YAAY,IAChB,KAAA,CAAA,aAAA,CAAC,QAAQ,EAAA,IAAA;QACP,KAAM,CAAA,aAAA,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,UAAU,CAAC,EAAA,EAAG,QAAQ,CAAQ;AACtD,QAAA,CAAC,cAAc,KACd,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,OAAO,CAAC,6BAA6B,CAAC,IAAG,gBAAgB,EAAE,CAAO,CACnF,CACQ,CACZ,CAAC;IAEF,QACE,KACM,CAAA,aAAA,CAAA,IAAA,EAAA,EAAA,GAAA,IAAI,EACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,CAAC,aAAa,CAAC,EAAA,WAAA,EACtB,mBAAmB,IAAI,eAAe,CAAC,mBAAmB,CAAC,EAAA,EAErE,cAAc,IACb,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,IAAI,EAAG,EAAA,YAAY,CAAO,KAEpC,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAQ,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EACpC,EAAA,YAAY,CACN,CACV,CACE,EACL;AACJ,CAAC,CAAC;AAEW,MAAA,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAC,2BAA2B;;;;"}

package/dist/esm/DataGrid/DataGridHeader/DataGridHeaderCell.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 */.DataGridHeaderCell-module_header-cell__proHM{font-weight:400;padding:.625rem .75rem;text-align:left}.DataGridHeaderCell-module_header-cell__proHM:first-child{padding-left:1rem}.DataGridHeaderCell-module_header-cell__proHM:last-child{padding-right:1rem}.DataGridHeaderCell-module_header-cell__proHM>*{display:inline-flex}.DataGridHeaderCell-module_header-cell__proHM>button{align-items:center;background:none;border:0;cursor:pointer;display:inline-flex;margin:0;padding:0}.DataGridHeaderCell-module_headline__cmx1r{color:var(--default);font-family:var(--font-family);font-size:var(--font-size-data-grid);font-weight:700;line-height:var(--data-grid-line-height)}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI{display:flex;flex-direction:column;justify-content:center;padding-left:.5rem}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI>*{font-size:.625rem}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k{color:var(--greyed-out)}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k.DataGridHeaderCell-module_active__vg3wV{color:var(--color-primary)}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k.DataGridHeaderCell-module_hidden__MAOV3{visibility:hidden}@media only screen and (min-width:50em){.DataGridHeaderCell-module_header-cell__proHM:first-child{padding-left:1.25rem}.DataGridHeaderCell-module_header-cell__proHM:last-child{padding-right:1.25rem}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkSGVhZGVyQ2VsbC5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLDhDQUNFLGVBQW1CLENBRW5CLHNCQUF5QixDQUR6QixlQUVGLENBQ0EsMERBQ0UsaUJBQ0YsQ0FDQSx5REFDRSxrQkFDRixDQUNBLGdEQUNFLG1CQUNGLENBQ0EscURBT0Usa0JBQW1CLENBSG5CLGVBQWdCLENBRGhCLFFBQVMsQ0FFVCxjQUFlLENBQ2YsbUJBQW9CLENBSnBCLFFBQVMsQ0FEVCxTQU9GLENBRUEsMkNBS0Usb0JBQXFCLENBSnJCLDhCQUErQixDQUMvQixvQ0FBcUMsQ0FFckMsZUFBZ0IsQ0FEaEIsd0NBR0YsQ0FFQSw4REFDRSxZQUFhLENBQ2IscUJBQXNCLENBRXRCLHNCQUF1QixDQUR2QixrQkFFRixDQUNBLGdFQUNFLGlCQUNGLENBQ0EsMEdBQ0UsdUJBQ0YsQ0FDQSxrSkFDRSwwQkFDRixDQUNBLGtKQUNFLGlCQUNGLENBRUEsd0NBQ0UsMERBQ0Usb0JBQ0YsQ0FDQSx5REFDRSxxQkFDRixDQUNGIiwiZmlsZSI6IkRhdGFHcmlkSGVhZGVyQ2VsbC5tb2R1bGUuc2NzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qIVxuICogQ29weXJpZ2h0IDIwMjIgT25lV2VsY29tZSBCLlYuXG4gKlxuICogICAgTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqICAgIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqICAgIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiAgICBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiAgICBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiAgICBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqICAgIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqICAgIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG4uaGVhZGVyLWNlbGwge1xuICBmb250LXdlaWdodDogbm9ybWFsO1xuICB0ZXh0LWFsaWduOiBsZWZ0O1xuICBwYWRkaW5nOiAwLjYyNXJlbSAwLjc1cmVtO1xufVxuLmhlYWRlci1jZWxsOmZpcnN0LWNoaWxkIHtcbiAgcGFkZGluZy1sZWZ0OiAxcmVtO1xufVxuLmhlYWRlci1jZWxsOmxhc3QtY2hpbGQge1xuICBwYWRkaW5nLXJpZ2h0OiAxcmVtO1xufVxuLmhlYWRlci1jZWxsID4gKiB7XG4gIGRpc3BsYXk6IGlubGluZS1mbGV4O1xufVxuLmhlYWRlci1jZWxsID4gYnV0dG9uIHtcbiAgcGFkZGluZzogMDtcbiAgbWFyZ2luOiAwO1xuICBib3JkZXI6IDA7XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGN1cnNvcjogcG9pbnRlcjtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG59XG5cbi5oZWFkbGluZSB7XG4gIGZvbnQtZmFtaWx5OiB2YXIoLS1mb250LWZhbWlseSk7XG4gIGZvbnQtc2l6ZTogdmFyKC0tZm9udC1zaXplLWRhdGEtZ3JpZCk7XG4gIGxpbmUtaGVpZ2h0OiB2YXIoLS1kYXRhLWdyaWQtbGluZS1oZWlnaHQpO1xuICBmb250LXdlaWdodDogNzAwO1xuICBjb2xvcjogdmFyKC0tZGVmYXVsdCk7XG59XG5cbi5zb3J0aW5nLWluZGljYXRvci1jb250YWluZXIge1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBwYWRkaW5nLWxlZnQ6IDAuNXJlbTtcbiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG59XG4uc29ydGluZy1pbmRpY2F0b3ItY29udGFpbmVyID4gKiB7XG4gIGZvbnQtc2l6ZTogMC42MjVyZW07XG59XG4uc29ydGluZy1pbmRpY2F0b3ItY29udGFpbmVyIC5pbmRpY2F0b3Ige1xuICBjb2xvcjogdmFyKC0tZ3JleWVkLW91dCk7XG59XG4uc29ydGluZy1pbmRpY2F0b3ItY29udGFpbmVyIC5pbmRpY2F0b3IuYWN0aXZlIHtcbiAgY29sb3I6IHZhcigtLWNvbG9yLXByaW1hcnkpO1xufVxuLnNvcnRpbmctaW5kaWNhdG9yLWNvbnRhaW5lciAuaW5kaWNhdG9yLmhpZGRlbiB7XG4gIHZpc2liaWxpdHk6IGhpZGRlbjtcbn1cblxuQG1lZGlhIG9ubHkgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA1MGVtKSB7XG4gIC5oZWFkZXItY2VsbDpmaXJzdC1jaGlsZCB7XG4gICAgcGFkZGluZy1sZWZ0OiAxLjI1cmVtO1xuICB9XG4gIC5oZWFkZXItY2VsbDpsYXN0LWNoaWxkIHtcbiAgICBwYWRkaW5nLXJpZ2h0OiAxLjI1cmVtO1xuICB9XG59Il19 */";
-var classes = {"header-cell":"DataGridHeaderCell-module_header-cell__proHM","headline":"DataGridHeaderCell-module_headline__cmx1r","sorting-indicator-container":"DataGridHeaderCell-module_sorting-indicator-container__G5sPI","indicator":"DataGridHeaderCell-module_indicator__xaM3k","active":"DataGridHeaderCell-module_active__vg3wV","hidden":"DataGridHeaderCell-module_hidden__MAOV3"};
+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 */.DataGridHeaderCell-module_header-cell__proHM{font-weight:400;padding:.625rem .75rem;text-align:left}.DataGridHeaderCell-module_header-cell__proHM:first-child{padding-left:1rem}.DataGridHeaderCell-module_header-cell__proHM:last-child{padding-right:1rem}.DataGridHeaderCell-module_header-cell__proHM>*{display:inline-flex}.DataGridHeaderCell-module_header-cell__proHM>button{align-items:center;background:none;border:0;cursor:pointer;display:inline-flex;margin:0;padding:0}.DataGridHeaderCell-module_headline__cmx1r{color:var(--default);font-family:var(--font-family);font-size:var(--font-size-data-grid);font-weight:700;line-height:var(--data-grid-line-height)}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI{display:flex;flex-direction:column;justify-content:center;padding-left:.5rem}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI>*{font-size:.625rem}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k{color:var(--greyed-out);transform:rotate(0deg);transition:transform .2s ease-in-out}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k.DataGridHeaderCell-module_ascending__MkLgD{color:var(--color-primary)}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k.DataGridHeaderCell-module_descending__ML1AI{color:var(--color-primary);transform:rotate(180deg)}.DataGridHeaderCell-module_sorting-indicator-container__G5sPI .DataGridHeaderCell-module_indicator__xaM3k.DataGridHeaderCell-module_hidden__MAOV3{visibility:hidden}@media only screen and (min-width:50em){.DataGridHeaderCell-module_header-cell__proHM:first-child{padding-left:1.25rem}.DataGridHeaderCell-module_header-cell__proHM:last-child{padding-right:1.25rem}}\n/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRhdGFHcmlkSGVhZGVyQ2VsbC5tb2R1bGUuc2NzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7RUFjRSxDQUNGLDhDQUNFLGVBQW1CLENBRW5CLHNCQUF5QixDQUR6QixlQUVGLENBQ0EsMERBQ0UsaUJBQ0YsQ0FDQSx5REFDRSxrQkFDRixDQUNBLGdEQUNFLG1CQUNGLENBQ0EscURBT0Usa0JBQW1CLENBSG5CLGVBQWdCLENBRGhCLFFBQVMsQ0FFVCxjQUFlLENBQ2YsbUJBQW9CLENBSnBCLFFBQVMsQ0FEVCxTQU9GLENBRUEsMkNBS0Usb0JBQXFCLENBSnJCLDhCQUErQixDQUMvQixvQ0FBcUMsQ0FFckMsZUFBZ0IsQ0FEaEIsd0NBR0YsQ0FFQSw4REFDRSxZQUFhLENBQ2IscUJBQXNCLENBRXRCLHNCQUF1QixDQUR2QixrQkFFRixDQUNBLGdFQUNFLGlCQUNGLENBQ0EsMEdBQ0UsdUJBQXdCLENBRXhCLHNCQUF1QixDQUR2QixvQ0FFRixDQUNBLHFKQUNFLDBCQUNGLENBQ0Esc0pBQ0UsMEJBQTJCLENBQzNCLHdCQUNGLENBQ0Esa0pBQ0UsaUJBQ0YsQ0FFQSx3Q0FDRSwwREFDRSxvQkFDRixDQUNBLHlEQUNFLHFCQUNGLENBQ0YiLCJmaWxlIjoiRGF0YUdyaWRIZWFkZXJDZWxsLm1vZHVsZS5zY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLyohXG4gKiBDb3B5cmlnaHQgMjAyMiBPbmVXZWxjb21lIEIuVi5cbiAqXG4gKiAgICBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogICAgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogICAgWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqICAgIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqICAgIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqICAgIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogICAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogICAgbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKi9cbi5oZWFkZXItY2VsbCB7XG4gIGZvbnQtd2VpZ2h0OiBub3JtYWw7XG4gIHRleHQtYWxpZ246IGxlZnQ7XG4gIHBhZGRpbmc6IDAuNjI1cmVtIDAuNzVyZW07XG59XG4uaGVhZGVyLWNlbGw6Zmlyc3QtY2hpbGQge1xuICBwYWRkaW5nLWxlZnQ6IDFyZW07XG59XG4uaGVhZGVyLWNlbGw6bGFzdC1jaGlsZCB7XG4gIHBhZGRpbmctcmlnaHQ6IDFyZW07XG59XG4uaGVhZGVyLWNlbGwgPiAqIHtcbiAgZGlzcGxheTogaW5saW5lLWZsZXg7XG59XG4uaGVhZGVyLWNlbGwgPiBidXR0b24ge1xuICBwYWRkaW5nOiAwO1xuICBtYXJnaW46IDA7XG4gIGJvcmRlcjogMDtcbiAgYmFja2dyb3VuZDogbm9uZTtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBkaXNwbGF5OiBpbmxpbmUtZmxleDtcbiAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbn1cblxuLmhlYWRsaW5lIHtcbiAgZm9udC1mYW1pbHk6IHZhcigtLWZvbnQtZmFtaWx5KTtcbiAgZm9udC1zaXplOiB2YXIoLS1mb250LXNpemUtZGF0YS1ncmlkKTtcbiAgbGluZS1oZWlnaHQ6IHZhcigtLWRhdGEtZ3JpZC1saW5lLWhlaWdodCk7XG4gIGZvbnQtd2VpZ2h0OiA3MDA7XG4gIGNvbG9yOiB2YXIoLS1kZWZhdWx0KTtcbn1cblxuLnNvcnRpbmctaW5kaWNhdG9yLWNvbnRhaW5lciB7XG4gIGRpc3BsYXk6IGZsZXg7XG4gIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gIHBhZGRpbmctbGVmdDogMC41cmVtO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbn1cbi5zb3J0aW5nLWluZGljYXRvci1jb250YWluZXIgPiAqIHtcbiAgZm9udC1zaXplOiAwLjYyNXJlbTtcbn1cbi5zb3J0aW5nLWluZGljYXRvci1jb250YWluZXIgLmluZGljYXRvciB7XG4gIGNvbG9yOiB2YXIoLS1ncmV5ZWQtb3V0KTtcbiAgdHJhbnNpdGlvbjogdHJhbnNmb3JtIDAuMnMgZWFzZS1pbi1vdXQ7XG4gIHRyYW5zZm9ybTogcm90YXRlKDBkZWcpO1xufVxuLnNvcnRpbmctaW5kaWNhdG9yLWNvbnRhaW5lciAuaW5kaWNhdG9yLmFzY2VuZGluZyB7XG4gIGNvbG9yOiB2YXIoLS1jb2xvci1wcmltYXJ5KTtcbn1cbi5zb3J0aW5nLWluZGljYXRvci1jb250YWluZXIgLmluZGljYXRvci5kZXNjZW5kaW5nIHtcbiAgY29sb3I6IHZhcigtLWNvbG9yLXByaW1hcnkpO1xuICB0cmFuc2Zvcm06IHJvdGF0ZSgxODBkZWcpO1xufVxuLnNvcnRpbmctaW5kaWNhdG9yLWNvbnRhaW5lciAuaW5kaWNhdG9yLmhpZGRlbiB7XG4gIHZpc2liaWxpdHk6IGhpZGRlbjtcbn1cblxuQG1lZGlhIG9ubHkgc2NyZWVuIGFuZCAobWluLXdpZHRoOiA1MGVtKSB7XG4gIC5oZWFkZXItY2VsbDpmaXJzdC1jaGlsZCB7XG4gICAgcGFkZGluZy1sZWZ0OiAxLjI1cmVtO1xuICB9XG4gIC5oZWFkZXItY2VsbDpsYXN0LWNoaWxkIHtcbiAgICBwYWRkaW5nLXJpZ2h0OiAxLjI1cmVtO1xuICB9XG59Il19 */";
+var classes = {"header-cell":"DataGridHeaderCell-module_header-cell__proHM","headline":"DataGridHeaderCell-module_headline__cmx1r","sorting-indicator-container":"DataGridHeaderCell-module_sorting-indicator-container__G5sPI","indicator":"DataGridHeaderCell-module_indicator__xaM3k","ascending":"DataGridHeaderCell-module_ascending__MkLgD","descending":"DataGridHeaderCell-module_descending__ML1AI","hidden":"DataGridHeaderCell-module_hidden__MAOV3"};
 styleInject(css_248z);
 
 export { classes as default };

package/dist/esm/Icon/Icon.esm.js

@@ -99,6 +99,8 @@ var Icons;
     Icons["AddCircle"] = "add-circle";
     Icons["ZoomIn"] = "zoom-in";
     Icons["ZoomOut"] = "zoom-out";
+    Icons["ArrowUp"] = "arrow-up";
+    Icons["ExternalLink"] = "external-link";
 })(Icons || (Icons = {}));
 const IconComponent = ({ icon, color, className, style, size, tag = "span", ...rest }, ref) => {
     const Component = tag;

package/dist/esm/Icon/Icon.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.esm.js","sources":["../../../../../src/components/Icon/Icon.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, { ForwardRefRenderFunction, ComponentPropsWithRef } from \"react\";\nimport classes from \"./Icon.module.scss\";\n\nexport enum Icons {\n  Bell = \"bell\",\n  BellAlt = \"bell-alt\",\n  Bookmark = \"bookmark\",\n  BookmarkAlt = \"bookmark-alt\",\n  Build = \"build\",\n  Calendar = \"calendar\",\n  Change = \"change\",\n  Checkmark = \"checkmark\",\n  CheckmarkCircle = \"checkmark-circle\",\n  CheckmarkCircleAlt = \"checkmark-circle-alt\",\n  CheckmarkCircleBreakout = \"checkmark-circle-breakout\",\n  CheckmarkSquare = \"checkmark-square\",\n  ChevronUp = \"chevron-up\",\n  ChevronDown = \"chevron-down\",\n  ChevronLeft = \"chevron-left\",\n  ChevronRight = \"chevron-right\",\n  Circle = \"circle\",\n  Clock = \"clock\",\n  Copy = \"copy\",\n  Edit = \"edit\",\n  Ellipsis = \"ellipsis\",\n  EllipsisAlt = \"ellipsis-alt\",\n  Equal = \"equal\",\n  Error = \"error-circle\",\n  ErrorAlt = \"error-circle-alt\",\n  Eye = \"eye\",\n  EyeBlocked = \"eye-blocked\",\n  Filter = \"filter\",\n  FilterAlt = \"filter-alt\",\n  FilterAltArrow = \"filter-alt-arrow\",\n  FilterAltTimes = \"filter-alt-times\",\n  Forbidden = \"forbidden\",\n  Fullscreen = \"fullscreen\",\n  FullscreenExit = \"fullscreen-exit\",\n  Gearwheel = \"gearwheel\",\n  Grid = \"grid\",\n  Hamburger = \"hamburger\",\n  HomeFilled = \"home-filled\",\n  Heart = \"heart\",\n  Image = \"image\",\n  InfoBell = \"info-bell\",\n  InfoCircle = \"info-circle\",\n  Link = \"link\",\n  MinusSquare = \"minus-square\",\n  NavigationFirst = \"navigation-first\",\n  NavigationLast = \"navigation-last\",\n  Plus = \"plus\",\n  Radio = \"radio\",\n  Refresh = \"refresh\",\n  Search = \"search\",\n  Share = \"share\",\n  Square = \"square\",\n  Star = \"star\",\n  StarAlt = \"star-alt\",\n  TableSearch = \"table-search\",\n  Times = \"times\",\n  TimesCircle = \"times-circle\",\n  TimesCircleAlt = \"times-circle-alt\",\n  TimesThin = \"times-thin\",\n  Trash = \"trash\",\n  TriangleDown = \"triangle-down\",\n  TriangleDownCircle = \"triangle-down-circle\",\n  TriangleLeft = \"triangle-left\",\n  TriangleRight = \"triangle-right\",\n  TriangleUp = \"triangle-up\",\n  Undo = \"undo\",\n  Warning = \"warning\",\n  WarningFilled = \"warning-filled\",\n  FileOutline = \"file-outline\",\n  FileUpload = \"file-upload-outline\",\n  FileDownload = \"file-download-outline\",\n  UploadOutline = \"upload-outline\",\n  ReplyOutline = \"reply-outline\",\n  SaveOutline = \"save-outline\",\n  DownloadFile = \"download-file-outline\",\n  RetryFile = \"retry\",\n  AbortFile = \"cancel\",\n  FileAltIcon = \"file-alt\",\n  AddCircle = \"add-circle\",\n  ZoomIn = \"zoom-in\",\n  ZoomOut = \"zoom-out\"\n}\n\ntype Tag = \"span\" | \"div\" | \"i\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  icon: Icons;\n  color?: string;\n  size?: string;\n  tag?: Tag;\n}\n\nconst IconComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { icon, color, className, style, size, tag = \"span\", ...rest }: Props,\n  ref\n) => {\n  const Component = tag;\n\n  return (\n    <Component\n      {...rest}\n      ref={ref}\n      style={{ color: color, ...style, fontSize: size }}\n      data-icon\n      aria-hidden=\"true\"\n      className={`${classes[\"icon\"]} ${classes[\"icon-\" + icon]} ${className ? className : \"\"}`}\n    />\n  );\n};\n\nexport const Icon = React.forwardRef(IconComponent);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Icon.esm.js","sources":["../../../../../src/components/Icon/Icon.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, { ForwardRefRenderFunction, ComponentPropsWithRef } from \"react\";\nimport classes from \"./Icon.module.scss\";\n\nexport enum Icons {\n  Bell = \"bell\",\n  BellAlt = \"bell-alt\",\n  Bookmark = \"bookmark\",\n  BookmarkAlt = \"bookmark-alt\",\n  Build = \"build\",\n  Calendar = \"calendar\",\n  Change = \"change\",\n  Checkmark = \"checkmark\",\n  CheckmarkCircle = \"checkmark-circle\",\n  CheckmarkCircleAlt = \"checkmark-circle-alt\",\n  CheckmarkCircleBreakout = \"checkmark-circle-breakout\",\n  CheckmarkSquare = \"checkmark-square\",\n  ChevronUp = \"chevron-up\",\n  ChevronDown = \"chevron-down\",\n  ChevronLeft = \"chevron-left\",\n  ChevronRight = \"chevron-right\",\n  Circle = \"circle\",\n  Clock = \"clock\",\n  Copy = \"copy\",\n  Edit = \"edit\",\n  Ellipsis = \"ellipsis\",\n  EllipsisAlt = \"ellipsis-alt\",\n  Equal = \"equal\",\n  Error = \"error-circle\",\n  ErrorAlt = \"error-circle-alt\",\n  Eye = \"eye\",\n  EyeBlocked = \"eye-blocked\",\n  Filter = \"filter\",\n  FilterAlt = \"filter-alt\",\n  FilterAltArrow = \"filter-alt-arrow\",\n  FilterAltTimes = \"filter-alt-times\",\n  Forbidden = \"forbidden\",\n  Fullscreen = \"fullscreen\",\n  FullscreenExit = \"fullscreen-exit\",\n  Gearwheel = \"gearwheel\",\n  Grid = \"grid\",\n  Hamburger = \"hamburger\",\n  HomeFilled = \"home-filled\",\n  Heart = \"heart\",\n  Image = \"image\",\n  InfoBell = \"info-bell\",\n  InfoCircle = \"info-circle\",\n  Link = \"link\",\n  MinusSquare = \"minus-square\",\n  NavigationFirst = \"navigation-first\",\n  NavigationLast = \"navigation-last\",\n  Plus = \"plus\",\n  Radio = \"radio\",\n  Refresh = \"refresh\",\n  Search = \"search\",\n  Share = \"share\",\n  Square = \"square\",\n  Star = \"star\",\n  StarAlt = \"star-alt\",\n  TableSearch = \"table-search\",\n  Times = \"times\",\n  TimesCircle = \"times-circle\",\n  TimesCircleAlt = \"times-circle-alt\",\n  TimesThin = \"times-thin\",\n  Trash = \"trash\",\n  TriangleDown = \"triangle-down\",\n  TriangleDownCircle = \"triangle-down-circle\",\n  TriangleLeft = \"triangle-left\",\n  TriangleRight = \"triangle-right\",\n  TriangleUp = \"triangle-up\",\n  Undo = \"undo\",\n  Warning = \"warning\",\n  WarningFilled = \"warning-filled\",\n  FileOutline = \"file-outline\",\n  FileUpload = \"file-upload-outline\",\n  FileDownload = \"file-download-outline\",\n  UploadOutline = \"upload-outline\",\n  ReplyOutline = \"reply-outline\",\n  SaveOutline = \"save-outline\",\n  DownloadFile = \"download-file-outline\",\n  RetryFile = \"retry\",\n  AbortFile = \"cancel\",\n  FileAltIcon = \"file-alt\",\n  AddCircle = \"add-circle\",\n  ZoomIn = \"zoom-in\",\n  ZoomOut = \"zoom-out\",\n  ArrowUp = \"arrow-up\",\n  ExternalLink = \"external-link\"\n}\n\ntype Tag = \"span\" | \"div\" | \"i\";\n\nexport interface Props extends ComponentPropsWithRef<\"div\"> {\n  icon: Icons;\n  color?: string;\n  size?: string;\n  tag?: Tag;\n}\n\nconst IconComponent: ForwardRefRenderFunction<HTMLDivElement, Props> = (\n  { icon, color, className, style, size, tag = \"span\", ...rest }: Props,\n  ref\n) => {\n  const Component = tag;\n\n  return (\n    <Component\n      {...rest}\n      ref={ref}\n      style={{ color: color, ...style, fontSize: size }}\n      data-icon\n      aria-hidden=\"true\"\n      className={`${classes[\"icon\"]} ${classes[\"icon-\" + icon]} ${className ? className : \"\"}`}\n    />\n  );\n};\n\nexport const Icon = React.forwardRef(IconComponent);\n"],"names":[],"mappings":"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"}