@vtx-ui/react 0.0.1-beta.16 → 0.0.1-beta.17

package/dist/types/stories/components/Textarea.stories.d.ts

@@ -1,21 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Textarea } from '../../components/Textarea';
-declare const meta: Meta<typeof Textarea>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-export declare const WithLabel: Story;
-export declare const WithCharacterCount: Story;
-export declare const WithError: Story;
-export declare const WithSuccess: Story;
-export declare const Required: Story;
-export declare const Disabled: Story;
-export declare const Clearable: Story;
-export declare const AutoResize: Story;
-export declare const WithMaxLength: Story;
-export declare const LongForm: Story;
-export declare const SmallSize: Story;
-export declare const MediumSize: Story;
-export declare const LargeSize: Story;
-export declare const InlineVariant: Story;
-export declare const CompleteExample: Story;

package/dist/types/stories/components/Timeline.stories.d.ts

@@ -1,20 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import Timeline from '../../components/Timeline/Timeline';
-declare const meta: Meta<typeof Timeline>;
-export default meta;
-type Story = StoryObj<typeof Timeline>;
-export declare const Default: Story;
-export declare const WithDescriptions: Story;
-export declare const Numbered: Story;
-export declare const CircleVariant: Story;
-export declare const SimpleVariant: Story;
-export declare const Vertical: Story;
-export declare const VerticalNumbered: Story;
-export declare const LargeSize: Story;
-export declare const SmallSize: Story;
-export declare const ColorVariants: Story;
-export declare const AllVariants: Story;
-export declare const CustomIcons: Story;
-export declare const Clickable: Story;
-export declare const LongLabels: Story;
-export declare const ManySteps: Story;

package/dist/types/stories/components/Toast.stories.d.ts

@@ -1,60 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-declare const meta: Meta;
-export default meta;
-type Story = StoryObj<typeof meta>;
-/**
- * Basic toast notifications with different variants
- */
-export declare const BasicVariants: Story;
-/**
- * Toast with custom title and description
- */
-export declare const WithTitleAndDescription: Story;
-/**
- * Toast with custom auto-close duration
- */
-export declare const CustomDuration: Story;
-/**
- * Toast with action button
- */
-export declare const WithAction: Story;
-/**
- * Toast without progress bar or close button
- */
-export declare const CustomOptions: Story;
-/**
- * Toast with custom icon
- */
-export declare const CustomIcon: Story;
-/**
- * Dismissing toasts programmatically
- */
-export declare const ProgrammaticDismiss: Story;
-/**
- * Updating an existing toast
- */
-export declare const UpdateToast: Story;
-/**
- * Multiple toasts at once
- */
-export declare const MultipleToasts: Story;
-/**
- * Loading state pattern
- */
-export declare const LoadingPattern: Story;
-/**
- * Form validation feedback
- */
-export declare const FormValidation: Story;
-/**
- * API operation feedback
- */
-export declare const APIOperations: Story;
-/**
- * Real-world examples
- */
-export declare const RealWorldExamples: Story;
-/**
- * Playground - Try different combinations
- */
-export declare const Playground: Story;

package/dist/types/stories/components/Tooltip.stories.d.ts

@@ -1,20 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Tooltip } from '../../components/Tooltip';
-declare const meta: Meta<typeof Tooltip>;
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-export declare const Top: Story;
-export declare const Bottom: Story;
-export declare const Left: Story;
-export declare const Right: Story;
-export declare const ClickTrigger: Story;
-export declare const FocusTrigger: Story;
-export declare const LongContent: Story;
-export declare const WithDelay: Story;
-export declare const NoArrow: Story;
-export declare const CustomContent: Story;
-export declare const OnDisabledElement: Story;
-export declare const MultipleTooltips: Story;
-export declare const WithIcon: Story;
-export declare const InteractiveTooltip: Story;

package/dist/types/stories/components/Widget.stories.d.ts

@@ -1,10 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Widget } from '../../components/Widget';
-declare const meta: Meta<typeof Widget>;
-export default meta;
-type Story = StoryObj<typeof Widget>;
-export declare const MetricWidgets: Story;
-export declare const InfoWidgets: Story;
-export declare const AutoGrid: Story;
-export declare const ThemeComparison: Story;
-export declare const SimpleMetric: Story;

package/dist/types/stories/widgets/DashboardCard.stories.d.ts

@@ -1,13 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { DashboardCard } from '../../widgets/DashboardCard';
-declare const meta: Meta<typeof DashboardCard>;
-export default meta;
-type Story = StoryObj<typeof DashboardCard>;
-export declare const StatCardBasic: Story;
-export declare const StatCardWithTrend: Story;
-export declare const StatCardNegativeTrend: Story;
-export declare const ProgressCardBasic: Story;
-export declare const ProgressCardOnTrack: Story;
-export declare const ProgressCardAtRisk: Story;
-export declare const ComparisonCardHorizontal: Story;
-export declare const ComparisonCardVertical: Story;

package/dist/types/stories/widgets/InfoCard.stories.d.ts

@@ -1,9 +0,0 @@
-declare const _default: {
-    title: string;
-    component: import("react").FC<import("../..").WidgetProps & import("react").RefAttributes<HTMLDivElement>>;
-};
-export default _default;
-export declare const Base: () => import("react/jsx-runtime").JSX.Element;
-export declare const BaseVariants: () => import("react/jsx-runtime").JSX.Element;
-export declare const Metric: () => import("react/jsx-runtime").JSX.Element;
-export declare const MetricCustom: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/stories/widgets/InfoListCard.stories.d.ts

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

package/dist/types/stories/widgets/InfoText.stories.d.ts

@@ -1,12 +0,0 @@
-declare const _default: {
-    title: string;
-    component: import("react").FC<import("../..").WidgetProps & import("react").RefAttributes<HTMLDivElement>>;
-};
-export default _default;
-export declare const Base: () => import("react/jsx-runtime").JSX.Element;
-export declare const Stat: () => import("react/jsx-runtime").JSX.Element;
-export declare const Feature: () => import("react/jsx-runtime").JSX.Element;
-export declare const Compact: () => import("react/jsx-runtime").JSX.Element;
-export declare const MixedUsage: () => import("react/jsx-runtime").JSX.Element;
-export declare const GridLayout: () => import("react/jsx-runtime").JSX.Element;
-export declare const FeatureGrid: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/stories/widgets/MetricCard.stories.d.ts

@@ -1,27 +0,0 @@
-import type { Meta, StoryObj } from '@storybook/react';
-import { Widget } from '../../components/Widget';
-declare const meta: Meta<typeof Widget>;
-export default meta;
-type Story = StoryObj<typeof Widget>;
-export declare const Base: Story;
-export declare const BaseWithIcon: Story;
-export declare const BaseNoTrend: Story;
-export declare const CompactPrimary: Story;
-export declare const CompactSuccess: Story;
-export declare const CompactWarning: Story;
-export declare const CompactDanger: Story;
-export declare const DetailedWithProgress: Story;
-export declare const DetailedWithIcon: Story;
-export declare const DetailedComplete: Story;
-export declare const ChartLine: Story;
-export declare const ChartBar: Story;
-export declare const ChartSecondary: Story;
-export declare const ChartDanger: Story;
-export declare const FilledStyles: Story;
-export declare const FilledDetailed: Story;
-export declare const FilledCharts: Story;
-export declare const AdminDashboard: Story;
-export declare const DetailedDashboard: Story;
-export declare const ChartDashboard: Story;
-export declare const MixedDashboard: Story;
-export declare const MixedDashboardWithoutTrend: Story;

package/dist/types/stories/widgets/OrderCard.stories.d.ts

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

package/dist/types/stories/widgets/OrderConfirmation.stories.d.ts

@@ -1,13 +0,0 @@
-import type { StoryObj } from '@storybook/react';
-declare const meta: {
-    title: string;
-    component: import("react").FC<import("../..").WidgetProps & import("react").RefAttributes<HTMLDivElement>>;
-    parameters: {
-        layout: string;
-    };
-    tags: string[];
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
-export declare const WithDiscount: Story;

package/dist/types/stories/widgets/OrderDetails.stories.d.ts

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

package/dist/types/stories/widgets/ProductCard.stories.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-declare const _default: {
-    title: string;
-    component: React.FC<import("../..").WidgetProps & React.RefAttributes<HTMLDivElement>>;
-};
-export default _default;
-export declare const Basic: () => import("react/jsx-runtime").JSX.Element;
-export declare const WithWishlist: () => import("react/jsx-runtime").JSX.Element;
-export declare const FeaturedProduct: () => import("react/jsx-runtime").JSX.Element;
-export declare const ProductGrid: () => import("react/jsx-runtime").JSX.Element;
-export declare const Interactive: () => import("react/jsx-runtime").JSX.Element;

package/dist/types/widgets/Header/Header.d.ts

@@ -1,252 +0,0 @@
-import React from 'react';
-import './Header.css';
-export interface TopBarConfig {
-    /**
-     * Content to display in the top bar
-     */
-    content?: React.ReactNode;
-    /**
-     * Left-aligned content
-     */
-    leftContent?: React.ReactNode;
-    /**
-     * Right-aligned content
-     */
-    rightContent?: React.ReactNode;
-    /**
-     * Top bar styling variant
-     * @default 'subtle'
-     */
-    variant?: 'subtle' | 'bold' | 'accent' | 'dark' | 'gradient';
-    /**
-     * If true, shows a dismiss button
-     */
-    dismissible?: boolean;
-    /**
-     * Callback when dismiss button is clicked
-     */
-    onDismiss?: () => void;
-}
-export interface MegaMenuColumn {
-    /**
-     * Column title
-     */
-    title?: React.ReactNode;
-    /**
-     * Column items
-     */
-    items: NavigationItem[];
-}
-export interface NavigationItem {
-    /**
-     * Unique identifier for the navigation item
-     */
-    id: string;
-    /**
-     * Label text to display
-     */
-    label: React.ReactNode;
-    /**
-     * URL or path for navigation
-     */
-    href?: string;
-    /**
-     * Icon to display before label
-     */
-    icon?: React.ReactNode;
-    /**
-     * Nested child items for dropdown menus
-     */
-    children?: NavigationItem[];
-    /**
-     * Click handler
-     */
-    onClick?: () => void;
-    /**
-     * If true, marks this item as active/selected
-     */
-    active?: boolean;
-    /**
-     * If true, disables the item
-     */
-    disabled?: boolean;
-    /**
-     * Badge content to display (e.g., notification count)
-     */
-    badge?: React.ReactNode;
-    /**
-     * If true, renders as a mega menu with columns
-     */
-    megaMenu?: boolean;
-    /**
-     * Mega menu columns (when megaMenu is true)
-     */
-    megaMenuColumns?: MegaMenuColumn[];
-    /**
-     * Description text for mega menu items
-     */
-    description?: React.ReactNode;
-    /**
-     * Featured image for mega menu
-     */
-    image?: string;
-}
-export interface HeaderDesktopProps extends React.HTMLAttributes<HTMLElement> {
-    /**
-     * Logo element or brand name
-     */
-    logo?: React.ReactNode;
-    /**
-     * Array of navigation items
-     */
-    navItems?: NavigationItem[];
-    /**
-     * Action buttons or elements to display on the right
-     */
-    actions?: React.ReactNode;
-    /**
-     * Visual theme variant
-     * @default 'primary'
-     */
-    variant?: 'primary' | 'secondary' | 'dark' | 'light' | 'transparent' | 'gradient';
-    /**
-     * If true, header has a shadow effect
-     * @default false
-     */
-    elevated?: boolean;
-    /**
-     * If true, header sticks to top on scroll
-     * @default false
-     */
-    sticky?: boolean;
-    /**
-     * If true, makes header full bleed (no max-width)
-     * @default false
-     */
-    fullWidth?: boolean;
-    /**
-     * If true, enables search functionality
-     * @default false
-     */
-    searchEnabled?: boolean;
-    /**
-     * Search placeholder text
-     */
-    searchPlaceholder?: string;
-    /**
-     * Search input handler
-     */
-    onSearch?: (query: string) => void;
-    /**
-     * Custom logo click handler
-     */
-    onLogoClick?: () => void;
-    /**
-     * Layout style for the header
-     * @default 'single-row'
-     */
-    layout?: 'single-row' | 'two-row' | 'centered';
-    /**
-     * Two-row bottom styling variant (only applicable when layout='two-row')
-     * @default 'default'
-     */
-    twoRowBottomStyle?: 'default' | 'divider' | 'dark-bottom' | 'gradient-bottom' | 'elevated-bottom';
-    /**
-     * Top bar configuration (displays above main header)
-     */
-    topBar?: TopBarConfig;
-    /**
-     * Scroll behavior - 'transparent-to-solid' makes header transparent initially and solid on scroll
-     * @default undefined
-     */
-    scrollBehavior?: 'transparent-to-solid';
-    /**
-     * Scroll threshold in pixels before applying scroll effect
-     * @default 50
-     */
-    scrollThreshold?: number;
-    /**
-     * Callback fired when scroll state changes
-     * @param scrolled - true if user has scrolled past threshold, false otherwise
-     */
-    onScrollStateChange?: (scrolled: boolean) => void;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export interface HeaderMobileProps extends React.HTMLAttributes<HTMLElement> {
-    /**
-     * Logo element or brand name
-     */
-    logo?: React.ReactNode;
-    /**
-     * Array of navigation items
-     */
-    navItems?: NavigationItem[];
-    /**
-     * Action buttons or elements to display on the right
-     */
-    actions?: React.ReactNode;
-    /**
-     * Visual theme variant
-     * @default 'primary'
-     */
-    variant?: 'primary' | 'secondary' | 'dark' | 'light' | 'transparent' | 'gradient';
-    /**
-     * If true, header has a shadow effect
-     * @default false
-     */
-    elevated?: boolean;
-    /**
-     * If true, header sticks to top on scroll
-     * @default false
-     */
-    sticky?: boolean;
-    /**
-     * If true, enables search functionality in mobile menu
-     * @default false
-     */
-    searchEnabled?: boolean;
-    /**
-     * Search placeholder text
-     */
-    searchPlaceholder?: string;
-    /**
-     * Search input handler
-     */
-    onSearch?: (query: string) => void;
-    /**
-     * Custom logo click handler
-     */
-    onLogoClick?: () => void;
-    /**
-     * Menu open state (controlled)
-     */
-    menuOpen?: boolean;
-    /**
-     * Menu open change handler (controlled)
-     */
-    onMenuOpenChange?: (open: boolean) => void;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export interface HeaderResponsiveProps {
-    /**
-     * Props for desktop header
-     */
-    desktopProps: HeaderDesktopProps;
-    /**
-     * Props for mobile header
-     */
-    mobileProps: HeaderMobileProps;
-    /**
-     * Breakpoint in pixels to switch between desktop and mobile
-     * @default 768
-     */
-    breakpoint?: number;
-}
-export declare const Header: {
-    Desktop: React.FC<HeaderDesktopProps & React.RefAttributes<HTMLElement>>;
-    Mobile: React.FC<HeaderMobileProps & React.RefAttributes<HTMLElement>>;
-    Responsive: React.FC<HeaderResponsiveProps>;
-};
-export default Header;

package/dist/types/widgets/Header/Header.stories.d.ts

@@ -1,30 +0,0 @@
-import type { StoryObj } from '@storybook/react';
-import { Header } from './Header';
-declare const meta: {
-    title: string;
-    component: import("react").FC<import("./Header").HeaderResponsiveProps>;
-    parameters: {
-        layout: string;
-    };
-    tags: string[];
-};
-export default meta;
-type Story = StoryObj<typeof Header.Responsive>;
-type MobileStory = StoryObj<typeof Header.Mobile>;
-type ResponsiveStory = StoryObj<typeof Header.Responsive>;
-export declare const Primary: Story;
-export declare const WithSearch: Story;
-export declare const WithActions: Story;
-export declare const NestedMenu: Story;
-export declare const FullFeatured: Story;
-export declare const TwoRowLayout: Story;
-export declare const WithMegaMenu: Story;
-export declare const MobilePrimary: MobileStory;
-export declare const MobileDark: MobileStory;
-export declare const MobileNested: MobileStory;
-export declare const MobileWithSearch: MobileStory;
-export declare const MobileWithActions: MobileStory;
-export declare const ResponsiveBasic: ResponsiveStory;
-export declare const ResponsiveTwoRowWithMegaMenu: ResponsiveStory;
-export declare const ScrollTransparentToSolid: Story;
-export declare const ScrollTwoRowTransparent: Story;

package/dist/types/widgets/Header/index.d.ts

@@ -1,2 +0,0 @@
-export { Header, default } from './Header';
-export type { NavigationItem, MegaMenuColumn, TopBarConfig, HeaderDesktopProps, HeaderMobileProps, HeaderResponsiveProps, } from './Header';

package/dist/types/widgets/MetricCard/MetricCard.d.ts

@@ -1,106 +0,0 @@
-import React from 'react';
-import './MetricCard.css';
-export interface TrendData {
-    direction: 'up' | 'down';
-    value: number;
-    label?: string;
-}
-export interface TargetData {
-    value: string;
-    label?: string;
-}
-export interface ChartData {
-    data: number[];
-    variant?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
-    type?: 'line' | 'bar';
-}
-export interface MetricCardBaseProps extends React.HTMLAttributes<HTMLDivElement> {
-    /**
-     * Primary value/metric to display
-     */
-    value: React.ReactNode;
-    /**
-     * Label for the metric
-     */
-    label: React.ReactNode;
-    /**
-     * Optional icon
-     */
-    icon?: React.ReactNode;
-    /**
-     * Trend information
-     */
-    trend?: TrendData;
-    /**
-     * Optional description text
-     */
-    description?: React.ReactNode;
-    /**
-     * Color variant for filled style
-     */
-    variant?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
-    /**
-     * If true, applies filled background style with variant color
-     * @default false
-     */
-    filled?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export interface MetricCardCompactProps extends React.HTMLAttributes<HTMLDivElement> {
-    value: React.ReactNode;
-    label: React.ReactNode;
-    trend?: TrendData;
-    variant?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
-    /**
-     * If true, applies filled background style with variant color
-     * @default false
-     */
-    filled?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export interface MetricCardDetailedProps extends React.HTMLAttributes<HTMLDivElement> {
-    value: React.ReactNode;
-    label: React.ReactNode;
-    icon?: React.ReactNode;
-    trend?: TrendData;
-    target?: TargetData;
-    progress?: number;
-    description?: React.ReactNode;
-    /**
-     * Color variant for filled style
-     */
-    variant?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
-    /**
-     * If true, applies filled background style with variant color
-     * @default false
-     */
-    filled?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export interface MetricCardChartProps extends React.HTMLAttributes<HTMLDivElement> {
-    value: React.ReactNode;
-    label: React.ReactNode;
-    trend?: TrendData;
-    chart: ChartData;
-    /**
-     * Color variant for filled style
-     */
-    variant?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'info';
-    /**
-     * If true, applies filled background style with variant color
-     * @default false
-     */
-    filled?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export declare const MetricCard: {
-    Base: React.FC<MetricCardBaseProps & React.RefAttributes<HTMLDivElement>>;
-    Compact: React.FC<MetricCardCompactProps & React.RefAttributes<HTMLDivElement>>;
-    Detailed: React.FC<MetricCardDetailedProps & React.RefAttributes<HTMLDivElement>>;
-    Chart: React.FC<MetricCardChartProps & React.RefAttributes<HTMLDivElement>>;
-};
-export default MetricCard;

package/dist/types/widgets/MetricCard/index.d.ts

@@ -1,2 +0,0 @@
-export { MetricCard, default } from './MetricCard';
-export type { MetricCardBaseProps, MetricCardCompactProps, MetricCardDetailedProps, MetricCardChartProps, TrendData, TargetData, ChartData, } from './MetricCard';