@thebuoyant-tsdev/mui-ts-library 1.3.0

package/dist/components/tag-selection/TagSelection.types.d.ts

@@ -0,0 +1,41 @@
+export type TagColor = "default" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
+export type TagSelectionItem = {
+    id: string;
+    label: string;
+    selected?: boolean;
+    disabled?: boolean;
+    color?: TagColor;
+    foregroundColor?: string;
+    backgroundColor?: string;
+};
+export type TagSelectionTranslation = {
+    selectedTagsLabel: string;
+    autoCompleteLabel: string;
+    noSelectedTagsText: string;
+    noAvailableTagsText: string;
+    placeholder: string;
+    loadingText: string;
+    maxTagsReachedText: string;
+};
+export declare const DEFAULT_TAG_SELECTION_TRANSLATION: TagSelectionTranslation;
+export type TagSelectionProps = {
+    tags: TagSelectionItem[];
+    showSelectedTags?: boolean;
+    showSelectedTagsLabel?: boolean;
+    showAutoComplete?: boolean;
+    translation?: Partial<TagSelectionTranslation>;
+    inputSize?: "small" | "medium";
+    chipSize?: "small" | "medium";
+    disabled?: boolean;
+    loading?: boolean;
+    maxTags?: number;
+    allowCreate?: boolean;
+    maxVisibleChips?: number;
+    popoverPlacement?: "top" | "bottom";
+    listboxMaxHeight?: number;
+    onTagSelect?: (tag: TagSelectionItem, selectedTags: TagSelectionItem[], allTags: TagSelectionItem[]) => void;
+    onTagDelete?: (tag: TagSelectionItem, selectedTags: TagSelectionItem[], allTags: TagSelectionItem[]) => void;
+    onTagsChange?: (selectedTags: TagSelectionItem[], allTags: TagSelectionItem[]) => void;
+    onSearchChange?: (searchValue: string) => void;
+    onTagCreate?: (label: string, color: TagColor) => void;
+};

package/dist/components/tag-selection/TagSelectionAutocomplete.d.ts

@@ -0,0 +1,18 @@
+import type { TagColor, TagSelectionItem, TagSelectionTranslation } from "./TagSelection.types";
+type TagSelectionAutocompleteProps = {
+    inputSize: "medium" | "small";
+    chipSize: "medium" | "small";
+    availableTags: TagSelectionItem[];
+    searchValue: string;
+    translation: TagSelectionTranslation;
+    onSearchChange: (value: string) => void;
+    onTagSelect: (tag: TagSelectionItem) => void;
+    onTagCreate?: (label: string, color: TagColor) => void;
+    disabled?: boolean;
+    loading?: boolean;
+    isMaxReached?: boolean;
+    allowCreate?: boolean;
+    listboxMaxHeight?: number;
+};
+export declare function TagSelectionAutocomplete({ availableTags, searchValue, translation, onSearchChange, onTagSelect, onTagCreate, inputSize, chipSize, disabled, loading, isMaxReached, allowCreate, listboxMaxHeight, }: TagSelectionAutocompleteProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/tag-selection/TagSelectionChip.d.ts

@@ -0,0 +1,10 @@
+import type { TagSelectionItem } from "./TagSelection.types";
+type TagSelectionChipProps = {
+    tag: TagSelectionItem;
+    onDelete?: (tag: TagSelectionItem) => void;
+    onClick?: (tag: TagSelectionItem) => void;
+    chipSize: "small" | "medium";
+    disabled?: boolean;
+};
+export declare function TagSelectionChip({ tag, onDelete, onClick, chipSize, disabled, }: TagSelectionChipProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/tag-selection/TagSelectionSelectedTags.d.ts

@@ -0,0 +1,13 @@
+import type { TagSelectionItem, TagSelectionTranslation } from "./TagSelection.types";
+type TagSelectionSelectedTagsProps = {
+    selectedTags: TagSelectionItem[];
+    translation: TagSelectionTranslation;
+    onTagDelete: (tag: TagSelectionItem) => void;
+    showSelectedTagsLabel: boolean;
+    chipSize: "small" | "medium";
+    disabled?: boolean;
+    maxVisibleChips?: number;
+    popoverPlacement?: "top" | "bottom";
+};
+export declare function TagSelectionSelectedTags({ selectedTags, translation, onTagDelete, showSelectedTagsLabel, chipSize, disabled, maxVisibleChips, popoverPlacement, }: TagSelectionSelectedTagsProps): import("react/jsx-runtime").JSX.Element;
+export {};