@epilot/volt-ui 1.3.3 → 1.3.5

package/dist/components/badge/badge.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { type VariantProps } from "class-variance-authority";
-declare const baseColors: {
+declare const allColors: {
     readonly blue: "blue";
     readonly sky: "sky";
     readonly mint: "mint";
@@ -15,6 +15,11 @@ declare const baseColors: {
     readonly yellow: "yellow";
     readonly bronze: "bronze";
     readonly gray: "gray";
+    readonly accent: "accent";
+    readonly neutral: "neutral";
+    readonly success: "success";
+    readonly warning: "warning";
+    readonly error: "error";
 };
 declare const styleClasses: {
     readonly soft: (color: string) => string;
@@ -22,19 +27,18 @@ declare const styleClasses: {
     readonly surface: (color: string) => string;
 };
 declare const badgeVariants: (props?: ({
-    color?: "blue" | "sky" | "mint" | "green" | "teal" | "cyan" | "indigo" | "purple" | "pink" | "red" | "orange" | "yellow" | "bronze" | "gray" | null | undefined;
-    style?: "soft" | "solid" | "surface" | null | undefined;
-    shape?: "rounded" | "default" | null | undefined;
-    size?: "sm" | "base" | null | undefined;
+    color?: "error" | "blue" | "cyan" | "gray" | "green" | "indigo" | "orange" | "pink" | "purple" | "red" | "teal" | "yellow" | "accent" | "neutral" | "success" | "warning" | "sky" | "mint" | "bronze" | null | undefined;
+    style?: "solid" | "soft" | "surface" | null | undefined;
+    size?: "base" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-type BadgeColor = keyof typeof baseColors;
+type BadgeColor = keyof typeof allColors;
 type BadgeStyle = keyof typeof styleClasses;
-type BadgeShape = "default" | "rounded";
+type BadgeSize = "sm" | "base" | "lg";
 type BadgeProps = React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
     asChild?: boolean;
     color?: BadgeColor;
     style?: BadgeStyle;
-    shape?: BadgeShape;
+    size?: BadgeSize;
 };
-declare const Badge: ({ className, color, style, shape, size, asChild, ...props }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
+declare const Badge: ({ className, color, style, size, asChild, ...props }: BadgeProps) => import("react/jsx-runtime").JSX.Element;
 export { Badge, badgeVariants };

package/dist/components/button/button.d.ts

@@ -3,7 +3,7 @@ import { type VariantProps } from "class-variance-authority";
 export declare const buttonVariants: (props?: ({
     variant?: "primary" | "secondary" | "tertiary" | null | undefined;
     destructive?: boolean | null | undefined;
-    size?: "xs" | "sm" | "base" | "lg" | "icon-xs" | "icon-sm" | "icon" | "icon-lg" | null | undefined;
+    size?: "base" | "xs" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon" | "icon-lg" | null | undefined;
     shape?: "normal" | "rounded" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export type ButtonVariant = VariantProps<typeof buttonVariants>["variant"];
@@ -14,7 +14,7 @@ export type ButtonProps = ComponentPropsWithoutRef<"button"> & VariantProps<type
 export declare const Button: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
     variant?: "primary" | "secondary" | "tertiary" | null | undefined;
     destructive?: boolean | null | undefined;
-    size?: "xs" | "sm" | "base" | "lg" | "icon-xs" | "icon-sm" | "icon" | "icon-lg" | null | undefined;
+    size?: "base" | "xs" | "sm" | "lg" | "icon-xs" | "icon-sm" | "icon" | "icon-lg" | null | undefined;
     shape?: "normal" | "rounded" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string> & {
     asChild?: boolean;

package/dist/components/callout/callout.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { type VariantProps } from "class-variance-authority";
 declare const calloutVariants: (props?: ({
-    variant?: "destructive" | "gray" | "info" | "success" | "warning" | null | undefined;
+    variant?: "destructive" | "gray" | "success" | "warning" | "info" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const Callout: ({ className, variant, hideIcon, customIcon, ...props }: React.ComponentProps<"div"> & VariantProps<typeof calloutVariants> & {
     customIcon?: React.ReactNode;

package/dist/components/data-table/data-table-column-order.d.ts

@@ -0,0 +1,24 @@
+import type { ComponentProps, ReactNode } from "react";
+import { DropdownMenu } from "../../components/dropdown-menu/dropdown-menu";
+export type DataTableColumnOrderProps = {
+    /** Custom icon for the default trigger button. Falls back to swap-vertical icon. */
+    icon?: ReactNode;
+    /** Custom trigger element. Defaults to an icon button. */
+    trigger?: ReactNode;
+    /** Label shown at top of dropdown and as screen reader text for default trigger. Required for i18n. */
+    label: string;
+    /** Additional class name for the dropdown content */
+    contentClassName?: string;
+    /** Alignment of dropdown relative to trigger. Default: "end" */
+    align?: "start" | "center" | "end";
+} & Omit<ComponentProps<typeof DropdownMenu>, "children">;
+/**
+ * A dropdown menu for reordering columns in DataTable via drag-and-drop.
+ * Shows a draggable list of columns that can be rearranged.
+ * Place in DataTableToolbar for consistent layout.
+ */
+declare function DataTableColumnOrder({ icon, trigger, label, contentClassName, align, ...props }: DataTableColumnOrderProps): import("react/jsx-runtime").JSX.Element | null;
+declare namespace DataTableColumnOrder {
+    var displayName: string;
+}
+export { DataTableColumnOrder };

package/dist/components/data-table/data-table-context.d.ts

@@ -57,6 +57,8 @@ export type DataTableContextValue<TData> = {
     resizeHandleVisibility?: "always" | "onHeaderHover";
     /** Ensure columns have minimum width to fit header content (prevents hover clipping on sortable headers) */
     fitHeaderWidth?: boolean;
+    /** Whether drag-and-drop column reordering is enabled via header drag handles */
+    enableColumnOrdering?: boolean;
 };
 export type DataTableVirtualizerContextValue = {
     virtualizer: Virtualizer<HTMLDivElement, Element>;

package/dist/components/data-table/data-table-header-draggable.d.ts

@@ -0,0 +1,20 @@
+import type { ComponentProps, ReactNode } from "react";
+import { TableHead } from "../../components/table/table";
+type DataTableHeaderDraggableProps = {
+    /** Column ID used as the sortable identifier */
+    headerId: string;
+    /** Whether this column cannot be reordered */
+    disabled?: boolean;
+    /** Header cell content (the flex-rendered header + resize handle) */
+    children: ReactNode;
+} & ComponentProps<typeof TableHead>;
+/**
+ * A TableHead cell wrapped with dnd-kit sortable for column reordering.
+ * Renders a drag handle icon that appears on hover.
+ * Used by DataTableHeader when enableColumnOrdering is true.
+ */
+declare function DataTableHeaderDraggable({ headerId, disabled, children, style: existingStyle, className, ...tableHeadProps }: DataTableHeaderDraggableProps): import("react/jsx-runtime").JSX.Element;
+declare namespace DataTableHeaderDraggable {
+    var displayName: string;
+}
+export { DataTableHeaderDraggable };

package/dist/components/data-table/data-table.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from "react";
 import type { MouseEvent } from "react";
-import { type SortingState, type RowSelectionState, type ColumnFiltersState, type VisibilityState, type ColumnDef, type Row, type ColumnSizingState, type ColumnPinningState } from "@tanstack/react-table";
+import { type SortingState, type RowSelectionState, type ColumnFiltersState, type VisibilityState, type ColumnDef, type Row, type ColumnSizingState, type ColumnPinningState, type ColumnOrderState } from "@tanstack/react-table";
 import { type TableDensity } from "../../components/table/table";
 import { type DataTablePaginationConfig, type DataTableVirtualizationConfig, type DataTableCellOverflow } from "./data-table-context";
 export type DataTableProps<TData> = {
@@ -60,6 +60,14 @@ export type DataTableProps<TData> = {
     selectedRowClassName?: string;
     /** Controls how cell content handles overflow. 'grow' expands cells (default), 'wrap' wraps text, 'truncate' shows ellipsis. Can be overridden per-column via column meta. */
     cellOverflow?: DataTableCellOverflow;
+    /** Enable drag-and-drop column reordering via header drag handles */
+    enableColumnOrdering?: boolean;
+    /** Controlled column order state (array of column IDs in desired order) */
+    columnOrder?: ColumnOrderState;
+    /** Callback when column order changes */
+    onColumnOrderChange?: (columnOrder: ColumnOrderState) => void;
+    /** Default column order for uncontrolled mode */
+    defaultColumnOrder?: ColumnOrderState;
     /** Disable column width resizing (enabled by default) */
     disableColumnResizing?: boolean;
     /** Controls when resize handles are visible. 'always' shows handles persistently, 'onHeaderHover' only shows on header row hover. Default: 'onHeaderHover' */
@@ -91,7 +99,7 @@ export type DataTableProps<TData> = {
     /** Additional class name */
     className?: string;
 };
-declare function DataTable<TData>({ columns, data, children, getRowId, enableRowSelection, enableSorting, manualSorting, enableFiltering, manualFiltering, enableGlobalFilter, pagination, virtualization, sorting: controlledSorting, onSortingChange, defaultSorting, rowSelection: controlledRowSelection, onRowSelectionChange, defaultRowSelection, columnFilters: controlledColumnFilters, onColumnFiltersChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange, globalFilter: controlledGlobalFilter, onGlobalFilterChange, onRowClick, clickableRowClassName, selectedRowClassName, cellOverflow, disableColumnResizing, resizeHandleVisibility, columnResizeMode, columnSizing: controlledColumnSizing, onColumnSizingChange, defaultColumnSizing, columnPinning: controlledColumnPinning, onColumnPinningChange, defaultColumnPinning, autoPinSelection, showHeaderBorder, showRowBorders, fitHeaderWidth, density, className, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
+declare function DataTable<TData>({ columns, data, children, getRowId, enableRowSelection, enableSorting, manualSorting, enableFiltering, manualFiltering, enableGlobalFilter, pagination, virtualization, sorting: controlledSorting, onSortingChange, defaultSorting, rowSelection: controlledRowSelection, onRowSelectionChange, defaultRowSelection, columnFilters: controlledColumnFilters, onColumnFiltersChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange, globalFilter: controlledGlobalFilter, onGlobalFilterChange, onRowClick, clickableRowClassName, selectedRowClassName, cellOverflow, enableColumnOrdering, columnOrder: controlledColumnOrder, onColumnOrderChange, defaultColumnOrder, disableColumnResizing, resizeHandleVisibility, columnResizeMode, columnSizing: controlledColumnSizing, onColumnSizingChange, defaultColumnSizing, columnPinning: controlledColumnPinning, onColumnPinningChange, defaultColumnPinning, autoPinSelection, showHeaderBorder, showRowBorders, fitHeaderWidth, density, className, }: DataTableProps<TData>): import("react/jsx-runtime").JSX.Element;
 declare namespace DataTable {
     var displayName: string;
 }

package/dist/components/label/label.d.ts

@@ -3,7 +3,7 @@ import * as LabelPrimitive from "@radix-ui/react-label";
 import { VariantProps } from "class-variance-authority";
 declare const labelVariants: (props?: ({
     variant?: "primary" | "destructive" | null | undefined;
-    size?: "sm" | "base" | "lg" | null | undefined;
+    size?: "base" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type LabelProps = React.ComponentProps<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>;
 declare const Label: ({ variant, size, className, ...props }: LabelProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/pill/pill.d.ts

@@ -0,0 +1,42 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const baseColors: {
+    readonly blue: "blue";
+    readonly sky: "sky";
+    readonly mint: "mint";
+    readonly lime: "lime";
+    readonly green: "green";
+    readonly teal: "teal";
+    readonly cyan: "cyan";
+    readonly indigo: "indigo";
+    readonly purple: "purple";
+    readonly pink: "pink";
+    readonly red: "red";
+    readonly orange: "orange";
+    readonly yellow: "yellow";
+    readonly bronze: "bronze";
+    readonly gray: "gray";
+    readonly accent: "accent";
+    readonly warning: "warning";
+    readonly success: "success";
+    readonly error: "error";
+};
+declare const styleClasses: {
+    readonly soft: (color: string) => string;
+    readonly solid: (color: string) => string;
+    readonly surface: (color: string) => string;
+};
+declare const pillVariants: (props?: ({
+    color?: "error" | "blue" | "cyan" | "gray" | "green" | "indigo" | "lime" | "orange" | "pink" | "purple" | "red" | "teal" | "yellow" | "accent" | "success" | "warning" | "sky" | "mint" | "bronze" | null | undefined;
+    style?: "solid" | "soft" | "surface" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+type PillColor = keyof typeof baseColors;
+type PillStyle = keyof typeof styleClasses;
+type PillProps = React.ComponentProps<"span"> & VariantProps<typeof pillVariants> & {
+    color?: PillColor;
+    style?: PillStyle;
+    disabled?: boolean;
+    onRemove?: (e: React.MouseEvent<HTMLButtonElement>) => void;
+};
+declare const Pill: ({ className, color, style, disabled, onRemove, onClick, children, ...props }: PillProps) => import("react/jsx-runtime").JSX.Element;
+export { Pill, pillVariants };

package/dist/components/segmented-control/segmented-control.d.ts

@@ -0,0 +1,12 @@
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+export type SegmentedControlLayout = "hug" | "equal" | "stretch";
+export type SegmentedControlProps = React.ComponentProps<typeof RadioGroupPrimitive.Root> & {
+    layout?: SegmentedControlLayout;
+};
+export type SegmentedControlItemProps = React.ComponentProps<typeof RadioGroupPrimitive.Item> & {
+    icon?: React.ReactNode;
+};
+declare const SegmentedControl: ({ className, layout, orientation, value: valueProp, defaultValue, onValueChange, children, ...props }: SegmentedControlProps) => import("react/jsx-runtime").JSX.Element;
+declare const SegmentedControlItem: ({ className, value, icon, children, ...props }: SegmentedControlItemProps) => import("react/jsx-runtime").JSX.Element;
+export { SegmentedControl, SegmentedControlItem };

package/dist/components/spinner/spinner.d.ts

@@ -1,7 +1,7 @@
 import { VariantProps } from "class-variance-authority";
 declare const SpinnerIcon: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
 declare const spinnerSizeVariants: (props?: ({
-    size?: "sm" | "base" | "lg" | "xl" | "2xl" | null | undefined;
+    size?: "base" | "sm" | "lg" | "xl" | "2xl" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type SpinnerProps = React.ComponentProps<typeof SpinnerIcon> & {
     variant?: "circle" | "line";

package/dist/components/switch/switch.d.ts

@@ -3,7 +3,7 @@ import * as SwitchPrimitive from "@radix-ui/react-switch";
 import { VariantProps } from "class-variance-authority";
 declare const switchVariants: (props?: ({
     variant?: "primary" | "destructive" | null | undefined;
-    size?: "sm" | "base" | "lg" | null | undefined;
+    size?: "base" | "sm" | "lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type SwitchProps = React.ComponentProps<typeof SwitchPrimitive.Root> & {
     variant?: VariantProps<typeof switchVariants>["variant"];