@unizap/uniui 1.0.0 → 1.0.2

package/dist/components/DropzoneUploader/DropzoneUploader.stories.d.ts

@@ -0,0 +1,9 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    component: import("react").FC<import("./DropzoneUploader.types").IDropzoneUploaderProps>;
+    title: string;
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const UploadedFile: Story;

package/dist/components/DropzoneUploader/DropzoneUploader.types.d.ts

@@ -0,0 +1,23 @@
+export interface IDropzoneUploaderProps {
+    onFilesAccepted: (files: File[]) => void;
+    onError?: (errorMessages: string[]) => void;
+    accept?: {
+        [mimeType: string]: string[];
+    };
+    multiple?: boolean;
+    maxSizeInBytes?: number;
+    maxFiles?: number;
+    label?: string;
+    subLabel?: string;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+    wrapperClass?: string;
+    iconClass?: string;
+    labelClass?: string;
+    subLabelClass?: string;
+    showList?: boolean;
+    listView?: boolean;
+    showListImage?: boolean;
+    uploadedFiles?: File[];
+    onDeleteCallback?: (remainingFiles: File[]) => void;
+}

package/dist/components/DropzoneUploader/index.d.ts

@@ -0,0 +1 @@
+export { default } from './DropzoneUploader';

package/dist/components/EmptyState/EmptyState.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { EmptyStateProps } from './EmptyState.types';
+declare const EmptyState: React.FC<EmptyStateProps>;
+export default EmptyState;

package/dist/components/EmptyState/EmptyState.stories.d.ts

@@ -0,0 +1,8 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import EmptyState from './EmptyState';
+declare const meta: Meta<typeof EmptyState>;
+export default meta;
+type Story = StoryObj<typeof EmptyState>;
+export declare const Basic: Story;
+export declare const WithoutCTA: Story;
+export declare const CustomIllustration: Story;

package/dist/components/EmptyState/EmptyState.types.d.ts

@@ -0,0 +1,18 @@
+import { CompColor } from "../../utils/ColorMap";
+export interface EmptyStateProps {
+    /** Heading shown above the description */
+    title: string;
+    /** Optional explanatory text */
+    description?: string;
+    /** Optional primary action (e.g., “Add item”) */
+    actionLabel?: string;
+    color?: CompColor;
+    /** Callback executed when primary button is clicked */
+    onAction?: () => void;
+    /** Optional illustration (SVG, img url, or React node) */
+    illustration?: React.ReactNode;
+    /** Width of the illustration (defaults 120px) */
+    illustrationWidth?: number | string;
+    /** Render children under the call-to-action area (links, tips, etc.) */
+    children?: React.ReactNode;
+}

package/dist/components/EmptyState/index.d.ts

@@ -0,0 +1 @@
+export { default } from './EmptyState';

package/dist/components/IconButton/Icon.stories.d.ts

@@ -0,0 +1,10 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import IconButton from './IconButton';
+declare const meta: Meta<typeof IconButton>;
+export default meta;
+type Story = StoryObj<typeof IconButton>;
+export declare const Filled: Story;
+export declare const Outlined: Story;
+export declare const Transparent: Story;
+export declare const RoundedFull: Story;
+export declare const Disabled: Story;

package/dist/components/IconButton/IconButton.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IconButtonProps } from './IconButton.types';
+declare const IconButton: React.FC<IconButtonProps>;
+export default IconButton;

package/dist/components/IconButton/IconButton.types.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { CompColor } from '../../utils/ColorMap';
+export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: 'filled' | 'outlined' | 'transparent';
+    color?: CompColor;
+    size?: 'small' | 'medium' | 'large';
+    className?: string;
+    disabled?: boolean;
+    roundedFull?: boolean;
+    icon?: React.ReactNode;
+    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+}

package/dist/components/IconButton/index.d.ts

@@ -0,0 +1 @@
+export { default } from './IconButton';

package/dist/components/List/List.d.ts

@@ -0,0 +1,3 @@
+import { ListProps } from './List.types';
+declare const List: ({ children, className }: ListProps) => import("react/jsx-runtime").JSX.Element;
+export default List;

package/dist/components/List/List.stories.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+    tags: string[];
+};
+export default _default;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/List/List.types.d.ts

@@ -0,0 +1,10 @@
+import { ReactNode } from 'react';
+export interface ListProps {
+    children: ReactNode;
+    className?: string;
+}
+export interface ListItemProps {
+    children: ReactNode;
+    secondaryAction?: ReactNode;
+    className?: string;
+}

package/dist/components/List/ListItem.d.ts

@@ -0,0 +1,3 @@
+import { ListItemProps } from './List.types';
+declare const ListItem: ({ children, secondaryAction, className }: ListItemProps) => import("react/jsx-runtime").JSX.Element;
+export default ListItem;

package/dist/components/List/index.d.ts

@@ -0,0 +1,2 @@
+export { default as List } from './List';
+export { default as ListItem } from './ListItem';

package/dist/components/Menu/Menu.d.ts

@@ -0,0 +1,8 @@
+type MenuProps<T extends React.ReactNode> = {
+    options?: T[];
+    selectedValue?: T;
+    onChange?: (value: T) => void;
+    placementTop?: boolean;
+};
+export default function Menu<T extends React.ReactNode>({ options, selectedValue, onChange, placementTop, }: MenuProps<T>): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Menu/Menu.types.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/Menu/Select.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Menu from './Menu';
+declare const meta: Meta<typeof Menu>;
+export default meta;
+type Story = StoryObj<typeof Menu>;
+export declare const Default: Story;

package/dist/components/Menu/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Menu';

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { PaginationProps } from "./Pagination.types";
+declare const Pagination: React.FC<PaginationProps>;
+export default Pagination;

package/dist/components/Pagination/Pagination.stories.d.ts

@@ -0,0 +1,6 @@
+import Pagination from "./Pagination";
+import { Meta } from "@storybook/react";
+declare const meta: Meta<typeof Pagination>;
+export default meta;
+export declare const Default: () => import("react/jsx-runtime").JSX.Element;
+export declare const CustomPageSize: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Pagination/Pagination.types.d.ts

@@ -0,0 +1,8 @@
+export interface PaginationProps {
+    total: number;
+    currentPage: number;
+    pageSize?: number;
+    onPageChange: (page: number) => void;
+    className?: string;
+    hideEdgeButtons?: boolean;
+}

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Pagination';

package/dist/components/PasswordInput/PasswordInput.d.ts

@@ -0,0 +1,3 @@
+import { ITextInputProps } from '../TextInput/TextInput.types';
+declare const PasswordInput: import("react").ForwardRefExoticComponent<Omit<ITextInputProps, "type" | "endIcon"> & import("react").RefAttributes<HTMLInputElement>>;
+export default PasswordInput;

package/dist/components/PasswordInput/PasswordInput.stories.d.ts

@@ -0,0 +1,8 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    component: import("react").ForwardRefExoticComponent<Omit<import("../TextInput/TextInput.types").ITextInputProps, "type" | "endIcon"> & import("react").RefAttributes<HTMLInputElement>>;
+    title: string;
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/components/PasswordInput/index.d.ts

@@ -0,0 +1 @@
+export { default } from './PasswordInput';

package/dist/components/Pill/Pill.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { PillProps } from "./Pill.type";
+export declare const Pill: React.FC<PillProps>;
+export default Pill;

package/dist/components/Pill/Pill.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { Pill } from './Pill';
+declare const meta: Meta<typeof Pill>;
+export default meta;
+type Story = StoryObj<typeof Pill>;
+export declare const Default: Story;
+export declare const AllColors: Story;
+export declare const AllSizes: Story;
+export declare const AllVariants: Story;

package/dist/components/Pill/Pill.type.d.ts

@@ -0,0 +1,8 @@
+import { CompColor } from "../../utils/ColorMap";
+export type PillProps = {
+    label: string;
+    color?: CompColor;
+    variant?: "filled" | "outlined";
+    size?: "sm" | "md" | "lg";
+    className?: string;
+};

package/dist/components/Pill/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Pill';

package/dist/components/ProfileImageShowcase/ProfileShowcase.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+export interface ProfileShowcaseProps {
+    size?: "sm" | "md" | "lg" | "xl";
+    imageUrl: string;
+    name: string;
+    number: string;
+    className: string;
+}
+declare const ProfileShowcase: React.FC<ProfileShowcaseProps>;
+export default ProfileShowcase;

package/dist/components/ProfileImageShowcase/ProfileShowcase.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from "@storybook/react";
+import ProfileShowcase from "./ProfileShowcase";
+declare const meta: Meta<typeof ProfileShowcase>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/components/ProfileImageShowcase/ProfileShowcase.type.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/ProfileImageShowcase/index.d.ts

@@ -0,0 +1 @@
+export { default } from './ProfileShowcase';

package/dist/components/Progress/Progress.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ProgressProps } from './Progress.types';
+declare const Progress: React.FC<ProgressProps>;
+export default Progress;

package/dist/components/Progress/Progress.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Progress from './Progress';
+import { ProgressProps } from './Progress.types';
+declare const meta: Meta<typeof Progress>;
+export default meta;
+type Story = StoryObj<ProgressProps>;
+export declare const LinearDefault: Story;
+export declare const CircularDefault: Story;
+export declare const LinearIndeterminate: Story;
+export declare const CircularIndeterminate: Story;
+export declare const AnimatedProgress: Story;
+export declare const AllColorsLinear: Story;
+export declare const AllColorsCircular: Story;
+export declare const CircularSizes: Story;
+export declare const ProgressStates: Story;
+export declare const Playground: Story;

package/dist/components/Progress/Progress.types.d.ts

@@ -0,0 +1,48 @@
+import { CompColor } from "../../utils/ColorMap";
+export type ProgressVariant = 'linear' | 'circular';
+export interface BaseProgressProps {
+    /**
+     * The variant of progress indicator to display
+     * @default 'linear'
+     */
+    variant?: ProgressVariant;
+    /**
+     * The progress value between 0 and 100
+     * @default 0
+     */
+    value?: number;
+    /**
+     * The color theme of the progress indicator
+     * @default 'blue'
+     */
+    color?: CompColor;
+    /**
+     * Whether the progress is determinate (shows specific progress) or indeterminate (loading animation)
+     * @default true
+     */
+    determinate?: boolean;
+    /**
+     * Additional CSS classes to apply to the component
+     */
+    className?: string;
+}
+export interface LinearProgressProps extends BaseProgressProps {
+    variant?: 'linear';
+}
+export interface CircularProgressProps extends BaseProgressProps {
+    variant: 'circular';
+    /**
+     * The size of the circular progress indicator in pixels
+     * @default 40
+     */
+    size?: number;
+    /**
+     * The thickness of the circular progress stroke
+     * @default 3.6
+     */
+    thickness?: number;
+}
+export type ProgressProps = LinearProgressProps | CircularProgressProps;
+export interface ProgressColorClasses {
+    [key: string]: string;
+}

package/dist/components/Progress/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Progress';

package/dist/components/RadioGroup/RadioGroup.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IRadioGroupProps } from './RadioGroup.types';
+declare const RadioGroup: React.FC<IRadioGroupProps>;
+export default RadioGroup;

package/dist/components/RadioGroup/RadioGroup.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import RadioGroup from './RadioGroup';
+declare const meta: Meta<typeof RadioGroup>;
+export default meta;
+type Story = StoryObj<typeof RadioGroup>;
+export declare const Default: Story;
+export declare const Row: Story;

package/dist/components/RadioGroup/RadioGroup.types.d.ts

@@ -0,0 +1,16 @@
+import { CompColor } from "../../utils/ColorMap";
+export interface IRadioGroupProps {
+    name: string;
+    options: {
+        label: string;
+        value: string;
+        disabled?: boolean;
+    }[];
+    selectedValue?: string;
+    onChange?: (value: string) => void;
+    direction?: 'row' | 'column';
+    disabled?: boolean;
+    color?: CompColor;
+    className?: string;
+    radioClass?: string;
+}

package/dist/components/RadioGroup/index.d.ts

@@ -0,0 +1 @@
+export { default } from './RadioGroup';

package/dist/components/SearchBar/SearchBar.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SearchBarProps } from './SearchBar.types';
+declare const SearchBar: React.FC<SearchBarProps>;
+export default SearchBar;

package/dist/components/SearchBar/SearchBar.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import SearchBar from './SearchBar';
+declare const meta: Meta<typeof SearchBar>;
+export default meta;
+type Story = StoryObj<typeof SearchBar>;
+export declare const Playground: Story;

package/dist/components/SearchBar/SearchBar.types.d.ts

@@ -0,0 +1,24 @@
+export interface SearchBarProps {
+    /** Current search value (controlled) */
+    value: string;
+    /** Called on every keystroke */
+    onChange: (v: string) => void;
+    /** Optional list shown under the field */
+    suggestions?: string[];
+    /** Fired when user picks a suggestion (click or Enter) */
+    onSelect?: (v: string) => void;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Debounce delay (ms) before firing onChange; 0 = none */
+    debounce?: number;
+    /** Width of the component (CSS size) */
+    width?: string | number;
+    /** If true, filter suggestions client-side */
+    filterLocal?: boolean;
+    /** Custom empty-state text when no suggestions */
+    emptyLabel?: string;
+    iconStyle?: string;
+    inputClass?: string;
+    className?: string;
+    startIcon?: React.ReactNode;
+}

package/dist/components/SearchBar/index.d.ts

@@ -0,0 +1 @@
+export { default } from './SearchBar';

package/dist/components/Select/Select.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ISelectProps } from './Select.types';
+declare const Select: React.FC<ISelectProps>;
+export default Select;

package/dist/components/Select/Select.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Select from './Select';
+declare const meta: Meta<typeof Select>;
+export default meta;
+type Story = StoryObj<typeof Select>;
+export declare const OutlinedMedium: Story;
+export declare const FilledLarge: Story;

package/dist/components/Select/Select.types.d.ts

@@ -0,0 +1,17 @@
+export interface ISelectOption {
+    value: string;
+    label: string;
+}
+export interface ISelectProps {
+    label?: string;
+    value: string;
+    onChange: (value: string) => void;
+    options: ISelectOption[];
+    className?: string;
+    labelClass?: string;
+    disabled?: boolean;
+    shadow?: boolean;
+    size?: "small" | "medium" | "large";
+    rounded?: "small" | "medium" | "full";
+    variant?: "filled" | "outlined";
+}

package/dist/components/Select/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Select';

package/dist/components/Sidebar/Sidebar.d.ts

@@ -0,0 +1,10 @@
+declare function Sidebar({ items, logoJSX, position, defaultActive, open, onClose, onItemSelect, }: {
+    items?: any[];
+    logoJSX: any;
+    position: any;
+    defaultActive: any;
+    open?: boolean;
+    onClose: any;
+    onItemSelect: any;
+}): import("react/jsx-runtime").JSX.Element;
+export default Sidebar;

package/dist/components/Sidebar/Sidebar.stories.d.ts

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from "@storybook/react";
+import Sidebar from "./Sidebar";
+declare const meta: Meta<typeof Sidebar>;
+export default meta;
+type Story = StoryObj<typeof Sidebar>;
+export declare const Default: Story;

package/dist/components/Sidebar/Sidebar.types.d.ts

@@ -0,0 +1,16 @@
+import type { ReactNode } from "react";
+export type SidebarItem = {
+    label: string;
+    icon: ReactNode;
+    href?: string;
+    onClick?: () => void;
+};
+export type SidebarProps = {
+    items: SidebarItem[];
+    closeSidebar?: () => void;
+    logoJSX?: React.ReactNode;
+    position?: "left" | "right" | "top" | "bottom";
+    defaultActive?: SidebarItem;
+    open?: boolean;
+    onClose?: () => void;
+};

package/dist/components/Sidebar/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Sidebar';

package/dist/components/Skeleton/Skeleton.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SkeletonProps } from './Skeleton.types';
+declare const Skeleton: React.FC<SkeletonProps>;
+export default Skeleton;

package/dist/components/Skeleton/Skeleton.stories.d.ts

@@ -0,0 +1,16 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Skeleton from './Skeleton';
+declare const meta: Meta<typeof Skeleton>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Rectangular: Story;
+export declare const Rounded: Story;
+export declare const Circular: Story;
+export declare const Text: Story;
+export declare const PulseAnimation: Story;
+export declare const WaveAnimation: Story;
+export declare const AllVariants: Story;
+export declare const DifferentSizes: Story;
+export declare const CardLoadingExample: Story;
+export declare const ListLoadingExample: Story;
+export declare const Playground: Story;

package/dist/components/Skeleton/Skeleton.types.d.ts

@@ -0,0 +1,28 @@
+export type SkeletonAnimation = 'pulse' | 'wave';
+export type SkeletonVariant = 'circular' | 'rectangular' | 'rounded' | 'text';
+export interface SkeletonProps {
+    /**
+     * The type of animation to display
+     * @default 'pulse'
+     */
+    animation?: SkeletonAnimation;
+    /**
+     * The variant of skeleton to display
+     * @default 'rectangular'
+     */
+    variant?: SkeletonVariant;
+    /**
+     * The width of the skeleton in pixels
+     * @default undefined (full width for text, auto for others)
+     */
+    width?: number;
+    /**
+     * The height of the skeleton in pixels
+     * @default undefined (auto height based on variant)
+     */
+    height?: number;
+    /**
+     * Additional CSS classes to apply to the component
+     */
+    className?: string;
+}

package/dist/components/Skeleton/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Skeleton';

package/dist/components/Slider/Slider.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SliderProps } from './Slider.types';
+declare const Slider: React.FC<SliderProps>;
+export default Slider;

package/dist/components/Slider/Slider.stories.d.ts

@@ -0,0 +1,14 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Slider from './Slider';
+declare const meta: Meta<typeof Slider>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Sizes: Story;
+export declare const Colors: Story;
+export declare const WithMarks: Story;
+export declare const TemperatureSlider: Story;
+export declare const VolumeSlider: Story;
+export declare const Disabled: Story;
+export declare const RangeDefault: Story;
+export declare const RangeSizes: Story;

package/dist/components/Slider/Slider.types.d.ts

@@ -0,0 +1,21 @@
+import { CompColor } from "../../utils/ColorMap";
+export interface SliderMark {
+    value: number;
+    label?: string | number;
+}
+export interface SliderProps {
+    value: number | [number, number];
+    onChange: (value: number | [number, number]) => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    color?: CompColor;
+    size?: 'small' | 'medium' | 'large';
+    disabled?: boolean;
+    className?: string;
+    showValue?: boolean;
+    showMarks?: boolean;
+    marks?: SliderMark[];
+    range?: boolean;
+    minDistance?: number;
+}

package/dist/components/Slider/index.d.ts

@@ -0,0 +1 @@
+export { default } from './Slider';

package/dist/components/Snackbar/Snackbar.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SnackbarProps } from './Snackbar.types';
+declare const Snackbar: React.FC<SnackbarProps>;
+export default Snackbar;

package/dist/components/Snackbar/Snackbar.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import Snackbar from './Snackbar';
+declare const meta: Meta<typeof Snackbar>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Positions: Story;
+export declare const Colors: Story;
+export declare const WithActions: Story;
+export declare const AutoHideDemo: Story;
+export declare const Playground: Story;