@stackone/malachite 0.28.0 → 0.29.0

package/dist/index.d.ts

@@ -8,6 +8,34 @@ import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 import { UseFormReturn } from 'react-hook-form';
 
+/**
+ * ActionMenu is a kebab-style overflow action menu. The trigger renders a
+ * three-dot icon button; on click, a popover appears with the given items.
+ * The popover is rendered to document.body via createPortal so it escapes
+ * any Shadow DOM or overflow:hidden ancestors.
+ */
+export declare const ActionMenu: default_2.FC<ActionMenuProps>;
+
+export declare type ActionMenuItem = {
+    type?: 'item';
+    key: string;
+    label: default_2.ReactNode;
+    onClick?: () => void;
+    disabled?: boolean;
+    danger?: boolean;
+    tooltip?: string;
+} | {
+    type: 'divider';
+    key: string;
+};
+
+export declare interface ActionMenuProps {
+    items: ActionMenuItem[];
+    label?: string;
+    triggerIcon?: default_2.ReactNode;
+    minWidth?: number;
+}
+
 export declare const Alert: default_2.FC<AlertProps>;
 
 declare interface AlertProps {
@@ -223,6 +251,7 @@ export declare const CustomIcons: {
     ManualWebhookIcon: FC<IconProps>;
     MembersIcon: FC<IconProps>;
     ModalIcon: FC<IconProps>;
+    MoreHorizontalIcon: FC<IconProps>;
     NavbarCollapseIcon: FC<IconProps>;
     NavbarExpandIcon: FC<IconProps>;
     NotFoundIcon: FC<IconProps>;
@@ -234,6 +263,7 @@ export declare const CustomIcons: {
     RejectIcon: FC<IconProps>;
     ReloadIcon: FC<IconProps>;
     RequiredFieldIndicatorIcon: FC<IconProps>;
+    SearchIcon: FC<IconProps>;
     SecurityIcon: FC<IconProps>;
     SettingsIcon: FC<IconProps>;
     SignOutIcon: FC<IconProps>;
@@ -244,6 +274,7 @@ export declare const CustomIcons: {
     TrashIcon: FC<IconProps>;
     UploadIcon: FC<IconProps>;
     WarningCircleFilled: FC<IconProps>;
+    WarningTriangleIcon: FC<IconProps>;
     WebhookEventsIcon: FC<IconProps>;
     WebhookIcon: FC<IconProps>;
     WebhookSigningSecretIcon: FC<IconProps>;
@@ -274,11 +305,15 @@ export declare enum DividerVariant {
     Emphasis = "emphasis"
 }
 
-export declare const Dropdown: ({ items, onItemSelected, defaultValue, disabled, error, label, hint, tooltip, name, required, loading, menuLoading, formControl, description, helperText, placeholder, search, }: DropdownProps) => JSX_2.Element;
+export declare const Dropdown: ({ items, onItemSelected, defaultValue, disabled, error, label, hint, tooltip, name, required, loading, menuLoading, formControl, description, helperText, placeholder, search, size, }: DropdownProps) => JSX_2.Element;
 
 export declare interface DropdownItem {
     id: string;
     label: string;
+    /** Alternate label shown in the trigger when selected (falls back to `label`). */
+    triggerLabel?: string;
+    /** Items sharing a `group` render under a section header, in first-seen order. */
+    group?: string;
     subtitle?: string;
     rightSideText?: string;
     rightSideTextVariant?: 'muted' | 'primary';
@@ -304,8 +339,12 @@ export declare interface DropdownProps {
     helperText?: default_2.ReactNode;
     placeholder?: string;
     search?: boolean;
+    /** 'medium' (42px) for form inputs; 'small' (32px) for toolbar chips. */
+    size?: DropdownSize;
 }
 
+export declare type DropdownSize = 'small' | 'medium';
+
 declare interface EllipsisTextProps {
     children: default_2.ReactNode;
     tooltip?: default_2.ReactNode | string;
@@ -353,6 +392,7 @@ declare interface FlexProps {
     direction?: FlexDirection;
     fullHeight?: boolean;
     grow?: boolean;
+    wrap?: boolean;
     width?: string;
     id?: string;
     children?: default_2.ReactNode;
@@ -464,6 +504,7 @@ export declare interface LinkProps {
     className?: string;
     color?: 'default' | 'dimmed';
     size?: FontSize;
+    underline?: boolean;
 }
 
 declare interface LinkProps_2 {
@@ -751,6 +792,32 @@ declare interface MarkdownProps {
     omitMargin?: boolean;
 }
 
+export declare const MultiSelect: default_2.FC<MultiSelectProps>;
+
+export declare interface MultiSelectOption {
+    value: string;
+    label: default_2.ReactNode;
+    searchText?: string;
+}
+
+export declare interface MultiSelectProps {
+    options: MultiSelectOption[];
+    value: string[];
+    onChange: (next: string[]) => void;
+    placeholder?: string;
+    renderTrigger?: (selected: MultiSelectOption[]) => default_2.ReactNode;
+    searchable?: boolean;
+    size?: MultiSelectSize;
+    width?: string | number;
+    minWidth?: number;
+    disabled?: boolean;
+    label?: string;
+    className?: string;
+    style?: default_2.CSSProperties;
+}
+
+export declare type MultiSelectSize = 'small' | 'medium';
+
 export declare const OverflowRow: default_2.FC<OverflowRowProps>;
 
 declare interface OverflowRowProps {
@@ -759,6 +826,7 @@ declare interface OverflowRowProps {
     align?: 'start' | 'center' | 'end' | 'stretch' | 'baseline';
     justify?: 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
     className?: string;
+    renderOverflow?: (hiddenCount: number) => default_2.ReactNode;
 }
 
 export declare const Padded: default_2.FC<PaddedProps>;
@@ -854,6 +922,21 @@ export declare function resetTheme(): void;
 
 export declare type RowVariant = 'success' | 'warning' | 'error' | 'info';
 
+export declare const Search: default_2.FC<SearchProps>;
+
+export declare interface SearchProps {
+    value: string;
+    onChange: (value: string) => void;
+    placeholder?: string;
+    size?: SearchSize;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    className?: string;
+    style?: default_2.CSSProperties;
+}
+
+export declare type SearchSize = 'small' | 'medium';
+
 declare interface SecondaryTextProps {
     children: default_2.ReactNode;
     fontWeight?: FontWeight;
@@ -992,11 +1075,17 @@ export declare interface SwatchProps {
     style?: default_2.CSSProperties;
 }
 
-export declare const Table: <T extends Record<string, unknown> = Record<string, unknown>>({ columns, data, loading, error, errorTitle, errorSubTitle, bordered, showHeader, rowKey, scrollHeight, size, layout, rowClassName, rowVariant, onRow, rowSelection, pagination, className, style, }: TableProps<T>) => JSX_2.Element;
+export declare interface TabItem {
+    key: string;
+    label: default_2.ReactNode;
+    disabled?: boolean;
+}
+
+export declare const Table: <T = Record<string, unknown>>({ columns, data, loading, error, errorTitle, errorSubTitle, bordered, showHeader, rowKey, scrollHeight, size, layout, headerVariant, rowClassName, rowVariant, onRow, onClickRow, rowSelection, pagination, className, style, stickyHeaderTop, }: TableProps<T>) => JSX_2.Element;
 
 export declare type TableColumnDefinition<T = Record<string, unknown>> = {
     title: string | default_2.ReactNode;
-    dataIndex: keyof T;
+    dataIndex: keyof T | (string & {});
     key: string;
     width?: string | number;
     ellipsis?: boolean;
@@ -1014,6 +1103,8 @@ export declare type TableColumnDefinition<T = Record<string, unknown>> = {
 
 export declare type TableColumns<T = Record<string, unknown>> = TableColumnDefinition<T>[];
 
+declare type TableHeaderVariant = 'inline' | 'detached';
+
 export declare type TablePaginationPosition = 'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight';
 
 declare type TableProps<T = Record<string, unknown>> = {
@@ -1030,9 +1121,11 @@ declare type TableProps<T = Record<string, unknown>> = {
     type?: TableType;
     size?: TableSize;
     layout?: 'fixed' | 'auto';
+    headerVariant?: TableHeaderVariant;
     rowClassName?: (record: T, index: number) => string;
     rowVariant?: (record: T, index: number) => RowVariant | undefined;
     onRow?: (record: T, index: number) => TableRowActions<T>;
+    onClickRow?: (record: T, index: number) => void;
     rowSelection?: TableRowSelection<T>;
     pagination?: {
         current?: number;
@@ -1048,6 +1141,11 @@ declare type TableProps<T = Record<string, unknown>> = {
     };
     className?: string;
     style?: default_2.CSSProperties;
+    /** When set, makes the detached-variant header sticky at this offset (px) from the
+     *  top of the nearest scrolling ancestor. Use this when the table sits inside a
+     *  page-level scroll container with other sticky elements (e.g. tabs + toolbar)
+     *  stacked above. */
+    stickyHeaderTop?: number;
 };
 
 declare type TableRowActions<T = Record<string, unknown>> = {
@@ -1080,6 +1178,16 @@ export declare type TableSize = 'small' | 'medium' | 'large';
 
 export declare type TableType = 'default' | 'compact' | 'bordered';
 
+export declare const Tabs: default_2.FC<TabsProps>;
+
+export declare interface TabsProps {
+    items: TabItem[];
+    activeKey: string;
+    onChange: (key: string) => void;
+    className?: string;
+    style?: default_2.CSSProperties;
+}
+
 export declare const Tag: default_2.FC<TagProps>;
 
 export declare interface TagProps {
@@ -1171,6 +1279,22 @@ declare interface TooltipProps {
     isShrinkable?: boolean;
 }
 
+/**
+ * TruncatedTooltip renders its children in a single-line truncating container
+ * (overflow:hidden + text-overflow:ellipsis + white-space:nowrap). It measures
+ * the rendered content via ResizeObserver and only surfaces the malachite
+ * Tooltip when the content is actually being cut off.
+ */
+export declare const TruncatedTooltip: default_2.FC<TruncatedTooltipProps>;
+
+export declare interface TruncatedTooltipProps {
+    text: default_2.ReactNode | string;
+    children: default_2.ReactNode;
+    delay?: number;
+    placement?: 'top' | 'bottom' | 'left' | 'right';
+    className?: string;
+}
+
 export declare const Typography: {
     CodeText: FC<CodeTextProps>;
     EllipsisText: FC<EllipsisTextProps>;