@segmentify/ui 0.0.29 → 0.0.32

package/dist/components/atoms/alert-dialog.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { AlertDialog as AlertDialogPrimitive } from 'radix-ui';
+import { Button } from '../../components/atoms/button';
+declare function AlertDialog({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogTrigger({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogPortal({ ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogOverlay({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Overlay>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogContent({ className, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Content> & {
+    size?: 'default' | 'sm';
+}): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogHeader({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogFooter({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogTitle({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogDescription({ className, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogMedia({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogAction({ className, variant, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Action> & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>): import("react/jsx-runtime").JSX.Element;
+declare function AlertDialogCancel({ className, variant, size, ...props }: React.ComponentProps<typeof AlertDialogPrimitive.Cancel> & Pick<React.ComponentProps<typeof Button>, 'variant' | 'size'>): import("react/jsx-runtime").JSX.Element;
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, };

package/dist/components/atoms/combobox.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { Combobox as ComboboxPrimitive } from '@base-ui/react';
+declare const Combobox: typeof ComboboxPrimitive.Root;
+declare function ComboboxValue({ ...props }: ComboboxPrimitive.Value.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxTrigger({ className, children, ...props }: ComboboxPrimitive.Trigger.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxInput({ className, children, disabled, showTrigger, showClear, ...props }: ComboboxPrimitive.Input.Props & {
+    showTrigger?: boolean;
+    showClear?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxContent({ className, side, sideOffset, align, alignOffset, anchor, ...props }: ComboboxPrimitive.Popup.Props & Pick<ComboboxPrimitive.Positioner.Props, 'side' | 'align' | 'sideOffset' | 'alignOffset' | 'anchor'>): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxList({ className, ...props }: ComboboxPrimitive.List.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxItem({ className, children, ...props }: ComboboxPrimitive.Item.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxGroup({ className, ...props }: ComboboxPrimitive.Group.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxLabel({ className, ...props }: ComboboxPrimitive.GroupLabel.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxCollection({ ...props }: ComboboxPrimitive.Collection.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxEmpty({ className, ...props }: ComboboxPrimitive.Empty.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxSeparator({ className, ...props }: ComboboxPrimitive.Separator.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxChips({ className, ...props }: React.ComponentPropsWithRef<typeof ComboboxPrimitive.Chips> & ComboboxPrimitive.Chips.Props): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxChip({ className, children, showRemove, ...props }: ComboboxPrimitive.Chip.Props & {
+    showRemove?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+declare function ComboboxChipsInput({ className, ...props }: ComboboxPrimitive.Input.Props): import("react/jsx-runtime").JSX.Element;
+declare function useComboboxAnchor(): React.RefObject<HTMLDivElement | null>;
+export { Combobox, ComboboxInput, ComboboxContent, ComboboxList, ComboboxItem, ComboboxGroup, ComboboxLabel, ComboboxCollection, ComboboxEmpty, ComboboxSeparator, ComboboxChips, ComboboxChip, ComboboxChipsInput, ComboboxTrigger, ComboboxValue, useComboboxAnchor, };

package/dist/components/atoms/input-group.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+import { Button } from '../../components/atoms/button';
+declare function InputGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare const inputGroupAddonVariants: (props?: ({
+    align?: "inline-start" | "inline-end" | "block-start" | "block-end" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function InputGroupAddon({ className, align, ...props }: React.ComponentProps<'div'> & VariantProps<typeof inputGroupAddonVariants>): import("react/jsx-runtime").JSX.Element;
+declare const inputGroupButtonVariants: (props?: ({
+    size?: "xs" | "sm" | "icon-sm" | "icon-xs" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare function InputGroupButton({ className, type, variant, size, ...props }: Omit<React.ComponentProps<typeof Button>, 'size'> & VariantProps<typeof inputGroupButtonVariants>): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupText({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupInput({ className, ...props }: React.ComponentProps<'input'>): import("react/jsx-runtime").JSX.Element;
+declare function InputGroupTextarea({ className, ...props }: React.ComponentProps<'textarea'>): import("react/jsx-runtime").JSX.Element;
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupText, InputGroupInput, InputGroupTextarea };

package/dist/components/molecules/combobox-field.d.ts

@@ -1,31 +1,26 @@
-import type { SelectItemProps } from '../../lib/types';
-type TriggerProps = {
-    trigger: React.ReactNode;
-    triggerPlaceholder?: never;
-} | {
-    trigger?: never;
-    triggerPlaceholder: string;
+import React from 'react';
+export type ComboboxFieldItem = {
+    value: string;
+    label: string;
+    disabled?: boolean;
 };
-type Props = TriggerProps & {
-    isDisabled?: boolean;
-    options: SelectItemProps[];
-    isFormControlWrapper?: boolean;
-    avoidCollisions?: boolean;
-    contentClassName?: string;
-    inputPlaceholder: string;
-    emptyMessage: string;
-    containerClassName?: string;
-    contentListClassName?: string;
-    closeOnSelect?: boolean;
-    align?: 'start' | 'center' | 'end';
+export type ComboboxFieldInputMode = 'input' | 'popup';
+type Props = {
+    items: ComboboxFieldItem[];
+    value: ComboboxFieldItem[];
+    onValueChange: (values: ComboboxFieldItem[]) => void;
     label?: string;
-    onInputChange?: (inputValue: string) => void;
-    clearable?: boolean;
     multiple?: boolean;
-    value: string | string[];
-    onValueChange: (value: string | string[]) => void;
+    hasClearButton?: boolean;
+    disabled?: boolean;
+    placeholder?: string;
+    containerClassName?: string;
+    emptyMessage?: string;
     hasAllOption?: boolean;
     allOptionLabel?: string;
+    inputMode?: ComboboxFieldInputMode;
+    renderPopupTrigger?: (valueElement: React.ReactNode, selectedValues: ComboboxFieldItem[]) => React.ReactElement;
+    onInputChange?: (value: string) => void;
 };
-export declare const ComboboxField: ({ value, isDisabled, hasAllOption, multiple, options, allOptionLabel, triggerPlaceholder, trigger, isFormControlWrapper, avoidCollisions, align, contentClassName, inputPlaceholder, emptyMessage, containerClassName, contentListClassName, closeOnSelect, label, onValueChange, onInputChange, clearable, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const ComboboxField: ({ items, label, multiple, hasClearButton, disabled, placeholder, containerClassName, emptyMessage, hasAllOption, allOptionLabel, inputMode, renderPopupTrigger, onInputChange, value, onValueChange, }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/molecules/date-range-picker.d.ts

@@ -1,3 +1,4 @@
+import { type Locale } from 'date-fns';
 import { type DateRange } from 'react-day-picker';
 import { type ClassValue } from 'clsx';
 type Props = {
@@ -10,6 +11,7 @@ type Props = {
     className?: ClassValue;
     confirmLabel?: string;
     disabledCondition?: boolean | ((date: Date) => boolean);
+    dateLocale?: Locale;
 };
-export declare const DateRangePicker: ({ start, end, onConfirm, className, triggerButtonClassName, label, placeholder, confirmLabel, disabledCondition, }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const DateRangePicker: ({ start, end, onConfirm, className, triggerButtonClassName, label, placeholder, confirmLabel, disabledCondition, dateLocale, }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/organisms/data-table/column-visibility.d.ts

@@ -1,7 +1,6 @@
 interface ColumnVisibilityProps {
-    inputPlaceholder?: string;
     emptyMessage?: string;
     allOptionLabel?: string;
 }
-export declare function ColumnVisibility({ inputPlaceholder, emptyMessage, allOptionLabel, }: ColumnVisibilityProps): import("react/jsx-runtime").JSX.Element;
+export declare function ColumnVisibility({ emptyMessage, allOptionLabel, }: ColumnVisibilityProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -11,6 +11,6 @@ export declare const DataTable: {
     Search: typeof Search;
     ColumnVisibility: typeof ColumnVisibility;
     Content: typeof Content;
-    Pagination: ({ showSelectedCount, showPaginationInfo, className }: import("./pagination").PaginationProps) => import("react/jsx-runtime").JSX.Element;
+    Pagination: ({ showSelectedCount, showPaginationInfo, className, showPerPageLabel, selectPlaceholder, selectedCountText, paginationInfoText, }: import("./pagination").PaginationProps) => import("react/jsx-runtime").JSX.Element;
     Actions: ({ actions }: import("./actions").ActionsProps) => import("react/jsx-runtime").JSX.Element | null;
 };

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

@@ -2,5 +2,9 @@ export interface PaginationProps {
     showSelectedCount?: boolean;
     showPaginationInfo?: boolean;
     className?: string;
+    showPerPageLabel?: string;
+    selectPlaceholder?: string;
+    selectedCountText?: (selected: number, total: number) => string;
+    paginationInfoText?: (start: number, end: number, total: number) => string;
 }
-export declare const Pagination: ({ showSelectedCount, showPaginationInfo, className }: PaginationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Pagination: ({ showSelectedCount, showPaginationInfo, className, showPerPageLabel, selectPlaceholder, selectedCountText, paginationInfoText, }: PaginationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/organisms/date-preset/date-preset.d.ts

@@ -1,3 +1,4 @@
+import { type Locale } from 'date-fns';
 import { type DatePresetItem } from './presets';
 export interface DatePresetProps {
     presets?: Record<string, DatePresetItem>;
@@ -5,5 +6,6 @@ export interface DatePresetProps {
     confirmLabel?: string;
     placeholder?: string;
     disabledCondition?: boolean | ((date: Date) => boolean);
+    dateLocale?: Locale;
 }
-export declare function DatePreset({ presets, className, confirmLabel, placeholder, disabledCondition, }: DatePresetProps): import("react/jsx-runtime").JSX.Element;
+export declare function DatePreset({ presets, className, confirmLabel, placeholder, disabledCondition, dateLocale, }: DatePresetProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/organisms/form-combobox.d.ts

@@ -1,26 +1,21 @@
 import { type Control, type FieldValues, type Path } from 'react-hook-form';
-import type { SelectItemProps } from '../../lib/types';
+import { type ComboboxFieldItem } from '../../components/molecules/combobox-field';
 type FormComboboxProps<TFieldValues extends FieldValues = FieldValues> = {
     name: Path<TFieldValues>;
-    label: string;
-    triggerPlaceholder: string;
-    inputPlaceholder: string;
-    options: SelectItemProps[];
+    label?: string;
+    placeholder?: string;
+    items: ComboboxFieldItem[];
     description?: string;
     multiple?: boolean;
-    emptyMessage: string;
+    emptyMessage?: string;
     containerClassName?: string;
-    contentClassName?: string;
-    contentListClassName?: string;
-    avoidCollisions?: boolean;
-    clearable?: boolean;
+    hasClearButton?: boolean;
     hasAllOption?: boolean;
     allOptionLabel?: string;
-    closeOnSelect?: boolean;
-    onInputChange?: (inputValue: string) => void;
-    isDisabled?: boolean;
+    disabled?: boolean;
     tooltipContent?: string;
     control?: Control<TFieldValues>;
+    inputMode?: 'input' | 'popup';
 };
-export declare const FormCombobox: <TFieldValues extends FieldValues = FieldValues>({ name, label, triggerPlaceholder, inputPlaceholder, options, description, multiple, emptyMessage, containerClassName, contentClassName, contentListClassName, avoidCollisions, clearable, hasAllOption, allOptionLabel, closeOnSelect, onInputChange, isDisabled, tooltipContent, control, }: FormComboboxProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+export declare const FormCombobox: <TFieldValues extends FieldValues = FieldValues>({ name, label, placeholder, items, description, multiple, emptyMessage, containerClassName, hasClearButton, hasAllOption, allOptionLabel, disabled, tooltipContent, control, inputMode, }: FormComboboxProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/organisms/form-file-upload.d.ts

@@ -5,6 +5,8 @@ type FormFileUploadProps<TFieldValues extends FieldValues = FieldValues> = {
     control?: Control<TFieldValues>;
     label?: string;
     uploadButtonLabel?: string;
+    uploadingLabel?: string;
+    uploadFailedMessage?: string;
     description?: string;
     accept?: string;
     disabled?: boolean;
@@ -15,7 +17,7 @@ type FormFileUploadProps<TFieldValues extends FieldValues = FieldValues> = {
     onUpload?: (file: File) => Promise<string>;
 };
 export declare const FormFileUpload: {
-    <TFieldValues extends FieldValues = FieldValues>({ name, control, label, uploadButtonLabel, description, accept, disabled, multiple, containerClassName, tooltipContent, hasRequiredIndicator, onUpload, }: FormFileUploadProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
+    <TFieldValues extends FieldValues = FieldValues>({ name, control, label, uploadButtonLabel, uploadingLabel, uploadFailedMessage, description, accept, disabled, multiple, containerClassName, tooltipContent, hasRequiredIndicator, onUpload, }: FormFileUploadProps<TFieldValues>): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export {};

package/dist/components/organisms/timeline.d.ts

@@ -0,0 +1,25 @@
+import { type Locale } from 'date-fns';
+import { type LucideIcon } from 'lucide-react';
+import { type ReactNode } from 'react';
+export interface IconConfig {
+    icon: LucideIcon;
+    bg?: string;
+    text?: string;
+}
+export interface TimelineItem {
+    iconConfig: IconConfig;
+    title: string;
+    description: string;
+    timestamp: number;
+    tags?: string[];
+    topRightSlot?: ReactNode;
+    bottomRightSlot?: ReactNode;
+}
+export interface TimelineProps {
+    items: TimelineItem[];
+    header?: ReactNode;
+    className?: string;
+    onItemClick?: (item: TimelineItem, index: number) => void;
+    dateLocale?: Locale;
+}
+export declare const Timeline: ({ items, header, className, onItemClick, dateLocale }: TimelineProps) => import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 export { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from './components/atoms/accordion';
+export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, } from './components/atoms/alert-dialog';
 export { AspectRatio } from './components/atoms/aspect-ratio';
 export { Avatar, AvatarFallback, AvatarImage } from './components/atoms/avatar';
 export { Badge } from './components/atoms/badge';
@@ -17,7 +18,6 @@ export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, Comman
 export { ContentWrapper } from './components/atoms/content-wrapper';
 export { CreatableActionIcons } from './components/molecules/creatable-action-icons';
 export { CheckboxField } from './components/molecules/checkbox-field';
-export { ConfirmationDialog } from './components/molecules/confirmation-dialog';
 export { ComboboxField } from './components/molecules/combobox-field';
 export { FormattedDate } from './components/atoms/date';
 export { DateRangePicker } from './components/molecules/date-range-picker';
@@ -69,12 +69,19 @@ export { Tabs, TabsList, TabsTrigger, TabsContent } from './components/atoms/tab
 export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption, } from './components/atoms/table';
 export { Textarea } from './components/atoms/textarea';
 export { TextAreaField } from './components/molecules/textarea-field';
+export { Timeline, type IconConfig, type TimelineItem, type TimelineProps } from './components/organisms/timeline';
 export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from './components/atoms/tooltip';
 export { TooltipField } from './components/molecules/tooltip-field';
 export { QuillEditor } from './components/atoms/quill-editor';
-export { DATE_PRESETS, DEFAULT_PRESET_KEY } from './components/organisms/date-preset/presets';
-export { type DateRange, type DatePresetItem } from './components/organisms/date-preset/presets';
-export { type DatePresetProviderProps } from './components/organisms/date-preset/root';
-export { type DatePresetContextValue } from './components/organisms/date-preset/context';
+export { DataTable } from './components/organisms/data-table';
+export type { ActionItem, ActionsProps, RenderRowSubComponentProps } from './components/organisms/data-table';
+export { DatePreset } from './components/organisms/date-preset/date-preset';
+export { DatePresetProvider } from './components/organisms/date-preset/root';
+export { useDatePreset } from './components/organisms/date-preset/context';
+export { DATE_PRESETS, DEFAULT_PRESET_KEY, findMatchingPreset } from './components/organisms/date-preset/presets';
+export type { DateRange, DatePresetItem } from './components/organisms/date-preset/presets';
+export type { DatePresetProps } from './components/organisms/date-preset/date-preset';
+export type { DatePresetProviderProps } from './components/organisms/date-preset/root';
+export type { DatePresetContextValue } from './components/organisms/date-preset/context';
 export { useDataTable, type UseDataTableOptions, type UseDataTableReturn, type FetcherParams, type FetcherResponse, } from './hooks/use-data-table';
 export { cn } from './lib/utils';

package/dist/lib/design-variants.d.ts

@@ -1,6 +1,6 @@
 export declare const buttonVariants: (props?: ({
     variant?: "link" | "primary" | "secondary" | "tertiary" | "success" | "destructive" | "outline" | "ghost" | "action" | "paginationActive" | "paginationInactive" | null | undefined;
-    size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export declare const labelVariants: (props?: ({
     variant?: "default" | null | undefined;

package/dist/lib/utils.d.ts

@@ -1,3 +1,29 @@
 import { type ClassValue } from 'clsx';
+import { type FormatOptions } from 'date-fns';
 export declare function cn(...inputs: ClassValue[]): string;
-export declare const formatDate: (date: Date, desiredFormat?: string) => string;
+/**
+ * Formats a Date object into a localized string using date-fns.
+ * Falls back to formatting the current date if the provided date is invalid.
+ *
+ * @param date - The Date object to format.
+ * @param desiredFormat - A date-fns format string. Default: `'MMM d, yyyy h:mmaaa'`
+ * @param options - date-fns `FormatOptions` for locale, week start day, etc.
+ * @returns The formatted date string.
+ *
+ * @example
+ * // Default English format
+ * formatDate(new Date('2026-02-05T15:30:00'));
+ * // => "Feb 5, 2026 3:30pm"
+ *
+ * @example
+ * // Turkish locale
+ * import { tr } from 'date-fns/locale';
+ * formatDate(new Date('2026-02-05T15:30:00'), undefined, { locale: tr });
+ * // => "Şub 5, 2026 3:30öö"
+ *
+ * @example
+ * // Custom format
+ * formatDate(new Date('2026-02-05'), 'dd/MM/yyyy');
+ * // => "05/02/2026"
+ */
+export declare const formatDate: (date: Date, desiredFormat?: string, options?: FormatOptions) => string;