@vuu-ui/vuu-filters 3.5.0-beta.4 → 3.5.1

package/types/src/quick-filters/useQuickFilters.d.ts

@@ -0,0 +1,12 @@
+import { MultiSelectionHandler } from "@vuu-ui/vuu-ui-controls";
+import { CommitHandler } from "@vuu-ui/vuu-utils";
+import { ChangeEventHandler, RefCallback } from "react";
+import { QuickFilterProps } from "./QuickFilters";
+export type QuickFilterHookProps = Pick<QuickFilterProps, "availableColumns" | "onApplyFilter" | "onClearFilter" | "onChangeQuickFilterColumns" | "quickFilterColumns">;
+export declare const useQuickFilters: ({ availableColumns, onApplyFilter, onClearFilter, onChangeQuickFilterColumns, }: QuickFilterProps) => {
+    availableColumnNames: string[];
+    onChange: ChangeEventHandler<HTMLInputElement>;
+    onColumnsSelectionChange: MultiSelectionHandler;
+    onCommit: CommitHandler<HTMLElement>;
+    rootRef: RefCallback<HTMLDivElement>;
+};

package/types/src/saved-filters/DeleteFilterPrompt.d.ts

@@ -0,0 +1,9 @@
+import { FilterContainerFilterDescriptor } from "@vuu-ui/vuu-filter-types";
+import { PromptProps } from "@vuu-ui/vuu-ui-controls";
+import { HTMLAttributes } from "react";
+import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export interface DeleteFilterPromptProps extends Pick<PromptProps, "onConfirm" | "onClose" | "open">, HTMLAttributes<HTMLDivElement> {
+    columns?: ColumnDescriptor[];
+    filterDescriptor: FilterContainerFilterDescriptor;
+}
+export declare const DeleteFilterPrompt: ({ children, className, columns, filterDescriptor, onClose, onConfirm, open, ...htmlAttributes }: DeleteFilterPromptProps) => import("react").JSX.Element;

package/types/src/saved-filters/FilterNamePrompt.d.ts

@@ -0,0 +1,6 @@
+import { PromptProps } from "@vuu-ui/vuu-ui-controls";
+import { HTMLAttributes } from "react";
+import { FilterNamePromptHookProps } from "./useFilterNamePrompt";
+export interface FilterNamePromptProps extends FilterNamePromptHookProps, Pick<PromptProps, "onClose" | "open" | "title">, Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+}
+export declare const FilterNamePrompt: ({ className, filterName, onClose, onConfirm: onConfirmProp, open, title, filterNameMaxLength, ...htmlAttributes }: FilterNamePromptProps) => import("react").JSX.Element;

package/types/src/saved-filters/SavedFilterPanel.d.ts

@@ -0,0 +1,14 @@
+import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+import { HTMLAttributes } from "react";
+import { FilterPermissions } from "../filter-pill/FilterMenu";
+import { FilterContainerProps } from "../filter-container/FilterContainer";
+export interface SavedFilterPanelProps extends HTMLAttributes<HTMLDivElement>, Pick<FilterContainerProps, "filterProviderKey"> {
+    /**
+     * ColumnDescriptors are not required but is passed will be
+     * used to provide labels and correct value formatting for
+     * displayed filters, e.g in tooltips
+     */
+    availableColumns?: ColumnDescriptor[];
+    filterPillPermissions?: FilterPermissions;
+}
+export declare const SavedFilterPanel: ({ availableColumns, className, filterPillPermissions, filterProviderKey, ...htmlAttributes }: SavedFilterPanelProps) => import("react").JSX.Element;

package/types/src/saved-filters/useFilterNamePrompt.d.ts

@@ -0,0 +1,28 @@
+import { ChangeEventHandler } from "react";
+import { CommitHandler, ValueOf } from "@vuu-ui/vuu-utils";
+export interface FilterNamePromptHookProps {
+    filterName?: string;
+    onConfirm: (filterName: string) => void;
+    filterNameMaxLength?: number;
+}
+export declare const Status: {
+    readonly Empty: "empty";
+    readonly Valid: "valid";
+    readonly Invalid: "invalid";
+    readonly DuplicateName: "duplicate-name";
+};
+type Status = ValueOf<typeof Status>;
+export declare const useFilterNamePrompt: ({ filterName, onConfirm, }: FilterNamePromptHookProps) => {
+    confirmButtonProps: {
+        disabled: boolean;
+        label: string;
+        ref: import("react").RefObject<HTMLButtonElement | null>;
+    };
+    nameOfDuplicateFilter: string | undefined;
+    onChange: ChangeEventHandler<HTMLInputElement>;
+    onCommit: CommitHandler;
+    onConfirm: () => void;
+    status: Status;
+    value: string;
+};
+export {};

package/types/src/saved-filters/useSavedFilterPanel.d.ts

@@ -0,0 +1,13 @@
+import { SyntheticEvent } from "react";
+import { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export type FilterClickHandler = (filterId: string) => void;
+interface SavedFilterPanelProps {
+    availableColumns?: ColumnDescriptor[];
+    filterProviderKey?: string;
+}
+export declare const useSavedFilterPanel: (props?: SavedFilterPanelProps) => {
+    onClickFilter: (e: SyntheticEvent) => void;
+    onFilterMenuAction: (filterId: string, filterAction: import("../filter-pill/FilterMenu").FilterAction) => void;
+    savedFilters: import("@vuu-ui/vuu-filter-types").FilterContainerFilterDescriptorWithFilter[];
+};
+export {};

package/types/src/tabbed-filter-container/TabbedFilterContainer.d.ts

@@ -0,0 +1,10 @@
+import type { HTMLAttributes, ReactNode } from "react";
+import { FilterContainerProps } from "../filter-container/FilterContainer";
+import { SavedFilterPanelProps } from "../saved-filters/SavedFilterPanel";
+export interface TabbedFilterContainerProps extends HTMLAttributes<HTMLDivElement>, Pick<FilterContainerProps, "filter" | "filterProviderKey" | "onFilterApplied" | "onFilterCleared"> {
+    SavedFilterPanelProps?: Pick<SavedFilterPanelProps, "availableColumns" | "filterPillPermissions">;
+    children: ReactNode;
+    filterTabLabel?: string;
+    savedFilterLabel?: string;
+}
+export declare const TabbedFilterContainer: ({ SavedFilterPanelProps, children, className, filter, filterProviderKey, filterTabLabel, onFilterApplied, onFilterCleared, savedFilterLabel, ...htmlAttributes }: TabbedFilterContainerProps) => import("react").JSX.Element;

package/types/src/toggle-filter/ToggleFilter.d.ts

@@ -0,0 +1,17 @@
+import { ToggleButtonGroupProps } from "@salt-ds/core";
+import { CommitHandler } from "@vuu-ui/vuu-utils";
+import { type ToggleFilterHookProps } from "./useToggleFilter";
+/**
+ * ToggleFilter is designed to work with a FilterProvider and
+ * DataSourceProvider. With a DataSourceProvider, values will
+ * be validated against available values from datasource.
+ * With both FilterProvider and a DataSourceProvider, changes to
+ * the currentFilter will also trigger re-evaluation of available
+ * values from dataSource.
+ * With neither of these Providers available, the ToggleFilter is
+ * behaving like a regular ToggleButtonGroup.
+ */
+export interface ToggleFilterProps extends ToggleButtonGroupProps, ToggleFilterHookProps {
+    onCommit: CommitHandler<HTMLElement>;
+}
+export declare const ToggleFilter: import("react").ForwardRefExoticComponent<ToggleFilterProps & import("react").RefAttributes<HTMLDivElement>>;

package/types/src/toggle-filter/useToggleFilter.d.ts

@@ -0,0 +1,11 @@
+import type { TableSchemaTable } from "@vuu-ui/vuu-data-types";
+export interface ToggleFilterHookProps {
+    column: string;
+    /**
+     * table must be provided to enable validation
+     * of values using server data.
+     */
+    table?: TableSchemaTable;
+    values: string[];
+}
+export declare const useToggleFilter: ({ column, table, values, }: ToggleFilterHookProps) => string | undefined;

package/types/toggle-filter/ToggleFilter.d.ts

@@ -12,6 +12,11 @@ import { type ToggleFilterHookProps } from "./useToggleFilter";
  * behaving like a regular ToggleButtonGroup.
  */
 export interface ToggleFilterProps extends ToggleButtonGroupProps, ToggleFilterHookProps {
+    /**
+     * Optional labels for the toggle buttons. If provided, must contain
+     * the same number of items as values. Defaults to values.
+     */
+    labels?: string[];
     onCommit: CommitHandler<HTMLElement>;
 }
 export declare const ToggleFilter: import("react").ForwardRefExoticComponent<ToggleFilterProps & import("react").RefAttributes<HTMLDivElement>>;