@vaadin/hilla-react-crud 24.4.0-alpha1

package/autoform.js

@@ -0,0 +1,178 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { EndpointError } from "@vaadin/hilla-core";
+import { ValidationError } from "@vaadin/hilla-lit-form";
+import { useForm } from "@vaadin/hilla-react-form";
+import { Button } from "@vaadin/react-components/Button.js";
+import { ConfirmDialog } from "@vaadin/react-components/ConfirmDialog";
+import { FormLayout } from "@vaadin/react-components/FormLayout";
+import { VerticalLayout } from "@vaadin/react-components/VerticalLayout.js";
+import {
+  useEffect,
+  useMemo,
+  useState
+} from "react";
+import { AutoFormField } from "./autoform-field.js";
+import css from "./autoform.obj.js";
+import { getDefaultProperties, ModelInfo } from "./model-info.js";
+import { registerStylesheet } from "./util.js";
+registerStylesheet(css);
+const emptyItem = Symbol();
+function AutoForm({
+  service,
+  model,
+  itemIdProperty,
+  item = emptyItem,
+  onSubmitError,
+  onSubmitSuccess,
+  disabled,
+  layoutRenderer: LayoutRenderer,
+  visibleFields,
+  formLayoutProps,
+  fieldOptions,
+  style,
+  id,
+  className,
+  deleteButtonVisible,
+  onDeleteSuccess,
+  onDeleteError
+}) {
+  const form = useForm(model, {
+    onSubmit: async (formItem) => service.save(formItem)
+  });
+  const [formError, setFormError] = useState("");
+  const [showDeleteDialog, setShowDeleteDialog] = useState(false);
+  const modelInfo = useMemo(() => new ModelInfo(model, itemIdProperty), [model]);
+  const isEditMode = item !== void 0 && item !== null && item !== emptyItem;
+  const showDeleteButton = deleteButtonVisible && isEditMode && modelInfo.idProperty;
+  const isSubmitDisabled = !!disabled || isEditMode && !form.dirty;
+  useEffect(() => {
+    if (item !== emptyItem) {
+      form.read(item);
+    } else {
+      form.clear();
+    }
+  }, [item]);
+  function handleSubmitError(error) {
+    if (error instanceof ValidationError) {
+      const nonPropertyErrorMessages = error.errors.filter((validationError) => !validationError.property).map((validationError) => validationError.validatorMessage ?? validationError.message);
+      if (nonPropertyErrorMessages.length > 0) {
+        setFormError(
+          /* @__PURE__ */ jsxs(Fragment, { children: [
+            "Validation errors:",
+            /* @__PURE__ */ jsx("ul", { children: nonPropertyErrorMessages.map((message, index) => /* @__PURE__ */ jsx("li", { children: message }, index)) })
+          ] })
+        );
+      }
+    } else if (error instanceof EndpointError) {
+      if (onSubmitError) {
+        onSubmitError({ error, setMessage: setFormError });
+      } else {
+        setFormError(error.message);
+      }
+    } else {
+      throw error;
+    }
+  }
+  async function handleSubmit() {
+    try {
+      setFormError("");
+      const newItem = await form.submit();
+      if (newItem === void 0) {
+        throw new EndpointError("No update performed");
+      } else if (onSubmitSuccess) {
+        onSubmitSuccess({ item: newItem });
+      }
+      if (!item || item === emptyItem) {
+        form.clear();
+      }
+    } catch (error) {
+      handleSubmitError(error);
+    }
+  }
+  function deleteItem() {
+    setShowDeleteDialog(true);
+  }
+  async function confirmDelete() {
+    const deletedItem = item;
+    try {
+      const idProperty = modelInfo.idProperty;
+      const id2 = item[idProperty.name];
+      await service.delete(id2);
+      if (onDeleteSuccess) {
+        onDeleteSuccess({ item: deletedItem });
+      }
+    } catch (error) {
+      if (error instanceof EndpointError) {
+        if (onDeleteError) {
+          onDeleteError({ error, setMessage: setFormError });
+        } else {
+          setFormError(error.message);
+        }
+      } else {
+        throw error;
+      }
+    } finally {
+      setShowDeleteDialog(false);
+    }
+  }
+  function cancelDelete() {
+    setShowDeleteDialog(false);
+  }
+  const handleKeyDown = (event) => {
+    if (event.key === "Enter" && !isSubmitDisabled) {
+      void handleSubmit();
+    }
+  };
+  function createAutoFormField(propertyInfo) {
+    const fieldOptionsForProperty = fieldOptions?.[propertyInfo.name] ?? {};
+    return /* @__PURE__ */ jsx(
+      AutoFormField,
+      {
+        propertyInfo,
+        form,
+        disabled,
+        options: fieldOptionsForProperty
+      },
+      propertyInfo.name
+    );
+  }
+  const visibleProperties = visibleFields ? modelInfo.getProperties(visibleFields) : getDefaultProperties(modelInfo);
+  const fields = visibleProperties.map(createAutoFormField);
+  const layout = LayoutRenderer ? /* @__PURE__ */ jsx(LayoutRenderer, { form, children: fields }) : /* @__PURE__ */ jsx(FormLayout, { ...formLayoutProps, children: fields });
+  return /* @__PURE__ */ jsxs("div", { className: `auto-form ${className ?? ""}`, id, style, "data-testid": "auto-form", children: [
+    /* @__PURE__ */ jsxs(VerticalLayout, { className: "auto-form-fields", onKeyDown: handleKeyDown, children: [
+      layout,
+      formError ? /* @__PURE__ */ jsx("div", { style: { color: "var(--lumo-error-color)" }, children: formError }) : /* @__PURE__ */ jsx(Fragment, {})
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "auto-form-toolbar", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          theme: "primary",
+          disabled: isSubmitDisabled,
+          onClick: handleSubmit,
+          children: "Submit"
+        }
+      ),
+      form.dirty ? /* @__PURE__ */ jsx(Button, { theme: "tertiary", onClick: () => form.reset(), children: "Discard" }) : null,
+      showDeleteButton && /* @__PURE__ */ jsx(Button, { className: "auto-form-delete-button", theme: "tertiary error", onClick: deleteItem, children: "Delete..." })
+    ] }),
+    showDeleteDialog && /* @__PURE__ */ jsx(
+      ConfirmDialog,
+      {
+        opened: true,
+        header: "Delete item",
+        confirmTheme: "error",
+        cancelButtonVisible: true,
+        onConfirm: confirmDelete,
+        onCancel: cancelDelete,
+        children: "Are you sure you want to delete the selected item?"
+      }
+    )
+  ] });
+}
+export {
+  AutoForm,
+  emptyItem
+};
+//# sourceMappingURL=autoform.js.map

package/autoform.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/autoform.tsx"],
+  "sourcesContent": ["import { EndpointError } from '@vaadin/hilla-core';\nimport { type AbstractModel, type DetachedModelConstructor, ValidationError, type Value } from '@vaadin/hilla-lit-form';\nimport { useForm, type UseFormResult } from '@vaadin/hilla-react-form';\nimport { Button } from '@vaadin/react-components/Button.js';\nimport { ConfirmDialog } from '@vaadin/react-components/ConfirmDialog';\nimport { FormLayout } from '@vaadin/react-components/FormLayout';\nimport { VerticalLayout } from '@vaadin/react-components/VerticalLayout.js';\nimport {\n  type ComponentType,\n  type JSX,\n  type KeyboardEvent,\n  type ReactElement,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { AutoFormField, type AutoFormFieldProps, type FieldOptions } from './autoform-field.js';\nimport css from './autoform.obj.js';\nimport type { FormService } from './crud.js';\nimport { getDefaultProperties, ModelInfo, type PropertyInfo } from './model-info.js';\nimport { type ComponentStyleProps, registerStylesheet } from './util.js';\n\nregisterStylesheet(css);\n\nexport const emptyItem = Symbol();\n\n/**\n * An event that is fired when an error occurs while submitting the form.\n */\nexport type SubmitErrorEvent = {\n  /**\n   * The error that occurred.\n   */\n  error: EndpointError;\n  /**\n   * A function that can be used to set a custom error message. This will be\n   * shown in the form at the same position as the default error message.\n   * You are not required to call this function if you want to handle the\n   * error differently.\n   */\n  setMessage(message: string): void;\n};\n\n/**\n * An event that is fired when the form has been successfully submitted.\n */\nexport type SubmitEvent<TItem> = {\n  /**\n   * The item that was submitted, as returned by the service.\n   */\n  item: TItem;\n};\n\n/**\n * An event that is fired when an error occurs while deleting an item.\n */\nexport type DeleteErrorEvent = {\n  /**\n   * The error that occurred.\n   */\n  error: EndpointError;\n  /**\n   * A function that can be used to set a custom error message. This will be\n   * shown in the form at the same position as the default error message.\n   * You are not required to call this function if you want to handle the\n   * error differently.\n   */\n  setMessage(message: string): void;\n};\n\n/**\n * An event that is fired when the form has been successfully deleted.\n */\nexport type DeleteEvent<TItem> = {\n  /**\n   * The item that was deleted, as returned by the service.\n   */\n  item: TItem;\n};\n\nexport type AutoFormLayoutRendererProps<M extends AbstractModel> = Readonly<{\n  form: UseFormResult<M>;\n  children: ReadonlyArray<ReactElement<AutoFormFieldProps>>;\n}>;\n\nexport type AutoFormProps<M extends AbstractModel = AbstractModel> = ComponentStyleProps &\n  Readonly<{\n    /**\n     * The service to use for saving and deleting items. This must be a\n     * TypeScript service that has been generated by Hilla from a backend Java\n     * service that implements the `com.vaadin.hilla.crud.FormService` interface.\n     */\n    service: FormService<Value<M>>;\n    /**\n     * The entity model to use, which determines which fields to show in the\n     * form. This must be a Typescript model class that has been generated by\n     * Hilla from a backend Java class. The model must match with the type of\n     * the items handled by the service. For example, a `PersonModel` can be\n     * used with a service that handles `Person` instances.\n     *\n     * By default, the form shows fields for all properties of the model which\n     * have a type that is supported. Use the `visibleFields` option to customize\n     * which fields to show and in which order.\n     */\n    model: DetachedModelConstructor<M>;\n    /**\n     * The property to use to detect an item's ID. The item ID is required for\n     * deleting items via the `FormService.delete` method. The delete button\n     * will not be shown if no item ID can be found.\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     * The item to edit in the form. The form fields are automatically populated\n     * with values from the item's properties. In order to create a new item,\n     * either pass `null`, or leave this prop as undefined.\n     *\n     * Use the `onSubmitSuccess` callback to get notified when the item has been\n     * saved.\n     *\n     * When submitting a new item (i.e. when `item` is null or undefined), the\n     * form will be automatically cleared, allowing to submit another new item.\n     * In order to keep editing the same item after submitting, set the `item`\n     * prop to the new item.\n     */\n    item?: Value<M> | typeof emptyItem | null;\n    /**\n     * Whether the form should be disabled. This disables all form fields and\n     * all buttons.\n     */\n    disabled?: boolean;\n    /**\n     * Allows to customize the layout of the form by providing a custom\n     * renderer. The renderer receives the form instance and the pre-rendered\n     * fields as props. The renderer can either reuse the pre-rendered fields in\n     * the custom layout, or render custom fields and connect them to the form\n     * manually.\n     *\n     * Check the component documentation for details and examples.\n     *\n     * Example using pre-rendered fields:\n     * ```tsx\n     * <AutoForm layoutRenderer={({ children }) =>\n     *   <VerticalLayout>\n     *     {children}\n     *     <p>All data is collected anonymously.</p>\n     *   </VerticalLayout>\n     * } />\n     * ```\n     *\n     * Example rendering custom fields:\n     * ```tsx\n     * <AutoForm layoutRenderer={({ form }) =>\n     *   <VerticalLayout>\n     *     <TextField {...form.field(form.model.name)} />\n     *     ...\n     *   </VerticalLayout>\n     * } />\n     * ```\n     */\n    layoutRenderer?: ComponentType<AutoFormLayoutRendererProps<M>>;\n    /**\n     * Defines the fields to show in the form, and in which order. This takes\n     * an array of property names. Properties that are not included in this\n     * array will not be shown in the form, and properties that are included,\n     * but don't exist in the model, will be ignored.\n     */\n    visibleFields?: string[];\n    /**\n     * Allows to customize the FormLayout used by default. This is especially useful\n     * to define the `responsiveSteps`. See the\n     * {@link https://hilla.dev/docs/react/components/form-layout | FormLayout documentation}\n     * for details.\n     */\n    formLayoutProps?: ComponentStyleProps & Pick<Parameters<typeof FormLayout>[0], 'responsiveSteps'>;\n    /**\n     * Allows to customize individual fields of the form. This takes an object\n     * where the keys are property names, and the values are options for the\n     * respective field for editing that property.\n     */\n    fieldOptions?: Record<string, FieldOptions>;\n    /**\n     * Whether to show the delete button in the form. This is disabled by\n     * default. If enabled, the delete button will only be shown when editing\n     * an existing item, which means that `item` is not null. The delete button\n     * will also only be shown if an item has a discernible ID. See the\n     * `itemIdProperty` prop for details how the item ID is detected.\n     *\n     * Use the `onDeleteSuccess` callback to get notified when the item has been\n     * deleted.\n     *\n     * NOTE: This only hides the button, it does not prevent from calling the\n     * delete method on the service. To completely disable deleting, you must\n     * override the `delete` method in the backend Java service to either throw\n     * an exception or annotate it with `@DenyAll` to prevent access.\n     */\n    deleteButtonVisible?: boolean;\n    /**\n     * A callback that will be called if an unexpected error occurs while\n     * submitting the form.\n     *\n     * Note that this will not be called for validation errors, which are\n     * handled automatically.\n     */\n    onSubmitError?({ error }: SubmitErrorEvent): void;\n    /**\n     * A callback that will be called after the form has been successfully\n     * submitted and the item has been saved.\n     *\n     * When submitting a new item (i.e. when `item` is null or undefined), the\n     * form will be automatically cleared, allowing to submit another new item.\n     * In order to keep editing the same item after submitting, set the `item`\n     * prop to the new item.\n     */\n    onSubmitSuccess?({ item }: SubmitEvent<Value<M>>): void;\n    /**\n     * A callback that will be called if an unexpected error occurs while\n     * deleting an item.\n     */\n    onDeleteError?({ error }: DeleteErrorEvent): void;\n    /**\n     * A callback that will be called after the form has been successfully\n     * deleted.\n     */\n    onDeleteSuccess?({ item }: DeleteEvent<Value<M>>): void;\n  }>;\n\n/**\n * Auto Form is a component that automatically generates a form for editing,\n * updating and deleting items from a backend service.\n *\n * Example usage:\n * ```tsx\n * import { AutoForm } from '@hilla/react-crud';\n * import PersonService from 'Frontend/generated/endpoints';\n * import PersonModel from 'Frontend/generated/com/example/application/Person';\n *\n * <AutoForm\n *   service={PersonService}\n *   model={PersonModel}\n *   onSubmitSuccess={({ item }) => {\n *     console.log('Submitted item:', item);\n *   }}\n * />\n * ```\n */\nexport function AutoForm<M extends AbstractModel>({\n  service,\n  model,\n  itemIdProperty,\n  item = emptyItem,\n  onSubmitError,\n  onSubmitSuccess,\n  disabled,\n  layoutRenderer: LayoutRenderer,\n  visibleFields,\n  formLayoutProps,\n  fieldOptions,\n  style,\n  id,\n  className,\n  deleteButtonVisible,\n  onDeleteSuccess,\n  onDeleteError,\n}: AutoFormProps<M>): JSX.Element {\n  const form = useForm(model, {\n    onSubmit: async (formItem) => service.save(formItem),\n  });\n  const [formError, setFormError] = useState<JSX.Element | string>('');\n  const [showDeleteDialog, setShowDeleteDialog] = useState(false);\n  const modelInfo = useMemo(() => new ModelInfo(model, itemIdProperty), [model]);\n\n  const isEditMode = item !== undefined && item !== null && item !== emptyItem;\n  const showDeleteButton = deleteButtonVisible && isEditMode && modelInfo.idProperty;\n  const isSubmitDisabled = !!disabled || (isEditMode && !form.dirty);\n\n  useEffect(() => {\n    if (item !== emptyItem) {\n      form.read(item);\n    } else {\n      form.clear();\n    }\n  }, [item]);\n\n  function handleSubmitError(error: unknown) {\n    if (error instanceof ValidationError) {\n      const nonPropertyErrorMessages = error.errors\n        .filter((validationError) => !validationError.property)\n        .map((validationError) => validationError.validatorMessage ?? validationError.message);\n      if (nonPropertyErrorMessages.length > 0) {\n        setFormError(\n          <>\n            Validation errors:\n            <ul>\n              {nonPropertyErrorMessages.map((message, index) => (\n                <li key={index}>{message}</li>\n              ))}\n            </ul>\n          </>,\n        );\n      }\n    } else if (error instanceof EndpointError) {\n      if (onSubmitError) {\n        onSubmitError({ error, setMessage: setFormError });\n      } else {\n        setFormError(error.message);\n      }\n    } else {\n      throw error;\n    }\n  }\n\n  async function handleSubmit(): Promise<void> {\n    try {\n      setFormError('');\n      const newItem = await form.submit();\n      if (newItem === undefined) {\n        // If update returns an empty object, then no update was performed\n        throw new EndpointError('No update performed');\n      } else if (onSubmitSuccess) {\n        onSubmitSuccess({ item: newItem });\n      }\n      // Automatically clear the form after submitting a new item.\n      // Otherwise, there would be no way for the developer to clear it, as the\n      // there is no new value to set for the item prop to trigger the above\n      // effect in case the prop is already null, undefined or the empty item.\n      if (!item || item === emptyItem) {\n        form.clear();\n      }\n    } catch (error) {\n      handleSubmitError(error);\n    }\n  }\n\n  function deleteItem() {\n    setShowDeleteDialog(true);\n  }\n\n  async function confirmDelete() {\n    // At this point, item can not be null or emptyItem\n    const deletedItem = item as Value<M>;\n    try {\n      const idProperty = modelInfo.idProperty!;\n      // eslint-disable-next-line\n      const id = (item as any)[idProperty.name];\n      await service.delete(id);\n      if (onDeleteSuccess) {\n        onDeleteSuccess({ item: deletedItem });\n      }\n    } catch (error) {\n      if (error instanceof EndpointError) {\n        if (onDeleteError) {\n          onDeleteError({ error, setMessage: setFormError });\n        } else {\n          setFormError(error.message);\n        }\n      } else {\n        throw error;\n      }\n    } finally {\n      setShowDeleteDialog(false);\n    }\n  }\n\n  function cancelDelete() {\n    setShowDeleteDialog(false);\n  }\n\n  const handleKeyDown = (event: KeyboardEvent): void => {\n    if (event.key === 'Enter' && !isSubmitDisabled) {\n      // eslint-disable-next-line no-void\n      void handleSubmit();\n    }\n  };\n\n  function createAutoFormField(propertyInfo: PropertyInfo): JSX.Element {\n    const fieldOptionsForProperty = fieldOptions?.[propertyInfo.name] ?? {};\n\n    return (\n      <AutoFormField\n        key={propertyInfo.name}\n        propertyInfo={propertyInfo}\n        form={form}\n        disabled={disabled}\n        options={fieldOptionsForProperty}\n      />\n    );\n  }\n\n  const visibleProperties = visibleFields ? modelInfo.getProperties(visibleFields) : getDefaultProperties(modelInfo);\n\n  const fields = visibleProperties.map(createAutoFormField);\n\n  const layout = LayoutRenderer ? (\n    <LayoutRenderer form={form}>{fields}</LayoutRenderer>\n  ) : (\n    <FormLayout {...formLayoutProps}>{fields}</FormLayout>\n  );\n\n  return (\n    <div className={`auto-form ${className ?? ''}`} id={id} style={style} data-testid=\"auto-form\">\n      <VerticalLayout className=\"auto-form-fields\" onKeyDown={handleKeyDown}>\n        {layout}\n        {formError ? <div style={{ color: 'var(--lumo-error-color)' }}>{formError}</div> : <></>}\n      </VerticalLayout>\n      <div className=\"auto-form-toolbar\">\n        <Button\n          theme=\"primary\"\n          disabled={isSubmitDisabled}\n          // eslint-disable-next-line @typescript-eslint/no-misused-promises\n          onClick={handleSubmit}\n        >\n          Submit\n        </Button>\n        {form.dirty ? (\n          <Button theme=\"tertiary\" onClick={() => form.reset()}>\n            Discard\n          </Button>\n        ) : null}\n        {showDeleteButton && (\n          <Button className=\"auto-form-delete-button\" theme=\"tertiary error\" onClick={deleteItem}>\n            Delete...\n          </Button>\n        )}\n      </div>\n      {showDeleteDialog && (\n        <ConfirmDialog\n          opened\n          header=\"Delete item\"\n          confirmTheme=\"error\"\n          cancelButtonVisible\n          // eslint-disable-next-line\n          onConfirm={confirmDelete}\n          onCancel={cancelDelete}\n        >\n          Are you sure you want to delete the selected item?\n        </ConfirmDialog>\n      )}\n    </div>\n  );\n}\n"],
+  "mappings": "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",
+  "names": ["id"]
+}

package/autoform.obj.js

@@ -0,0 +1,6 @@
+const css = new CSSStyleSheet();
+css.replaceSync(`.auto-form{display:flex;flex-direction:column;gap:var(--lumo-space-m)}.auto-form-toolbar{align-items:center;display:flex;flex-direction:row-reverse;gap:var(--lumo-space-xs) var(--lumo-space-s);justify-content:flex-start}.auto-form-delete-button{margin-right:auto}`);
+export {
+  css as default
+};
+//# sourceMappingURL=autoform.obj.js.map

package/autoform.obj.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/autoform.obj.css"],
+  "sourcesContent": ["const css = new CSSStyleSheet();css.replaceSync(`.auto-form{display:flex;flex-direction:column;gap:var(--lumo-space-m)}.auto-form-toolbar{align-items:center;display:flex;flex-direction:row-reverse;gap:var(--lumo-space-xs) var(--lumo-space-s);justify-content:flex-start}.auto-form-delete-button{margin-right:auto}`);export { css as default };"],
+  "mappings": "AAAA,MAAM,MAAM,IAAI,cAAc;AAAE,IAAI,YAAY,yQAAyQ;",
+  "names": []
+}

package/autogrid-column-context.d.ts

@@ -0,0 +1,39 @@
+import type { GridSorterDirection } from '@vaadin/react-components/GridSorter.js';
+import { type Dispatch, type SetStateAction, type ComponentType } from 'react';
+import type { ColumnOptions } from './autogrid-columns';
+import type { HeaderFilterRendererProps } from './header-filter';
+import type { PropertyInfo } from './model-info';
+import type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion';
+export interface SorterState {
+    direction: GridSorterDirection;
+}
+export type SortState = Record<string, SorterState | undefined>;
+export type ColumnContext = Readonly<{
+    propertyInfo: PropertyInfo;
+    setColumnFilter(filter: FilterUnion, filterKey: string): void;
+    sortState: SortState;
+    setSortState: Dispatch<SetStateAction<SortState>>;
+    customColumnOptions?: ColumnOptions;
+    headerFilterRenderer: ComponentType<HeaderFilterRendererProps>;
+    filterKey: string;
+}>;
+export declare const ColumnContext: import("react").Context<Readonly<{
+    propertyInfo: PropertyInfo;
+    setColumnFilter(filter: FilterUnion, filterKey: string): void;
+    sortState: SortState;
+    setSortState: Dispatch<SetStateAction<SortState>>;
+    customColumnOptions?: ColumnOptions | undefined;
+    headerFilterRenderer: ComponentType<HeaderFilterRendererProps>;
+    filterKey: string;
+}> | null>;
+export type CustomColumnContext = Readonly<{
+    setColumnFilter(filter: FilterUnion, filterKey: string): void;
+    headerFilterRenderer: ComponentType<HeaderFilterRendererProps>;
+    filterKey: string;
+}>;
+export declare const CustomColumnContext: import("react").Context<Readonly<{
+    setColumnFilter(filter: FilterUnion, filterKey: string): void;
+    headerFilterRenderer: ComponentType<HeaderFilterRendererProps>;
+    filterKey: string;
+}> | null>;
+//# sourceMappingURL=autogrid-column-context.d.ts.map

package/autogrid-column-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autogrid-column-context.d.ts","sourceRoot":"","sources":["src/autogrid-column-context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAClF,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAiB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAC9F,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACxD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AACjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,KAAK,WAAW,MAAM,kDAAkD,CAAC;AAEhF,MAAM,WAAW,WAAW;IAC1B,SAAS,EAAE,mBAAmB,CAAC;CAChC;AAED,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,WAAW,GAAG,SAAS,CAAC,CAAC;AAEhE,MAAM,MAAM,aAAa,GAAG,QAAQ,CAAC;IACnC,YAAY,EAAE,YAAY,CAAC;IAC3B,eAAe,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9D,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,EAAE,QAAQ,CAAC,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC;IAClD,mBAAmB,CAAC,EAAE,aAAa,CAAC;IACpC,oBAAoB,EAAE,aAAa,CAAC,yBAAyB,CAAC,CAAC;IAC/D,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,eAAO,MAAM,aAAa;kBATV,YAAY;4BACF,WAAW,aAAa,MAAM,GAAG,IAAI;eAClD,SAAS;kBACN,SAAS,eAAe,SAAS,CAAC,CAAC;;0BAE3B,cAAc,yBAAyB,CAAC;eACnD,MAAM;UAGmD,CAAC;AAEvE,MAAM,MAAM,mBAAmB,GAAG,QAAQ,CAAC;IACzC,eAAe,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9D,oBAAoB,EAAE,aAAa,CAAC,yBAAyB,CAAC,CAAC;IAC/D,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,eAAO,MAAM,mBAAmB;4BALN,WAAW,aAAa,MAAM,GAAG,IAAI;0BACvC,cAAc,yBAAyB,CAAC;eACnD,MAAM;UAG+D,CAAC"}

package/autogrid-column-context.js

@@ -0,0 +1,8 @@
+import { createContext } from "react";
+const ColumnContext = createContext(null);
+const CustomColumnContext = createContext(null);
+export {
+  ColumnContext,
+  CustomColumnContext
+};
+//# sourceMappingURL=autogrid-column-context.js.map

package/autogrid-column-context.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/autogrid-column-context.tsx"],
+  "sourcesContent": ["import type { GridSorterDirection } from '@vaadin/react-components/GridSorter.js';\nimport { type Dispatch, type SetStateAction, createContext, type ComponentType } from 'react';\nimport type { ColumnOptions } from './autogrid-columns';\nimport type { HeaderFilterRendererProps } from './header-filter';\nimport type { PropertyInfo } from './model-info';\nimport type FilterUnion from './types/com/vaadin/hilla/crud/filter/FilterUnion';\n\nexport interface SorterState {\n  direction: GridSorterDirection;\n}\n\nexport type SortState = Record<string, SorterState | undefined>;\n\nexport type ColumnContext = Readonly<{\n  propertyInfo: PropertyInfo;\n  setColumnFilter(filter: FilterUnion, filterKey: string): void;\n  sortState: SortState;\n  setSortState: Dispatch<SetStateAction<SortState>>;\n  customColumnOptions?: ColumnOptions;\n  headerFilterRenderer: ComponentType<HeaderFilterRendererProps>;\n  filterKey: string;\n}>;\n\nexport const ColumnContext = createContext<ColumnContext | null>(null);\n\nexport type CustomColumnContext = Readonly<{\n  setColumnFilter(filter: FilterUnion, filterKey: string): void;\n  headerFilterRenderer: ComponentType<HeaderFilterRendererProps>;\n  filterKey: string;\n}>;\n\nexport const CustomColumnContext = createContext<CustomColumnContext | null>(null);\n"],
+  "mappings": "AACA,SAA6C,qBAAyC;AAsB/E,MAAM,gBAAgB,cAAoC,IAAI;AAQ9D,MAAM,sBAAsB,cAA0C,IAAI;",
+  "names": []
+}

package/autogrid-columns.d.ts

@@ -0,0 +1,6 @@
+import type { GridColumnProps } from '@vaadin/react-components/GridColumn.js';
+import { type HeaderFilterProps } from './header-filter';
+import type { PropertyInfo } from './model-info';
+export type ColumnOptions = HeaderFilterProps & Omit<GridColumnProps<any>, 'dangerouslySetInnerHTML'>;
+export declare function getColumnOptions(propertyInfo: PropertyInfo, customColumnOptions: ColumnOptions | undefined): ColumnOptions;
+//# sourceMappingURL=autogrid-columns.d.ts.map

package/autogrid-columns.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autogrid-columns.d.ts","sourceRoot":"","sources":["src/autogrid-columns.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,wCAAwC,CAAC;AAW9E,OAAO,EAIL,KAAK,iBAAiB,EAKvB,MAAM,iBAAiB,CAAC;AACzB,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAEjD,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAAG,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,EAAE,yBAAyB,CAAC,CAAC;AA+EtG,wBAAgB,gBAAgB,CAC9B,YAAY,EAAE,YAAY,EAC1B,mBAAmB,EAAE,aAAa,GAAG,SAAS,GAC7C,aAAa,CAWf"}

package/autogrid-columns.js

@@ -0,0 +1,102 @@
+import {
+  AutoGridBooleanRenderer,
+  AutoGridDateRenderer,
+  AutoGridDateTimeRenderer,
+  AutoGridDecimalRenderer,
+  AutoGridEnumRenderer,
+  AutoGridIntegerRenderer,
+  AutoGridJsonRenderer,
+  AutoGridTimeRenderer
+} from "./autogrid-renderers";
+import {
+  BooleanHeaderFilter,
+  DateHeaderFilter,
+  EnumHeaderFilter,
+  NoHeaderFilter,
+  NumberHeaderFilter,
+  StringHeaderFilter,
+  TimeHeaderFilter
+} from "./header-filter";
+function getTypeColumnOptions(propertyInfo) {
+  switch (propertyInfo.type) {
+    case "integer":
+      return {
+        autoWidth: true,
+        textAlign: "end",
+        flexGrow: 0,
+        renderer: AutoGridIntegerRenderer,
+        headerFilterRenderer: NumberHeaderFilter
+      };
+    case "decimal":
+      return {
+        autoWidth: true,
+        textAlign: "end",
+        flexGrow: 0,
+        renderer: AutoGridDecimalRenderer,
+        headerFilterRenderer: NumberHeaderFilter
+      };
+    case "boolean":
+      return {
+        autoWidth: true,
+        textAlign: "end",
+        flexGrow: 0,
+        renderer: AutoGridBooleanRenderer,
+        headerFilterRenderer: BooleanHeaderFilter
+      };
+    case "date":
+      return {
+        autoWidth: true,
+        textAlign: "end",
+        flexGrow: 0,
+        renderer: AutoGridDateRenderer,
+        headerFilterRenderer: DateHeaderFilter
+      };
+    case "time":
+      return {
+        autoWidth: true,
+        textAlign: "end",
+        flexGrow: 0,
+        renderer: AutoGridTimeRenderer,
+        headerFilterRenderer: TimeHeaderFilter
+      };
+    case "datetime":
+      return {
+        autoWidth: true,
+        textAlign: "end",
+        flexGrow: 0,
+        renderer: AutoGridDateTimeRenderer,
+        headerFilterRenderer: DateHeaderFilter
+      };
+    case "enum":
+      return {
+        autoWidth: true,
+        renderer: AutoGridEnumRenderer,
+        headerFilterRenderer: EnumHeaderFilter
+      };
+    case "string":
+      return {
+        autoWidth: true,
+        headerFilterRenderer: StringHeaderFilter
+      };
+    case "object":
+      return {
+        autoWidth: true,
+        renderer: AutoGridJsonRenderer,
+        headerFilterRenderer: NoHeaderFilter
+      };
+    default:
+      return {
+        autoWidth: true,
+        headerFilterRenderer: NoHeaderFilter
+      };
+  }
+}
+function getColumnOptions(propertyInfo, customColumnOptions) {
+  const typeColumnOptions = getTypeColumnOptions(propertyInfo);
+  const headerFilterRenderer = customColumnOptions?.filterable === false ? NoHeaderFilter : typeColumnOptions.headerFilterRenderer ?? NoHeaderFilter;
+  return customColumnOptions ? { ...typeColumnOptions, headerFilterRenderer, ...customColumnOptions } : typeColumnOptions;
+}
+export {
+  getColumnOptions
+};
+//# sourceMappingURL=autogrid-columns.js.map

package/autogrid-columns.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/autogrid-columns.tsx"],
+  "sourcesContent": ["import type { GridColumnProps } from '@vaadin/react-components/GridColumn.js';\nimport {\n  AutoGridBooleanRenderer,\n  AutoGridDateRenderer,\n  AutoGridDateTimeRenderer,\n  AutoGridDecimalRenderer,\n  AutoGridEnumRenderer,\n  AutoGridIntegerRenderer,\n  AutoGridJsonRenderer,\n  AutoGridTimeRenderer,\n} from './autogrid-renderers';\nimport {\n  BooleanHeaderFilter,\n  DateHeaderFilter,\n  EnumHeaderFilter,\n  type HeaderFilterProps,\n  NoHeaderFilter,\n  NumberHeaderFilter,\n  StringHeaderFilter,\n  TimeHeaderFilter,\n} from './header-filter';\nimport type { PropertyInfo } from './model-info';\n\nexport type ColumnOptions = HeaderFilterProps & Omit<GridColumnProps<any>, 'dangerouslySetInnerHTML'>;\n\n// eslint-disable-next-line consistent-return\nfunction getTypeColumnOptions(propertyInfo: PropertyInfo): ColumnOptions {\n  // eslint-disable-next-line default-case\n  switch (propertyInfo.type) {\n    case 'integer':\n      return {\n        autoWidth: true,\n        textAlign: 'end',\n        flexGrow: 0,\n        renderer: AutoGridIntegerRenderer,\n        headerFilterRenderer: NumberHeaderFilter,\n      };\n    case 'decimal':\n      return {\n        autoWidth: true,\n        textAlign: 'end',\n        flexGrow: 0,\n        renderer: AutoGridDecimalRenderer,\n        headerFilterRenderer: NumberHeaderFilter,\n      };\n    case 'boolean':\n      return {\n        autoWidth: true,\n        textAlign: 'end',\n        flexGrow: 0,\n        renderer: AutoGridBooleanRenderer,\n        headerFilterRenderer: BooleanHeaderFilter,\n      };\n    case 'date':\n      return {\n        autoWidth: true,\n        textAlign: 'end',\n        flexGrow: 0,\n        renderer: AutoGridDateRenderer,\n        headerFilterRenderer: DateHeaderFilter,\n      };\n    case 'time':\n      return {\n        autoWidth: true,\n        textAlign: 'end',\n        flexGrow: 0,\n        renderer: AutoGridTimeRenderer,\n        headerFilterRenderer: TimeHeaderFilter,\n      };\n    case 'datetime':\n      return {\n        autoWidth: true,\n        textAlign: 'end',\n        flexGrow: 0,\n        renderer: AutoGridDateTimeRenderer,\n        headerFilterRenderer: DateHeaderFilter,\n      };\n    case 'enum':\n      return {\n        autoWidth: true,\n        renderer: AutoGridEnumRenderer,\n        headerFilterRenderer: EnumHeaderFilter,\n      };\n    case 'string':\n      return {\n        autoWidth: true,\n        headerFilterRenderer: StringHeaderFilter,\n      };\n    case 'object':\n      return {\n        autoWidth: true,\n        renderer: AutoGridJsonRenderer,\n        headerFilterRenderer: NoHeaderFilter,\n      };\n    default:\n      return {\n        autoWidth: true,\n        headerFilterRenderer: NoHeaderFilter,\n      };\n  }\n}\n\nexport function getColumnOptions(\n  propertyInfo: PropertyInfo,\n  customColumnOptions: ColumnOptions | undefined,\n): ColumnOptions {\n  const typeColumnOptions = getTypeColumnOptions(propertyInfo);\n  const headerFilterRenderer =\n    customColumnOptions?.filterable === false\n      ? NoHeaderFilter\n      : typeColumnOptions.headerFilterRenderer ?? NoHeaderFilter;\n  // TODO: Remove eslint-disable when all TypeScript version issues are resolved\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  return customColumnOptions\n    ? { ...typeColumnOptions, headerFilterRenderer, ...customColumnOptions }\n    : typeColumnOptions;\n}\n"],
+  "mappings": "AACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAMP,SAAS,qBAAqB,cAA2C;AAEvE,UAAQ,aAAa,MAAM;AAAA,IACzB,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,WAAW;AAAA,QACX,UAAU;AAAA,QACV,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,sBAAsB;AAAA,MACxB;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,WAAW;AAAA,QACX,UAAU;AAAA,QACV,sBAAsB;AAAA,MACxB;AAAA,IACF;AACE,aAAO;AAAA,QACL,WAAW;AAAA,QACX,sBAAsB;AAAA,MACxB;AAAA,EACJ;AACF;AAEO,SAAS,iBACd,cACA,qBACe;AACf,QAAM,oBAAoB,qBAAqB,YAAY;AAC3D,QAAM,uBACJ,qBAAqB,eAAe,QAChC,iBACA,kBAAkB,wBAAwB;AAGhD,SAAO,sBACH,EAAE,GAAG,mBAAmB,sBAAsB,GAAG,oBAAoB,IACrE;AACN;",
+  "names": []
+}

package/autogrid-feature.d.ts

@@ -0,0 +1,4 @@
+import { AutoGrid as _AutoGrid } from './autogrid.js';
+export * from './autogrid.js';
+export declare const AutoGrid: typeof _AutoGrid;
+//# sourceMappingURL=autogrid-feature.d.ts.map

package/autogrid-feature.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autogrid-feature.d.ts","sourceRoot":"","sources":["src/autogrid-feature.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,eAAe,CAAC;AAGtD,cAAc,eAAe,CAAC;AAE9B,eAAO,MAAM,QAAQ,EAAE,OAAO,SAAsD,CAAC"}

package/autogrid-feature.js

@@ -0,0 +1,8 @@
+import { AutoGrid as _AutoGrid } from "./autogrid.js";
+import { featureRegistration } from "./util";
+export * from "./autogrid.js";
+const AutoGrid = featureRegistration(_AutoGrid, "AutoGrid");
+export {
+  AutoGrid
+};
+//# sourceMappingURL=autogrid-feature.js.map

package/autogrid-feature.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/autogrid-feature.ts"],
+  "sourcesContent": ["/* eslint-disable import/export */\nimport { AutoGrid as _AutoGrid } from './autogrid.js';\nimport { featureRegistration } from './util';\n\nexport * from './autogrid.js';\n\nexport const AutoGrid: typeof _AutoGrid = featureRegistration(_AutoGrid, 'AutoGrid');\n"],
+  "mappings": "AACA,SAAS,YAAY,iBAAiB;AACtC,SAAS,2BAA2B;AAEpC,cAAc;AAEP,MAAM,WAA6B,oBAAoB,WAAW,UAAU;",
+  "names": []
+}

package/autogrid-renderers.d.ts

@@ -0,0 +1,28 @@
+import type { GridItemModel } from '@vaadin/react-components/Grid.js';
+import type { GridColumnElement } from '@vaadin/react-components/GridColumn.js';
+import { type ComponentType, type JSX } from 'react';
+import type { ItemCounts } from './data-provider';
+import '@vaadin/vaadin-lumo-styles/vaadin-iconset.js';
+export type RendererOptions<TItem> = {
+    item: TItem;
+    model: GridItemModel<TItem>;
+    original: GridColumnElement<TItem>;
+};
+export declare function AutoGridIntegerRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridDecimalRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridEnumRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridBooleanRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridDateRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridTimeRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridDateTimeRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridJsonRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element;
+export declare function AutoGridRowNumberRenderer<TItem>({ model }: RendererOptions<TItem>): JSX.Element;
+export type FooterContextType = {
+    totalCount?: boolean;
+    filteredCount?: boolean;
+    footerCountRenderer?: ComponentType<ItemCounts>;
+    itemCounts?: ItemCounts;
+};
+export declare const FooterContext: import("react").Context<FooterContextType>;
+export declare function AutoGridFooterItemCountRenderer(): JSX.Element;
+//# sourceMappingURL=autogrid-renderers.d.ts.map

package/autogrid-renderers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"autogrid-renderers.d.ts","sourceRoot":"","sources":["src/autogrid-renderers.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kCAAkC,CAAC;AACtE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,wCAAwC,CAAC;AAEhF,OAAO,EAAE,KAAK,aAAa,EAAqC,KAAK,GAAG,EAAc,MAAM,OAAO,CAAC;AAEpG,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAKlD,OAAO,8CAA8C,CAAC;AAEtD,MAAM,MAAM,eAAe,CAAC,KAAK,IAAI;IACnC,IAAI,EAAE,KAAK,CAAC;IACZ,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5B,QAAQ,EAAE,iBAAiB,CAAC,KAAK,CAAC,CAAC;CACpC,CAAC;AAUF,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAI5F;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAI5F;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAIzF;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAO5F;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAIzF;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAIzF;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAI7F;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAMzF;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAE/F;AAED,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mBAAmB,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;IAChD,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,aAAa,4CAA+C,CAAC;AAE1E,wBAAgB,+BAA+B,IAAI,GAAG,CAAC,OAAO,CAqB7D"}

package/autogrid-renderers.js

@@ -0,0 +1,92 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+import { Icon } from "@vaadin/react-components/Icon.js";
+import { createContext, useContext } from "react";
+import { ColumnContext } from "./autogrid-column-context";
+import { useLocaleFormatter } from "./locale.js";
+import { convertToTitleCase } from "./util";
+import "@vaadin/vaadin-lumo-styles/vaadin-iconset.js";
+function getColumnValue(context, item) {
+  const path = context.propertyInfo.name;
+  return path.split(".").reduce((obj, property) => obj ? obj[property] : void 0, item);
+}
+const fontVariantStyle = { fontVariantNumeric: "tabular-nums" };
+function AutoGridIntegerRenderer({ item }) {
+  const formatter = useLocaleFormatter();
+  const context = useContext(ColumnContext);
+  return /* @__PURE__ */ jsx("span", { style: fontVariantStyle, children: formatter.formatInteger(getColumnValue(context, item)) });
+}
+function AutoGridDecimalRenderer({ item }) {
+  const formatter = useLocaleFormatter();
+  const context = useContext(ColumnContext);
+  return /* @__PURE__ */ jsx("span", { style: fontVariantStyle, children: formatter.formatDecimal(getColumnValue(context, item)) });
+}
+function AutoGridEnumRenderer({ item }) {
+  const context = useContext(ColumnContext);
+  const value = getColumnValue(context, item) || "";
+  return /* @__PURE__ */ jsx("span", { children: convertToTitleCase(value) });
+}
+function AutoGridBooleanRenderer({ item }) {
+  const context = useContext(ColumnContext);
+  const value = getColumnValue(context, item);
+  if (value) {
+    return /* @__PURE__ */ jsx(Icon, { "aria-label": "false", icon: "lumo:checkmark" });
+  }
+  return /* @__PURE__ */ jsx(Icon, { "aria-label": "true", style: { color: "var(--lumo-secondary-text-color)" }, icon: "lumo:minus" });
+}
+function AutoGridDateRenderer({ item }) {
+  const formatter = useLocaleFormatter();
+  const context = useContext(ColumnContext);
+  return /* @__PURE__ */ jsx("span", { style: fontVariantStyle, children: formatter.formatDate(getColumnValue(context, item)) });
+}
+function AutoGridTimeRenderer({ item }) {
+  const formatter = useLocaleFormatter();
+  const context = useContext(ColumnContext);
+  return /* @__PURE__ */ jsx("span", { style: fontVariantStyle, children: formatter.formatLocalTime(getColumnValue(context, item)) });
+}
+function AutoGridDateTimeRenderer({ item }) {
+  const formatter = useLocaleFormatter();
+  const context = useContext(ColumnContext);
+  return /* @__PURE__ */ jsx("span", { style: fontVariantStyle, children: formatter.formatLocalDateTime(getColumnValue(context, item)) });
+}
+function AutoGridJsonRenderer({ item }) {
+  const context = useContext(ColumnContext);
+  const value = getColumnValue(context, item);
+  const jsonString = value ? JSON.stringify(value) : "";
+  const jsonPreview = jsonString.length > 50 ? `${jsonString.substring(0, 50)}...` : jsonString;
+  return /* @__PURE__ */ jsx("span", { children: jsonPreview });
+}
+function AutoGridRowNumberRenderer({ model }) {
+  return /* @__PURE__ */ jsx(Fragment, { children: model.index + 1 });
+}
+const FooterContext = createContext(void 0);
+function AutoGridFooterItemCountRenderer() {
+  const footerContext = useContext(FooterContext);
+  const { totalCount, filteredCount, itemCounts, footerCountRenderer: FooterRenderer } = footerContext;
+  if (FooterRenderer) {
+    return /* @__PURE__ */ jsx(FooterRenderer, { ...itemCounts });
+  }
+  let filterCountText;
+  if (filteredCount && itemCounts?.filteredCount !== void 0) {
+    filterCountText = totalCount && itemCounts.totalCount !== void 0 ? `Showing: ${itemCounts.filteredCount} out of ${itemCounts.totalCount}` : `Showing: ${itemCounts.filteredCount}`;
+  } else if (totalCount && itemCounts?.totalCount !== void 0) {
+    filterCountText = `Total: ${itemCounts.totalCount}`;
+  }
+  if (filterCountText) {
+    return /* @__PURE__ */ jsx("p", { children: filterCountText });
+  }
+  return /* @__PURE__ */ jsx(Fragment, {});
+}
+export {
+  AutoGridBooleanRenderer,
+  AutoGridDateRenderer,
+  AutoGridDateTimeRenderer,
+  AutoGridDecimalRenderer,
+  AutoGridEnumRenderer,
+  AutoGridFooterItemCountRenderer,
+  AutoGridIntegerRenderer,
+  AutoGridJsonRenderer,
+  AutoGridRowNumberRenderer,
+  AutoGridTimeRenderer,
+  FooterContext
+};
+//# sourceMappingURL=autogrid-renderers.js.map

package/autogrid-renderers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/autogrid-renderers.tsx"],
+  "sourcesContent": ["import type { GridItemModel } from '@vaadin/react-components/Grid.js';\nimport type { GridColumnElement } from '@vaadin/react-components/GridColumn.js';\nimport { Icon } from '@vaadin/react-components/Icon.js';\nimport { type ComponentType, createContext, type CSSProperties, type JSX, useContext } from 'react';\nimport { ColumnContext } from './autogrid-column-context';\nimport type { ItemCounts } from './data-provider';\nimport { useLocaleFormatter } from './locale.js';\nimport { convertToTitleCase } from './util';\n\n// eslint-disable-next-line\nimport '@vaadin/vaadin-lumo-styles/vaadin-iconset.js';\n\nexport type RendererOptions<TItem> = {\n  item: TItem;\n  model: GridItemModel<TItem>;\n  original: GridColumnElement<TItem>;\n};\n\nfunction getColumnValue<TItem>(context: ColumnContext, item: TItem): any {\n  const path = context.propertyInfo.name;\n  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n  return path.split('.').reduce<any>((obj, property) => (obj ? obj[property] : undefined), item);\n}\n\nconst fontVariantStyle: CSSProperties = { fontVariantNumeric: 'tabular-nums' };\n\nexport function AutoGridIntegerRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const formatter = useLocaleFormatter();\n  const context = useContext(ColumnContext)!;\n  return <span style={fontVariantStyle}>{formatter.formatInteger(getColumnValue(context, item))}</span>;\n}\n\nexport function AutoGridDecimalRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const formatter = useLocaleFormatter();\n  const context = useContext(ColumnContext)!;\n  return <span style={fontVariantStyle}>{formatter.formatDecimal(getColumnValue(context, item))}</span>;\n}\n\nexport function AutoGridEnumRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const context = useContext(ColumnContext)!;\n  const value = getColumnValue(context, item) || '';\n  return <span>{convertToTitleCase(value)}</span>;\n}\n\nexport function AutoGridBooleanRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const context = useContext(ColumnContext)!;\n  const value = getColumnValue(context, item);\n  if (value) {\n    return <Icon aria-label=\"false\" icon=\"lumo:checkmark\" />;\n  }\n  return <Icon aria-label=\"true\" style={{ color: 'var(--lumo-secondary-text-color)' }} icon=\"lumo:minus\" />;\n}\n\nexport function AutoGridDateRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const formatter = useLocaleFormatter();\n  const context = useContext(ColumnContext)!;\n  return <span style={fontVariantStyle}>{formatter.formatDate(getColumnValue(context, item))}</span>;\n}\n\nexport function AutoGridTimeRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const formatter = useLocaleFormatter();\n  const context = useContext(ColumnContext)!;\n  return <span style={fontVariantStyle}>{formatter.formatLocalTime(getColumnValue(context, item))}</span>;\n}\n\nexport function AutoGridDateTimeRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const formatter = useLocaleFormatter();\n  const context = useContext(ColumnContext)!;\n  return <span style={fontVariantStyle}>{formatter.formatLocalDateTime(getColumnValue(context, item))}</span>;\n}\n\nexport function AutoGridJsonRenderer<TItem>({ item }: RendererOptions<TItem>): JSX.Element {\n  const context = useContext(ColumnContext)!;\n  const value = getColumnValue(context, item);\n  const jsonString = value ? JSON.stringify(value) : '';\n  const jsonPreview = jsonString.length > 50 ? `${jsonString.substring(0, 50)}...` : jsonString;\n  return <span>{jsonPreview}</span>;\n}\n\nexport function AutoGridRowNumberRenderer<TItem>({ model }: RendererOptions<TItem>): JSX.Element {\n  return <>{model.index + 1}</>;\n}\n\nexport type FooterContextType = {\n  totalCount?: boolean;\n  filteredCount?: boolean;\n  footerCountRenderer?: ComponentType<ItemCounts>;\n  itemCounts?: ItemCounts;\n};\n\nexport const FooterContext = createContext<FooterContextType>(undefined!);\n\nexport function AutoGridFooterItemCountRenderer(): JSX.Element {\n  const footerContext = useContext(FooterContext);\n  const { totalCount, filteredCount, itemCounts, footerCountRenderer: FooterRenderer } = footerContext;\n\n  if (FooterRenderer) {\n    return <FooterRenderer {...itemCounts} />;\n  }\n\n  let filterCountText: string | undefined;\n  if (filteredCount && itemCounts?.filteredCount !== undefined) {\n    filterCountText =\n      totalCount && itemCounts.totalCount !== undefined\n        ? `Showing: ${itemCounts.filteredCount} out of ${itemCounts.totalCount}`\n        : `Showing: ${itemCounts.filteredCount}`;\n  } else if (totalCount && itemCounts?.totalCount !== undefined) {\n    filterCountText = `Total: ${itemCounts.totalCount}`;\n  }\n  if (filterCountText) {\n    return <p>{filterCountText}</p>;\n  }\n  return <></>;\n}\n"],
+  "mappings": "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",
+  "names": []
+}