@aspect-ops/exon-ui 0.2.1 → 0.2.2

package/dist/components/StatusBanner/StatusBanner.svelte

@@ -0,0 +1,325 @@
+<script lang="ts">
+	import type { StatusBannerStatus, StatusBannerPosition } from '../../types/index.js';
+
+	interface Props {
+		status: StatusBannerStatus;
+		message?: string;
+		description?: string;
+		dismissible?: boolean;
+		position?: StatusBannerPosition;
+		class?: string;
+		children?: import('svelte').Snippet;
+	}
+
+	let {
+		status,
+		message,
+		description,
+		dismissible = false,
+		position = 'sticky',
+		class: className = '',
+		children
+	}: Props = $props();
+
+	let dismissed = $state(false);
+	let visible = $state(true);
+
+	function handleDismiss() {
+		visible = false;
+		setTimeout(() => {
+			dismissed = true;
+		}, 300); // Match animation duration
+	}
+
+	// Default icons for each status
+	const statusIcons: Record<StatusBannerStatus, string> = {
+		online: '✓',
+		offline: '⚠',
+		warning: '⚠',
+		error: '✕',
+		reconnecting: '↻'
+	};
+
+	// Default messages if not provided
+	const statusMessages: Record<StatusBannerStatus, string> = {
+		online: 'Online',
+		offline: 'Offline',
+		warning: 'Warning',
+		error: 'Error',
+		reconnecting: 'Reconnecting'
+	};
+</script>
+
+{#if !dismissed}
+	<div
+		class="status-banner status-banner--{status} status-banner--{position} {className}"
+		class:status-banner--visible={visible}
+		role="status"
+		aria-live="polite"
+	>
+		<div class="status-banner__content">
+			<span class="status-banner__icon" aria-hidden="true">
+				{statusIcons[status]}
+			</span>
+			<div class="status-banner__text">
+				<span class="status-banner__message">
+					{message || statusMessages[status]}
+				</span>
+				{#if description}
+					<span class="status-banner__description">
+						{description}
+					</span>
+				{/if}
+				{#if children}
+					{@render children()}
+				{/if}
+			</div>
+		</div>
+		{#if dismissible}
+			<button
+				type="button"
+				class="status-banner__close"
+				onclick={handleDismiss}
+				aria-label="Dismiss status banner"
+			>
+				×
+			</button>
+		{/if}
+	</div>
+{/if}
+
+<style>
+	.status-banner {
+		position: relative;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		width: 100%;
+		padding: 0.75rem 1rem;
+		font-family: inherit;
+		font-size: 0.875rem;
+		line-height: 1.5;
+		opacity: 0;
+		transform: translateY(-100%);
+		transition:
+			transform 0.3s ease,
+			opacity 0.3s ease;
+		z-index: 1000;
+	}
+
+	.status-banner--visible {
+		opacity: 1;
+		transform: translateY(0);
+	}
+
+	.status-banner--fixed {
+		position: fixed;
+		top: 0;
+		left: 0;
+		right: 0;
+	}
+
+	.status-banner--sticky {
+		position: sticky;
+		top: 0;
+	}
+
+	.status-banner--static {
+		position: static;
+	}
+
+	/* Support for mobile safe areas */
+	@supports (padding-top: env(safe-area-inset-top)) {
+		.status-banner--fixed,
+		.status-banner--sticky {
+			padding-top: calc(0.75rem + env(safe-area-inset-top));
+		}
+	}
+
+	.status-banner__content {
+		display: flex;
+		align-items: center;
+		gap: 0.75rem;
+		flex: 1;
+	}
+
+	.status-banner__icon {
+		flex-shrink: 0;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 1.5rem;
+		height: 1.5rem;
+		font-size: 1rem;
+		font-weight: 600;
+		line-height: 1;
+	}
+
+	.status-banner__text {
+		display: flex;
+		flex-direction: column;
+		gap: 0.125rem;
+		flex: 1;
+	}
+
+	.status-banner__message {
+		font-weight: 600;
+		letter-spacing: 0.025em;
+	}
+
+	.status-banner__description {
+		font-size: 0.8125rem;
+		opacity: 0.9;
+	}
+
+	.status-banner__close {
+		flex-shrink: 0;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 2rem;
+		height: 2rem;
+		margin: -0.25rem -0.25rem -0.25rem 0.5rem;
+		padding: 0;
+		border: none;
+		border-radius: var(--radius-sm, 0.25rem);
+		background: transparent;
+		font-family: inherit;
+		font-size: 1.25rem;
+		line-height: 1;
+		cursor: pointer;
+		transition: background-color 0.2s ease;
+	}
+
+	.status-banner__close:hover {
+		background-color: rgba(0, 0, 0, 0.1);
+	}
+
+	.status-banner__close:focus-visible {
+		outline: 2px solid currentColor;
+		outline-offset: 2px;
+	}
+
+	/* Online variant */
+	.status-banner--online {
+		background-color: var(--color-success-bg, #ecfdf5);
+		color: var(--color-success, #10b981);
+	}
+
+	.status-banner--online .status-banner__message,
+	.status-banner--online .status-banner__description {
+		color: var(--color-success-text, #065f46);
+	}
+
+	/* Offline variant */
+	.status-banner--offline {
+		background-color: var(--color-warning-bg, #fffbeb);
+		color: var(--color-warning, #f59e0b);
+	}
+
+	.status-banner--offline .status-banner__message,
+	.status-banner--offline .status-banner__description {
+		color: var(--color-warning-text, #92400e);
+	}
+
+	/* Warning variant */
+	.status-banner--warning {
+		background-color: var(--color-warning-bg, #fffbeb);
+		color: var(--color-warning, #f59e0b);
+	}
+
+	.status-banner--warning .status-banner__message,
+	.status-banner--warning .status-banner__description {
+		color: var(--color-warning-text, #92400e);
+	}
+
+	/* Error variant */
+	.status-banner--error {
+		background-color: var(--color-error-bg, #fef2f2);
+		color: var(--color-error, #ef4444);
+	}
+
+	.status-banner--error .status-banner__message,
+	.status-banner--error .status-banner__description {
+		color: var(--color-error-text, #991b1b);
+	}
+
+	/* Reconnecting variant */
+	.status-banner--reconnecting {
+		background-color: var(--color-info-bg, #eff6ff);
+		color: var(--color-info, #3b82f6);
+	}
+
+	.status-banner--reconnecting .status-banner__message,
+	.status-banner--reconnecting .status-banner__description {
+		color: var(--color-info-text, #1e3a8a);
+	}
+
+	.status-banner--reconnecting .status-banner__icon {
+		animation: spin 1s linear infinite;
+	}
+
+	@keyframes spin {
+		from {
+			transform: rotate(0deg);
+		}
+		to {
+			transform: rotate(360deg);
+		}
+	}
+
+	/* Dark mode support */
+	:global([data-theme='dark']) .status-banner--online {
+		background-color: var(--color-success-bg-dark, #064e3b);
+		color: var(--color-success-dark, #6ee7b7);
+	}
+
+	:global([data-theme='dark']) .status-banner--online .status-banner__message,
+	:global([data-theme='dark']) .status-banner--online .status-banner__description {
+		color: var(--color-success-text-dark, #d1fae5);
+	}
+
+	:global([data-theme='dark']) .status-banner--offline {
+		background-color: var(--color-warning-bg-dark, #78350f);
+		color: var(--color-warning-dark, #fcd34d);
+	}
+
+	:global([data-theme='dark']) .status-banner--offline .status-banner__message,
+	:global([data-theme='dark']) .status-banner--offline .status-banner__description {
+		color: var(--color-warning-text-dark, #fef3c7);
+	}
+
+	:global([data-theme='dark']) .status-banner--warning {
+		background-color: var(--color-warning-bg-dark, #78350f);
+		color: var(--color-warning-dark, #fcd34d);
+	}
+
+	:global([data-theme='dark']) .status-banner--warning .status-banner__message,
+	:global([data-theme='dark']) .status-banner--warning .status-banner__description {
+		color: var(--color-warning-text-dark, #fef3c7);
+	}
+
+	:global([data-theme='dark']) .status-banner--error {
+		background-color: var(--color-error-bg-dark, #7f1d1d);
+		color: var(--color-error-dark, #fca5a5);
+	}
+
+	:global([data-theme='dark']) .status-banner--error .status-banner__message,
+	:global([data-theme='dark']) .status-banner--error .status-banner__description {
+		color: var(--color-error-text-dark, #fee2e2);
+	}
+
+	:global([data-theme='dark']) .status-banner--reconnecting {
+		background-color: var(--color-info-bg-dark, #1e3a8a);
+		color: var(--color-info-dark, #93c5fd);
+	}
+
+	:global([data-theme='dark']) .status-banner--reconnecting .status-banner__message,
+	:global([data-theme='dark']) .status-banner--reconnecting .status-banner__description {
+		color: var(--color-info-text-dark, #dbeafe);
+	}
+
+	:global([data-theme='dark']) .status-banner__close:hover {
+		background-color: rgba(255, 255, 255, 0.1);
+	}
+</style>

package/dist/components/StatusBanner/StatusBanner.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { StatusBannerStatus, StatusBannerPosition } from '../../types/index.js';
+interface Props {
+    status: StatusBannerStatus;
+    message?: string;
+    description?: string;
+    dismissible?: boolean;
+    position?: StatusBannerPosition;
+    class?: string;
+    children?: import('svelte').Snippet;
+}
+declare const StatusBanner: import("svelte").Component<Props, {}, "">;
+type StatusBanner = ReturnType<typeof StatusBanner>;
+export default StatusBanner;

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

@@ -0,0 +1 @@
+export { default as StatusBanner } from './StatusBanner.svelte';

package/dist/components/StatusBanner/index.js

@@ -0,0 +1 @@
+export { default as StatusBanner } from './StatusBanner.svelte';

package/dist/index.d.ts

@@ -52,16 +52,22 @@ export { ProgressBar, ProgressCircle, Spinner } from './components/Progress/inde
 export { Tooltip } from './components/Tooltip/index.js';
 export { Popover, PopoverTrigger, PopoverContent } from './components/Popover/index.js';
 export { Skeleton } from './components/Skeleton/index.js';
-export { Card, CardHeader, CardBody, CardFooter } from './components/Card/index.js';
+export { StatusBanner } from './components/StatusBanner/index.js';
+export { Card, CardHeader, CardBody, CardFooter, FlipCard } from './components/Card/index.js';
 export { Avatar, AvatarGroup } from './components/Avatar/index.js';
 export { Tag } from './components/Tag/index.js';
 export { EmptyState } from './components/EmptyState/index.js';
+export { PageHeader } from './components/PageHeader/index.js';
 export { List, ListItem } from './components/List/index.js';
+export { StatCircle } from './components/StatCircle/index.js';
 export { Table, TableHead, TableHeader, TableBody, TableRow, TableCell } from './components/Table/index.js';
 export { Accordion, AccordionItem } from './components/Accordion/index.js';
 export { Slider } from './components/Slider/index.js';
 export { Carousel, CarouselSlide } from './components/Carousel/index.js';
 export { Image } from './components/Image/index.js';
+export { StatusBadge } from './components/StatusBadge/index.js';
+export { StatsCard } from './components/StatsCard/index.js';
+export { DataTable } from './components/DataTable/index.js';
 export { Container } from './components/Container/index.js';
 export { Grid } from './components/Grid/index.js';
 export { GridItem } from './components/Grid/index.js';
@@ -83,4 +89,4 @@ export { ContactForm } from './components/ContactForm/index.js';
 export { ViewCounter } from './components/ViewCounter/index.js';
 export { Mermaid } from './components/Mermaid/index.js';
 export { DoughnutChart } from './components/DoughnutChart/index.js';
-export type { ButtonProps, ButtonVariant, ButtonSize, TypographyProps, TypographyVariant, IconProps, IconSize, BadgeProps, BadgeVariant, LinkProps, InputSize, TextInputType, FormFieldProps, TextInputProps, TextareaProps, SelectOption, SelectProps, CheckboxProps, RadioProps, RadioGroupProps, SwitchProps, SearchInputProps, DatePickerProps, FileUploadProps, OTPInputProps, TimeFormat, TimePickerProps, RatingProps, ToggleGroupType, ToggleGroupOrientation, ToggleGroupProps, ToggleGroupItemProps, NumberInputProps, PaginationProps, TabsOrientation, TabsProps, TabListProps, TabTriggerProps, TabContentProps, MenuProps, MenuTriggerProps, MenuContentProps, MenuItemProps, MenuSeparatorProps, MenuSubProps, MenuSubTriggerProps, MenuSubContentProps, BreadcrumbItemData, BreadcrumbsProps, BreadcrumbItemProps, BottomNavItemData, BottomNavProps, BottomNavItemProps, NavItemProps, NavbarProps, SidebarItemData, SidebarProps, SidebarItemProps, SidebarGroupProps, StepperOrientation, StepperProps, StepperStepProps, AlertVariant, AlertProps, ToastVariant, ToastPosition, ToastData, ToastProps, ToastContainerProps, ModalSize, ModalProps, ModalHeaderProps, ModalBodyProps, ModalFooterProps, ProgressSize, ProgressBarProps, ProgressCircleProps, SpinnerProps, TooltipSide, TooltipProps, PopoverSide, PopoverProps, PopoverTriggerProps, PopoverContentProps, SkeletonVariant, SkeletonProps, CardVariant, CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, AvatarSize, AvatarShape, AvatarProps, AvatarGroupProps, TagVariant, TagSize, TagProps, ChipVariant, ChipColor, ChipSize, ChipProps, ChipGroupProps, EmptyStateSize, EmptyStateProps, ListProps, ListItemProps, TableProps, TableHeadProps, TableHeaderAlign, TableHeaderSortDirection, TableHeaderProps, TableBodyProps, TableRowProps, TableCellAlign, TableCellProps, AccordionProps, AccordionItemProps, SliderProps, CarouselProps, CarouselSlideProps, ImageObjectFit, ImageRounded, ImageProps, ContainerSize, ContainerProps, GridAlign, GridJustify, SpacingToken, GridProps, GridItemProps, StackDirection, StackProps, DividerOrientation, DividerProps, SpacerSize, SpacerProps, AspectRatioPreset, AspectRatioProps, CenterProps, BoxProps, SafeAreaEdge, SafeAreaProps, BottomSheetSnapPoint, BottomSheetProps, BottomSheetHeaderProps, BottomSheetBodyProps, ActionSheetAction, ActionSheetProps, ActionSheetItemProps, PullToRefreshProps, SwipeActionSide, SwipeActionData, SwipeActionsProps, SwipeActionProps, FABSize, FABPosition, FABProps, FABAction, FABGroupProps } from './types/index.js';
+export type { ButtonProps, ButtonVariant, ButtonSize, TypographyProps, TypographyVariant, IconProps, IconSize, BadgeProps, BadgeVariant, LinkProps, InputSize, TextInputType, FormFieldProps, TextInputProps, TextareaProps, SelectOption, SelectProps, CheckboxProps, RadioProps, RadioGroupProps, SwitchProps, SearchInputProps, DatePickerProps, FileUploadProps, OTPInputProps, TimeFormat, TimePickerProps, RatingProps, ToggleGroupType, ToggleGroupOrientation, ToggleGroupProps, ToggleGroupItemProps, NumberInputProps, PaginationProps, TabsOrientation, TabsProps, TabListProps, TabTriggerProps, TabContentProps, MenuProps, MenuTriggerProps, MenuContentProps, MenuItemProps, MenuSeparatorProps, MenuSubProps, MenuSubTriggerProps, MenuSubContentProps, BreadcrumbItemData, BreadcrumbsProps, BreadcrumbItemProps, BottomNavItemData, BottomNavProps, BottomNavItemProps, NavItemProps, NavbarProps, SidebarItemData, SidebarProps, SidebarItemProps, SidebarGroupProps, StepperOrientation, StepperProps, StepperStepProps, AlertVariant, AlertProps, ToastVariant, ToastPosition, ToastData, ToastProps, ToastContainerProps, ModalSize, ModalProps, ModalHeaderProps, ModalBodyProps, ModalFooterProps, ProgressSize, ProgressBarProps, ProgressCircleProps, SpinnerProps, TooltipSide, TooltipProps, PopoverSide, PopoverProps, PopoverTriggerProps, PopoverContentProps, SkeletonVariant, SkeletonProps, StatusBannerStatus, StatusBannerPosition, StatusBannerProps, CardVariant, CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, FlipDirection, FlipTrigger, FlipCardProps, AvatarSize, AvatarShape, AvatarProps, AvatarGroupProps, TagVariant, TagSize, TagProps, ChipVariant, ChipColor, ChipSize, ChipProps, ChipGroupProps, EmptyStateSize, EmptyStateProps, PageHeaderProps, StatCircleColor, StatCircleSize, StatCircleProps, ListProps, ListItemProps, TableProps, TableHeadProps, TableHeaderAlign, TableHeaderSortDirection, TableHeaderProps, TableBodyProps, TableRowProps, TableCellAlign, TableCellProps, AccordionProps, AccordionItemProps, SliderProps, CarouselProps, CarouselSlideProps, ImageObjectFit, ImageRounded, ImageProps, StatusBadgeColor, StatusBadgeSize, StatusBadgeProps, StatsCardColor, StatsCardTrend, StatsCardProps, DataTableSortOrder, DataTableColumnAlign, DataTableColumn, DataTableProps, ContainerSize, ContainerProps, GridAlign, GridJustify, SpacingToken, GridProps, GridItemProps, StackDirection, StackProps, DividerOrientation, DividerProps, SpacerSize, SpacerProps, AspectRatioPreset, AspectRatioProps, CenterProps, BoxProps, SafeAreaEdge, SafeAreaProps, BottomSheetSnapPoint, BottomSheetProps, BottomSheetHeaderProps, BottomSheetBodyProps, ActionSheetAction, ActionSheetProps, ActionSheetItemProps, PullToRefreshProps, SwipeActionSide, SwipeActionData, SwipeActionsProps, SwipeActionProps, FABSize, FABPosition, FABProps, FABAction, FABGroupProps } from './types/index.js';

package/dist/index.js

@@ -58,17 +58,23 @@ export { ProgressBar, ProgressCircle, Spinner } from './components/Progress/inde
 export { Tooltip } from './components/Tooltip/index.js';
 export { Popover, PopoverTrigger, PopoverContent } from './components/Popover/index.js';
 export { Skeleton } from './components/Skeleton/index.js';
+export { StatusBanner } from './components/StatusBanner/index.js';
 // Data Display Components
-export { Card, CardHeader, CardBody, CardFooter } from './components/Card/index.js';
+export { Card, CardHeader, CardBody, CardFooter, FlipCard } from './components/Card/index.js';
 export { Avatar, AvatarGroup } from './components/Avatar/index.js';
 export { Tag } from './components/Tag/index.js';
 export { EmptyState } from './components/EmptyState/index.js';
+export { PageHeader } from './components/PageHeader/index.js';
 export { List, ListItem } from './components/List/index.js';
+export { StatCircle } from './components/StatCircle/index.js';
 export { Table, TableHead, TableHeader, TableBody, TableRow, TableCell } from './components/Table/index.js';
 export { Accordion, AccordionItem } from './components/Accordion/index.js';
 export { Slider } from './components/Slider/index.js';
 export { Carousel, CarouselSlide } from './components/Carousel/index.js';
 export { Image } from './components/Image/index.js';
+export { StatusBadge } from './components/StatusBadge/index.js';
+export { StatsCard } from './components/StatsCard/index.js';
+export { DataTable } from './components/DataTable/index.js';
 // Layout Components
 export { Container } from './components/Container/index.js';
 export { Grid } from './components/Grid/index.js';

package/dist/types/data-display.d.ts

@@ -13,6 +13,12 @@ export interface CardBodyProps {
 export interface CardFooterProps {
     class?: string;
 }
+export interface FlipCardProps {
+    flipped?: boolean;
+    class?: string;
+    front?: import('svelte').Snippet;
+    back?: import('svelte').Snippet;
+}
 export type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export type AvatarShape = 'circle' | 'square';
 export interface AvatarProps {
@@ -45,6 +51,24 @@ export interface EmptyStateProps {
     size?: EmptyStateSize;
     class?: string;
 }
+export interface PageHeaderProps {
+    greeting?: string;
+    userName: string;
+    avatarSrc?: string;
+    avatarInitials?: string;
+    class?: string;
+}
+export type StatCircleColor = 'default' | 'primary' | 'warning' | 'error' | 'success';
+export type StatCircleSize = 'sm' | 'md' | 'lg';
+export interface StatCircleProps {
+    value: number | string;
+    label: string;
+    color?: StatCircleColor;
+    size?: StatCircleSize;
+    clickable?: boolean;
+    class?: string;
+    onclick?: (event: MouseEvent) => void;
+}
 export interface ListProps {
     dividers?: boolean;
     class?: string;
@@ -159,3 +183,51 @@ export interface ImageProps {
     aspectRatio?: string;
     class?: string;
 }
+export type StatusBadgeColor = 'success' | 'warning' | 'error' | 'info' | 'default';
+export type StatusBadgeSize = 'sm' | 'md' | 'lg';
+export interface StatusBadgeProps {
+    status: string;
+    colorMap?: Record<string, StatusBadgeColor>;
+    size?: StatusBadgeSize;
+    dot?: boolean;
+    uppercase?: boolean;
+    class?: string;
+}
+export type StatsCardColor = 'default' | 'primary' | 'success' | 'warning' | 'error';
+export interface StatsCardTrend {
+    value: number;
+    direction: 'up' | 'down';
+}
+export interface StatsCardProps {
+    label: string;
+    value: number | string;
+    color?: StatsCardColor;
+    selected?: boolean;
+    onclick?: (event: MouseEvent) => void;
+    trend?: StatsCardTrend;
+    loading?: boolean;
+    class?: string;
+}
+export type DataTableSortOrder = 'asc' | 'desc';
+export type DataTableColumnAlign = 'left' | 'center' | 'right';
+export interface DataTableColumn {
+    key: string;
+    header: string;
+    sortable?: boolean;
+    width?: string;
+    align?: DataTableColumnAlign;
+    cell?: import('svelte').Snippet<[value: unknown, row: unknown]>;
+}
+export interface DataTableProps {
+    data: unknown[];
+    columns: DataTableColumn[];
+    sortBy?: string;
+    sortOrder?: DataTableSortOrder;
+    onsort?: (column: string, order: DataTableSortOrder) => void;
+    loading?: boolean;
+    loadingRows?: number;
+    rowHover?: boolean;
+    striped?: boolean;
+    stickyHeader?: boolean;
+    class?: string;
+}

package/dist/types/feedback.d.ts

@@ -90,3 +90,13 @@ export interface SkeletonProps {
     height?: string;
     class?: string;
 }
+export type StatusBannerStatus = 'online' | 'offline' | 'warning' | 'error' | 'reconnecting';
+export type StatusBannerPosition = 'fixed' | 'sticky' | 'static';
+export interface StatusBannerProps {
+    status: StatusBannerStatus;
+    message?: string;
+    description?: string;
+    dismissible?: boolean;
+    position?: StatusBannerPosition;
+    class?: string;
+}

package/dist/types/index.d.ts

@@ -127,8 +127,8 @@ export interface SwitchProps {
     class?: string;
 }
 export type { TabsOrientation, TabsProps, TabListProps, TabTriggerProps, TabContentProps, MenuProps, MenuTriggerProps, MenuContentProps, MenuItemProps, MenuSeparatorProps, MenuSubProps, MenuSubTriggerProps, MenuSubContentProps, BreadcrumbItemData, BreadcrumbsProps, BreadcrumbItemProps, BottomNavItemData, BottomNavProps, BottomNavItemProps, NavItemProps, NavbarProps, SidebarItemData, SidebarProps, SidebarItemProps, SidebarGroupProps, StepperOrientation, StepperProps, StepperStepProps } from './navigation.js';
-export type { AlertVariant, AlertProps, ToastVariant, ToastPosition, ToastData, ToastProps, ToastContainerProps, ModalSize, ModalProps, ModalHeaderProps, ModalBodyProps, ModalFooterProps, ProgressSize, ProgressBarProps, ProgressCircleProps, SpinnerProps, TooltipSide, TooltipProps, PopoverSide, PopoverProps, PopoverTriggerProps, PopoverContentProps, SkeletonVariant, SkeletonProps } from './feedback.js';
-export type { CardVariant, CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, AvatarSize, AvatarShape, AvatarProps, AvatarGroupProps, TagVariant, TagSize, TagProps, ChipVariant, ChipColor, ChipSize, ChipProps, ChipGroupProps, EmptyStateSize, EmptyStateProps, ListProps, ListItemProps, TableProps, TableHeadProps, TableHeaderAlign, TableHeaderSortDirection, TableHeaderProps, TableBodyProps, TableRowProps, TableCellAlign, TableCellProps, AccordionProps, AccordionItemProps, SliderProps, CarouselProps, CarouselSlideProps, ImageObjectFit, ImageRounded, ImageProps } from './data-display.js';
+export type { AlertVariant, AlertProps, ToastVariant, ToastPosition, ToastData, ToastProps, ToastContainerProps, ModalSize, ModalProps, ModalHeaderProps, ModalBodyProps, ModalFooterProps, ProgressSize, ProgressBarProps, ProgressCircleProps, SpinnerProps, TooltipSide, TooltipProps, PopoverSide, PopoverProps, PopoverTriggerProps, PopoverContentProps, SkeletonVariant, SkeletonProps, StatusBannerStatus, StatusBannerPosition, StatusBannerProps } from './feedback.js';
+export type { CardVariant, CardProps, CardHeaderProps, CardBodyProps, CardFooterProps, FlipCardProps, AvatarSize, AvatarShape, AvatarProps, AvatarGroupProps, TagVariant, TagSize, TagProps, ChipVariant, ChipColor, ChipSize, ChipProps, ChipGroupProps, EmptyStateSize, EmptyStateProps, PageHeaderProps, StatCircleColor, StatCircleSize, StatCircleProps, ListProps, ListItemProps, TableProps, TableHeadProps, TableHeaderAlign, TableHeaderSortDirection, TableHeaderProps, TableBodyProps, TableRowProps, TableCellAlign, TableCellProps, AccordionProps, AccordionItemProps, SliderProps, CarouselProps, CarouselSlideProps, ImageObjectFit, ImageRounded, ImageProps, StatusBadgeColor, StatusBadgeSize, StatusBadgeProps, StatsCardColor, StatsCardTrend, StatsCardProps, DataTableSortOrder, DataTableColumnAlign, DataTableColumn, DataTableProps } from './data-display.js';
 export type { ContainerSize, ContainerProps, GridAlign, GridJustify, SpacingToken, GridProps, GridItemProps, StackDirection, StackProps, DividerOrientation, DividerProps, SpacerSize, SpacerProps, AspectRatioPreset, AspectRatioProps, CenterProps, BoxProps } from './layout.js';
 export type { SafeAreaEdge, SafeAreaProps, BottomSheetSnapPoint, BottomSheetProps, BottomSheetHeaderProps, BottomSheetBodyProps, ActionSheetAction, ActionSheetProps, ActionSheetItemProps, PullToRefreshProps, SwipeActionSide, SwipeActionData, SwipeActionsProps, SwipeActionProps, FABSize, FABPosition, FABProps, FABAction, FABGroupProps } from './mobile.js';
 export type { SearchInputProps, DatePickerProps, FileUploadProps, OTPInputProps, TimeFormat, TimePickerProps, RatingProps, ToggleGroupType, ToggleGroupOrientation, ToggleGroupProps, ToggleGroupItemProps, NumberInputProps, PaginationProps } from './input.js';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@aspect-ops/exon-ui",
-	"version": "0.2.1",
+	"version": "0.2.2",
 	"description": "Reusable Svelte UI components for web and Capacitor mobile apps",
 	"author": "Exon Team",
 	"license": "MIT",
@@ -111,7 +111,8 @@
 		"vitest": "^2.0.0"
 	},
 	"dependencies": {
-		"bits-ui": "^1.0.0"
+		"bits-ui": "^1.0.0",
+		"lucide-svelte": "^0.562.0"
 	},
 	"publishConfig": {
 		"access": "public"