@luscii-healthtech/web-ui 0.0.0-alpha.00bf0f6

package/dist/src/components/DetailsDisclosure/DetailsDisclosure.d.ts

@@ -0,0 +1,81 @@
+import type { ReactNode } from "react";
+import { type ComponentProps, type FC } from "react";
+import { Box } from "../Box/Box";
+import { Stack } from "../Stack/Stack";
+type Props = Omit<ComponentProps<typeof Box<"details">>, "as"> & {
+    children?: ReactNode;
+    /**
+     * This attribute enables multiple <details> elements to be connected, with only one open at a time.
+     *
+     * This allows developers to easily create UI features such as accordions without scripting.
+     *
+     * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#name
+     */
+    name?: string;
+    /**
+     * Called when the details component opens or closes.
+     */
+    onToggleDetails?: (
+    /**
+     * Indicates wether the toggle actions resulted in an open or closed DetailsDisclosure component
+     */
+    isOpen: boolean) => void;
+} /**
+ * Enforce usage of either open or openByDefault through the type system.
+ */ & ({
+    open?: never;
+    /**
+     * Used when this component is used as an uncontrolled component.
+     *
+     * This sets the initial open state after which control is delegated to the component.
+     *
+     * When using this prop the `open` prop should be omitted.
+     */
+    openByDefault?: boolean;
+} | {
+    /**
+     * Passed to the internal `<details />` element.
+     *
+     * This value should be used to use the component as a controlled component.
+     *
+     * When using this prop the `openByDefault` prop should be omitted.
+     *
+     * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details#open
+     */
+    open?: boolean;
+    openByDefault?: never;
+});
+/**
+ * The `DetailsDisclosure` component provides a description of which more information can be disclosed when the widget is toggled to its open state.
+ *
+ * It is a reflection of the `<details><summary /></details>` HTML elements.
+ *
+ * @example
+ *
+ * <DetailsDisclosure>
+ *   <DetailsDisclosure.Summary>Title</DetailsDisclosure.Summary>
+ *   details content
+ * </DetailsDisclosure>
+ */
+export declare const DetailsDisclosure: FC<Props> & {
+    Summary: typeof Summary;
+};
+type SummaryProps = Omit<ComponentProps<typeof Stack<"summary">>, "as"> & {
+    /**
+     * When set to true will omit the open indicator which is presented as a chevron by default.
+     *
+     * Omitting the open indicator allows the implementer to set a custom indicator using the DetailsDisclosure.OpenIndicator component.
+     *
+     * @default false
+     */
+    omitOpenIndicator?: boolean;
+};
+export declare const OpenIndicator: FC<{
+    component: FC<{
+        isOpen: boolean;
+    }>;
+}>;
+export declare const Summary: FC<SummaryProps> & {
+    OpenIndicator: typeof OpenIndicator;
+};
+export {};

package/dist/src/components/Divider/Divider.d.ts

@@ -0,0 +1,36 @@
+import type { ComponentProps, ComponentPropsWithoutRef, FC } from "react";
+import { Stack } from "../Stack/Stack";
+type DividerProps = ComponentPropsWithoutRef<"div"> & {
+    dark?: boolean;
+};
+type HrProps = ComponentPropsWithoutRef<"hr"> & {
+    /**
+     * Request the v2 version of the divider, which has the following benefits:
+     * - Uses an `<hr>` tag instead of a `<div>`.
+     * - Uses the border color from the design system, and doesn't have a prop
+     *   to change it.
+     * - Doesn't contain any logic about when it should be hidden.
+     */
+    version: "v2";
+    /**
+     * The color of the divider. Defaults to "border".
+     */
+    color?: "divider" | "border" | "high-contrast" | "low-contrast";
+    /**
+     * The variant of the divider
+     *
+     * @default "hr"
+     */
+    variant?: "hr";
+};
+type VerticalFlowDividerProps = ComponentProps<typeof Stack> & {
+    version: "v2";
+    variant: "vertical-flow";
+};
+type Props = DividerProps | HrProps | VerticalFlowDividerProps | HorizontalFlowDividerProps;
+export declare const Divider: FC<Props>;
+type HorizontalFlowDividerProps = ComponentProps<typeof Stack> & {
+    version: "v2";
+    variant: "horizontal-flow";
+};
+export {};

package/dist/src/components/DragHandle/DragHandle.d.ts

@@ -0,0 +1,6 @@
+declare const DragHandle: import("react").ForwardRefExoticComponent<import("react").HTMLAttributes<HTMLButtonElement> & {
+    grabbing: boolean;
+    disabled?: boolean;
+    dataTestId?: string;
+} & import("react").RefAttributes<HTMLButtonElement>>;
+export default DragHandle;

package/dist/src/components/DragHandle/DragHandle.types.d.ts

@@ -0,0 +1,5 @@
+export type DragHandleProps = React.HTMLAttributes<HTMLButtonElement> & {
+    grabbing: boolean;
+    disabled?: boolean;
+    dataTestId?: string;
+};

package/dist/src/components/DragHandle/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./DragHandle";
+export type { DragHandleProps } from "./DragHandle.types";

package/dist/src/components/Dropdown/Dropdown.d.ts

@@ -0,0 +1,61 @@
+export default Dropdown;
+/**
+ * @deprecated
+ * This component is very similar to the `Select` component. The `Select` component is more
+ * advanced and supports more use cases, so `Select` should be used instead.
+ */
+declare class Dropdown extends React.PureComponent<any, any, any> {
+    static getDerivedStateFromProps(nextProps: any, prevState: any): any;
+    constructor(props: any);
+    state: {
+        totalItemCount: any;
+        isDropdownOpen: boolean;
+        highlightIndex: null;
+        selectedItem: any;
+        items: any;
+    };
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    handleClickOutside: (event: any) => void;
+    handleKeyDown: (event: any) => void;
+    findItem: (items: any, fieldName: any, fieldValue: any) => any;
+    openDropdown: () => void;
+    closeDropdown: () => void;
+    setSelectedItem: (item: any) => void;
+    findSelectedItem: (selectedIndex: any) => Element;
+    scrollToHighlightedItem: (selectedIndex: any) => void;
+    increaseHighlightIndexIfPossible: () => void;
+    decreaseHighlightIndexIfPossible: () => void;
+    selectItem: (item: any) => void;
+    renderIndividualItem: (item: any) => import("react/jsx-runtime").JSX.Element;
+    renderGroupedItems: (item: any) => import("react/jsx-runtime").JSX.Element;
+    renderItems: () => import("react/jsx-runtime").JSX.Element;
+    dropdownListRef: HTMLDivElement | null | undefined;
+    render(): import("react/jsx-runtime").JSX.Element;
+    rootRef: HTMLDivElement | null | undefined;
+}
+declare namespace Dropdown {
+    namespace propTypes {
+        let items: PropTypes.Validator<(NonNullable<PropTypes.InferProps<{
+            id: PropTypes.Validator<string>;
+            text: PropTypes.Validator<string>;
+            key: PropTypes.Validator<string>;
+        }> | PropTypes.InferProps<{
+            subItems: PropTypes.Validator<(PropTypes.InferProps<{
+                id: PropTypes.Validator<string>;
+                text: PropTypes.Validator<string>;
+                key: PropTypes.Validator<string>;
+            }> | null | undefined)[]>;
+            title: PropTypes.Requireable<string>;
+            groupKey: PropTypes.Validator<string>;
+        }> | null | undefined> | null | undefined)[]>;
+        let initialSelectedItemId: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
+        let placeholder: PropTypes.Requireable<string>;
+        let className: PropTypes.Requireable<string>;
+        let onItemSelect: PropTypes.Validator<(...args: any[]) => any>;
+        let wider: PropTypes.Requireable<boolean>;
+        let name: PropTypes.Requireable<string>;
+    }
+}
+import React from "react";
+import PropTypes from "prop-types";

package/dist/src/components/Dropzone/Dropzone.d.ts

@@ -0,0 +1,6 @@
+import { type FC } from "react";
+import "./Dropzone.scss";
+import type { DropzoneProps, DropzonePresentationProps } from "./Dropzone.types";
+export declare const DropzonePresentation: import("react").ForwardRefExoticComponent<Omit<DropzonePresentationProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+export declare const Dropzone: FC<DropzoneProps>;
+export default Dropzone;

package/dist/src/components/Dropzone/Dropzone.types.d.ts

@@ -0,0 +1,33 @@
+import type { ReactNode, Ref } from "react";
+import type { IconKey } from "../Icons/types/IconProps.type";
+export type DropzonePresentationProps = {
+    /**
+     * Message shown to the user hinting how to use the component
+     * Usually something like "Click or Drag"
+     */
+    message?: string;
+    /**
+     * @deprecated
+     * Dropzones no longer support icons
+     */
+    icon?: IconKey;
+    isHighlighted?: boolean;
+    isClickable?: boolean;
+    ref?: Ref<HTMLDivElement>;
+    children?: ReactNode;
+    className?: string;
+    dataTestId?: string;
+    /**
+     * @deprecated
+     * use alignMessage instead
+     */
+    horizontal?: boolean;
+    alignMessage?: "left" | "center";
+};
+export type DropzoneProps = Omit<DropzonePresentationProps, "isHighlighted" | "isClickable"> & {
+    draggableIdentifier: string | number;
+    disabled?: boolean;
+    data?: Record<string, unknown>;
+    dataTestId?: string;
+    onClick?: React.HTMLAttributes<HTMLButtonElement>["onClick"];
+};

package/dist/src/components/Dropzone/index.d.ts

@@ -0,0 +1,2 @@
+export { Dropzone, DropzonePresentation } from "./Dropzone";
+export type { DropzoneProps } from "./Dropzone.types";

package/dist/src/components/EmptyListMessage/EmptyListMessage.d.ts

@@ -0,0 +1,13 @@
+declare const imageSrc: {
+    "no-open-alerts": string;
+    "search-not-found": string;
+    "no-notes-found": string;
+};
+type EmptyListMessageProps = {
+    text: string;
+    imageName?: keyof typeof imageSrc;
+    dataTestId?: string;
+    className?: string;
+};
+export declare const EmptyListMessage: ({ text, imageName, dataTestId, className, }: EmptyListMessageProps) => JSX.Element;
+export {};

package/dist/src/components/FilePreviewModal/FilePreview.d.ts

@@ -0,0 +1,25 @@
+import type { FC, MouseEventHandler } from "react";
+type Props = {
+    /**
+     * The actual location of the file. Make sure this is an unauthenticated URL, otherwise the download may fail.
+     *
+     * @example "https://luscii-tst-user-uploaded-files.s3.eu-central-1.amazonaws.com/<patientUuid>/<filename>.<extension>?X-Amz-Expires=60&x-amz-security-token=<token>&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=<credential>&X-Amz-Date=20250402T075801Z&X-Amz-SignedHeaders=host;x-amz-security-token&X-Amz-Signature=<signature>"
+     */
+    fileUrl: string;
+    /**
+     * Download URL, if it is different from the fileUrl for previewing.
+     * This can be because the fileUrl needs the content-disposition header to be set to attachment for downloading, but
+     * this would cause an immediate download instead of a preview for some files, which we don't want.
+     *
+     * @param fileUrl
+     */
+    downloadUrl?: string;
+    localization: {
+        closeButtonLabel: string;
+        downloadButtonLabel: string;
+    };
+    onClose: MouseEventHandler<HTMLElement>;
+    onDownload?: MouseEventHandler<HTMLAnchorElement>;
+};
+export declare const FilePreview: FC<Props>;
+export {};

package/dist/src/components/FileUpload/FileUpload.d.ts

@@ -0,0 +1,32 @@
+import type { FC } from "react";
+export type FileUploadProps = {
+    /**
+     * The file types that the input should accept.
+     */
+    accept?: string;
+    /**
+     * The maximum size of the file in MBs.
+     */
+    maxFileSize?: number;
+    /**
+     * The name of the field input.
+     */
+    name?: string;
+    /**
+     * The id of the field input.
+     * To be used with a `<label htmlFor={id}>`.
+     */
+    id?: string;
+    onChange?: (file: File) => void;
+    /**
+     * Disallow the user to change the file input value.
+     */
+    isDisabled?: boolean;
+    /**
+     * The text to be displayed on the button controlling the file input.
+     *
+     * @default "Upload a file"
+     */
+    buttonText: string;
+};
+export declare const FileUpload: FC<FileUploadProps>;

package/dist/src/components/FilterBar/ActiveFilters.d.ts

@@ -0,0 +1,9 @@
+import type React from "react";
+import { type CategorizedFilters, type FilterBarLocalization, type OnFilterBarFilterChange } from "./FilterBarProps.type";
+type ActiveFiltersProps = {
+    filters: CategorizedFilters;
+    onRemoveActiveFilter: OnFilterBarFilterChange;
+    localization: Pick<FilterBarLocalization, "filtersLabel" | "removeFilterOptionLabelGetter">;
+};
+export declare const ActiveFilters: React.FC<ActiveFiltersProps>;
+export {};

package/dist/src/components/FilterBar/FilterBar.d.ts

@@ -0,0 +1,111 @@
+import type { ReactElement } from "react";
+import { type CategorizedFilters, type FilterBarLocalization, type HasSingleSelection, type TransformedPresetFilterOptions, type TransformedSortingOptions } from "./FilterBarProps.type";
+type FilterBarProps<SortableEntity extends object> = {
+    /**
+     * A list of grouped filters to be displayed in the FilterBar.
+     *
+     * This is an array with items shaped as:
+     * ```ts
+     * type CategorizedFilter = {
+     *    key: string;
+     *    label: string;
+     *    options: TransformedFilterOptions;
+     * }
+     * ```
+     *
+     * You can choose to manually create this option or use the `getFilterGroups` helper function that will do the same
+     * for you based on your data.
+     *
+     * @example
+     *
+     * If you decided to use the `getFilterGroups` function:
+     *
+     *
+     * ```ts
+     * const items = []; // any list of object you are working with
+     *
+     * // the list of filter generators, the `filterValuePredicate` will be the displayed
+     * // value in the filter dropdown, so you can map and transform it to any custom string if necessary, or use
+     * // the value from the object entry
+     *
+     * const filterGenerators: FilterGenerator<TShirtFromApi>[] = [
+     *   {
+     *     id: "brand",
+     *     label: "Brand",
+     *     filterValuePredicate: (tshirt) => tshirt.brand,
+     *   },
+     *   {
+     *     id: "size",
+     *     label: "Size",
+     *     filterValuePredicate: (tshirt) => tshirt.size,
+     *   },
+     *   {
+     *     id: "color",
+     *     label: "Color",
+     *     filterValuePredicate: (tshirt) => tshirt.color,
+     *   },
+     * ];
+     *
+     * const categorizedFilters = getFilterGroups(items, filterGenerators);
+     * ```
+     *
+     *
+     * A compliant entry in the `categorizedFilters` has a shape like the object below:
+     *
+     *
+     * ```json
+     * {
+     *  "key": "color",
+     *  "label": "Color",
+     *  "options": [
+     *     {
+     *         "isChecked": false,
+     *         "id": "yellow",
+     *         "label": "yellow",
+     *         "value": "yellow"
+     *     },
+     *     {
+     *         "isChecked": false,
+     *         "id": "red",
+     *         "label": "red",
+     *         "value": "red"
+     *     },
+     *     {
+     *         "isChecked": false,
+     *         "id": "green",
+     *         "label": "green",
+     *         "value": "green"
+     *     }
+     *   ]
+     * }
+     *```
+     */
+    categorizedFilters: CategorizedFilters;
+    /**
+     * Whether to hide the active filters section when no filters are applied.
+     * Works by checking if any of the filters have an `isChecked` value set to `true`.
+     *
+     * This defaults to `true`.
+     */
+    hideActiveFiltersWhenEmpty?: boolean;
+    /**
+     * For more details, see {@link TransformedSortingOptions}.
+     */
+    onFilterChange: (updatedFilters: CategorizedFilters) => void;
+    sortingOptions: TransformedSortingOptions<SortableEntity>;
+    onSortingChange?: (updatedSortingOptions: TransformedSortingOptions<SortableEntity>) => void;
+    presetFilterOptions?: TransformedPresetFilterOptions<SortableEntity>;
+    onPresetFilterChange?: (updatedPresetFilterOptions: TransformedPresetFilterOptions<SortableEntity>) => void;
+    /**
+     * See {@link FilterBarLocalization}.
+     */
+    localization: FilterBarLocalization;
+    /**
+     * Quick way to change the order of the preset filters and sorting options.
+     *
+     * @default ["presetFilters", "divider", "sorting"]
+     */
+    menuOrder?: ["presetFilters", "divider", "sorting"] | ["sorting", "divider", "presetFilters"];
+} & HasSingleSelection;
+export declare const FilterBar: <SortableEntity extends object>({ localization, categorizedFilters, sortingOptions, presetFilterOptions, hideActiveFiltersWhenEmpty, menuOrder, ...props }: FilterBarProps<SortableEntity>) => ReactElement | null;
+export {};

package/dist/src/components/FilterBar/FilterBar.utils.d.ts

@@ -0,0 +1,32 @@
+import { type CategorizedFilters, type FilterGenerator, type TransformedSortingOptions } from "./FilterBarProps.type";
+/**
+ * Generates the list of filters based on the data (see this as what you'd like to be filtered in your component).
+ *
+ * @param dataToGenerateFiltersFrom  - The data (list of entities) that will be used to create the filters.
+ * @param groupers a list of functions used to create the filters dropdown
+ * @returns {CategorisedFilters} a list of filters properly grouped.
+ */
+export declare function getFilterGroups<T extends unknown[]>(dataToGenerateFiltersFrom: T, groupers: FilterGenerator<T[number]>[]): CategorizedFilters;
+/**
+ *
+ * @param filterKey the key of the categorized filter (eg. color, size, brand) - which one of them are you gonna check.
+ * @param categorizedFilters the array of categorized filters the FilterBar component needs
+ * @param attributeGetter the getter to retrieve the attribute to be filtered on, this allow maximum flexibility on how to process
+ * filters on any level of nesting if necessary.
+ * @returns a predicate to be used in the filter function
+ * @example
+ *
+ *   const sizeFilterPredicate = createFilterPredicate<TShirtFromApi>("size", filtersOptions, (item) => item.meta.size);
+ *   const filteredBySize = items.filter(sizeFilterPredicate);
+ *
+ */
+export declare const createFilterPredicate: <T extends object>(filterKey: string, categorizedFilters: CategorizedFilters, attributeGetter: (item: T) => string) => (item: T) => boolean;
+/**
+ * Creates a sorting function to be used on a specific object attribute.
+ *
+ * @param getter the getter function to retrieve the attribute used in the sorting
+ * @param order if ascending or descending
+ * @returns the sorting comparer function to be used in Array.sort
+ */
+export declare const createSortingComparer: <T extends object>(getter: (item: T) => string | number, order?: "asc" | "desc") => ((itemA: T, itemB: T) => number);
+export declare const applySorting: <T extends object[]>(sortable: T, sortingOptions: TransformedSortingOptions<T[number]>) => T;

package/dist/src/components/FilterBar/FilterBarProps.type.d.ts

@@ -0,0 +1,135 @@
+export type HasSingleSelection = {
+    /**
+     * When `true`, will still allow multiple filters to be added
+     * but each filter can only have a single value selected.
+     *
+     * The checkboxes in the filter list are hidden and you only see a checkmark ✓ on the selected item.
+     *
+     * `[⚠️ WARNING]` - this doesn't work with the `presetFilterOptions` prop, so do not combine them.
+     *
+     */
+    singleSelection?: boolean;
+};
+/**
+ * The object used to create a filter dropdown in the component.
+ * This is used based on the dataset passed to FilterBar, so we always calculate the filters
+ * looking at the data.
+ */
+export type FilterGenerator<SortableEntity> = {
+    id: string;
+    label: string;
+    /**
+     *
+     * @param data the value from the dataset entry that will be used for the filter
+     * @returns the string value for the desired filter
+     *
+     * @example
+     *
+     * ```ts
+     * {
+          id: "brand",
+          label: "Brand",
+          filterValuePredicate: (tshirt: TShirtFromApi) => tshirt.brand,
+       }
+     * ```
+     * in the above, all unique values from `brand` will be used to populate the `Brand` filter.
+     */
+    filterValuePredicate: (data: SortableEntity) => string;
+};
+/**
+ * Allows customization of labels related to filter.
+ *
+ */
+export type FilterBarLocalization = {
+    /**
+     * The string prefix displayed when a sorting value is selected in the menu.
+     *
+     * @default "Sorted by:"
+     * @example
+     *
+     * `sortedByLabel`: "Sorted by: "
+     *
+     * Example of sorting options
+     * - Name
+     * - Email (selected)
+     * - Date of birth
+     *
+     * UI shows: `Sorted by: Email`.
+     */
+    sortedByLabel: string;
+    /**
+     * The string for unselected state of the sorting options.
+     *
+     * @default "Sort"
+     */
+    sortLabel: string;
+    /**
+     * The string prefix displayed when a preset filter is selected from the menu.
+     *
+     * @example "Showing patients with status: "
+     *
+     * Example of preset filter options
+     * - Active
+     * - Stopped
+     *
+     * UI shows: `Showing patients with status: Active`.
+     */
+    presetFilteredByLabel?: string;
+    /**
+     * The string for the unselected state of the preset filter.
+     *
+     * @example "Show by patient status"
+     */
+    presetFiltersLabel?: string;
+    /**
+     * The string for the active filters and the mobile filter menu label.
+     *
+     * @default "Filters"
+     */
+    filtersLabel: string;
+    /**
+     * Function for assigning a label to the remove button of an active filter.
+     * @param {TransformedFilterOption} activeFilter
+     * @default (activeFilter) => `Remove filter ${activeFilter.label}`
+     */
+    removeFilterOptionLabelGetter?: (activeFilter: TransformedFilterOption) => string;
+};
+export type TransformedFilterOption = {
+    id: string;
+    label: string;
+    value: string;
+    isChecked: boolean;
+};
+export type TransformedFilterOptions = TransformedFilterOption[];
+export type CategorizedFilter = {
+    key: string;
+    label: string;
+    options: TransformedFilterOptions;
+};
+export type CategorizedFilters = CategorizedFilter[];
+export type TransformedSortingOption<SortableEntity extends object> = {
+    id: string;
+    label: string;
+    value: string;
+    isChecked: boolean;
+    sortingCompare: (itemA: SortableEntity, itemB: SortableEntity) => number;
+};
+export type TransformedSortingOptions<SortableEntity extends object> = TransformedSortingOption<SortableEntity>[];
+export type OnFilterBarFilterChange = (params: {
+    changedFilterOption: TransformedFilterOption;
+}) => void;
+export type OnFilterBarSortingChange<SortableEntity extends object> = (changedSortingOption: TransformedSortingOption<SortableEntity>) => void;
+export type TransformedPresetFilterOption<SortableEntity extends object> = {
+    id: string;
+    label: string;
+    value: string;
+    isChecked: boolean;
+    filterFn?: (item: SortableEntity) => boolean;
+};
+export type TransformedPresetFilterOptions<SortableEntity extends object> = TransformedPresetFilterOption<SortableEntity>[];
+export type OnFilterBarPresetFilterChange<SortableEntity extends object> = (changedPresetFilterOption: TransformedPresetFilterOption<SortableEntity>) => void;
+type OnChangeOptionParam = TransformedFilterOption | TransformedSortingOption<object> | TransformedPresetFilterOption<object>;
+export type OnFilterMenuChange = (params: {
+    changedFilterOption: OnChangeOptionParam;
+}) => void;
+export {};

package/dist/src/components/FilterBar/FilterMenu.d.ts

@@ -0,0 +1,10 @@
+import { type CategorizedFilter, type OnFilterMenuChange } from "./FilterBarProps.type";
+type Props = {
+    alignPopover?: "left" | "right";
+    categorizedFilter: CategorizedFilter;
+    onFilterOptionChange: OnFilterMenuChange;
+    showCheckedAmount?: boolean;
+    singleSelection?: boolean;
+};
+export declare const FilterMenu: (props: Props) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/components/FilterBar/FiltersMenus.d.ts

@@ -0,0 +1,11 @@
+import type { FC } from "react";
+import { type CategorizedFilters, type HasSingleSelection, type OnFilterMenuChange } from "./FilterBarProps.type";
+type FiltersMenusProps = {
+    filters: CategorizedFilters;
+    onFilterOptionChange: OnFilterMenuChange;
+} & HasSingleSelection;
+/**
+ * Each of the menu lists on the right side of the `FilterBar` component.
+ */
+export declare const FiltersMenus: FC<FiltersMenusProps>;
+export {};

package/dist/src/components/FilterBar/PresetFiltersMenu.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from "react";
+import { type FilterBarLocalization, type OnFilterBarPresetFilterChange, type TransformedPresetFilterOptions } from "./FilterBarProps.type";
+type Props<SortableEntity extends object> = {
+    localization: FilterBarLocalization;
+    presetFilterOptions: TransformedPresetFilterOptions<SortableEntity>;
+    onPresetFilterOptionChange: OnFilterBarPresetFilterChange<SortableEntity>;
+};
+export declare const PresetFiltersMenu: <SortableEntity extends object>(props: Props<SortableEntity>) => ReactNode;
+export {};

package/dist/src/components/FilterBar/SortMenu.d.ts

@@ -0,0 +1,9 @@
+import type { ReactElement } from "react";
+import { type FilterBarLocalization, type OnFilterBarSortingChange, type TransformedSortingOption } from "./FilterBarProps.type";
+type SortMenuProps<SortableEntity extends object> = {
+    localization: FilterBarLocalization;
+    sortingOptions: TransformedSortingOption<SortableEntity>[];
+    onSortOptionChange: OnFilterBarSortingChange<SortableEntity>;
+};
+export declare const SortMenu: <SortableEntity extends object>(props: SortMenuProps<SortableEntity>) => ReactElement | null;
+export {};

package/dist/src/components/FilterBar/index.d.ts

@@ -0,0 +1,2 @@
+export { FilterBar } from "./FilterBar";
+export * as FilterBarUtils from "./FilterBar.utils";