@backstage/core-components 0.18.4 → 0.18.5

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @backstage/core-components
 
+## 0.18.5
+
+### Patch Changes
+
+- a723b8a: The MarkdownContent component now handles HTML content the same way as GitHub when rendering GitHub-flavored Markdown
+- c671db9: Fixed bug in Table component where the toolbar layout would break when both a title and filters were present.
+- 55a9dc2: Update colour token again in ItemCardHeader to respect theme definition.
+
+## 0.18.5-next.0
+
+### Patch Changes
+
+- a723b8a: The MarkdownContent component now handles HTML content the same way as GitHub when rendering GitHub-flavored Markdown
+
 ## 0.18.4
 
 ### Patch Changes

package/dist/components/MarkdownContent/MarkdownContent.esm.js

@@ -4,6 +4,8 @@ import ReactMarkdown from 'react-markdown';
 import gfm from 'remark-gfm';
 import { Children, createElement } from 'react';
 import { CodeSnippet } from '../CodeSnippet/CodeSnippet.esm.js';
+import rehypeRaw from 'rehype-raw';
+import rehypeSanitize, { defaultSchema } from 'rehype-sanitize';
 
 const useStyles = makeStyles(
   (theme) => ({
@@ -67,6 +69,29 @@ const components = {
   h5: headingRenderer,
   h6: headingRenderer
 };
+const gfmRehypePlugins = [
+  [
+    rehypeRaw,
+    {
+      tagFiter: true
+    }
+  ],
+  [
+    rehypeSanitize,
+    {
+      ...defaultSchema,
+      attributes: {
+        ...defaultSchema.attributes,
+        code: [
+          ...defaultSchema.attributes?.code ?? [],
+          // for syntax highlighting classes in code blocks
+          // breaks the codesnippet component override above if omitted
+          ["className"]
+        ]
+      }
+    }
+  ]
+];
 function MarkdownContent(props) {
   const {
     content,
@@ -81,6 +106,7 @@ function MarkdownContent(props) {
     ReactMarkdown,
     {
       remarkPlugins: dialect === "gfm" ? [gfm] : [],
+      rehypePlugins: dialect === "gfm" ? gfmRehypePlugins : [],
       className: `${classes.markdown} ${className ?? ""}`.trim(),
       children: content,
       components,

package/dist/components/MarkdownContent/MarkdownContent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"MarkdownContent.esm.js","sources":["../../../src/components/MarkdownContent/MarkdownContent.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 { makeStyles } from '@material-ui/core/styles';\nimport ReactMarkdown, { Options } from 'react-markdown';\nimport gfm from 'remark-gfm';\nimport { Children, createElement } from 'react';\nimport { CodeSnippet } from '../CodeSnippet';\nimport { HeadingProps } from 'react-markdown/lib/ast-to-react';\n\nexport type MarkdownContentClassKey = 'markdown';\n\nconst useStyles = makeStyles(\n  theme => ({\n    markdown: {\n      '& table': {\n        borderCollapse: 'collapse',\n        border: `1px solid ${theme.palette.border}`,\n      },\n      '& th, & td': {\n        border: `1px solid ${theme.palette.border}`,\n        padding: theme.spacing(1),\n      },\n      '& td': {\n        wordBreak: 'break-word',\n        overflow: 'hidden',\n        verticalAlign: 'middle',\n        lineHeight: '1',\n        margin: 0,\n        padding: theme.spacing(3, 2, 3, 2.5),\n        borderBottom: 0,\n      },\n      '& th': {\n        backgroundColor: theme.palette.background.paper,\n      },\n      '& tr': {\n        backgroundColor: theme.palette.background.paper,\n      },\n      '& tr:nth-child(odd)': {\n        backgroundColor: theme.palette.background.default,\n      },\n\n      '& a': {\n        color: theme.palette.link,\n      },\n      '& img': {\n        maxWidth: '100%',\n      },\n    },\n  }),\n  { name: 'BackstageMarkdownContent' },\n);\n\ntype Props = {\n  content: string;\n  dialect?: 'gfm' | 'common-mark';\n  linkTarget?: Options['linkTarget'];\n  transformLinkUri?: (href: string) => string;\n  transformImageUri?: (href: string) => string;\n  className?: string;\n};\n\nconst flatten = (text: string, child: any): string => {\n  if (!child) return text;\n\n  return typeof child === 'string'\n    ? text + child\n    : Children.toArray(child.props.children).reduce(flatten, text);\n};\n\nconst headingRenderer = ({ level, children }: HeadingProps) => {\n  const childrenArray = Children.toArray(children);\n  const text = childrenArray.reduce(flatten, '');\n  const slug = text.toLocaleLowerCase('en-US').replace(/\\W/g, '-');\n  return createElement(`h${level}`, { id: slug }, children);\n};\n\nconst components: Options['components'] = {\n  code: ({ inline, className, children, ...props }) => {\n    const text = String(children).replace(/\\n+$/, '');\n    const match = /language-(\\w+)/.exec(className || '');\n    return !inline && match ? (\n      <CodeSnippet language={match[1]} text={text} />\n    ) : (\n      <code className={className} {...props}>\n        {children}\n      </code>\n    );\n  },\n  h1: headingRenderer,\n  h2: headingRenderer,\n  h3: headingRenderer,\n  h4: headingRenderer,\n  h5: headingRenderer,\n  h6: headingRenderer,\n};\n\n/**\n * Renders markdown with the default dialect {@link https://github.github.com/gfm/ | gfm - GitHub flavored Markdown} to backstage theme styled HTML.\n *\n * @remarks\n * If you just want to render to plain {@link https://commonmark.org/ | CommonMark}, set the dialect to `'common-mark'`\n */\nexport function MarkdownContent(props: Props) {\n  const {\n    content,\n    dialect = 'gfm',\n    linkTarget,\n    transformLinkUri,\n    transformImageUri,\n    className,\n  } = props;\n  const classes = useStyles();\n  return (\n    <ReactMarkdown\n      remarkPlugins={dialect === 'gfm' ? [gfm] : []}\n      className={`${classes.markdown} ${className ?? ''}`.trim()}\n      children={content}\n      components={components}\n      linkTarget={linkTarget}\n      transformLinkUri={transformLinkUri}\n      transformImageUri={transformImageUri}\n    />\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"MarkdownContent.esm.js","sources":["../../../src/components/MarkdownContent/MarkdownContent.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 { makeStyles } from '@material-ui/core/styles';\nimport ReactMarkdown, { Options } from 'react-markdown';\nimport gfm from 'remark-gfm';\nimport { Children, createElement } from 'react';\nimport { CodeSnippet } from '../CodeSnippet';\nimport { HeadingProps } from 'react-markdown/lib/ast-to-react';\nimport rehypeRaw from 'rehype-raw';\nimport rehypeSanitize, { defaultSchema } from 'rehype-sanitize';\nimport type { PluggableList } from 'react-markdown/lib/react-markdown';\n\nexport type MarkdownContentClassKey = 'markdown';\n\nconst useStyles = makeStyles(\n  theme => ({\n    markdown: {\n      '& table': {\n        borderCollapse: 'collapse',\n        border: `1px solid ${theme.palette.border}`,\n      },\n      '& th, & td': {\n        border: `1px solid ${theme.palette.border}`,\n        padding: theme.spacing(1),\n      },\n      '& td': {\n        wordBreak: 'break-word',\n        overflow: 'hidden',\n        verticalAlign: 'middle',\n        lineHeight: '1',\n        margin: 0,\n        padding: theme.spacing(3, 2, 3, 2.5),\n        borderBottom: 0,\n      },\n      '& th': {\n        backgroundColor: theme.palette.background.paper,\n      },\n      '& tr': {\n        backgroundColor: theme.palette.background.paper,\n      },\n      '& tr:nth-child(odd)': {\n        backgroundColor: theme.palette.background.default,\n      },\n\n      '& a': {\n        color: theme.palette.link,\n      },\n      '& img': {\n        maxWidth: '100%',\n      },\n    },\n  }),\n  { name: 'BackstageMarkdownContent' },\n);\n\ntype Props = {\n  content: string;\n  dialect?: 'gfm' | 'common-mark';\n  linkTarget?: Options['linkTarget'];\n  transformLinkUri?: (href: string) => string;\n  transformImageUri?: (href: string) => string;\n  className?: string;\n};\n\nconst flatten = (text: string, child: any): string => {\n  if (!child) return text;\n\n  return typeof child === 'string'\n    ? text + child\n    : Children.toArray(child.props.children).reduce(flatten, text);\n};\n\nconst headingRenderer = ({ level, children }: HeadingProps) => {\n  const childrenArray = Children.toArray(children);\n  const text = childrenArray.reduce(flatten, '');\n  const slug = text.toLocaleLowerCase('en-US').replace(/\\W/g, '-');\n  return createElement(`h${level}`, { id: slug }, children);\n};\n\nconst components: Options['components'] = {\n  code: ({ inline, className, children, ...props }) => {\n    const text = String(children).replace(/\\n+$/, '');\n    const match = /language-(\\w+)/.exec(className || '');\n    return !inline && match ? (\n      <CodeSnippet language={match[1]} text={text} />\n    ) : (\n      <code className={className} {...props}>\n        {children}\n      </code>\n    );\n  },\n  h1: headingRenderer,\n  h2: headingRenderer,\n  h3: headingRenderer,\n  h4: headingRenderer,\n  h5: headingRenderer,\n  h6: headingRenderer,\n};\n\nconst gfmRehypePlugins: PluggableList = [\n  [\n    rehypeRaw,\n    {\n      tagFiter: true,\n    },\n  ],\n  [\n    rehypeSanitize,\n    {\n      ...defaultSchema,\n      attributes: {\n        ...defaultSchema.attributes,\n        code: [\n          ...(defaultSchema.attributes?.code ?? []),\n          // for syntax highlighting classes in code blocks\n          // breaks the codesnippet component override above if omitted\n          ['className'],\n        ],\n      },\n    },\n  ],\n];\n\n/**\n * Renders markdown with the default dialect {@link https://github.github.com/gfm/ | gfm - GitHub flavored Markdown} to backstage theme styled HTML.\n *\n * @remarks\n * If you just want to render to plain {@link https://commonmark.org/ | CommonMark}, set the dialect to `'common-mark'`\n */\nexport function MarkdownContent(props: Props) {\n  const {\n    content,\n    dialect = 'gfm',\n    linkTarget,\n    transformLinkUri,\n    transformImageUri,\n    className,\n  } = props;\n  const classes = useStyles();\n  return (\n    <ReactMarkdown\n      remarkPlugins={dialect === 'gfm' ? [gfm] : []}\n      rehypePlugins={dialect === 'gfm' ? gfmRehypePlugins : []}\n      className={`${classes.markdown} ${className ?? ''}`.trim()}\n      children={content}\n      components={components}\n      linkTarget={linkTarget}\n      transformLinkUri={transformLinkUri}\n      transformImageUri={transformImageUri}\n    />\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/Table/Table.esm.js

@@ -93,7 +93,8 @@ const useFilterStyles = makeStyles(
     root: {
       display: "flex",
       alignItems: "center",
-      justifyContent: "space-between"
+      justifyContent: "space-between",
+      flexWrap: "wrap"
     },
     title: {
       fontWeight: theme.typography.fontWeightBold,

package/dist/components/Table/Table.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.esm.js","sources":["../../../src/components/Table/Table.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 {\n  TranslationFunction,\n  useTranslationRef,\n} from '@backstage/core-plugin-api/alpha';\nimport MTable, {\n  Column,\n  Icons,\n  MaterialTableProps,\n  MTableBody,\n  MTableHeader,\n  MTableToolbar,\n  Options,\n} from '@material-table/core';\nimport Box from '@material-ui/core/Box';\nimport IconButton from '@material-ui/core/IconButton';\nimport {\n  makeStyles,\n  Theme,\n  useTheme,\n  withStyles,\n} from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport AddBox from '@material-ui/icons/AddBox';\nimport ArrowUpward from '@material-ui/icons/ArrowUpward';\nimport Check from '@material-ui/icons/Check';\nimport ChevronLeft from '@material-ui/icons/ChevronLeft';\nimport ChevronRight from '@material-ui/icons/ChevronRight';\nimport Clear from '@material-ui/icons/Clear';\nimport DeleteOutline from '@material-ui/icons/DeleteOutline';\nimport Edit from '@material-ui/icons/Edit';\nimport FilterList from '@material-ui/icons/FilterList';\nimport Search from '@material-ui/icons/Search';\nimport FirstPage from '@material-ui/icons/FirstPage';\nimport LastPage from '@material-ui/icons/LastPage';\nimport Remove from '@material-ui/icons/Remove';\nimport SaveAlt from '@material-ui/icons/SaveAlt';\nimport ViewColumn from '@material-ui/icons/ViewColumn';\nimport { isEqual, transform } from 'lodash';\nimport {\n  CSSProperties,\n  forwardRef,\n  MutableRefObject,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { coreComponentsTranslationRef } from '../../translation';\nimport { SelectProps } from '../Select/Select';\nimport { Filter, Filters, SelectedFilters, Without } from './Filters';\nimport { TableLoadingBody } from './TableLoadingBody';\n\n// Material-table is not using the standard icons available in in material-ui. https://github.com/mbrn/material-table/issues/51\nconst tableIcons: Icons = {\n  Add: forwardRef<SVGSVGElement>((props, ref) => (\n    <AddBox {...props} ref={ref} />\n  )),\n  Check: forwardRef<SVGSVGElement>((props, ref) => (\n    <Check {...props} ref={ref} />\n  )),\n  Clear: forwardRef<SVGSVGElement>((props, ref) => (\n    <Clear {...props} ref={ref} />\n  )),\n  Delete: forwardRef<SVGSVGElement>((props, ref) => (\n    <DeleteOutline {...props} ref={ref} />\n  )),\n  DetailPanel: forwardRef<SVGSVGElement>((props, ref) => (\n    <ChevronRight {...props} ref={ref} />\n  )),\n  Edit: forwardRef<SVGSVGElement>((props, ref) => (\n    <Edit {...props} ref={ref} />\n  )),\n  Export: forwardRef<SVGSVGElement>((props, ref) => (\n    <SaveAlt {...props} ref={ref} />\n  )),\n  Filter: forwardRef<SVGSVGElement>((props, ref) => (\n    <FilterList {...props} ref={ref} />\n  )),\n  FirstPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <FirstPage {...props} ref={ref} />\n  )),\n  LastPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <LastPage {...props} ref={ref} />\n  )),\n  NextPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <ChevronRight {...props} ref={ref} />\n  )),\n  PreviousPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <ChevronLeft {...props} ref={ref} />\n  )),\n  ResetSearch: forwardRef<SVGSVGElement>((props, ref) => (\n    <Clear {...props} ref={ref} />\n  )),\n  Search: forwardRef<SVGSVGElement>((props, ref) => (\n    <Search {...props} ref={ref} />\n  )),\n  SortArrow: forwardRef<SVGSVGElement>((props, ref) => (\n    <ArrowUpward {...props} ref={ref} />\n  )),\n  ThirdStateCheck: forwardRef<SVGSVGElement>((props, ref) => (\n    <Remove {...props} ref={ref} />\n  )),\n  ViewColumn: forwardRef<SVGSVGElement>((props, ref) => (\n    <ViewColumn {...props} ref={ref} />\n  )),\n};\n\n// TODO: Material table might already have such a function internally that we can use?\nfunction extractValueByField(data: any, field: string): any | undefined {\n  const path = field.split('.');\n  let value = data[path[0]];\n\n  for (let i = 1; i < path.length; ++i) {\n    if (value === undefined) {\n      return value;\n    }\n\n    const f = path[i];\n    value = value[f];\n  }\n\n  return value;\n}\n\nexport type TableHeaderClassKey = 'header';\n\nconst StyledMTableHeader = withStyles(\n  theme => ({\n    header: {\n      padding: theme.spacing(1, 2, 1, 2.5),\n      borderTop: `1px solid ${theme.palette.grey.A100}`,\n      borderBottom: `1px solid ${theme.palette.grey.A100}`,\n      // withStyles hasn't a generic overload for theme\n      fontWeight: theme.typography.fontWeightBold,\n      position: 'static',\n      wordBreak: 'normal',\n      textTransform: 'uppercase',\n    },\n  }),\n  { name: 'BackstageTableHeader' },\n)(MTableHeader);\n\nexport type TableToolbarClassKey = 'root' | 'title' | 'searchField';\n\nconst StyledMTableToolbar = withStyles(\n  theme => ({\n    root: {\n      padding: theme.spacing(3, 0, 2.5, 2.5),\n    },\n    title: {\n      '& > h6': {\n        fontWeight: theme.typography.fontWeightBold,\n      },\n    },\n    searchField: {\n      paddingRight: theme.spacing(2),\n    },\n  }),\n  { name: 'BackstageTableToolbar' },\n)(MTableToolbar);\n\n/** @public */\nexport type FiltersContainerClassKey = 'root' | 'title';\n\nconst useFilterStyles = makeStyles(\n  theme => ({\n    root: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n    },\n    title: {\n      fontWeight: theme.typography.fontWeightBold,\n      fontSize: 18,\n      whiteSpace: 'nowrap',\n    },\n  }),\n  { name: 'BackstageTableFiltersContainer' },\n);\n\nexport type TableClassKey = 'root';\n\nconst useTableStyles = makeStyles(\n  () => ({\n    root: {\n      display: 'flex',\n      alignItems: 'start',\n    },\n  }),\n  { name: 'BackstageTable' },\n);\n\nfunction convertColumns<T extends object>(\n  columns: TableColumn<T>[],\n  theme: Theme,\n): TableColumn<T>[] {\n  return columns.map(column => {\n    const headerStyle: CSSProperties = column.headerStyle ?? {};\n\n    let cellStyle = column.cellStyle || {};\n\n    if (column.highlight) {\n      headerStyle.color = theme.palette.textContrast;\n\n      if (typeof cellStyle === 'object') {\n        (cellStyle as CSSProperties).fontWeight =\n          theme.typography.fontWeightBold;\n      } else {\n        const cellStyleFn = cellStyle as (\n          data: any,\n          rowData: T,\n          column?: Column<T>,\n        ) => CSSProperties;\n        cellStyle = (data, rowData, rowColumn) => {\n          const style = cellStyleFn(data, rowData, rowColumn);\n          return { ...style, fontWeight: theme.typography.fontWeightBold };\n        };\n      }\n    }\n\n    return {\n      ...column,\n      headerStyle,\n      cellStyle,\n    };\n  });\n}\n\nfunction removeDefaultValues(state: any, defaultState: any): any {\n  return transform(state, (result, value, key) => {\n    if (!isEqual(value, defaultState[key])) {\n      result[key] = value;\n    }\n  });\n}\n\nconst defaultInitialState = {\n  search: '',\n  filtersOpen: false,\n  filters: {},\n};\n\nexport interface TableColumn<T extends object = {}> extends Column<T> {\n  highlight?: boolean;\n  width?: string;\n}\n\nexport type TableFilter = {\n  column: string;\n  type: 'select' | 'multiple-select';\n};\n\nexport type TableState = {\n  search?: string;\n  filtersOpen?: boolean;\n  filters?: SelectedFilters;\n};\n\nexport interface TableProps<T extends object = {}>\n  extends MaterialTableProps<T> {\n  columns: TableColumn<T>[];\n  subtitle?: string;\n  filters?: TableFilter[];\n  initialState?: TableState;\n  emptyContent?: ReactNode;\n  isLoading?: boolean;\n  onStateChange?: (state: TableState) => any;\n}\n\nexport interface TableOptions<T extends object = {}> extends Options<T> {}\n\nexport function TableToolbar(toolbarProps: {\n  toolbarRef: MutableRefObject<any>;\n  setSearch: (value: string) => void;\n  onSearchChanged: (value: string) => void;\n  toggleFilters: () => void;\n  hasFilters: boolean;\n  selectedFiltersLength: number;\n}) {\n  const {\n    toolbarRef,\n    setSearch,\n    hasFilters,\n    selectedFiltersLength,\n    toggleFilters,\n  } = toolbarProps;\n  const { t } = useTranslationRef(coreComponentsTranslationRef);\n  const filtersClasses = useFilterStyles();\n  const onSearchChanged = useCallback(\n    (searchText: string) => {\n      toolbarProps.onSearchChanged(searchText);\n      setSearch(searchText);\n    },\n    [toolbarProps, setSearch],\n  );\n\n  if (hasFilters) {\n    return (\n      <Box className={filtersClasses.root}>\n        <Box className={filtersClasses.root}>\n          <IconButton onClick={toggleFilters} aria-label=\"filter list\">\n            <FilterList />\n          </IconButton>\n          <Typography className={filtersClasses.title}>\n            {t('table.filter.title')} ({selectedFiltersLength})\n          </Typography>\n        </Box>\n        <StyledMTableToolbar\n          {...toolbarProps}\n          ref={toolbarRef}\n          onSearchChanged={onSearchChanged}\n        />\n      </Box>\n    );\n  }\n\n  return (\n    <StyledMTableToolbar\n      {...toolbarProps}\n      ref={toolbarRef}\n      onSearchChanged={onSearchChanged}\n    />\n  );\n}\n\n/**\n * @public\n */\nexport function Table<T extends object = {}>(props: TableProps<T>) {\n  const {\n    data,\n    columns,\n    emptyContent,\n    options,\n    title,\n    subtitle,\n    localization,\n    filters,\n    initialState,\n    onStateChange,\n    components,\n    isLoading: loading,\n    style,\n    ...restProps\n  } = props;\n  const { t } = useTranslationRef(coreComponentsTranslationRef);\n  const tableClasses = useTableStyles();\n\n  const theme = useTheme();\n\n  const calculatedInitialState = { ...defaultInitialState, ...initialState };\n\n  const [filtersOpen, setFiltersOpen] = useState(\n    calculatedInitialState.filtersOpen,\n  );\n  const toggleFilters = useCallback(\n    () => setFiltersOpen(v => !v),\n    [setFiltersOpen],\n  );\n\n  const [selectedFilters, setSelectedFilters] = useState(\n    calculatedInitialState.filters,\n  );\n\n  const [search, setSearch] = useState(calculatedInitialState.search);\n\n  useEffect(() => {\n    if (onStateChange) {\n      const state = removeDefaultValues(\n        {\n          search,\n          filtersOpen,\n          filters: selectedFilters,\n        },\n        defaultInitialState,\n      );\n\n      onStateChange(state);\n    }\n  }, [search, filtersOpen, selectedFilters, onStateChange]);\n\n  const getFieldByTitle = useCallback(\n    (titleValue: string | keyof T) =>\n      columns.find(el => el.title === titleValue)?.field,\n    [columns],\n  );\n\n  const tableData = useMemo(() => {\n    if (typeof data === 'function' || !selectedFilters) {\n      return data;\n    }\n\n    const selectedFiltersArray = Object.values(selectedFilters);\n    if (data && selectedFiltersArray.flat().length) {\n      const newData = (data as any[]).filter(\n        el =>\n          !!Object.entries(selectedFilters)\n            .filter(([, value]) => !!(value as { length?: number }).length)\n            .every(([key, filterValue]) => {\n              const fieldValue = extractValueByField(\n                el,\n                getFieldByTitle(key) as string,\n              );\n\n              if (Array.isArray(fieldValue) && Array.isArray(filterValue)) {\n                return fieldValue.some(v => filterValue.includes(v));\n              } else if (Array.isArray(fieldValue)) {\n                return fieldValue.includes(filterValue);\n              } else if (Array.isArray(filterValue)) {\n                return filterValue.includes(fieldValue);\n              }\n\n              return fieldValue === filterValue;\n            }),\n      );\n      return newData;\n    }\n    return data;\n  }, [data, selectedFilters, getFieldByTitle]);\n\n  const selectedFiltersLength = Object.values(selectedFilters).flat().length;\n\n  const hasFilters = !!filters?.length;\n  const Toolbar = useCallback(\n    (toolbarProps: any /* no type for this in material-table */) => {\n      return (\n        <TableToolbar\n          setSearch={setSearch}\n          hasFilters={hasFilters}\n          selectedFiltersLength={selectedFiltersLength}\n          toggleFilters={toggleFilters}\n          {...toolbarProps}\n        />\n      );\n    },\n    [toggleFilters, hasFilters, selectedFiltersLength, setSearch],\n  );\n\n  const hasNoRows = typeof data !== 'function' && data.length === 0;\n  const columnCount = columns.length;\n  const Body = useMemo(\n    () => makeBody({ hasNoRows, emptyContent, columnCount, loading }),\n    [hasNoRows, emptyContent, columnCount, loading],\n  );\n\n  return (\n    <Box className={tableClasses.root}>\n      {filtersOpen && data && typeof data !== 'function' && filters?.length && (\n        <Filters\n          filters={constructFilters(filters, data as any[], columns, t)}\n          selectedFilters={selectedFilters}\n          onChangeFilters={setSelectedFilters}\n        />\n      )}\n      <MTable<T>\n        components={{\n          Header: StyledMTableHeader,\n          Body,\n          Toolbar,\n          ...components,\n        }}\n        options={options}\n        columns={convertColumns(columns, theme)}\n        icons={tableIcons}\n        title={\n          <>\n            <Typography variant=\"h5\" component=\"h2\">\n              {title}\n            </Typography>\n            {subtitle && (\n              <Typography color=\"textSecondary\" variant=\"body1\">\n                {subtitle}\n              </Typography>\n            )}\n          </>\n        }\n        data={tableData}\n        style={{ width: '100%', ...style }}\n        localization={{\n          ...localization,\n          body: {\n            emptyDataSourceMessage: t('table.body.emptyDataSourceMessage'),\n            ...localization?.body,\n          },\n          pagination: {\n            firstTooltip: t('table.pagination.firstTooltip'),\n            labelDisplayedRows: t('table.pagination.labelDisplayedRows'),\n            labelRowsSelect: t('table.pagination.labelRowsSelect'),\n            lastTooltip: t('table.pagination.lastTooltip'),\n            nextTooltip: t('table.pagination.nextTooltip'),\n            previousTooltip: t('table.pagination.previousTooltip'),\n            ...localization?.pagination,\n          },\n          header: {\n            actions: t('table.header.actions'),\n            ...localization?.header,\n          },\n          toolbar: {\n            searchPlaceholder: t('table.toolbar.search'),\n            searchTooltip: t('table.toolbar.search'),\n            ...localization?.toolbar,\n          },\n        }}\n        {...restProps}\n      />\n    </Box>\n  );\n}\n\nTable.icons = Object.freeze(tableIcons);\n\nfunction makeBody({\n  columnCount,\n  emptyContent,\n  hasNoRows,\n  loading,\n}: {\n  hasNoRows: boolean;\n  emptyContent: ReactNode;\n  columnCount: number;\n  loading?: boolean;\n}) {\n  return (bodyProps: any /* no type for this in material-table */) => {\n    if (loading) {\n      return <TableLoadingBody colSpan={columnCount} />;\n    }\n\n    if (emptyContent && hasNoRows) {\n      return (\n        <tbody>\n          <tr>\n            <td colSpan={columnCount}>{emptyContent}</td>\n          </tr>\n        </tbody>\n      );\n    }\n\n    return <MTableBody {...bodyProps} />;\n  };\n}\n\nfunction constructFilters<T extends object>(\n  filterConfig: TableFilter[],\n  dataValue: any[] | undefined,\n  columns: TableColumn<T>[],\n  t: TranslationFunction<typeof coreComponentsTranslationRef.T>,\n): Filter[] {\n  const extractDistinctValues = (field: string | keyof T): Set<any> => {\n    const distinctValues = new Set<any>();\n    const addValue = (value: any) => {\n      if (value !== undefined && value !== null) {\n        distinctValues.add(value);\n      }\n    };\n\n    if (dataValue) {\n      dataValue.forEach(el => {\n        const value = extractValueByField(\n          el,\n          columns.find(c => c.title === field)?.field as string,\n        );\n\n        if (Array.isArray(value)) {\n          (value as []).forEach(addValue);\n        } else {\n          addValue(value);\n        }\n      });\n    }\n\n    return distinctValues;\n  };\n\n  const constructSelect = (\n    filter: TableFilter,\n  ): Without<SelectProps, 'onChange'> => {\n    return {\n      placeholder: t('table.filter.placeholder'),\n      label: filter.column,\n      multiple: filter.type === 'multiple-select',\n      items: [...extractDistinctValues(filter.column)].sort().map(value => ({\n        label: value,\n        value,\n      })),\n    };\n  };\n\n  return filterConfig.map(filter => ({\n    type: filter.type,\n    element: constructSelect(filter),\n  }));\n}\n"],"names":["ChevronLeft"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEA,MAAM,UAAA,GAAoB;AAAA,EACxB,GAAA,EAAK,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACpC,MAAA,EAAA,EAAQ,GAAG,KAAA,EAAO,GAAA,EAAU,CAC9B,CAAA;AAAA,EACD,KAAA,EAAO,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACtC,KAAA,EAAA,EAAO,GAAG,KAAA,EAAO,GAAA,EAAU,CAC7B,CAAA;AAAA,EACD,KAAA,EAAO,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACtC,KAAA,EAAA,EAAO,GAAG,KAAA,EAAO,GAAA,EAAU,CAC7B,CAAA;AAAA,EACD,MAAA,EAAQ,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACvC,aAAA,EAAA,EAAe,GAAG,KAAA,EAAO,GAAA,EAAU,CACrC,CAAA;AAAA,EACD,WAAA,EAAa,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAC5C,YAAA,EAAA,EAAc,GAAG,KAAA,EAAO,GAAA,EAAU,CACpC,CAAA;AAAA,EACD,IAAA,EAAM,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACrC,IAAA,EAAA,EAAM,GAAG,KAAA,EAAO,GAAA,EAAU,CAC5B,CAAA;AAAA,EACD,MAAA,EAAQ,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACvC,OAAA,EAAA,EAAS,GAAG,KAAA,EAAO,GAAA,EAAU,CAC/B,CAAA;AAAA,EACD,MAAA,EAAQ,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACvC,UAAA,EAAA,EAAY,GAAG,KAAA,EAAO,GAAA,EAAU,CAClC,CAAA;AAAA,EACD,SAAA,EAAW,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAC1C,SAAA,EAAA,EAAW,GAAG,KAAA,EAAO,GAAA,EAAU,CACjC,CAAA;AAAA,EACD,QAAA,EAAU,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACzC,QAAA,EAAA,EAAU,GAAG,KAAA,EAAO,GAAA,EAAU,CAChC,CAAA;AAAA,EACD,QAAA,EAAU,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACzC,YAAA,EAAA,EAAc,GAAG,KAAA,EAAO,GAAA,EAAU,CACpC,CAAA;AAAA,EACD,YAAA,EAAc,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAC7CA,eAAA,EAAA,EAAa,GAAG,KAAA,EAAO,GAAA,EAAU,CACnC,CAAA;AAAA,EACD,WAAA,EAAa,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAC5C,KAAA,EAAA,EAAO,GAAG,KAAA,EAAO,GAAA,EAAU,CAC7B,CAAA;AAAA,EACD,MAAA,EAAQ,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBACvC,MAAA,EAAA,EAAQ,GAAG,KAAA,EAAO,GAAA,EAAU,CAC9B,CAAA;AAAA,EACD,SAAA,EAAW,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAC1C,WAAA,EAAA,EAAa,GAAG,KAAA,EAAO,GAAA,EAAU,CACnC,CAAA;AAAA,EACD,eAAA,EAAiB,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAChD,MAAA,EAAA,EAAQ,GAAG,KAAA,EAAO,GAAA,EAAU,CAC9B,CAAA;AAAA,EACD,UAAA,EAAY,UAAA,CAA0B,CAAC,KAAA,EAAO,GAAA,yBAC3C,UAAA,EAAA,EAAY,GAAG,KAAA,EAAO,GAAA,EAAU,CAClC;AACH,CAAA;AAGA,SAAS,mBAAA,CAAoB,MAAW,KAAA,EAAgC;AACtE,EAAA,MAAM,IAAA,GAAO,KAAA,CAAM,KAAA,CAAM,GAAG,CAAA;AAC5B,EAAA,IAAI,KAAA,GAAQ,IAAA,CAAK,IAAA,CAAK,CAAC,CAAC,CAAA;AAExB,EAAA,KAAA,IAAS,IAAI,CAAA,EAAG,CAAA,GAAI,IAAA,CAAK,MAAA,EAAQ,EAAE,CAAA,EAAG;AACpC,IAAA,IAAI,UAAU,MAAA,EAAW;AACvB,MAAA,OAAO,KAAA;AAAA,IACT;AAEA,IAAA,MAAM,CAAA,GAAI,KAAK,CAAC,CAAA;AAChB,IAAA,KAAA,GAAQ,MAAM,CAAC,CAAA;AAAA,EACjB;AAEA,EAAA,OAAO,KAAA;AACT;AAIA,MAAM,kBAAA,GAAqB,UAAA;AAAA,EACzB,CAAA,KAAA,MAAU;AAAA,IACR,MAAA,EAAQ;AAAA,MACN,SAAS,KAAA,CAAM,OAAA,CAAQ,CAAA,EAAG,CAAA,EAAG,GAAG,GAAG,CAAA;AAAA,MACnC,SAAA,EAAW,CAAA,UAAA,EAAa,KAAA,CAAM,OAAA,CAAQ,KAAK,IAAI,CAAA,CAAA;AAAA,MAC/C,YAAA,EAAc,CAAA,UAAA,EAAa,KAAA,CAAM,OAAA,CAAQ,KAAK,IAAI,CAAA,CAAA;AAAA;AAAA,MAElD,UAAA,EAAY,MAAM,UAAA,CAAW,cAAA;AAAA,MAC7B,QAAA,EAAU,QAAA;AAAA,MACV,SAAA,EAAW,QAAA;AAAA,MACX,aAAA,EAAe;AAAA;AACjB,GACF,CAAA;AAAA,EACA,EAAE,MAAM,sBAAA;AACV,CAAA,CAAE,YAAY,CAAA;AAId,MAAM,mBAAA,GAAsB,UAAA;AAAA,EAC1B,CAAA,KAAA,MAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,SAAS,KAAA,CAAM,OAAA,CAAQ,CAAA,EAAG,CAAA,EAAG,KAAK,GAAG;AAAA,KACvC;AAAA,IACA,KAAA,EAAO;AAAA,MACL,QAAA,EAAU;AAAA,QACR,UAAA,EAAY,MAAM,UAAA,CAAW;AAAA;AAC/B,KACF;AAAA,IACA,WAAA,EAAa;AAAA,MACX,YAAA,EAAc,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA;AAC/B,GACF,CAAA;AAAA,EACA,EAAE,MAAM,uBAAA;AACV,CAAA,CAAE,aAAa,CAAA;AAKf,MAAM,eAAA,GAAkB,UAAA;AAAA,EACtB,CAAA,KAAA,MAAU;AAAA,IACR,IAAA,EAAM;AAAA,MACJ,OAAA,EAAS,MAAA;AAAA,MACT,UAAA,EAAY,QAAA;AAAA,MACZ,cAAA,EAAgB;AAAA,KAClB;AAAA,IACA,KAAA,EAAO;AAAA,MACL,UAAA,EAAY,MAAM,UAAA,CAAW,cAAA;AAAA,MAC7B,QAAA,EAAU,EAAA;AAAA,MACV,UAAA,EAAY;AAAA;AACd,GACF,CAAA;AAAA,EACA,EAAE,MAAM,gCAAA;AACV,CAAA;AAIA,MAAM,cAAA,GAAiB,UAAA;AAAA,EACrB,OAAO;AAAA,IACL,IAAA,EAAM;AAAA,MACJ,OAAA,EAAS,MAAA;AAAA,MACT,UAAA,EAAY;AAAA;AACd,GACF,CAAA;AAAA,EACA,EAAE,MAAM,gBAAA;AACV,CAAA;AAEA,SAAS,cAAA,CACP,SACA,KAAA,EACkB;AAClB,EAAA,OAAO,OAAA,CAAQ,IAAI,CAAA,MAAA,KAAU;AAC3B,IAAA,MAAM,WAAA,GAA6B,MAAA,CAAO,WAAA,IAAe,EAAC;AAE1D,IAAA,IAAI,SAAA,GAAY,MAAA,CAAO,SAAA,IAAa,EAAC;AAErC,IAAA,IAAI,OAAO,SAAA,EAAW;AACpB,MAAA,WAAA,CAAY,KAAA,GAAQ,MAAM,OAAA,CAAQ,YAAA;AAElC,MAAA,IAAI,OAAO,cAAc,QAAA,EAAU;AACjC,QAAC,SAAA,CAA4B,UAAA,GAC3B,KAAA,CAAM,UAAA,CAAW,cAAA;AAAA,MACrB,CAAA,MAAO;AACL,QAAA,MAAM,WAAA,GAAc,SAAA;AAKpB,QAAA,SAAA,GAAY,CAAC,IAAA,EAAM,OAAA,EAAS,SAAA,KAAc;AACxC,UAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,IAAA,EAAM,OAAA,EAAS,SAAS,CAAA;AAClD,UAAA,OAAO,EAAE,GAAG,KAAA,EAAO,UAAA,EAAY,KAAA,CAAM,WAAW,cAAA,EAAe;AAAA,QACjE,CAAA;AAAA,MACF;AAAA,IACF;AAEA,IAAA,OAAO;AAAA,MACL,GAAG,MAAA;AAAA,MACH,WAAA;AAAA,MACA;AAAA,KACF;AAAA,EACF,CAAC,CAAA;AACH;AAEA,SAAS,mBAAA,CAAoB,OAAY,YAAA,EAAwB;AAC/D,EAAA,OAAO,SAAA,CAAU,KAAA,EAAO,CAAC,MAAA,EAAQ,OAAO,GAAA,KAAQ;AAC9C,IAAA,IAAI,CAAC,OAAA,CAAQ,KAAA,EAAO,YAAA,CAAa,GAAG,CAAC,CAAA,EAAG;AACtC,MAAA,MAAA,CAAO,GAAG,CAAA,GAAI,KAAA;AAAA,IAChB;AAAA,EACF,CAAC,CAAA;AACH;AAEA,MAAM,mBAAA,GAAsB;AAAA,EAC1B,MAAA,EAAQ,EAAA;AAAA,EACR,WAAA,EAAa,KAAA;AAAA,EACb,SAAS;AACX,CAAA;AA+BO,SAAS,aAAa,YAAA,EAO1B;AACD,EAAA,MAAM;AAAA,IACJ,UAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,qBAAA;AAAA,IACA;AAAA,GACF,GAAI,YAAA;AACJ,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,4BAA4B,CAAA;AAC5D,EAAA,MAAM,iBAAiB,eAAA,EAAgB;AACvC,EAAA,MAAM,eAAA,GAAkB,WAAA;AAAA,IACtB,CAAC,UAAA,KAAuB;AACtB,MAAA,YAAA,CAAa,gBAAgB,UAAU,CAAA;AACvC,MAAA,SAAA,CAAU,UAAU,CAAA;AAAA,IACtB,CAAA;AAAA,IACA,CAAC,cAAc,SAAS;AAAA,GAC1B;AAEA,EAAA,IAAI,UAAA,EAAY;AACd,IAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,cAAA,CAAe,IAAA,EAC7B,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,cAAA,CAAe,IAAA,EAC7B,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,cAAW,OAAA,EAAS,aAAA,EAAe,cAAW,aAAA,EAC7C,QAAA,kBAAA,GAAA,CAAC,cAAW,CAAA,EACd,CAAA;AAAA,wBACA,IAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAW,cAAA,CAAe,KAAA,EACnC,QAAA,EAAA;AAAA,UAAA,CAAA,CAAE,oBAAoB,CAAA;AAAA,UAAE,IAAA;AAAA,UAAG,qBAAA;AAAA,UAAsB;AAAA,SAAA,EACpD;AAAA,OAAA,EACF,CAAA;AAAA,sBACA,GAAA;AAAA,QAAC,mBAAA;AAAA,QAAA;AAAA,UACE,GAAG,YAAA;AAAA,UACJ,GAAA,EAAK,UAAA;AAAA,UACL;AAAA;AAAA;AACF,KAAA,EACF,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACE,GAAG,YAAA;AAAA,MACJ,GAAA,EAAK,UAAA;AAAA,MACL;AAAA;AAAA,GACF;AAEJ;AAKO,SAAS,MAA6B,KAAA,EAAsB;AACjE,EAAA,MAAM;AAAA,IACJ,IAAA;AAAA,IACA,OAAA;AAAA,IACA,YAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,YAAA;AAAA,IACA,OAAA;AAAA,IACA,YAAA;AAAA,IACA,aAAA;AAAA,IACA,UAAA;AAAA,IACA,SAAA,EAAW,OAAA;AAAA,IACX,KAAA;AAAA,IACA,GAAG;AAAA,GACL,GAAI,KAAA;AACJ,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,iBAAA,CAAkB,4BAA4B,CAAA;AAC5D,EAAA,MAAM,eAAe,cAAA,EAAe;AAEpC,EAAA,MAAM,QAAQ,QAAA,EAAS;AAEvB,EAAA,MAAM,sBAAA,GAAyB,EAAE,GAAG,mBAAA,EAAqB,GAAG,YAAA,EAAa;AAEzE,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,QAAA;AAAA,IACpC,sBAAA,CAAuB;AAAA,GACzB;AACA,EAAA,MAAM,aAAA,GAAgB,WAAA;AAAA,IACpB,MAAM,cAAA,CAAe,CAAA,CAAA,KAAK,CAAC,CAAC,CAAA;AAAA,IAC5B,CAAC,cAAc;AAAA,GACjB;AAEA,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,QAAA;AAAA,IAC5C,sBAAA,CAAuB;AAAA,GACzB;AAEA,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,QAAA,CAAS,uBAAuB,MAAM,CAAA;AAElE,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,aAAA,EAAe;AACjB,MAAA,MAAM,KAAA,GAAQ,mBAAA;AAAA,QACZ;AAAA,UACE,MAAA;AAAA,UACA,WAAA;AAAA,UACA,OAAA,EAAS;AAAA,SACX;AAAA,QACA;AAAA,OACF;AAEA,MAAA,aAAA,CAAc,KAAK,CAAA;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,MAAA,EAAQ,WAAA,EAAa,eAAA,EAAiB,aAAa,CAAC,CAAA;AAExD,EAAA,MAAM,eAAA,GAAkB,WAAA;AAAA,IACtB,CAAC,eACC,OAAA,CAAQ,IAAA,CAAK,QAAM,EAAA,CAAG,KAAA,KAAU,UAAU,CAAA,EAAG,KAAA;AAAA,IAC/C,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,SAAA,GAAY,QAAQ,MAAM;AAC9B,IAAA,IAAI,OAAO,IAAA,KAAS,UAAA,IAAc,CAAC,eAAA,EAAiB;AAClD,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,MAAM,oBAAA,GAAuB,MAAA,CAAO,MAAA,CAAO,eAAe,CAAA;AAC1D,IAAA,IAAI,IAAA,IAAQ,oBAAA,CAAqB,IAAA,EAAK,CAAE,MAAA,EAAQ;AAC9C,MAAA,MAAM,UAAW,IAAA,CAAe,MAAA;AAAA,QAC9B,CAAA,EAAA,KACE,CAAC,CAAC,MAAA,CAAO,QAAQ,eAAe,CAAA,CAC7B,MAAA,CAAO,CAAC,GAAG,KAAK,CAAA,KAAM,CAAC,CAAE,KAAA,CAA8B,MAAM,CAAA,CAC7D,MAAM,CAAC,CAAC,GAAA,EAAK,WAAW,CAAA,KAAM;AAC7B,UAAA,MAAM,UAAA,GAAa,mBAAA;AAAA,YACjB,EAAA;AAAA,YACA,gBAAgB,GAAG;AAAA,WACrB;AAEA,UAAA,IAAI,MAAM,OAAA,CAAQ,UAAU,KAAK,KAAA,CAAM,OAAA,CAAQ,WAAW,CAAA,EAAG;AAC3D,YAAA,OAAO,WAAW,IAAA,CAAK,CAAA,CAAA,KAAK,WAAA,CAAY,QAAA,CAAS,CAAC,CAAC,CAAA;AAAA,UACrD,CAAA,MAAA,IAAW,KAAA,CAAM,OAAA,CAAQ,UAAU,CAAA,EAAG;AACpC,YAAA,OAAO,UAAA,CAAW,SAAS,WAAW,CAAA;AAAA,UACxC,CAAA,MAAA,IAAW,KAAA,CAAM,OAAA,CAAQ,WAAW,CAAA,EAAG;AACrC,YAAA,OAAO,WAAA,CAAY,SAAS,UAAU,CAAA;AAAA,UACxC;AAEA,UAAA,OAAO,UAAA,KAAe,WAAA;AAAA,QACxB,CAAC;AAAA,OACP;AACA,MAAA,OAAO,OAAA;AAAA,IACT;AACA,IAAA,OAAO,IAAA;AAAA,EACT,CAAA,EAAG,CAAC,IAAA,EAAM,eAAA,EAAiB,eAAe,CAAC,CAAA;AAE3C,EAAA,MAAM,wBAAwB,MAAA,CAAO,MAAA,CAAO,eAAe,CAAA,CAAE,MAAK,CAAE,MAAA;AAEpE,EAAA,MAAM,UAAA,GAAa,CAAC,CAAC,OAAA,EAAS,MAAA;AAC9B,EAAA,MAAM,OAAA,GAAU,WAAA;AAAA,IACd,CAAC,YAAA,KAA+D;AAC9D,MAAA,uBACE,GAAA;AAAA,QAAC,YAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACA,UAAA;AAAA,UACA,qBAAA;AAAA,UACA,aAAA;AAAA,UACC,GAAG;AAAA;AAAA,OACN;AAAA,IAEJ,CAAA;AAAA,IACA,CAAC,aAAA,EAAe,UAAA,EAAY,qBAAA,EAAuB,SAAS;AAAA,GAC9D;AAEA,EAAA,MAAM,SAAA,GAAY,OAAO,IAAA,KAAS,UAAA,IAAc,KAAK,MAAA,KAAW,CAAA;AAChE,EAAA,MAAM,cAAc,OAAA,CAAQ,MAAA;AAC5B,EAAA,MAAM,IAAA,GAAO,OAAA;AAAA,IACX,MAAM,QAAA,CAAS,EAAE,WAAW,YAAA,EAAc,WAAA,EAAa,SAAS,CAAA;AAAA,IAChE,CAAC,SAAA,EAAW,YAAA,EAAc,WAAA,EAAa,OAAO;AAAA,GAChD;AAEA,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,YAAA,CAAa,IAAA,EAC1B,QAAA,EAAA;AAAA,IAAA,WAAA,IAAe,IAAA,IAAQ,OAAO,IAAA,KAAS,UAAA,IAAc,SAAS,MAAA,oBAC7D,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,gBAAA,CAAiB,OAAA,EAAS,IAAA,EAAe,SAAS,CAAC,CAAA;AAAA,QAC5D,eAAA;AAAA,QACA,eAAA,EAAiB;AAAA;AAAA,KACnB;AAAA,oBAEF,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,UAAA,EAAY;AAAA,UACV,MAAA,EAAQ,kBAAA;AAAA,UACR,IAAA;AAAA,UACA,OAAA;AAAA,UACA,GAAG;AAAA,SACL;AAAA,QACA,OAAA;AAAA,QACA,OAAA,EAAS,cAAA,CAAe,OAAA,EAAS,KAAK,CAAA;AAAA,QACtC,KAAA,EAAO,UAAA;AAAA,QACP,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAQ,IAAA,EAAK,SAAA,EAAU,MAChC,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UACC,4BACC,GAAA,CAAC,UAAA,EAAA,EAAW,OAAM,eAAA,EAAgB,OAAA,EAAQ,SACvC,QAAA,EAAA,QAAA,EACH;AAAA,SAAA,EAEJ,CAAA;AAAA,QAEF,IAAA,EAAM,SAAA;AAAA,QACN,KAAA,EAAO,EAAE,KAAA,EAAO,MAAA,EAAQ,GAAG,KAAA,EAAM;AAAA,QACjC,YAAA,EAAc;AAAA,UACZ,GAAG,YAAA;AAAA,UACH,IAAA,EAAM;AAAA,YACJ,sBAAA,EAAwB,EAAE,mCAAmC,CAAA;AAAA,YAC7D,GAAG,YAAA,EAAc;AAAA,WACnB;AAAA,UACA,UAAA,EAAY;AAAA,YACV,YAAA,EAAc,EAAE,+BAA+B,CAAA;AAAA,YAC/C,kBAAA,EAAoB,EAAE,qCAAqC,CAAA;AAAA,YAC3D,eAAA,EAAiB,EAAE,kCAAkC,CAAA;AAAA,YACrD,WAAA,EAAa,EAAE,8BAA8B,CAAA;AAAA,YAC7C,WAAA,EAAa,EAAE,8BAA8B,CAAA;AAAA,YAC7C,eAAA,EAAiB,EAAE,kCAAkC,CAAA;AAAA,YACrD,GAAG,YAAA,EAAc;AAAA,WACnB;AAAA,UACA,MAAA,EAAQ;AAAA,YACN,OAAA,EAAS,EAAE,sBAAsB,CAAA;AAAA,YACjC,GAAG,YAAA,EAAc;AAAA,WACnB;AAAA,UACA,OAAA,EAAS;AAAA,YACP,iBAAA,EAAmB,EAAE,sBAAsB,CAAA;AAAA,YAC3C,aAAA,EAAe,EAAE,sBAAsB,CAAA;AAAA,YACvC,GAAG,YAAA,EAAc;AAAA;AACnB,SACF;AAAA,QACC,GAAG;AAAA;AAAA;AACN,GAAA,EACF,CAAA;AAEJ;AAEA,KAAA,CAAM,KAAA,GAAQ,MAAA,CAAO,MAAA,CAAO,UAAU,CAAA;AAEtC,SAAS,QAAA,CAAS;AAAA,EAChB,WAAA;AAAA,EACA,YAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAKG;AACD,EAAA,OAAO,CAAC,SAAA,KAA4D;AAClE,IAAA,IAAI,OAAA,EAAS;AACX,MAAA,uBAAO,GAAA,CAAC,gBAAA,EAAA,EAAiB,OAAA,EAAS,WAAA,EAAa,CAAA;AAAA,IACjD;AAEA,IAAA,IAAI,gBAAgB,SAAA,EAAW;AAC7B,MAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,QAAG,OAAA,EAAS,WAAA,EAAc,QAAA,EAAA,YAAA,EAAa,CAAA,EAC1C,CAAA,EACF,CAAA;AAAA,IAEJ;AAEA,IAAA,uBAAO,GAAA,CAAC,UAAA,EAAA,EAAY,GAAG,SAAA,EAAW,CAAA;AAAA,EACpC,CAAA;AACF;AAEA,SAAS,gBAAA,CACP,YAAA,EACA,SAAA,EACA,OAAA,EACA,CAAA,EACU;AACV,EAAA,MAAM,qBAAA,GAAwB,CAAC,KAAA,KAAsC;AACnE,IAAA,MAAM,cAAA,uBAAqB,GAAA,EAAS;AACpC,IAAA,MAAM,QAAA,GAAW,CAAC,KAAA,KAAe;AAC/B,MAAA,IAAI,KAAA,KAAU,MAAA,IAAa,KAAA,KAAU,IAAA,EAAM;AACzC,QAAA,cAAA,CAAe,IAAI,KAAK,CAAA;AAAA,MAC1B;AAAA,IACF,CAAA;AAEA,IAAA,IAAI,SAAA,EAAW;AACb,MAAA,SAAA,CAAU,QAAQ,CAAA,EAAA,KAAM;AACtB,QAAA,MAAM,KAAA,GAAQ,mBAAA;AAAA,UACZ,EAAA;AAAA,UACA,QAAQ,IAAA,CAAK,CAAA,CAAA,KAAK,CAAA,CAAE,KAAA,KAAU,KAAK,CAAA,EAAG;AAAA,SACxC;AAEA,QAAA,IAAI,KAAA,CAAM,OAAA,CAAQ,KAAK,CAAA,EAAG;AACxB,UAAC,KAAA,CAAa,QAAQ,QAAQ,CAAA;AAAA,QAChC,CAAA,MAAO;AACL,UAAA,QAAA,CAAS,KAAK,CAAA;AAAA,QAChB;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAEA,IAAA,OAAO,cAAA;AAAA,EACT,CAAA;AAEA,EAAA,MAAM,eAAA,GAAkB,CACtB,MAAA,KACqC;AACrC,IAAA,OAAO;AAAA,MACL,WAAA,EAAa,EAAE,0BAA0B,CAAA;AAAA,MACzC,OAAO,MAAA,CAAO,MAAA;AAAA,MACd,QAAA,EAAU,OAAO,IAAA,KAAS,iBAAA;AAAA,MAC1B,KAAA,EAAO,CAAC,GAAG,qBAAA,CAAsB,MAAA,CAAO,MAAM,CAAC,CAAA,CAAE,IAAA,EAAK,CAAE,GAAA,CAAI,CAAA,KAAA,MAAU;AAAA,QACpE,KAAA,EAAO,KAAA;AAAA,QACP;AAAA,OACF,CAAE;AAAA,KACJ;AAAA,EACF,CAAA;AAEA,EAAA,OAAO,YAAA,CAAa,IAAI,CAAA,MAAA,MAAW;AAAA,IACjC,MAAM,MAAA,CAAO,IAAA;AAAA,IACb,OAAA,EAAS,gBAAgB,MAAM;AAAA,GACjC,CAAE,CAAA;AACJ;;;;"}
+{"version":3,"file":"Table.esm.js","sources":["../../../src/components/Table/Table.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 {\n  TranslationFunction,\n  useTranslationRef,\n} from '@backstage/core-plugin-api/alpha';\nimport MTable, {\n  Column,\n  Icons,\n  MaterialTableProps,\n  MTableBody,\n  MTableHeader,\n  MTableToolbar,\n  Options,\n} from '@material-table/core';\nimport Box from '@material-ui/core/Box';\nimport IconButton from '@material-ui/core/IconButton';\nimport {\n  makeStyles,\n  Theme,\n  useTheme,\n  withStyles,\n} from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport AddBox from '@material-ui/icons/AddBox';\nimport ArrowUpward from '@material-ui/icons/ArrowUpward';\nimport Check from '@material-ui/icons/Check';\nimport ChevronLeft from '@material-ui/icons/ChevronLeft';\nimport ChevronRight from '@material-ui/icons/ChevronRight';\nimport Clear from '@material-ui/icons/Clear';\nimport DeleteOutline from '@material-ui/icons/DeleteOutline';\nimport Edit from '@material-ui/icons/Edit';\nimport FilterList from '@material-ui/icons/FilterList';\nimport Search from '@material-ui/icons/Search';\nimport FirstPage from '@material-ui/icons/FirstPage';\nimport LastPage from '@material-ui/icons/LastPage';\nimport Remove from '@material-ui/icons/Remove';\nimport SaveAlt from '@material-ui/icons/SaveAlt';\nimport ViewColumn from '@material-ui/icons/ViewColumn';\nimport { isEqual, transform } from 'lodash';\nimport {\n  CSSProperties,\n  forwardRef,\n  MutableRefObject,\n  ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\n\nimport { coreComponentsTranslationRef } from '../../translation';\nimport { SelectProps } from '../Select/Select';\nimport { Filter, Filters, SelectedFilters, Without } from './Filters';\nimport { TableLoadingBody } from './TableLoadingBody';\n\n// Material-table is not using the standard icons available in in material-ui. https://github.com/mbrn/material-table/issues/51\nconst tableIcons: Icons = {\n  Add: forwardRef<SVGSVGElement>((props, ref) => (\n    <AddBox {...props} ref={ref} />\n  )),\n  Check: forwardRef<SVGSVGElement>((props, ref) => (\n    <Check {...props} ref={ref} />\n  )),\n  Clear: forwardRef<SVGSVGElement>((props, ref) => (\n    <Clear {...props} ref={ref} />\n  )),\n  Delete: forwardRef<SVGSVGElement>((props, ref) => (\n    <DeleteOutline {...props} ref={ref} />\n  )),\n  DetailPanel: forwardRef<SVGSVGElement>((props, ref) => (\n    <ChevronRight {...props} ref={ref} />\n  )),\n  Edit: forwardRef<SVGSVGElement>((props, ref) => (\n    <Edit {...props} ref={ref} />\n  )),\n  Export: forwardRef<SVGSVGElement>((props, ref) => (\n    <SaveAlt {...props} ref={ref} />\n  )),\n  Filter: forwardRef<SVGSVGElement>((props, ref) => (\n    <FilterList {...props} ref={ref} />\n  )),\n  FirstPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <FirstPage {...props} ref={ref} />\n  )),\n  LastPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <LastPage {...props} ref={ref} />\n  )),\n  NextPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <ChevronRight {...props} ref={ref} />\n  )),\n  PreviousPage: forwardRef<SVGSVGElement>((props, ref) => (\n    <ChevronLeft {...props} ref={ref} />\n  )),\n  ResetSearch: forwardRef<SVGSVGElement>((props, ref) => (\n    <Clear {...props} ref={ref} />\n  )),\n  Search: forwardRef<SVGSVGElement>((props, ref) => (\n    <Search {...props} ref={ref} />\n  )),\n  SortArrow: forwardRef<SVGSVGElement>((props, ref) => (\n    <ArrowUpward {...props} ref={ref} />\n  )),\n  ThirdStateCheck: forwardRef<SVGSVGElement>((props, ref) => (\n    <Remove {...props} ref={ref} />\n  )),\n  ViewColumn: forwardRef<SVGSVGElement>((props, ref) => (\n    <ViewColumn {...props} ref={ref} />\n  )),\n};\n\n// TODO: Material table might already have such a function internally that we can use?\nfunction extractValueByField(data: any, field: string): any | undefined {\n  const path = field.split('.');\n  let value = data[path[0]];\n\n  for (let i = 1; i < path.length; ++i) {\n    if (value === undefined) {\n      return value;\n    }\n\n    const f = path[i];\n    value = value[f];\n  }\n\n  return value;\n}\n\nexport type TableHeaderClassKey = 'header';\n\nconst StyledMTableHeader = withStyles(\n  theme => ({\n    header: {\n      padding: theme.spacing(1, 2, 1, 2.5),\n      borderTop: `1px solid ${theme.palette.grey.A100}`,\n      borderBottom: `1px solid ${theme.palette.grey.A100}`,\n      // withStyles hasn't a generic overload for theme\n      fontWeight: theme.typography.fontWeightBold,\n      position: 'static',\n      wordBreak: 'normal',\n      textTransform: 'uppercase',\n    },\n  }),\n  { name: 'BackstageTableHeader' },\n)(MTableHeader);\n\nexport type TableToolbarClassKey = 'root' | 'title' | 'searchField';\n\nconst StyledMTableToolbar = withStyles(\n  theme => ({\n    root: {\n      padding: theme.spacing(3, 0, 2.5, 2.5),\n    },\n    title: {\n      '& > h6': {\n        fontWeight: theme.typography.fontWeightBold,\n      },\n    },\n    searchField: {\n      paddingRight: theme.spacing(2),\n    },\n  }),\n  { name: 'BackstageTableToolbar' },\n)(MTableToolbar);\n\n/** @public */\nexport type FiltersContainerClassKey = 'root' | 'title';\n\nconst useFilterStyles = makeStyles(\n  theme => ({\n    root: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      flexWrap: 'wrap',\n    },\n    title: {\n      fontWeight: theme.typography.fontWeightBold,\n      fontSize: 18,\n      whiteSpace: 'nowrap',\n    },\n  }),\n  { name: 'BackstageTableFiltersContainer' },\n);\n\nexport type TableClassKey = 'root';\n\nconst useTableStyles = makeStyles(\n  () => ({\n    root: {\n      display: 'flex',\n      alignItems: 'start',\n    },\n  }),\n  { name: 'BackstageTable' },\n);\n\nfunction convertColumns<T extends object>(\n  columns: TableColumn<T>[],\n  theme: Theme,\n): TableColumn<T>[] {\n  return columns.map(column => {\n    const headerStyle: CSSProperties = column.headerStyle ?? {};\n\n    let cellStyle = column.cellStyle || {};\n\n    if (column.highlight) {\n      headerStyle.color = theme.palette.textContrast;\n\n      if (typeof cellStyle === 'object') {\n        (cellStyle as CSSProperties).fontWeight =\n          theme.typography.fontWeightBold;\n      } else {\n        const cellStyleFn = cellStyle as (\n          data: any,\n          rowData: T,\n          column?: Column<T>,\n        ) => CSSProperties;\n        cellStyle = (data, rowData, rowColumn) => {\n          const style = cellStyleFn(data, rowData, rowColumn);\n          return { ...style, fontWeight: theme.typography.fontWeightBold };\n        };\n      }\n    }\n\n    return {\n      ...column,\n      headerStyle,\n      cellStyle,\n    };\n  });\n}\n\nfunction removeDefaultValues(state: any, defaultState: any): any {\n  return transform(state, (result, value, key) => {\n    if (!isEqual(value, defaultState[key])) {\n      result[key] = value;\n    }\n  });\n}\n\nconst defaultInitialState = {\n  search: '',\n  filtersOpen: false,\n  filters: {},\n};\n\nexport interface TableColumn<T extends object = {}> extends Column<T> {\n  highlight?: boolean;\n  width?: string;\n}\n\nexport type TableFilter = {\n  column: string;\n  type: 'select' | 'multiple-select';\n};\n\nexport type TableState = {\n  search?: string;\n  filtersOpen?: boolean;\n  filters?: SelectedFilters;\n};\n\nexport interface TableProps<T extends object = {}>\n  extends MaterialTableProps<T> {\n  columns: TableColumn<T>[];\n  subtitle?: string;\n  filters?: TableFilter[];\n  initialState?: TableState;\n  emptyContent?: ReactNode;\n  isLoading?: boolean;\n  onStateChange?: (state: TableState) => any;\n}\n\nexport interface TableOptions<T extends object = {}> extends Options<T> {}\n\nexport function TableToolbar(toolbarProps: {\n  toolbarRef: MutableRefObject<any>;\n  setSearch: (value: string) => void;\n  onSearchChanged: (value: string) => void;\n  toggleFilters: () => void;\n  hasFilters: boolean;\n  selectedFiltersLength: number;\n}) {\n  const {\n    toolbarRef,\n    setSearch,\n    hasFilters,\n    selectedFiltersLength,\n    toggleFilters,\n  } = toolbarProps;\n  const { t } = useTranslationRef(coreComponentsTranslationRef);\n  const filtersClasses = useFilterStyles();\n  const onSearchChanged = useCallback(\n    (searchText: string) => {\n      toolbarProps.onSearchChanged(searchText);\n      setSearch(searchText);\n    },\n    [toolbarProps, setSearch],\n  );\n\n  if (hasFilters) {\n    return (\n      <Box className={filtersClasses.root}>\n        <Box className={filtersClasses.root}>\n          <IconButton onClick={toggleFilters} aria-label=\"filter list\">\n            <FilterList />\n          </IconButton>\n          <Typography className={filtersClasses.title}>\n            {t('table.filter.title')} ({selectedFiltersLength})\n          </Typography>\n        </Box>\n        <StyledMTableToolbar\n          {...toolbarProps}\n          ref={toolbarRef}\n          onSearchChanged={onSearchChanged}\n        />\n      </Box>\n    );\n  }\n\n  return (\n    <StyledMTableToolbar\n      {...toolbarProps}\n      ref={toolbarRef}\n      onSearchChanged={onSearchChanged}\n    />\n  );\n}\n\n/**\n * @public\n */\nexport function Table<T extends object = {}>(props: TableProps<T>) {\n  const {\n    data,\n    columns,\n    emptyContent,\n    options,\n    title,\n    subtitle,\n    localization,\n    filters,\n    initialState,\n    onStateChange,\n    components,\n    isLoading: loading,\n    style,\n    ...restProps\n  } = props;\n  const { t } = useTranslationRef(coreComponentsTranslationRef);\n  const tableClasses = useTableStyles();\n\n  const theme = useTheme();\n\n  const calculatedInitialState = { ...defaultInitialState, ...initialState };\n\n  const [filtersOpen, setFiltersOpen] = useState(\n    calculatedInitialState.filtersOpen,\n  );\n  const toggleFilters = useCallback(\n    () => setFiltersOpen(v => !v),\n    [setFiltersOpen],\n  );\n\n  const [selectedFilters, setSelectedFilters] = useState(\n    calculatedInitialState.filters,\n  );\n\n  const [search, setSearch] = useState(calculatedInitialState.search);\n\n  useEffect(() => {\n    if (onStateChange) {\n      const state = removeDefaultValues(\n        {\n          search,\n          filtersOpen,\n          filters: selectedFilters,\n        },\n        defaultInitialState,\n      );\n\n      onStateChange(state);\n    }\n  }, [search, filtersOpen, selectedFilters, onStateChange]);\n\n  const getFieldByTitle = useCallback(\n    (titleValue: string | keyof T) =>\n      columns.find(el => el.title === titleValue)?.field,\n    [columns],\n  );\n\n  const tableData = useMemo(() => {\n    if (typeof data === 'function' || !selectedFilters) {\n      return data;\n    }\n\n    const selectedFiltersArray = Object.values(selectedFilters);\n    if (data && selectedFiltersArray.flat().length) {\n      const newData = (data as any[]).filter(\n        el =>\n          !!Object.entries(selectedFilters)\n            .filter(([, value]) => !!(value as { length?: number }).length)\n            .every(([key, filterValue]) => {\n              const fieldValue = extractValueByField(\n                el,\n                getFieldByTitle(key) as string,\n              );\n\n              if (Array.isArray(fieldValue) && Array.isArray(filterValue)) {\n                return fieldValue.some(v => filterValue.includes(v));\n              } else if (Array.isArray(fieldValue)) {\n                return fieldValue.includes(filterValue);\n              } else if (Array.isArray(filterValue)) {\n                return filterValue.includes(fieldValue);\n              }\n\n              return fieldValue === filterValue;\n            }),\n      );\n      return newData;\n    }\n    return data;\n  }, [data, selectedFilters, getFieldByTitle]);\n\n  const selectedFiltersLength = Object.values(selectedFilters).flat().length;\n\n  const hasFilters = !!filters?.length;\n  const Toolbar = useCallback(\n    (toolbarProps: any /* no type for this in material-table */) => {\n      return (\n        <TableToolbar\n          setSearch={setSearch}\n          hasFilters={hasFilters}\n          selectedFiltersLength={selectedFiltersLength}\n          toggleFilters={toggleFilters}\n          {...toolbarProps}\n        />\n      );\n    },\n    [toggleFilters, hasFilters, selectedFiltersLength, setSearch],\n  );\n\n  const hasNoRows = typeof data !== 'function' && data.length === 0;\n  const columnCount = columns.length;\n  const Body = useMemo(\n    () => makeBody({ hasNoRows, emptyContent, columnCount, loading }),\n    [hasNoRows, emptyContent, columnCount, loading],\n  );\n\n  return (\n    <Box className={tableClasses.root}>\n      {filtersOpen && data && typeof data !== 'function' && filters?.length && (\n        <Filters\n          filters={constructFilters(filters, data as any[], columns, t)}\n          selectedFilters={selectedFilters}\n          onChangeFilters={setSelectedFilters}\n        />\n      )}\n      <MTable<T>\n        components={{\n          Header: StyledMTableHeader,\n          Body,\n          Toolbar,\n          ...components,\n        }}\n        options={options}\n        columns={convertColumns(columns, theme)}\n        icons={tableIcons}\n        title={\n          <>\n            <Typography variant=\"h5\" component=\"h2\">\n              {title}\n            </Typography>\n            {subtitle && (\n              <Typography color=\"textSecondary\" variant=\"body1\">\n                {subtitle}\n              </Typography>\n            )}\n          </>\n        }\n        data={tableData}\n        style={{ width: '100%', ...style }}\n        localization={{\n          ...localization,\n          body: {\n            emptyDataSourceMessage: t('table.body.emptyDataSourceMessage'),\n            ...localization?.body,\n          },\n          pagination: {\n            firstTooltip: t('table.pagination.firstTooltip'),\n            labelDisplayedRows: t('table.pagination.labelDisplayedRows'),\n            labelRowsSelect: t('table.pagination.labelRowsSelect'),\n            lastTooltip: t('table.pagination.lastTooltip'),\n            nextTooltip: t('table.pagination.nextTooltip'),\n            previousTooltip: t('table.pagination.previousTooltip'),\n            ...localization?.pagination,\n          },\n          header: {\n            actions: t('table.header.actions'),\n            ...localization?.header,\n          },\n          toolbar: {\n            searchPlaceholder: t('table.toolbar.search'),\n            searchTooltip: t('table.toolbar.search'),\n            ...localization?.toolbar,\n          },\n        }}\n        {...restProps}\n      />\n    </Box>\n  );\n}\n\nTable.icons = Object.freeze(tableIcons);\n\nfunction makeBody({\n  columnCount,\n  emptyContent,\n  hasNoRows,\n  loading,\n}: {\n  hasNoRows: boolean;\n  emptyContent: ReactNode;\n  columnCount: number;\n  loading?: boolean;\n}) {\n  return (bodyProps: any /* no type for this in material-table */) => {\n    if (loading) {\n      return <TableLoadingBody colSpan={columnCount} />;\n    }\n\n    if (emptyContent && hasNoRows) {\n      return (\n        <tbody>\n          <tr>\n            <td colSpan={columnCount}>{emptyContent}</td>\n          </tr>\n        </tbody>\n      );\n    }\n\n    return <MTableBody {...bodyProps} />;\n  };\n}\n\nfunction constructFilters<T extends object>(\n  filterConfig: TableFilter[],\n  dataValue: any[] | undefined,\n  columns: TableColumn<T>[],\n  t: TranslationFunction<typeof coreComponentsTranslationRef.T>,\n): Filter[] {\n  const extractDistinctValues = (field: string | keyof T): Set<any> => {\n    const distinctValues = new Set<any>();\n    const addValue = (value: any) => {\n      if (value !== undefined && value !== null) {\n        distinctValues.add(value);\n      }\n    };\n\n    if (dataValue) {\n      dataValue.forEach(el => {\n        const value = extractValueByField(\n          el,\n          columns.find(c => c.title === field)?.field as string,\n        );\n\n        if (Array.isArray(value)) {\n          (value as []).forEach(addValue);\n        } else {\n          addValue(value);\n        }\n      });\n    }\n\n    return distinctValues;\n  };\n\n  const constructSelect = (\n    filter: TableFilter,\n  ): Without<SelectProps, 'onChange'> => {\n    return {\n      placeholder: t('table.filter.placeholder'),\n      label: filter.column,\n      multiple: filter.type === 'multiple-select',\n      items: [...extractDistinctValues(filter.column)].sort().map(value => ({\n        label: value,\n        value,\n      })),\n    };\n  };\n\n  return filterConfig.map(filter => ({\n    type: filter.type,\n    element: constructSelect(filter),\n  }));\n}\n"],"names":["ChevronLeft"],"mappings":"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"}

package/dist/layout/ItemCard/ItemCardHeader.esm.js

@@ -5,7 +5,7 @@ import Typography from '@material-ui/core/Typography';
 
 const styles = (theme) => createStyles({
   root: {
-    color: theme.palette.text.primary,
+    color: theme.getPageTheme({ themeId: "card" }).fontColor,
     padding: theme.spacing(2, 2, 3),
     backgroundImage: theme.getPageTheme({ themeId: "card" }).backgroundImage,
     backgroundPosition: 0,

package/dist/layout/ItemCard/ItemCardHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ItemCardHeader.esm.js","sources":["../../../src/layout/ItemCard/ItemCardHeader.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\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 Box from '@material-ui/core/Box';\nimport {\n  createStyles,\n  makeStyles,\n  Theme,\n  WithStyles,\n} from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport { ReactNode } from 'react';\n\n/** @public */\nexport type ItemCardHeaderClassKey = 'root';\n\nconst styles = (theme: Theme) =>\n  createStyles({\n    root: {\n      color: theme.palette.text.primary,\n      padding: theme.spacing(2, 2, 3),\n      backgroundImage: theme.getPageTheme({ themeId: 'card' }).backgroundImage,\n      backgroundPosition: 0,\n      backgroundSize: 'inherit',\n    },\n  });\n\nconst useStyles = makeStyles(styles, { name: 'BackstageItemCardHeader' });\n\n/** @public */\nexport type ItemCardHeaderProps = Partial<WithStyles<typeof styles>> & {\n  /**\n   * A large title to show in the header, providing the main heading.\n   *\n   * Use this if you want to have the default styling and placement of a title.\n   */\n  title?: ReactNode;\n  /**\n   * A slightly smaller title to show in the header, providing additional\n   * details.\n   *\n   * Use this if you want to have the default styling and placement of a\n   * subtitle.\n   */\n  subtitle?: ReactNode;\n  /**\n   * Custom children to draw in the header.\n   *\n   * If the title and/or subtitle were specified, the children are drawn below\n   * those.\n   */\n  children?: ReactNode;\n};\n\n/**\n * A simple card header, rendering a default look for \"item cards\" - cards that\n * are arranged in a grid for users to select among several options.\n *\n * @remarks\n * This component expects to be placed within a Material UI `<CardMedia>`.\n *\n * Styles for the header can be overridden using the `classes` prop, e.g.:\n *\n * `<ItemCardHeader title=\"Hello\" classes={{ root: myClassName }} />`\n *\n * @public\n */\nexport function ItemCardHeader(props: ItemCardHeaderProps) {\n  const { title, subtitle, children } = props;\n  const classes = useStyles(props);\n  return (\n    <Box className={classes.root}>\n      {subtitle && (\n        <Typography variant=\"subtitle2\" component=\"h3\">\n          {subtitle}\n        </Typography>\n      )}\n      {title && (\n        <Typography variant=\"h6\" component=\"h4\">\n          {title}\n        </Typography>\n      )}\n      {children}\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;AA6BA,MAAM,MAAA,GAAS,CAAC,KAAA,KACd,YAAA,CAAa;AAAA,EACX,IAAA,EAAM;AAAA,IACJ,KAAA,EAAO,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,OAAA;AAAA,IAC1B,OAAA,EAAS,KAAA,CAAM,OAAA,CAAQ,CAAA,EAAG,GAAG,CAAC,CAAA;AAAA,IAC9B,iBAAiB,KAAA,CAAM,YAAA,CAAa,EAAE,OAAA,EAAS,MAAA,EAAQ,CAAA,CAAE,eAAA;AAAA,IACzD,kBAAA,EAAoB,CAAA;AAAA,IACpB,cAAA,EAAgB;AAAA;AAEpB,CAAC,CAAA;AAEH,MAAM,YAAY,UAAA,CAAW,MAAA,EAAQ,EAAE,IAAA,EAAM,2BAA2B,CAAA;AAwCjE,SAAS,eAAe,KAAA,EAA4B;AACzD,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,QAAA,EAAS,GAAI,KAAA;AACtC,EAAA,MAAM,OAAA,GAAU,UAAU,KAAK,CAAA;AAC/B,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,IAAA,EACrB,QAAA,EAAA;AAAA,IAAA,QAAA,wBACE,UAAA,EAAA,EAAW,OAAA,EAAQ,WAAA,EAAY,SAAA,EAAU,MACvC,QAAA,EAAA,QAAA,EACH,CAAA;AAAA,IAED,yBACC,GAAA,CAAC,UAAA,EAAA,EAAW,SAAQ,IAAA,EAAK,SAAA,EAAU,MAChC,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,IAED;AAAA,GAAA,EACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"ItemCardHeader.esm.js","sources":["../../../src/layout/ItemCard/ItemCardHeader.tsx"],"sourcesContent":["/*\n * Copyright 2021 The Backstage Authors\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 Box from '@material-ui/core/Box';\nimport {\n  createStyles,\n  makeStyles,\n  Theme,\n  WithStyles,\n} from '@material-ui/core/styles';\nimport Typography from '@material-ui/core/Typography';\nimport { ReactNode } from 'react';\n\n/** @public */\nexport type ItemCardHeaderClassKey = 'root';\n\nconst styles = (theme: Theme) =>\n  createStyles({\n    root: {\n      color: theme.getPageTheme({ themeId: 'card' }).fontColor,\n      padding: theme.spacing(2, 2, 3),\n      backgroundImage: theme.getPageTheme({ themeId: 'card' }).backgroundImage,\n      backgroundPosition: 0,\n      backgroundSize: 'inherit',\n    },\n  });\n\nconst useStyles = makeStyles(styles, { name: 'BackstageItemCardHeader' });\n\n/** @public */\nexport type ItemCardHeaderProps = Partial<WithStyles<typeof styles>> & {\n  /**\n   * A large title to show in the header, providing the main heading.\n   *\n   * Use this if you want to have the default styling and placement of a title.\n   */\n  title?: ReactNode;\n  /**\n   * A slightly smaller title to show in the header, providing additional\n   * details.\n   *\n   * Use this if you want to have the default styling and placement of a\n   * subtitle.\n   */\n  subtitle?: ReactNode;\n  /**\n   * Custom children to draw in the header.\n   *\n   * If the title and/or subtitle were specified, the children are drawn below\n   * those.\n   */\n  children?: ReactNode;\n};\n\n/**\n * A simple card header, rendering a default look for \"item cards\" - cards that\n * are arranged in a grid for users to select among several options.\n *\n * @remarks\n * This component expects to be placed within a Material UI `<CardMedia>`.\n *\n * Styles for the header can be overridden using the `classes` prop, e.g.:\n *\n * `<ItemCardHeader title=\"Hello\" classes={{ root: myClassName }} />`\n *\n * @public\n */\nexport function ItemCardHeader(props: ItemCardHeaderProps) {\n  const { title, subtitle, children } = props;\n  const classes = useStyles(props);\n  return (\n    <Box className={classes.root}>\n      {subtitle && (\n        <Typography variant=\"subtitle2\" component=\"h3\">\n          {subtitle}\n        </Typography>\n      )}\n      {title && (\n        <Typography variant=\"h6\" component=\"h4\">\n          {title}\n        </Typography>\n      )}\n      {children}\n    </Box>\n  );\n}\n"],"names":[],"mappings":";;;;;AA6BA,MAAM,MAAA,GAAS,CAAC,KAAA,KACd,YAAA,CAAa;AAAA,EACX,IAAA,EAAM;AAAA,IACJ,OAAO,KAAA,CAAM,YAAA,CAAa,EAAE,OAAA,EAAS,MAAA,EAAQ,CAAA,CAAE,SAAA;AAAA,IAC/C,OAAA,EAAS,KAAA,CAAM,OAAA,CAAQ,CAAA,EAAG,GAAG,CAAC,CAAA;AAAA,IAC9B,iBAAiB,KAAA,CAAM,YAAA,CAAa,EAAE,OAAA,EAAS,MAAA,EAAQ,CAAA,CAAE,eAAA;AAAA,IACzD,kBAAA,EAAoB,CAAA;AAAA,IACpB,cAAA,EAAgB;AAAA;AAEpB,CAAC,CAAA;AAEH,MAAM,YAAY,UAAA,CAAW,MAAA,EAAQ,EAAE,IAAA,EAAM,2BAA2B,CAAA;AAwCjE,SAAS,eAAe,KAAA,EAA4B;AACzD,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,QAAA,EAAS,GAAI,KAAA;AACtC,EAAA,MAAM,OAAA,GAAU,UAAU,KAAK,CAAA;AAC/B,EAAA,uBACE,IAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAW,OAAA,CAAQ,IAAA,EACrB,QAAA,EAAA;AAAA,IAAA,QAAA,wBACE,UAAA,EAAA,EAAW,OAAA,EAAQ,WAAA,EAAY,SAAA,EAAU,MACvC,QAAA,EAAA,QAAA,EACH,CAAA;AAAA,IAED,yBACC,GAAA,CAAC,UAAA,EAAA,EAAW,SAAQ,IAAA,EAAK,SAAA,EAAU,MAChC,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,IAED;AAAA,GAAA,EACH,CAAA;AAEJ;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@backstage/core-components",
-  "version": "0.18.4",
+  "version": "0.18.5",
   "description": "Core components used by Backstage plugins and apps",
   "backstage": {
     "role": "web-library"
@@ -89,6 +89,7 @@
     "linkify-react": "4.3.2",
     "linkifyjs": "4.3.2",
     "lodash": "^4.17.21",
+    "parse5": "^6.0.0",
     "pluralize": "^8.0.0",
     "qs": "^6.9.4",
     "rc-progress": "3.5.1",
@@ -102,13 +103,15 @@
     "react-use": "^17.3.2",
     "react-virtualized-auto-sizer": "^1.0.11",
     "react-window": "^1.8.6",
+    "rehype-raw": "^6.0.0",
+    "rehype-sanitize": "^5.0.0",
     "remark-gfm": "^3.0.1",
     "zen-observable": "^0.10.0",
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@backstage/app-defaults": "^1.7.3",
-    "@backstage/cli": "^0.35.0",
+    "@backstage/app-defaults": "^1.7.4",
+    "@backstage/cli": "^0.35.2",
     "@backstage/core-app-api": "^1.19.3",
     "@backstage/test-utils": "^1.7.14",
     "@testing-library/dom": "^10.0.0",