@vaadin/hilla-react-crud 24.6.0 → 24.6.2

package/autogrid.js

@@ -149,7 +149,7 @@ function AutoGridInner({
   const [internalFilter, setInternalFilter] = useState({ "@type": "and", children: [] });
   const [itemCounts, setItemCounts] = useState();
   const gridRef = useRef(null);
-  const dataProviderRef = useRef();
+  const dataProviderRef = useRef(void 0);
   useImperativeHandle(
     ref,
     () => ({

package/autogrid.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["src/autogrid.tsx"],
-  "sourcesContent": ["import type { AbstractModel, DetachedModelConstructor } from '@vaadin/hilla-lit-form';\nimport { Grid, type GridElement, type GridProps } from '@vaadin/react-components/Grid.js';\nimport { GridColumn } from '@vaadin/react-components/GridColumn.js';\nimport { GridColumnGroup } from '@vaadin/react-components/GridColumnGroup.js';\nimport {\n  cloneElement,\n  type ComponentType,\n  type ForwardedRef,\n  forwardRef,\n  type JSX,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ColumnContext, CustomColumnContext, type SortState } from './autogrid-column-context.js';\nimport { type ColumnOptions, getColumnOptions } from './autogrid-columns.js';\nimport { AutoGridFooterItemCountRenderer, AutoGridRowNumberRenderer, FooterContext } from './autogrid-renderers.js';\nimport css from './autogrid.obj.js';\nimport type { ListService } from './crud';\nimport { createDataProvider, type DataProvider, isCountService, type ItemCounts } from './data-provider.js';\nimport { type HeaderFilterRendererProps, NoHeaderFilter, HeaderFilterWrapper } from './header-filter';\nimport { HeaderSorter } from './header-sorter';\nimport { getDefaultProperties, ModelInfo, type PropertyInfo } from './model-info.js';\nimport type AndFilter from './types/com/vaadin/hilla/crud/filter/AndFilter.js';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion.js';\nimport { isFilterEmpty, registerStylesheet } from './util';\n\nregisterStylesheet(css);\n\nexport interface AutoGridRef<TItem = any> {\n  /**\n   * The underlying vaadin-grid DOM element.\n   */\n  grid: GridElement<TItem> | null;\n\n  /**\n   * Refreshes the grid by reloading the data from the backend.\n   */\n  refresh(): void;\n}\n\ninterface AutoGridOwnProps<TItem> {\n  /**\n   * The service to use for fetching the data. This must be a TypeScript service\n   * that has been generated by Hilla from a backend Java service that\n   * implements the `com.vaadin.hilla.crud.ListService` interface.\n   */\n  service: ListService<TItem>;\n  /**\n   * The entity model to use for the grid, which determines which columns to\n   * show and how to render them. This must be a Typescript model class that has\n   * been generated by Hilla from a backend Java class. The model must match\n   * with the type of the items returned by the service. For example, a\n   * `PersonModel` can be used with a service that returns `Person` instances.\n   *\n   * By default, the grid shows columns for all properties of the model which\n   * have a type that is supported. Use the `visibleColumns` option to customize\n   * which columns to show and in which order.\n   */\n  model: DetachedModelConstructor<AbstractModel<TItem>>;\n  /**\n   * The property to use to detect an item's ID. The item ID is used to keep\n   * the selection state when reloading the grid.\n   *\n   * By default, the component uses the property annotated with\n   * `jakarta.persistence.Id`, or a property named `id`, in that order.\n   * This option can be used to override the default behavior, or define the ID\n   * property in case a class doesn't have a property matching the defaults.\n   */\n  itemIdProperty?: string;\n  /**\n   * Allows to provide a filter that is applied when fetching data from the\n   * service. This can be used for implementing an external filter UI outside\n   * the grid. A custom filter is not compatible with header filters.\n   *\n   * **NOTE:** This is considered an experimental feature and the API may change\n   * in the future.\n   */\n  experimentalFilter?: FilterUnion;\n  /**\n   * Allows to customize which columns to show and in which order. This must be\n   * an array of property names that are defined in the model. Nested properties\n   * can be specified using dot notation, e.g. `address.street`.\n   */\n  visibleColumns?: string[];\n  /**\n   * Allows to customize which columns to hide. This must be an array of property\n   * names that are defined in the model. Nested properties can be specified using\n   * dot notation, e.g. `address.street`.\n   */\n  hiddenColumns?: string[];\n  /**\n   * Disables header filters, which are otherwise enabled by default.\n   */\n  noHeaderFilters?: boolean;\n  /**\n   * Allows to add custom columns to the grid. This must be an array of\n   * `GridColumn` component instances. Custom columns are added after the\n   * auto-generated columns.\n   */\n  customColumns?: JSX.Element[];\n  /**\n   * Allows to customize the props for individual columns. This is an object\n   * where the keys must be property names that are defined in the model, and\n   * the values are props that are accepted by the `GridColumn` component.\n   * Nested properties can be specified using dot notation, e.g.\n   * `address.street`.\n   */\n  columnOptions?: Record<string, ColumnOptions>;\n  /**\n   * When enabled, inserts a column with row numbers at the beginning of the\n   * grid.\n   */\n  rowNumbers?: boolean;\n  /**\n   * When enabled, shows the total count of items in the grid footer.\n   * This requires the provided service to implement the CountService interface,\n   *  otherwise an error will be logged to the console, without any count being\n   *  rendered.\n   */\n  totalCount?: boolean;\n  /**\n   * When enabled, shows the filtered item count in the grid footer.\n   * if totalCount is also enabled, it will show both totalCount and filteredCount.\n   * This requires the provided service to implement the CountService interface,\n   *  otherwise an error will be logged to the console, without any count being\n   *  rendered.\n   */\n  filteredCount?: boolean;\n  /**\n   * Allows to customize the grid footer with a custom renderer component for\n   *  the total count and filtered item count.\n   * This requires the provided service to implement the CountService interface,\n   * See {@link AutoGrid#totalCount} and {@link AutoGrid#filteredCount}.\n   */\n  footerCountRenderer?: ComponentType<ItemCounts>;\n}\n\nexport type AutoGridProps<TItem> = GridProps<TItem> & Readonly<AutoGridOwnProps<TItem>>;\n\ninterface ColumnConfigurationOptions {\n  visibleColumns?: string[];\n  hiddenColumns?: string[];\n  noHeaderFilters?: boolean;\n  customColumns?: JSX.Element[];\n  columnOptions?: Record<string, ColumnOptions>;\n  rowNumbers?: boolean;\n  totalCount?: boolean;\n  filteredCount?: boolean;\n  footerCountRenderer?: ComponentType<ItemCounts>;\n  itemCounts?: ItemCounts;\n}\n\nfunction wrapCustomColumn(\n  column: JSX.Element,\n  setColumnFilter: (filter: FilterUnion, filterKey: string) => void,\n  options: ColumnConfigurationOptions,\n) {\n  const key = column.key ?? 'no-key';\n  const { header, headerRenderer } = column.props;\n  const customOptions = options.columnOptions?.[key];\n  const { header: customHeader, headerRenderer: customHeaderRenderer, headerFilterRenderer } = customOptions ?? {};\n  const columnWithoutHeader = cloneElement(column, {\n    header: null,\n    headerRenderer: HeaderFilterWrapper,\n  });\n  return (\n    <CustomColumnContext.Provider\n      key={key}\n      value={{\n        setColumnFilter,\n        headerFilterRenderer: headerFilterRenderer ?? NoHeaderFilter,\n        filterKey: key,\n      }}\n    >\n      <GridColumnGroup\n        key={key}\n        header={customHeader ?? header}\n        headerRenderer={customHeaderRenderer ?? headerRenderer}\n      >\n        {columnWithoutHeader}\n      </GridColumnGroup>\n    </CustomColumnContext.Provider>\n  );\n}\n\nfunction addCustomColumns(\n  columns: JSX.Element[],\n  options: ColumnConfigurationOptions,\n  setColumnFilter: (filter: FilterUnion, filterKey: string) => void,\n): JSX.Element[] {\n  if (!options.customColumns) {\n    return columns;\n  }\n\n  // When using header filters, wrap custom columns into column groups and\n  // move header text or renderer to group\n  const customColumns = options.noHeaderFilters\n    ? options.customColumns\n    : options.customColumns.map((column) => wrapCustomColumn(column, setColumnFilter, options));\n\n  // When using a custom column order, insert custom columns into auto-generated\n  // ones using their `key`\n  if (options.visibleColumns) {\n    const columnMap = [...columns, ...customColumns].reduce((map, column) => {\n      const { key } = column;\n      if (key) {\n        map.set(key, column);\n      }\n      return map;\n    }, new Map<string, JSX.Element>());\n\n    return options.visibleColumns.map((path) => columnMap.get(path)).filter(Boolean) as JSX.Element[];\n  }\n\n  // Otherwise just append custom columns at the end\n  return [...columns, ...customColumns];\n}\n\nfunction useColumns(\n  properties: PropertyInfo[],\n  setColumnFilter: (filter: FilterUnion, filterKey: string) => void,\n  options: ColumnConfigurationOptions,\n) {\n  const sortableProperties = properties.filter(\n    (propertyInfo) => options.columnOptions?.[propertyInfo.name]?.sortable !== false,\n  );\n  const [sortState, setSortState] = useState<SortState>(\n    sortableProperties.length > 0 ? { [sortableProperties[0].name]: { direction: 'asc' } } : {},\n  );\n  let columns = properties.map((propertyInfo) => {\n    let column;\n    const customColumnOptions = options.columnOptions?.[propertyInfo.name];\n\n    const { headerFilterRenderer, ...columnProps } = getColumnOptions(propertyInfo, customColumnOptions);\n\n    if (!options.noHeaderFilters) {\n      column = (\n        <GridColumnGroup headerRenderer={HeaderSorter}>\n          <GridColumn path={propertyInfo.name} headerRenderer={HeaderFilterWrapper} {...columnProps}></GridColumn>\n        </GridColumnGroup>\n      );\n    } else {\n      column = <GridColumn path={propertyInfo.name} headerRenderer={HeaderSorter} {...columnProps}></GridColumn>;\n    }\n    return (\n      <ColumnContext.Provider\n        key={propertyInfo.name}\n        value={{\n          propertyInfo,\n          setColumnFilter,\n          sortState,\n          setSortState,\n          customColumnOptions,\n          headerFilterRenderer: headerFilterRenderer ?? NoHeaderFilter,\n          filterKey: propertyInfo.name,\n        }}\n      >\n        {column}\n      </ColumnContext.Provider>\n    );\n  });\n\n  columns = addCustomColumns(columns, options, setColumnFilter);\n\n  // When using `hiddenColumns` option, remove columns to hide using their `key`\n  if (options.hiddenColumns) {\n    columns = columns.filter(({ key }) => !(key && options.hiddenColumns?.includes(key)));\n  }\n\n  if (options.rowNumbers) {\n    columns = [\n      <GridColumn key=\"rownumbers\" width=\"4em\" flexGrow={0} renderer={AutoGridRowNumberRenderer}></GridColumn>,\n      ...columns,\n    ];\n  }\n  const { totalCount, filteredCount, itemCounts, footerCountRenderer } = options;\n  if (totalCount ?? filteredCount) {\n    const col = (\n      <FooterContext.Provider\n        key=\"grid-footer\"\n        value={{\n          totalCount,\n          filteredCount,\n          footerCountRenderer,\n          itemCounts,\n        }}\n      >\n        <GridColumnGroup footerRenderer={AutoGridFooterItemCountRenderer}>{columns}</GridColumnGroup>\n      </FooterContext.Provider>\n    );\n    columns = [col];\n  }\n\n  return columns;\n}\n\nfunction AutoGridInner<TItem>(\n  {\n    service,\n    model,\n    itemIdProperty,\n    experimentalFilter,\n    visibleColumns,\n    hiddenColumns,\n    noHeaderFilters,\n    customColumns,\n    columnOptions,\n    rowNumbers,\n    totalCount,\n    filteredCount,\n    footerCountRenderer,\n    ...gridProps\n  }: AutoGridProps<TItem>,\n  ref: ForwardedRef<AutoGridRef<TItem>>,\n): JSX.Element {\n  const [internalFilter, setInternalFilter] = useState<AndFilter>({ '@type': 'and', children: [] });\n  const [itemCounts, setItemCounts] = useState<ItemCounts | undefined>();\n  const gridRef = useRef<GridElement<TItem>>(null);\n  const dataProviderRef = useRef<DataProvider<TItem>>();\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      get grid() {\n        return gridRef.current;\n      },\n      refresh() {\n        dataProviderRef.current?.reset();\n        gridRef.current?.clearCache();\n      },\n    }),\n    [],\n  );\n\n  const setHeaderFilter = (filter: FilterUnion, filterKey: string) => {\n    let changed = false;\n    filter.key = filterKey;\n    const indexOfFilter = filterKey\n      ? internalFilter.children.findIndex((f) => (f as FilterUnion).key === filterKey)\n      : -1;\n    const isEmptyFilter = isFilterEmpty(filter);\n\n    if (indexOfFilter >= 0 && isEmptyFilter) {\n      internalFilter.children.splice(indexOfFilter, 1);\n      changed = true;\n    } else if (!isEmptyFilter) {\n      if (indexOfFilter >= 0) {\n        internalFilter.children[indexOfFilter] = filter;\n        changed = true;\n      } else {\n        internalFilter.children.push(filter);\n        changed = true;\n      }\n    }\n    if (changed) {\n      setInternalFilter({ ...internalFilter });\n    }\n  };\n\n  const modelInfo = useMemo(() => new ModelInfo(model, itemIdProperty), [model]);\n  const properties = visibleColumns ? modelInfo.getProperties(visibleColumns) : getDefaultProperties(modelInfo);\n  const children = useColumns(properties, setHeaderFilter, {\n    visibleColumns,\n    hiddenColumns,\n    noHeaderFilters,\n    customColumns,\n    columnOptions,\n    rowNumbers,\n    totalCount,\n    filteredCount,\n    footerCountRenderer,\n    itemCounts,\n  });\n\n  useEffect(() => {\n    // Remove all filtering if header filters are removed\n    if (noHeaderFilters) {\n      setInternalFilter({ '@type': 'and', children: [] });\n    }\n  }, [noHeaderFilters]);\n\n  useEffect(() => {\n    // Log an error if totalCount or filteredCount is enabled but the service doesn't implement CountService\n    if ((!isCountService(service) && totalCount) ?? filteredCount) {\n      console.error(\n        '\"totalCount\" and \"filteredCount\" props require the provided service to implement the CountService interface.',\n      );\n    }\n    // Sets the data provider, should be done only once\n    const grid = gridRef.current!;\n    // Wait for the sorting headers to be rendered so that the sorting state is correct for the first data provider call\n    const timeoutId = setTimeout(() => {\n      let firstUpdate = true;\n      const dataProvider = createDataProvider(service, {\n        initialFilter: experimentalFilter ?? internalFilter,\n        loadTotalCount: totalCount,\n        afterLoad(newItemCounts: ItemCounts) {\n          setItemCounts(newItemCounts);\n\n          if (firstUpdate) {\n            // Workaround for https://github.com/vaadin/react-components/issues/129\n            firstUpdate = false;\n            setTimeout(() => grid.recalculateColumnWidths(), 0);\n          }\n        },\n      });\n      dataProviderRef.current = dataProvider;\n      // eslint-disable-next-line @typescript-eslint/no-misused-promises\n      gridRef.current!.dataProvider = dataProvider.load.bind(dataProvider);\n    }, 1);\n\n    return () => clearTimeout(timeoutId);\n  }, [model, service]);\n\n  useEffect(() => {\n    // Update the filtering, whenever the filter changes\n    const dataProvider = dataProviderRef.current;\n    const grid = gridRef.current;\n    if (grid && dataProvider) {\n      dataProvider.setFilter(experimentalFilter ?? internalFilter);\n      grid.clearCache();\n    }\n  }, [experimentalFilter, internalFilter]);\n\n  return (\n    <Grid itemIdPath={modelInfo.idProperty?.name} {...gridProps} ref={gridRef}>\n      {children}\n    </Grid>\n  );\n}\n\ntype AutoGrid = <TItem>(\n  props: AutoGridProps<TItem> & { ref?: ForwardedRef<AutoGridRef<TItem>> },\n) => ReturnType<typeof AutoGridInner>;\n\n/**\n * Auto Grid is a component for displaying tabular data based on a Java backend\n * service. It automatically generates columns based on the properties of a\n * Java class and provides features such as lazy-loading, sorting and filtering.\n *\n * Example usage:\n * ```tsx\n * import { AutoGrid } from '@vaadin/hilla-react-crud';\n * import PersonService from 'Frontend/generated/endpoints';\n * import PersonModel from 'Frontend/generated/com/example/application/Person';\n *\n * <AutoGrid service={PersonService} model={PersonModel} />\n * ```\n */\nexport const AutoGrid: AutoGrid = forwardRef(AutoGridInner) as AutoGrid;\n\nexport type { ColumnOptions, HeaderFilterRendererProps };\n"],
-  "mappings": "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",
+  "sourcesContent": ["import type { AbstractModel, DetachedModelConstructor } from '@vaadin/hilla-lit-form';\nimport { Grid, type GridElement, type GridProps } from '@vaadin/react-components/Grid.js';\nimport { GridColumn } from '@vaadin/react-components/GridColumn.js';\nimport { GridColumnGroup } from '@vaadin/react-components/GridColumnGroup.js';\nimport {\n  cloneElement,\n  type ComponentType,\n  type ForwardedRef,\n  forwardRef,\n  type JSX,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ColumnContext, CustomColumnContext, type SortState } from './autogrid-column-context.js';\nimport { type ColumnOptions, getColumnOptions } from './autogrid-columns.js';\nimport { AutoGridFooterItemCountRenderer, AutoGridRowNumberRenderer, FooterContext } from './autogrid-renderers.js';\nimport css from './autogrid.obj.js';\nimport type { ListService } from './crud';\nimport { createDataProvider, type DataProvider, isCountService, type ItemCounts } from './data-provider.js';\nimport { type HeaderFilterRendererProps, NoHeaderFilter, HeaderFilterWrapper } from './header-filter';\nimport { HeaderSorter } from './header-sorter';\nimport { getDefaultProperties, ModelInfo, type PropertyInfo } from './model-info.js';\nimport type AndFilter from './types/com/vaadin/hilla/crud/filter/AndFilter.js';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion.js';\nimport { isFilterEmpty, registerStylesheet } from './util';\n\nregisterStylesheet(css);\n\nexport interface AutoGridRef<TItem = any> {\n  /**\n   * The underlying vaadin-grid DOM element.\n   */\n  grid: GridElement<TItem> | null;\n\n  /**\n   * Refreshes the grid by reloading the data from the backend.\n   */\n  refresh(): void;\n}\n\ninterface AutoGridOwnProps<TItem> {\n  /**\n   * The service to use for fetching the data. This must be a TypeScript service\n   * that has been generated by Hilla from a backend Java service that\n   * implements the `com.vaadin.hilla.crud.ListService` interface.\n   */\n  service: ListService<TItem>;\n  /**\n   * The entity model to use for the grid, which determines which columns to\n   * show and how to render them. This must be a Typescript model class that has\n   * been generated by Hilla from a backend Java class. The model must match\n   * with the type of the items returned by the service. For example, a\n   * `PersonModel` can be used with a service that returns `Person` instances.\n   *\n   * By default, the grid shows columns for all properties of the model which\n   * have a type that is supported. Use the `visibleColumns` option to customize\n   * which columns to show and in which order.\n   */\n  model: DetachedModelConstructor<AbstractModel<TItem>>;\n  /**\n   * The property to use to detect an item's ID. The item ID is used to keep\n   * the selection state when reloading the grid.\n   *\n   * By default, the component uses the property annotated with\n   * `jakarta.persistence.Id`, or a property named `id`, in that order.\n   * This option can be used to override the default behavior, or define the ID\n   * property in case a class doesn't have a property matching the defaults.\n   */\n  itemIdProperty?: string;\n  /**\n   * Allows to provide a filter that is applied when fetching data from the\n   * service. This can be used for implementing an external filter UI outside\n   * the grid. A custom filter is not compatible with header filters.\n   *\n   * **NOTE:** This is considered an experimental feature and the API may change\n   * in the future.\n   */\n  experimentalFilter?: FilterUnion;\n  /**\n   * Allows to customize which columns to show and in which order. This must be\n   * an array of property names that are defined in the model. Nested properties\n   * can be specified using dot notation, e.g. `address.street`.\n   */\n  visibleColumns?: string[];\n  /**\n   * Allows to customize which columns to hide. This must be an array of property\n   * names that are defined in the model. Nested properties can be specified using\n   * dot notation, e.g. `address.street`.\n   */\n  hiddenColumns?: string[];\n  /**\n   * Disables header filters, which are otherwise enabled by default.\n   */\n  noHeaderFilters?: boolean;\n  /**\n   * Allows to add custom columns to the grid. This must be an array of\n   * `GridColumn` component instances. Custom columns are added after the\n   * auto-generated columns.\n   */\n  customColumns?: JSX.Element[];\n  /**\n   * Allows to customize the props for individual columns. This is an object\n   * where the keys must be property names that are defined in the model, and\n   * the values are props that are accepted by the `GridColumn` component.\n   * Nested properties can be specified using dot notation, e.g.\n   * `address.street`.\n   */\n  columnOptions?: Record<string, ColumnOptions>;\n  /**\n   * When enabled, inserts a column with row numbers at the beginning of the\n   * grid.\n   */\n  rowNumbers?: boolean;\n  /**\n   * When enabled, shows the total count of items in the grid footer.\n   * This requires the provided service to implement the CountService interface,\n   *  otherwise an error will be logged to the console, without any count being\n   *  rendered.\n   */\n  totalCount?: boolean;\n  /**\n   * When enabled, shows the filtered item count in the grid footer.\n   * if totalCount is also enabled, it will show both totalCount and filteredCount.\n   * This requires the provided service to implement the CountService interface,\n   *  otherwise an error will be logged to the console, without any count being\n   *  rendered.\n   */\n  filteredCount?: boolean;\n  /**\n   * Allows to customize the grid footer with a custom renderer component for\n   *  the total count and filtered item count.\n   * This requires the provided service to implement the CountService interface,\n   * See {@link AutoGrid#totalCount} and {@link AutoGrid#filteredCount}.\n   */\n  footerCountRenderer?: ComponentType<ItemCounts>;\n}\n\nexport type AutoGridProps<TItem> = GridProps<TItem> & Readonly<AutoGridOwnProps<TItem>>;\n\ninterface ColumnConfigurationOptions {\n  visibleColumns?: string[];\n  hiddenColumns?: string[];\n  noHeaderFilters?: boolean;\n  customColumns?: JSX.Element[];\n  columnOptions?: Record<string, ColumnOptions>;\n  rowNumbers?: boolean;\n  totalCount?: boolean;\n  filteredCount?: boolean;\n  footerCountRenderer?: ComponentType<ItemCounts>;\n  itemCounts?: ItemCounts;\n}\n\nfunction wrapCustomColumn(\n  column: JSX.Element,\n  setColumnFilter: (filter: FilterUnion, filterKey: string) => void,\n  options: ColumnConfigurationOptions,\n) {\n  const key = column.key ?? 'no-key';\n  const { header, headerRenderer } = column.props;\n  const customOptions = options.columnOptions?.[key];\n  const { header: customHeader, headerRenderer: customHeaderRenderer, headerFilterRenderer } = customOptions ?? {};\n  const columnWithoutHeader = cloneElement(column, {\n    header: null,\n    headerRenderer: HeaderFilterWrapper,\n  });\n  return (\n    <CustomColumnContext.Provider\n      key={key}\n      value={{\n        setColumnFilter,\n        headerFilterRenderer: headerFilterRenderer ?? NoHeaderFilter,\n        filterKey: key,\n      }}\n    >\n      <GridColumnGroup\n        key={key}\n        header={customHeader ?? header}\n        headerRenderer={customHeaderRenderer ?? headerRenderer}\n      >\n        {columnWithoutHeader}\n      </GridColumnGroup>\n    </CustomColumnContext.Provider>\n  );\n}\n\nfunction addCustomColumns(\n  columns: JSX.Element[],\n  options: ColumnConfigurationOptions,\n  setColumnFilter: (filter: FilterUnion, filterKey: string) => void,\n): JSX.Element[] {\n  if (!options.customColumns) {\n    return columns;\n  }\n\n  // When using header filters, wrap custom columns into column groups and\n  // move header text or renderer to group\n  const customColumns = options.noHeaderFilters\n    ? options.customColumns\n    : options.customColumns.map((column) => wrapCustomColumn(column, setColumnFilter, options));\n\n  // When using a custom column order, insert custom columns into auto-generated\n  // ones using their `key`\n  if (options.visibleColumns) {\n    const columnMap = [...columns, ...customColumns].reduce((map, column) => {\n      const { key } = column;\n      if (key) {\n        map.set(key, column);\n      }\n      return map;\n    }, new Map<string, JSX.Element>());\n\n    return options.visibleColumns.map((path) => columnMap.get(path)).filter(Boolean) as JSX.Element[];\n  }\n\n  // Otherwise just append custom columns at the end\n  return [...columns, ...customColumns];\n}\n\nfunction useColumns(\n  properties: PropertyInfo[],\n  setColumnFilter: (filter: FilterUnion, filterKey: string) => void,\n  options: ColumnConfigurationOptions,\n) {\n  const sortableProperties = properties.filter(\n    (propertyInfo) => options.columnOptions?.[propertyInfo.name]?.sortable !== false,\n  );\n  const [sortState, setSortState] = useState<SortState>(\n    sortableProperties.length > 0 ? { [sortableProperties[0].name]: { direction: 'asc' } } : {},\n  );\n  let columns = properties.map((propertyInfo) => {\n    let column;\n    const customColumnOptions = options.columnOptions?.[propertyInfo.name];\n\n    const { headerFilterRenderer, ...columnProps } = getColumnOptions(propertyInfo, customColumnOptions);\n\n    if (!options.noHeaderFilters) {\n      column = (\n        <GridColumnGroup headerRenderer={HeaderSorter}>\n          <GridColumn path={propertyInfo.name} headerRenderer={HeaderFilterWrapper} {...columnProps}></GridColumn>\n        </GridColumnGroup>\n      );\n    } else {\n      column = <GridColumn path={propertyInfo.name} headerRenderer={HeaderSorter} {...columnProps}></GridColumn>;\n    }\n    return (\n      <ColumnContext.Provider\n        key={propertyInfo.name}\n        value={{\n          propertyInfo,\n          setColumnFilter,\n          sortState,\n          setSortState,\n          customColumnOptions,\n          headerFilterRenderer: headerFilterRenderer ?? NoHeaderFilter,\n          filterKey: propertyInfo.name,\n        }}\n      >\n        {column}\n      </ColumnContext.Provider>\n    );\n  });\n\n  columns = addCustomColumns(columns, options, setColumnFilter);\n\n  // When using `hiddenColumns` option, remove columns to hide using their `key`\n  if (options.hiddenColumns) {\n    columns = columns.filter(({ key }) => !(key && options.hiddenColumns?.includes(key)));\n  }\n\n  if (options.rowNumbers) {\n    columns = [\n      <GridColumn key=\"rownumbers\" width=\"4em\" flexGrow={0} renderer={AutoGridRowNumberRenderer}></GridColumn>,\n      ...columns,\n    ];\n  }\n  const { totalCount, filteredCount, itemCounts, footerCountRenderer } = options;\n  if (totalCount ?? filteredCount) {\n    const col = (\n      <FooterContext.Provider\n        key=\"grid-footer\"\n        value={{\n          totalCount,\n          filteredCount,\n          footerCountRenderer,\n          itemCounts,\n        }}\n      >\n        <GridColumnGroup footerRenderer={AutoGridFooterItemCountRenderer}>{columns}</GridColumnGroup>\n      </FooterContext.Provider>\n    );\n    columns = [col];\n  }\n\n  return columns;\n}\n\nfunction AutoGridInner<TItem>(\n  {\n    service,\n    model,\n    itemIdProperty,\n    experimentalFilter,\n    visibleColumns,\n    hiddenColumns,\n    noHeaderFilters,\n    customColumns,\n    columnOptions,\n    rowNumbers,\n    totalCount,\n    filteredCount,\n    footerCountRenderer,\n    ...gridProps\n  }: AutoGridProps<TItem>,\n  ref: ForwardedRef<AutoGridRef<TItem>>,\n): JSX.Element {\n  const [internalFilter, setInternalFilter] = useState<AndFilter>({ '@type': 'and', children: [] });\n  const [itemCounts, setItemCounts] = useState<ItemCounts | undefined>();\n  const gridRef = useRef<GridElement<TItem>>(null);\n  const dataProviderRef = useRef<DataProvider<TItem>>(undefined);\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      get grid() {\n        return gridRef.current;\n      },\n      refresh() {\n        dataProviderRef.current?.reset();\n        gridRef.current?.clearCache();\n      },\n    }),\n    [],\n  );\n\n  const setHeaderFilter = (filter: FilterUnion, filterKey: string) => {\n    let changed = false;\n    filter.key = filterKey;\n    const indexOfFilter = filterKey\n      ? internalFilter.children.findIndex((f) => (f as FilterUnion).key === filterKey)\n      : -1;\n    const isEmptyFilter = isFilterEmpty(filter);\n\n    if (indexOfFilter >= 0 && isEmptyFilter) {\n      internalFilter.children.splice(indexOfFilter, 1);\n      changed = true;\n    } else if (!isEmptyFilter) {\n      if (indexOfFilter >= 0) {\n        internalFilter.children[indexOfFilter] = filter;\n        changed = true;\n      } else {\n        internalFilter.children.push(filter);\n        changed = true;\n      }\n    }\n    if (changed) {\n      setInternalFilter({ ...internalFilter });\n    }\n  };\n\n  const modelInfo = useMemo(() => new ModelInfo(model, itemIdProperty), [model]);\n  const properties = visibleColumns ? modelInfo.getProperties(visibleColumns) : getDefaultProperties(modelInfo);\n  const children = useColumns(properties, setHeaderFilter, {\n    visibleColumns,\n    hiddenColumns,\n    noHeaderFilters,\n    customColumns,\n    columnOptions,\n    rowNumbers,\n    totalCount,\n    filteredCount,\n    footerCountRenderer,\n    itemCounts,\n  });\n\n  useEffect(() => {\n    // Remove all filtering if header filters are removed\n    if (noHeaderFilters) {\n      setInternalFilter({ '@type': 'and', children: [] });\n    }\n  }, [noHeaderFilters]);\n\n  useEffect(() => {\n    // Log an error if totalCount or filteredCount is enabled but the service doesn't implement CountService\n    if ((!isCountService(service) && totalCount) ?? filteredCount) {\n      console.error(\n        '\"totalCount\" and \"filteredCount\" props require the provided service to implement the CountService interface.',\n      );\n    }\n    // Sets the data provider, should be done only once\n    const grid = gridRef.current!;\n    // Wait for the sorting headers to be rendered so that the sorting state is correct for the first data provider call\n    const timeoutId = setTimeout(() => {\n      let firstUpdate = true;\n      const dataProvider = createDataProvider(service, {\n        initialFilter: experimentalFilter ?? internalFilter,\n        loadTotalCount: totalCount,\n        afterLoad(newItemCounts: ItemCounts) {\n          setItemCounts(newItemCounts);\n\n          if (firstUpdate) {\n            // Workaround for https://github.com/vaadin/react-components/issues/129\n            firstUpdate = false;\n            setTimeout(() => grid.recalculateColumnWidths(), 0);\n          }\n        },\n      });\n      dataProviderRef.current = dataProvider;\n      // eslint-disable-next-line @typescript-eslint/no-misused-promises\n      gridRef.current!.dataProvider = dataProvider.load.bind(dataProvider);\n    }, 1);\n\n    return () => clearTimeout(timeoutId);\n  }, [model, service]);\n\n  useEffect(() => {\n    // Update the filtering, whenever the filter changes\n    const dataProvider = dataProviderRef.current;\n    const grid = gridRef.current;\n    if (grid && dataProvider) {\n      dataProvider.setFilter(experimentalFilter ?? internalFilter);\n      grid.clearCache();\n    }\n  }, [experimentalFilter, internalFilter]);\n\n  return (\n    <Grid itemIdPath={modelInfo.idProperty?.name} {...gridProps} ref={gridRef}>\n      {children}\n    </Grid>\n  );\n}\n\ntype AutoGrid = <TItem>(\n  props: AutoGridProps<TItem> & { ref?: ForwardedRef<AutoGridRef<TItem>> },\n) => ReturnType<typeof AutoGridInner>;\n\n/**\n * Auto Grid is a component for displaying tabular data based on a Java backend\n * service. It automatically generates columns based on the properties of a\n * Java class and provides features such as lazy-loading, sorting and filtering.\n *\n * Example usage:\n * ```tsx\n * import { AutoGrid } from '@vaadin/hilla-react-crud';\n * import PersonService from 'Frontend/generated/endpoints';\n * import PersonModel from 'Frontend/generated/com/example/application/Person';\n *\n * <AutoGrid service={PersonService} model={PersonModel} />\n * ```\n */\nexport const AutoGrid: AutoGrid = forwardRef(AutoGridInner) as AutoGrid;\n\nexport type { ColumnOptions, HeaderFilterRendererProps };\n"],
+  "mappings": "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",
   "names": []
 }

package/header-filter.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["src/header-filter.tsx"],
-  "sourcesContent": ["import { _enum, type EnumModel } from '@vaadin/hilla-lit-form';\nimport { DatePicker } from '@vaadin/react-components/DatePicker.js';\nimport type { GridColumnProps } from '@vaadin/react-components/GridColumn.js';\nimport { Item } from '@vaadin/react-components/Item.js';\nimport { ListBox } from '@vaadin/react-components/ListBox.js';\nimport { NumberField } from '@vaadin/react-components/NumberField.js';\nimport { Select, type SelectElement } from '@vaadin/react-components/Select.js';\nimport { TextField, type TextFieldElement } from '@vaadin/react-components/TextField.js';\nimport { TimePicker } from '@vaadin/react-components/TimePicker.js';\nimport {\n  type ComponentType,\n  type JSX,\n  type ReactElement,\n  type RefObject,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { ColumnContext, CustomColumnContext } from './autogrid-column-context.js';\nimport { useDatePickerI18n } from './locale.js';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion';\nimport type PropertyStringFilter from './types/com/vaadin/hilla/crud/filter/PropertyStringFilter';\nimport Matcher from './types/com/vaadin/hilla/crud/filter/PropertyStringFilter/Matcher.js';\nimport { convertToTitleCase } from './util';\n\ntype ExtractComponentTypeProps<T extends ComponentType<any>> = T extends ComponentType<infer U> ? U : never;\n\nexport type HeaderRendererProps = ExtractComponentTypeProps<\n  NonNullable<Required<GridColumnProps<unknown>>['headerRenderer']>\n>;\n\nexport type HeaderFilterRendererProps = HeaderRendererProps & {\n  /**\n   * Allows to set custom filters for the column.\n   * This is used by the header filter components.\n   * @param filter - The filter to set in the filter list.\n   */\n  setFilter(filter: FilterUnion): void;\n};\n\nexport type HeaderFilterProps = Readonly<{\n  /**\n   * If true, the column can be sorted. This is useful to disable sorting for\n   * properties that are not sortable in the backend, or that require excessive processing.\n   */\n  sortable?: boolean;\n  /**\n   * If true, the column can be filtered. This is useful to disable filtering for\n   * properties that are not sortable in the backend, or that require excessive processing.\n   */\n  filterable?: boolean;\n  /**\n   * Placeholder text for the filter input.\n   * Only applies to string, number and date/time value filters.\n   */\n  filterPlaceholder?: string;\n  /**\n   * Debounce time for the filter input in milliseconds.\n   * Only applies to string value filters and number value filters.\n   */\n  filterDebounceTime?: number;\n  /**\n   * Minimum length for the filter input.\n   * Only applies to string value filters.\n   */\n  filterMinLength?: number;\n\n  /**\n   * Custom renderer for the filter in the header.\n   */\n  headerFilterRenderer?: ComponentType<HeaderFilterRendererProps>;\n}>;\n\nfunction useFilterState(initialMatcher: Matcher) {\n  const context = useContext(ColumnContext)!;\n  const [matcher, setMatcher] = useState(initialMatcher);\n  const [filterValue, setFilterValue] = useState('');\n\n  function updateFilter(newMatcher: Matcher, newFilterValue: string) {\n    setFilterValue(newFilterValue);\n    setMatcher(newMatcher);\n\n    const filter: PropertyStringFilter = {\n      propertyId: context.propertyInfo.name,\n      filterValue: newFilterValue,\n      matcher: newMatcher,\n      '@type': 'propertyString',\n    };\n    context.setColumnFilter(filter, context.filterKey);\n  }\n\n  return { matcher, filterValue, updateFilter };\n}\n\n// Workaround for https://github.com/vaadin/react-components/issues/148\nfunction useSelectInitWorkaround(selectRef: RefObject<SelectElement>) {\n  useEffect(() => {\n    setTimeout(() => {\n      if (selectRef.current) {\n        selectRef.current.requestContentUpdate();\n      }\n    }, 1);\n  }, []);\n}\n\n// extracted component (and type) to avoid code duplication\ntype ComparationSelectionProps = Readonly<{\n  value: Matcher;\n  onMatcherChanged(matcher: Matcher): void;\n  isDateTimeType?: boolean;\n}>;\n\nfunction ComparationSelection({ onMatcherChanged, value, isDateTimeType }: ComparationSelectionProps): ReactElement {\n  const select = useRef<SelectElement>(null);\n\n  useSelectInitWorkaround(select);\n\n  return (\n    <Select\n      theme=\"small\"\n      className=\"auto-grid-comparation-selection\"\n      ref={select}\n      value={value}\n      onValueChanged={({ detail }) => {\n        onMatcherChanged(detail.value as Matcher);\n      }}\n      renderer={() => (\n        <ListBox>\n          <Item value={Matcher.GREATER_THAN} {...{ label: '>' }}>\n            {isDateTimeType ? '> After' : '> Greater than'}\n          </Item>\n          <Item value={Matcher.LESS_THAN} {...{ label: '<' }}>\n            {isDateTimeType ? '< Before' : '< Less than'}\n          </Item>\n          <Item value={Matcher.EQUALS} {...{ label: '=' }}>\n            = Equals\n          </Item>\n        </ListBox>\n      )}\n    ></Select>\n  );\n}\n\nexport function StringHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const { filterPlaceholder, filterDebounceTime, filterMinLength } = context.customColumnOptions ?? {};\n  const { updateFilter } = useFilterState(Matcher.CONTAINS);\n  const [inputValue, setInputValue] = useState('');\n\n  useEffect(() => {\n    if (filterMinLength && inputValue && inputValue.length < filterMinLength) {\n      updateFilter(Matcher.CONTAINS, '');\n      return () => {};\n    }\n\n    const delayInputTimeoutId = setTimeout(() => {\n      updateFilter(Matcher.CONTAINS, inputValue);\n    }, filterDebounceTime ?? 200);\n    return () => clearTimeout(delayInputTimeoutId);\n  }, [inputValue]);\n\n  return (\n    <div className=\"auto-grid-string-filter\">\n      <TextField\n        theme=\"small\"\n        placeholder={filterPlaceholder ?? 'Filter...'}\n        onInput={(e: any) => {\n          const fieldValue = ((e as InputEvent).target as TextFieldElement).value;\n          setInputValue(fieldValue);\n        }}\n      ></TextField>\n    </div>\n  );\n}\n\nexport function NumberHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const { filterPlaceholder, filterDebounceTime } = context.customColumnOptions ?? {};\n  const [inputValue, setInputValue] = useState('');\n  const { matcher, filterValue, updateFilter } = useFilterState(Matcher.GREATER_THAN);\n  const select = useRef<SelectElement>(null);\n\n  useSelectInitWorkaround(select);\n\n  useEffect(() => {\n    const delayInputTimeoutId = setTimeout(() => {\n      updateFilter(matcher, inputValue);\n    }, filterDebounceTime ?? 200);\n    return () => clearTimeout(delayInputTimeoutId);\n  }, [inputValue]);\n\n  return (\n    <div className=\"auto-grid-number-filter\">\n      <ComparationSelection value={matcher} onMatcherChanged={(m) => updateFilter(m, filterValue)} />\n      <NumberField\n        theme=\"small\"\n        placeholder={filterPlaceholder ?? 'Filter...'}\n        onInput={(e) => {\n          const fieldValue = ((e as InputEvent).target as TextFieldElement).value;\n          setInputValue(fieldValue);\n        }}\n      />\n    </div>\n  );\n}\n\nexport function EnumHeaderFilter(): ReactElement {\n  const { filterValue, updateFilter } = useFilterState(Matcher.EQUALS);\n  const context = useContext(ColumnContext)!;\n  const model = context.propertyInfo.model as EnumModel;\n  const options = [\n    {\n      value: '',\n      label: '',\n    },\n    ...Object.keys(model[_enum]).map((value) => ({\n      label: convertToTitleCase(value),\n      value,\n    })),\n  ];\n  return (\n    <div className=\"auto-grid-enum-filter\">\n      <Select\n        theme=\"small\"\n        items={options}\n        value={filterValue}\n        onValueChanged={(e) => {\n          const newFilterValue = e.detail.value;\n          updateFilter(Matcher.EQUALS, newFilterValue);\n        }}\n      />\n    </div>\n  );\n}\n\nexport function BooleanHeaderFilter(): ReactElement {\n  const { filterValue, updateFilter } = useFilterState(Matcher.EQUALS);\n  const select = useRef<SelectElement>(null);\n\n  useSelectInitWorkaround(select);\n\n  return (\n    <div className=\"auto-grid-boolean-filter\">\n      <Select\n        theme=\"small\"\n        ref={select}\n        onValueChanged={(e) => {\n          const newFilterValue = e.detail.value;\n          updateFilter(Matcher.EQUALS, newFilterValue);\n        }}\n        renderer={() => (\n          <ListBox>\n            <Item value={''} {...{ label: '' }}></Item>\n            <Item value={'True'} {...{ label: 'Yes' }}>\n              Yes\n            </Item>\n            <Item value={'False'} {...{ label: 'No' }}>\n              No\n            </Item>\n          </ListBox>\n        )}\n        value={filterValue}\n      ></Select>\n    </div>\n  );\n}\n\nexport function DateHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const i18n = useDatePickerI18n();\n  const { matcher, filterValue, updateFilter } = useFilterState(Matcher.GREATER_THAN);\n  const [invalid, setInvalid] = useState(false);\n\n  return (\n    <div className=\"auto-grid-date-filter\">\n      <ComparationSelection\n        value={matcher}\n        onMatcherChanged={(m) => updateFilter(m, filterValue)}\n        isDateTimeType={true}\n      />\n      <DatePicker\n        theme=\"small\"\n        value={filterValue}\n        placeholder={context.customColumnOptions?.filterPlaceholder ?? 'Filter...'}\n        i18n={i18n}\n        onInvalidChanged={({ detail: { value } }) => {\n          setInvalid(value);\n        }}\n        onValueChanged={({ detail: { value } }) => {\n          if (!(invalid || value === filterValue)) {\n            updateFilter(matcher, value);\n          }\n        }}\n      />\n    </div>\n  );\n}\n\nexport function TimeHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const { matcher, filterValue, updateFilter } = useFilterState(Matcher.GREATER_THAN);\n  const [invalid, setInvalid] = useState(false);\n\n  return (\n    <div className=\"auto-grid-time-filter\">\n      <ComparationSelection\n        value={matcher}\n        onMatcherChanged={(m) => updateFilter(m, filterValue)}\n        isDateTimeType={true}\n      />\n      <TimePicker\n        theme=\"small\"\n        value={filterValue}\n        placeholder={context.customColumnOptions?.filterPlaceholder ?? 'Filter...'}\n        onInvalidChanged={({ detail: { value } }) => {\n          setInvalid(value);\n        }}\n        onValueChanged={({ detail: { value } }) => {\n          if (!(invalid || value === filterValue)) {\n            updateFilter(matcher, value);\n          }\n        }}\n      />\n    </div>\n  );\n}\n\nexport function NoHeaderFilter(): ReactElement {\n  return <></>;\n}\n\nexport function HeaderFilterWrapper({ original }: HeaderRendererProps): JSX.Element | null {\n  const context = useContext(ColumnContext);\n  const customContext = useContext(CustomColumnContext);\n  const { setColumnFilter, headerFilterRenderer: HeaderFilterRenderer, filterKey } = (context ?? customContext)!;\n\n  function setFilter(filter: FilterUnion) {\n    setColumnFilter(filter, filterKey);\n  }\n\n  return <HeaderFilterRenderer original={original} setFilter={setFilter} />;\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { _enum, type EnumModel } from '@vaadin/hilla-lit-form';\nimport { DatePicker } from '@vaadin/react-components/DatePicker.js';\nimport type { GridColumnProps } from '@vaadin/react-components/GridColumn.js';\nimport { Item } from '@vaadin/react-components/Item.js';\nimport { ListBox } from '@vaadin/react-components/ListBox.js';\nimport { NumberField } from '@vaadin/react-components/NumberField.js';\nimport { Select, type SelectElement } from '@vaadin/react-components/Select.js';\nimport { TextField, type TextFieldElement } from '@vaadin/react-components/TextField.js';\nimport { TimePicker } from '@vaadin/react-components/TimePicker.js';\nimport {\n  type ComponentType,\n  type JSX,\n  type ReactElement,\n  type RefObject,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n} from 'react';\nimport { ColumnContext, CustomColumnContext } from './autogrid-column-context.js';\nimport { useDatePickerI18n } from './locale.js';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion';\nimport type PropertyStringFilter from './types/com/vaadin/hilla/crud/filter/PropertyStringFilter';\nimport Matcher from './types/com/vaadin/hilla/crud/filter/PropertyStringFilter/Matcher.js';\nimport { convertToTitleCase } from './util';\n\ntype ExtractComponentTypeProps<T extends ComponentType<any>> = T extends ComponentType<infer U> ? U : never;\n\nexport type HeaderRendererProps = ExtractComponentTypeProps<\n  NonNullable<Required<GridColumnProps<unknown>>['headerRenderer']>\n>;\n\nexport type HeaderFilterRendererProps = HeaderRendererProps & {\n  /**\n   * Allows to set custom filters for the column.\n   * This is used by the header filter components.\n   * @param filter - The filter to set in the filter list.\n   */\n  setFilter(filter: FilterUnion): void;\n};\n\nexport type HeaderFilterProps = Readonly<{\n  /**\n   * If true, the column can be sorted. This is useful to disable sorting for\n   * properties that are not sortable in the backend, or that require excessive processing.\n   */\n  sortable?: boolean;\n  /**\n   * If true, the column can be filtered. This is useful to disable filtering for\n   * properties that are not sortable in the backend, or that require excessive processing.\n   */\n  filterable?: boolean;\n  /**\n   * Placeholder text for the filter input.\n   * Only applies to string, number and date/time value filters.\n   */\n  filterPlaceholder?: string;\n  /**\n   * Debounce time for the filter input in milliseconds.\n   * Only applies to string value filters and number value filters.\n   */\n  filterDebounceTime?: number;\n  /**\n   * Minimum length for the filter input.\n   * Only applies to string value filters.\n   */\n  filterMinLength?: number;\n\n  /**\n   * Custom renderer for the filter in the header.\n   */\n  headerFilterRenderer?: ComponentType<HeaderFilterRendererProps>;\n}>;\n\nfunction useFilterState(initialMatcher: Matcher) {\n  const context = useContext(ColumnContext)!;\n  const [matcher, setMatcher] = useState(initialMatcher);\n  const [filterValue, setFilterValue] = useState('');\n\n  function updateFilter(newMatcher: Matcher, newFilterValue: string) {\n    setFilterValue(newFilterValue);\n    setMatcher(newMatcher);\n\n    const filter: PropertyStringFilter = {\n      propertyId: context.propertyInfo.name,\n      filterValue: newFilterValue,\n      matcher: newMatcher,\n      '@type': 'propertyString',\n    };\n    context.setColumnFilter(filter, context.filterKey);\n  }\n\n  return { matcher, filterValue, updateFilter };\n}\n\n// Workaround for https://github.com/vaadin/react-components/issues/148\nfunction useSelectInitWorkaround(selectRef: RefObject<SelectElement | null>) {\n  useEffect(() => {\n    setTimeout(() => {\n      if (selectRef.current) {\n        selectRef.current.requestContentUpdate();\n      }\n    }, 1);\n  }, []);\n}\n\n// extracted component (and type) to avoid code duplication\ntype ComparationSelectionProps = Readonly<{\n  value: Matcher;\n  onMatcherChanged(matcher: Matcher): void;\n  isDateTimeType?: boolean;\n}>;\n\nfunction ComparationSelection({ onMatcherChanged, value, isDateTimeType }: ComparationSelectionProps): ReactElement {\n  const select = useRef<SelectElement>(null);\n\n  useSelectInitWorkaround(select);\n\n  return (\n    <Select\n      theme=\"small\"\n      className=\"auto-grid-comparation-selection\"\n      ref={select}\n      value={value}\n      onValueChanged={({ detail }) => {\n        onMatcherChanged(detail.value as Matcher);\n      }}\n      renderer={() => (\n        <ListBox>\n          <Item value={Matcher.GREATER_THAN} {...{ label: '>' }}>\n            {isDateTimeType ? '> After' : '> Greater than'}\n          </Item>\n          <Item value={Matcher.LESS_THAN} {...{ label: '<' }}>\n            {isDateTimeType ? '< Before' : '< Less than'}\n          </Item>\n          <Item value={Matcher.EQUALS} {...{ label: '=' }}>\n            = Equals\n          </Item>\n        </ListBox>\n      )}\n    ></Select>\n  );\n}\n\nexport function StringHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const { filterPlaceholder, filterDebounceTime, filterMinLength } = context.customColumnOptions ?? {};\n  const { updateFilter } = useFilterState(Matcher.CONTAINS);\n  const [inputValue, setInputValue] = useState('');\n\n  useEffect(() => {\n    if (filterMinLength && inputValue && inputValue.length < filterMinLength) {\n      updateFilter(Matcher.CONTAINS, '');\n      return () => {};\n    }\n\n    const delayInputTimeoutId = setTimeout(() => {\n      updateFilter(Matcher.CONTAINS, inputValue);\n    }, filterDebounceTime ?? 200);\n    return () => clearTimeout(delayInputTimeoutId);\n  }, [inputValue]);\n\n  return (\n    <div className=\"auto-grid-string-filter\">\n      <TextField\n        theme=\"small\"\n        placeholder={filterPlaceholder ?? 'Filter...'}\n        onInput={(e: any) => {\n          const fieldValue = ((e as InputEvent).target as TextFieldElement).value;\n          setInputValue(fieldValue);\n        }}\n      ></TextField>\n    </div>\n  );\n}\n\nexport function NumberHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const { filterPlaceholder, filterDebounceTime } = context.customColumnOptions ?? {};\n  const [inputValue, setInputValue] = useState('');\n  const { matcher, filterValue, updateFilter } = useFilterState(Matcher.GREATER_THAN);\n  const select = useRef<SelectElement>(null);\n\n  useSelectInitWorkaround(select);\n\n  useEffect(() => {\n    const delayInputTimeoutId = setTimeout(() => {\n      updateFilter(matcher, inputValue);\n    }, filterDebounceTime ?? 200);\n    return () => clearTimeout(delayInputTimeoutId);\n  }, [inputValue]);\n\n  return (\n    <div className=\"auto-grid-number-filter\">\n      <ComparationSelection value={matcher} onMatcherChanged={(m) => updateFilter(m, filterValue)} />\n      <NumberField\n        theme=\"small\"\n        placeholder={filterPlaceholder ?? 'Filter...'}\n        onInput={(e) => {\n          const fieldValue = ((e as InputEvent).target as TextFieldElement).value;\n          setInputValue(fieldValue);\n        }}\n      />\n    </div>\n  );\n}\n\nexport function EnumHeaderFilter(): ReactElement {\n  const { filterValue, updateFilter } = useFilterState(Matcher.EQUALS);\n  const context = useContext(ColumnContext)!;\n  const model = context.propertyInfo.model as EnumModel;\n  const options = [\n    {\n      value: '',\n      label: '',\n    },\n    ...Object.keys(model[_enum]).map((value) => ({\n      label: convertToTitleCase(value),\n      value,\n    })),\n  ];\n  return (\n    <div className=\"auto-grid-enum-filter\">\n      <Select\n        theme=\"small\"\n        items={options}\n        value={filterValue}\n        onValueChanged={(e) => {\n          const newFilterValue = e.detail.value;\n          updateFilter(Matcher.EQUALS, newFilterValue);\n        }}\n      />\n    </div>\n  );\n}\n\nexport function BooleanHeaderFilter(): ReactElement {\n  const { filterValue, updateFilter } = useFilterState(Matcher.EQUALS);\n  const select = useRef<SelectElement>(null);\n\n  useSelectInitWorkaround(select);\n\n  return (\n    <div className=\"auto-grid-boolean-filter\">\n      <Select\n        theme=\"small\"\n        ref={select}\n        onValueChanged={(e) => {\n          const newFilterValue = e.detail.value;\n          updateFilter(Matcher.EQUALS, newFilterValue);\n        }}\n        renderer={() => (\n          <ListBox>\n            <Item value={''} {...{ label: '' }}></Item>\n            <Item value={'True'} {...{ label: 'Yes' }}>\n              Yes\n            </Item>\n            <Item value={'False'} {...{ label: 'No' }}>\n              No\n            </Item>\n          </ListBox>\n        )}\n        value={filterValue}\n      ></Select>\n    </div>\n  );\n}\n\nexport function DateHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const i18n = useDatePickerI18n();\n  const { matcher, filterValue, updateFilter } = useFilterState(Matcher.GREATER_THAN);\n  const [invalid, setInvalid] = useState(false);\n\n  return (\n    <div className=\"auto-grid-date-filter\">\n      <ComparationSelection\n        value={matcher}\n        onMatcherChanged={(m) => updateFilter(m, filterValue)}\n        isDateTimeType={true}\n      />\n      <DatePicker\n        theme=\"small\"\n        value={filterValue}\n        placeholder={context.customColumnOptions?.filterPlaceholder ?? 'Filter...'}\n        i18n={i18n}\n        onInvalidChanged={({ detail: { value } }) => {\n          setInvalid(value);\n        }}\n        onValueChanged={({ detail: { value } }) => {\n          if (!(invalid || value === filterValue)) {\n            updateFilter(matcher, value);\n          }\n        }}\n      />\n    </div>\n  );\n}\n\nexport function TimeHeaderFilter(): ReactElement {\n  const context = useContext(ColumnContext)!;\n  const { matcher, filterValue, updateFilter } = useFilterState(Matcher.GREATER_THAN);\n  const [invalid, setInvalid] = useState(false);\n\n  return (\n    <div className=\"auto-grid-time-filter\">\n      <ComparationSelection\n        value={matcher}\n        onMatcherChanged={(m) => updateFilter(m, filterValue)}\n        isDateTimeType={true}\n      />\n      <TimePicker\n        theme=\"small\"\n        value={filterValue}\n        placeholder={context.customColumnOptions?.filterPlaceholder ?? 'Filter...'}\n        onInvalidChanged={({ detail: { value } }) => {\n          setInvalid(value);\n        }}\n        onValueChanged={({ detail: { value } }) => {\n          if (!(invalid || value === filterValue)) {\n            updateFilter(matcher, value);\n          }\n        }}\n      />\n    </div>\n  );\n}\n\nexport function NoHeaderFilter(): ReactElement {\n  return <></>;\n}\n\nexport function HeaderFilterWrapper({ original }: HeaderRendererProps): JSX.Element | null {\n  const context = useContext(ColumnContext);\n  const customContext = useContext(CustomColumnContext);\n  const { setColumnFilter, headerFilterRenderer: HeaderFilterRenderer, filterKey } = (context ?? customContext)!;\n\n  function setFilter(filter: FilterUnion) {\n    setColumnFilter(filter, filterKey);\n  }\n\n  return <HeaderFilterRenderer original={original} setFilter={setFilter} />;\n}\n"],
+  "mappings": "AAgIQ,SAyMC,UAxMC,KADF;AAhIR,SAAS,aAA6B;AACtC,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AACrB,SAAS,eAAe;AACxB,SAAS,mBAAmB;AAC5B,SAAS,cAAkC;AAC3C,SAAS,iBAAwC;AACjD,SAAS,kBAAkB;AAC3B;AAAA,EAKE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,eAAe,2BAA2B;AACnD,SAAS,yBAAyB;AAGlC,OAAO,aAAa;AACpB,SAAS,0BAA0B;AAkDnC,SAAS,eAAe,gBAAyB;AAC/C,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,cAAc;AACrD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,EAAE;AAEjD,WAAS,aAAa,YAAqB,gBAAwB;AACjE,mBAAe,cAAc;AAC7B,eAAW,UAAU;AAErB,UAAM,SAA+B;AAAA,MACnC,YAAY,QAAQ,aAAa;AAAA,MACjC,aAAa;AAAA,MACb,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AACA,YAAQ,gBAAgB,QAAQ,QAAQ,SAAS;AAAA,EACnD;AAEA,SAAO,EAAE,SAAS,aAAa,aAAa;AAC9C;AAGA,SAAS,wBAAwB,WAA4C;AAC3E,YAAU,MAAM;AACd,eAAW,MAAM;AACf,UAAI,UAAU,SAAS;AACrB,kBAAU,QAAQ,qBAAqB;AAAA,MACzC;AAAA,IACF,GAAG,CAAC;AAAA,EACN,GAAG,CAAC,CAAC;AACP;AASA,SAAS,qBAAqB,EAAE,kBAAkB,OAAO,eAAe,GAA4C;AAClH,QAAM,SAAS,OAAsB,IAAI;AAEzC,0BAAwB,MAAM;AAE9B,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,WAAU;AAAA,MACV,KAAK;AAAA,MACL;AAAA,MACA,gBAAgB,CAAC,EAAE,OAAO,MAAM;AAC9B,yBAAiB,OAAO,KAAgB;AAAA,MAC1C;AAAA,MACA,UAAU,MACR,qBAAC,WACC;AAAA,4BAAC,QAAK,OAAO,QAAQ,cAAe,GAAG,EAAE,OAAO,IAAI,GACjD,2BAAiB,YAAY,kBAChC;AAAA,QACA,oBAAC,QAAK,OAAO,QAAQ,WAAY,GAAG,EAAE,OAAO,IAAI,GAC9C,2BAAiB,aAAa,eACjC;AAAA,QACA,oBAAC,QAAK,OAAO,QAAQ,QAAS,GAAG,EAAE,OAAO,IAAI,GAAG,sBAEjD;AAAA,SACF;AAAA;AAAA,EAEH;AAEL;AAEO,SAAS,qBAAmC;AACjD,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,EAAE,mBAAmB,oBAAoB,gBAAgB,IAAI,QAAQ,uBAAuB,CAAC;AACnG,QAAM,EAAE,aAAa,IAAI,eAAe,QAAQ,QAAQ;AACxD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,EAAE;AAE/C,YAAU,MAAM;AACd,QAAI,mBAAmB,cAAc,WAAW,SAAS,iBAAiB;AACxE,mBAAa,QAAQ,UAAU,EAAE;AACjC,aAAO,MAAM;AAAA,MAAC;AAAA,IAChB;AAEA,UAAM,sBAAsB,WAAW,MAAM;AAC3C,mBAAa,QAAQ,UAAU,UAAU;AAAA,IAC3C,GAAG,sBAAsB,GAAG;AAC5B,WAAO,MAAM,aAAa,mBAAmB;AAAA,EAC/C,GAAG,CAAC,UAAU,CAAC;AAEf,SACE,oBAAC,SAAI,WAAU,2BACb;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,aAAa,qBAAqB;AAAA,MAClC,SAAS,CAAC,MAAW;AACnB,cAAM,aAAe,EAAiB,OAA4B;AAClE,sBAAc,UAAU;AAAA,MAC1B;AAAA;AAAA,EACD,GACH;AAEJ;AAEO,SAAS,qBAAmC;AACjD,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,EAAE,mBAAmB,mBAAmB,IAAI,QAAQ,uBAAuB,CAAC;AAClF,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,EAAE;AAC/C,QAAM,EAAE,SAAS,aAAa,aAAa,IAAI,eAAe,QAAQ,YAAY;AAClF,QAAM,SAAS,OAAsB,IAAI;AAEzC,0BAAwB,MAAM;AAE9B,YAAU,MAAM;AACd,UAAM,sBAAsB,WAAW,MAAM;AAC3C,mBAAa,SAAS,UAAU;AAAA,IAClC,GAAG,sBAAsB,GAAG;AAC5B,WAAO,MAAM,aAAa,mBAAmB;AAAA,EAC/C,GAAG,CAAC,UAAU,CAAC;AAEf,SACE,qBAAC,SAAI,WAAU,2BACb;AAAA,wBAAC,wBAAqB,OAAO,SAAS,kBAAkB,CAAC,MAAM,aAAa,GAAG,WAAW,GAAG;AAAA,IAC7F;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,aAAa,qBAAqB;AAAA,QAClC,SAAS,CAAC,MAAM;AACd,gBAAM,aAAe,EAAiB,OAA4B;AAClE,wBAAc,UAAU;AAAA,QAC1B;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEO,SAAS,mBAAiC;AAC/C,QAAM,EAAE,aAAa,aAAa,IAAI,eAAe,QAAQ,MAAM;AACnE,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,QAAQ,QAAQ,aAAa;AACnC,QAAM,UAAU;AAAA,IACd;AAAA,MACE,OAAO;AAAA,MACP,OAAO;AAAA,IACT;AAAA,IACA,GAAG,OAAO,KAAK,MAAM,KAAK,CAAC,EAAE,IAAI,CAAC,WAAW;AAAA,MAC3C,OAAO,mBAAmB,KAAK;AAAA,MAC/B;AAAA,IACF,EAAE;AAAA,EACJ;AACA,SACE,oBAAC,SAAI,WAAU,yBACb;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,OAAO;AAAA,MACP,OAAO;AAAA,MACP,gBAAgB,CAAC,MAAM;AACrB,cAAM,iBAAiB,EAAE,OAAO;AAChC,qBAAa,QAAQ,QAAQ,cAAc;AAAA,MAC7C;AAAA;AAAA,EACF,GACF;AAEJ;AAEO,SAAS,sBAAoC;AAClD,QAAM,EAAE,aAAa,aAAa,IAAI,eAAe,QAAQ,MAAM;AACnE,QAAM,SAAS,OAAsB,IAAI;AAEzC,0BAAwB,MAAM;AAE9B,SACE,oBAAC,SAAI,WAAU,4BACb;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,KAAK;AAAA,MACL,gBAAgB,CAAC,MAAM;AACrB,cAAM,iBAAiB,EAAE,OAAO;AAChC,qBAAa,QAAQ,QAAQ,cAAc;AAAA,MAC7C;AAAA,MACA,UAAU,MACR,qBAAC,WACC;AAAA,4BAAC,QAAK,OAAO,IAAK,GAAG,EAAE,OAAO,GAAG,GAAG;AAAA,QACpC,oBAAC,QAAK,OAAO,QAAS,GAAG,EAAE,OAAO,MAAM,GAAG,iBAE3C;AAAA,QACA,oBAAC,QAAK,OAAO,SAAU,GAAG,EAAE,OAAO,KAAK,GAAG,gBAE3C;AAAA,SACF;AAAA,MAEF,OAAO;AAAA;AAAA,EACR,GACH;AAEJ;AAEO,SAAS,mBAAiC;AAC/C,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,OAAO,kBAAkB;AAC/B,QAAM,EAAE,SAAS,aAAa,aAAa,IAAI,eAAe,QAAQ,YAAY;AAClF,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,SACE,qBAAC,SAAI,WAAU,yBACb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,kBAAkB,CAAC,MAAM,aAAa,GAAG,WAAW;AAAA,QACpD,gBAAgB;AAAA;AAAA,IAClB;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO;AAAA,QACP,aAAa,QAAQ,qBAAqB,qBAAqB;AAAA,QAC/D;AAAA,QACA,kBAAkB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM;AAC3C,qBAAW,KAAK;AAAA,QAClB;AAAA,QACA,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM;AACzC,cAAI,EAAE,WAAW,UAAU,cAAc;AACvC,yBAAa,SAAS,KAAK;AAAA,UAC7B;AAAA,QACF;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEO,SAAS,mBAAiC;AAC/C,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,EAAE,SAAS,aAAa,aAAa,IAAI,eAAe,QAAQ,YAAY;AAClF,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,SACE,qBAAC,SAAI,WAAU,yBACb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO;AAAA,QACP,kBAAkB,CAAC,MAAM,aAAa,GAAG,WAAW;AAAA,QACpD,gBAAgB;AAAA;AAAA,IAClB;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO;AAAA,QACP,aAAa,QAAQ,qBAAqB,qBAAqB;AAAA,QAC/D,kBAAkB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM;AAC3C,qBAAW,KAAK;AAAA,QAClB;AAAA,QACA,gBAAgB,CAAC,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM;AACzC,cAAI,EAAE,WAAW,UAAU,cAAc;AACvC,yBAAa,SAAS,KAAK;AAAA,UAC7B;AAAA,QACF;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEO,SAAS,iBAA+B;AAC7C,SAAO,gCAAE;AACX;AAEO,SAAS,oBAAoB,EAAE,SAAS,GAA4C;AACzF,QAAM,UAAU,WAAW,aAAa;AACxC,QAAM,gBAAgB,WAAW,mBAAmB;AACpD,QAAM,EAAE,iBAAiB,sBAAsB,sBAAsB,UAAU,IAAK,WAAW;AAE/F,WAAS,UAAU,QAAqB;AACtC,oBAAgB,QAAQ,SAAS;AAAA,EACnC;AAEA,SAAO,oBAAC,wBAAqB,UAAoB,WAAsB;AACzE;",
   "names": []
 }

package/index.js

@@ -2,7 +2,7 @@ function __REGISTER__(feature, vaadinObj = window.Vaadin ??= {}) {
   vaadinObj.registrations ??= [];
   vaadinObj.registrations.push({
     is: feature ? `${"@vaadin/hilla-react-crud"}/${feature}` : "@vaadin/hilla-react-crud",
-    version: "24.6.0"
+    version: "24.6.2"
   });
 }
 export * from "./autogrid-feature.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vaadin/hilla-react-crud",
-  "version": "24.6.0",
+  "version": "24.6.2",
   "description": "Hilla CRUD utils for React",
   "main": "index.js",
   "module": "index.js",
@@ -56,17 +56,16 @@
     "access": "public"
   },
   "dependencies": {
-    "@vaadin/hilla-frontend": "24.6.0",
-    "@vaadin/hilla-lit-form": "24.6.0",
-    "@vaadin/hilla-react-form": "24.6.0",
-    "@vaadin/react-components": "24.6.0"
+    "@vaadin/hilla-frontend": "24.6.2",
+    "@vaadin/hilla-lit-form": "24.6.2",
+    "@vaadin/hilla-react-form": "24.6.2",
+    "@vaadin/react-components": "24.6.2"
   },
   "peerDependencies": {
     "react": "^18",
     "react-dom": "^18"
   },
   "devDependencies": {
-    "@esm-bundle/chai": "^4.3.4-fix.0",
     "@testing-library/dom": "^10.4.0",
     "@testing-library/react": "^16.1.0",
     "@testing-library/user-event": "^14.5.2",
@@ -74,15 +73,17 @@
     "@types/chai-as-promised": "^7.1.6",
     "@types/chai-dom": "^1.11.1",
     "@types/mocha": "^10.0.2",
-    "@types/react": "^18.2.23",
-    "@types/sinon": "^10.0.17",
-    "@types/sinon-chai": "^3.2.10",
-    "@types/validator": "^13.11.2",
-    "chai-as-promised": "^7.1.1",
-    "chai-dom": "^1.11.0",
+    "@types/react": "^18.3.17",
+    "@types/react-dom": "^18",
+    "@types/sinon": "^10.0.20",
+    "@types/sinon-chai": "^3.2.12",
+    "@types/validator": "^13.12.2",
+    "chai": "^5.1.2",
+    "chai-as-promised": "^7.1.2",
+    "chai-dom": "^1.12.0",
     "karma-viewport": "^1.0.9",
     "sinon": "^16.0.0",
     "sinon-chai": "^3.7.0",
-    "typescript": "5.6.2"
+    "typescript": "5.7.2"
   }
 }

package/util.js

@@ -2,7 +2,7 @@ function __REGISTER__(feature, vaadinObj = window.Vaadin ??= {}) {
   vaadinObj.registrations ??= [];
   vaadinObj.registrations.push({
     is: feature ? `${"@vaadin/hilla-react-crud"}/${feature}` : "@vaadin/hilla-react-crud",
-    version: "24.6.0"
+    version: "24.6.2"
   });
 }
 import { jsx } from "react/jsx-runtime";

package/util.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../scripts/register.js", "src/util.tsx"],
-  "sourcesContent": ["export function __REGISTER__(feature, vaadinObj = (window.Vaadin ??= {})) {\n  vaadinObj.registrations ??= [];\n  vaadinObj.registrations.push({\n    is: feature ? `${__NAME__}/${feature}` : __NAME__,\n    version: __VERSION__,\n  });\n}\n", "import React, { type CSSProperties, forwardRef } from 'react';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion';\n\nexport type ComponentStyleProps = Readonly<{\n  id?: string;\n  style?: CSSProperties;\n  className?: string;\n}>;\n\nexport function convertToTitleCase(inputString: string): string {\n  // Convert underscores to spaces\n  const stringWithSpaces = inputString.replace(/_/gu, ' ');\n\n  // Convert to title case\n  const words = stringWithSpaces.split(' ');\n  const titleCaseWords = words.map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase());\n\n  // Join the title case words with spaces\n  return titleCaseWords.join(' ');\n}\n\nexport function registerStylesheet(stylesheet: CSSStyleSheet): void {\n  const css = Array.from(stylesheet.cssRules)\n    .map((rule) => rule.cssText)\n    .join('\\n');\n\n  const styleTag = document.createElement('style');\n  styleTag.textContent = css;\n  document.head.prepend(styleTag);\n}\n\nconst registeredFeatures = new Set<string>();\nfunction useFeatureRegistration(feature: string): void {\n  if (registeredFeatures.has(feature)) {\n    return;\n  }\n\n  registeredFeatures.add(feature);\n  // @ts-expect-error: esbuild injection\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n  __REGISTER__(feature);\n}\n\nexport function featureRegistration<C extends (...args: any[]) => any>(Component: C, feature: string): C {\n  return forwardRef<unknown, React.JSX.LibraryManagedAttributes<C, NonNullable<unknown>>>((props, ref) => {\n    useFeatureRegistration(feature);\n    return <Component {...props} ref={ref} />;\n  }) as unknown as C;\n}\n\nexport function isFilterEmpty(filter: FilterUnion): boolean {\n  if (filter['@type'] === 'and' || filter['@type'] === 'or') {\n    if (filter.children.length === 0) {\n      return true;\n    }\n    return filter.children.every((child) => isFilterEmpty(child as FilterUnion));\n  }\n  if ('filterValue' in filter) {\n    return filter.filterValue === '';\n  }\n  throw new Error(`Unknown filter type: ${'@type' in filter ? filter['@type'] : JSON.stringify(filter)} `);\n}\n"],
-  "mappings": "AAAO,SAAS,aAAa,SAAS,YAAa,OAAO,WAAW,CAAC,GAAI;AACxE,YAAU,kBAAkB,CAAC;AAC7B,YAAU,cAAc,KAAK;AAAA,IAC3B,IAAI,UAAU,GAAG,0BAAQ,IAAI,OAAO,KAAK;AAAA,IACzC,SAAS;AAAA,EACX,CAAC;AACH;ACwCW;AA9CX,OAAO,SAA6B,kBAAkB;AAS/C,SAAS,mBAAmB,aAA6B;AAE9D,QAAM,mBAAmB,YAAY,QAAQ,OAAO,GAAG;AAGvD,QAAM,QAAQ,iBAAiB,MAAM,GAAG;AACxC,QAAM,iBAAiB,MAAM,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,EAAE,YAAY,IAAI,KAAK,MAAM,CAAC,EAAE,YAAY,CAAC;AAGrG,SAAO,eAAe,KAAK,GAAG;AAChC;AAEO,SAAS,mBAAmB,YAAiC;AAClE,QAAM,MAAM,MAAM,KAAK,WAAW,QAAQ,EACvC,IAAI,CAAC,SAAS,KAAK,OAAO,EAC1B,KAAK,IAAI;AAEZ,QAAM,WAAW,SAAS,cAAc,OAAO;AAC/C,WAAS,cAAc;AACvB,WAAS,KAAK,QAAQ,QAAQ;AAChC;AAEA,MAAM,qBAAqB,oBAAI,IAAY;AAC3C,SAAS,uBAAuB,SAAuB;AACrD,MAAI,mBAAmB,IAAI,OAAO,GAAG;AACnC;AAAA,EACF;AAEA,qBAAmB,IAAI,OAAO;AAG9B,eAAa,OAAO;AACtB;AAEO,SAAS,oBAAuD,WAAc,SAAoB;AACvG,SAAO,WAAiF,CAAC,OAAO,QAAQ;AACtG,2BAAuB,OAAO;AAC9B,WAAO,oBAAC,aAAW,GAAG,OAAO,KAAU;AAAA,EACzC,CAAC;AACH;AAEO,SAAS,cAAc,QAA8B;AAC1D,MAAI,OAAO,OAAO,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM;AACzD,QAAI,OAAO,SAAS,WAAW,GAAG;AAChC,aAAO;AAAA,IACT;AACA,WAAO,OAAO,SAAS,MAAM,CAAC,UAAU,cAAc,KAAoB,CAAC;AAAA,EAC7E;AACA,MAAI,iBAAiB,QAAQ;AAC3B,WAAO,OAAO,gBAAgB;AAAA,EAChC;AACA,QAAM,IAAI,MAAM,wBAAwB,WAAW,SAAS,OAAO,OAAO,IAAI,KAAK,UAAU,MAAM,CAAC,GAAG;AACzG;",
+  "sourcesContent": ["export function __REGISTER__(feature, vaadinObj = (window.Vaadin ??= {})) {\n  vaadinObj.registrations ??= [];\n  vaadinObj.registrations.push({\n    is: feature ? `${__NAME__}/${feature}` : __NAME__,\n    version: __VERSION__,\n  });\n}\n", "import React, { type CSSProperties, forwardRef } from 'react';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion';\n\nexport type ComponentStyleProps = Readonly<{\n  id?: string;\n  style?: CSSProperties;\n  className?: string;\n}>;\n\nexport function convertToTitleCase(inputString: string): string {\n  // Convert underscores to spaces\n  const stringWithSpaces = inputString.replace(/_/gu, ' ');\n\n  // Convert to title case\n  const words = stringWithSpaces.split(' ');\n  const titleCaseWords = words.map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase());\n\n  // Join the title case words with spaces\n  return titleCaseWords.join(' ');\n}\n\nexport function registerStylesheet(stylesheet: CSSStyleSheet): void {\n  const css = Array.from(stylesheet.cssRules)\n    .map((rule) => rule.cssText)\n    .join('\\n');\n\n  const styleTag = document.createElement('style');\n  styleTag.textContent = css;\n  document.head.prepend(styleTag);\n}\n\nconst registeredFeatures = new Set<string>();\nfunction useFeatureRegistration(feature: string): void {\n  if (registeredFeatures.has(feature)) {\n    return;\n  }\n\n  registeredFeatures.add(feature);\n  // @ts-expect-error: esbuild injection\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n  __REGISTER__(feature);\n}\n\nexport function featureRegistration<C extends (...args: any[]) => any>(Component: C, feature: string): C {\n  return forwardRef<unknown, React.JSX.LibraryManagedAttributes<C, NonNullable<unknown>>>((props, ref) => {\n    useFeatureRegistration(feature);\n    return <Component {...(props as any)} ref={ref} />;\n  }) as unknown as C;\n}\n\nexport function isFilterEmpty(filter: FilterUnion): boolean {\n  if (filter['@type'] === 'and' || filter['@type'] === 'or') {\n    if (filter.children.length === 0) {\n      return true;\n    }\n    return filter.children.every((child) => isFilterEmpty(child as FilterUnion));\n  }\n  if ('filterValue' in filter) {\n    return filter.filterValue === '';\n  }\n  throw new Error(`Unknown filter type: ${'@type' in filter ? filter['@type'] : JSON.stringify(filter)} `);\n}\n"],
+  "mappings": "AAAO,SAAS,aAAa,SAAS,YAAa,OAAO,WAAW,CAAC,GAAI;AACxE,YAAU,kBAAkB,CAAC;AAC7B,YAAU,cAAc,KAAK;AAAA,IAC3B,IAAI,UAAU,GAAG,0BAAQ,IAAI,OAAO,KAAK;AAAA,IACzC,SAAS;AAAA,EACX,CAAC;AACH;ACwCW;AA9CX,OAAO,SAA6B,kBAAkB;AAS/C,SAAS,mBAAmB,aAA6B;AAE9D,QAAM,mBAAmB,YAAY,QAAQ,OAAO,GAAG;AAGvD,QAAM,QAAQ,iBAAiB,MAAM,GAAG;AACxC,QAAM,iBAAiB,MAAM,IAAI,CAAC,SAAS,KAAK,OAAO,CAAC,EAAE,YAAY,IAAI,KAAK,MAAM,CAAC,EAAE,YAAY,CAAC;AAGrG,SAAO,eAAe,KAAK,GAAG;AAChC;AAEO,SAAS,mBAAmB,YAAiC;AAClE,QAAM,MAAM,MAAM,KAAK,WAAW,QAAQ,EACvC,IAAI,CAAC,SAAS,KAAK,OAAO,EAC1B,KAAK,IAAI;AAEZ,QAAM,WAAW,SAAS,cAAc,OAAO;AAC/C,WAAS,cAAc;AACvB,WAAS,KAAK,QAAQ,QAAQ;AAChC;AAEA,MAAM,qBAAqB,oBAAI,IAAY;AAC3C,SAAS,uBAAuB,SAAuB;AACrD,MAAI,mBAAmB,IAAI,OAAO,GAAG;AACnC;AAAA,EACF;AAEA,qBAAmB,IAAI,OAAO;AAG9B,eAAa,OAAO;AACtB;AAEO,SAAS,oBAAuD,WAAc,SAAoB;AACvG,SAAO,WAAiF,CAAC,OAAO,QAAQ;AACtG,2BAAuB,OAAO;AAC9B,WAAO,oBAAC,aAAW,GAAI,OAAe,KAAU;AAAA,EAClD,CAAC;AACH;AAEO,SAAS,cAAc,QAA8B;AAC1D,MAAI,OAAO,OAAO,MAAM,SAAS,OAAO,OAAO,MAAM,MAAM;AACzD,QAAI,OAAO,SAAS,WAAW,GAAG;AAChC,aAAO;AAAA,IACT;AACA,WAAO,OAAO,SAAS,MAAM,CAAC,UAAU,cAAc,KAAoB,CAAC;AAAA,EAC7E;AACA,MAAI,iBAAiB,QAAQ;AAC3B,WAAO,OAAO,gBAAgB;AAAA,EAChC;AACA,QAAM,IAAI,MAAM,wBAAwB,WAAW,SAAS,OAAO,OAAO,IAAI,KAAK,UAAU,MAAM,CAAC,GAAG;AACzG;",
   "names": []
 }