@arclux/arc-ui-react 2.9.0 → 2.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arclux/arc-ui-react",
-  "version": "2.9.0",
+  "version": "2.10.0",
   "description": "React wrappers for ARC UI Web Components.",
   "sideEffects": false,
   "type": "module",
@@ -54,7 +54,7 @@
   },
   "dependencies": {
     "@lit/react": "^1.0.8",
-    "@arclux/arc-ui": "2.9.0"
+    "@arclux/arc-ui": "2.10.0"
   },
   "license": "MIT",
   "keywords": [

package/src/content/Avatar.ts

@@ -8,7 +8,7 @@ export interface AvatarProps {
   src?: string;
   name?: string;
   size?: 'sm' | 'md' | 'lg';
-  shape?: 'square' | 'rounded';
+  shape?: 'circle' | 'square' | 'rounded';
   status?: 'online' | 'offline' | 'busy' | 'away';
   className?: string;
   children?: React.ReactNode;

package/src/content/AvatarGroup.ts

@@ -6,7 +6,7 @@ import { ArcAvatarGroup } from '@arclux/arc-ui/avatar-group';
 
 export interface AvatarGroupProps {
   max?: number;
-  overlap?: 'sm' | 'lg';
+  overlap?: 'sm' | 'md' | 'lg';
   className?: string;
   children?: React.ReactNode;
 }

package/src/content/Callout.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcCallout } from '@arclux/arc-ui/callout';
 
 export interface CalloutProps {
-  variant?: string;
+  variant?: 'info' | 'warning' | 'tip' | 'danger';
   dismissible?: boolean;
   className?: string;
   children?: React.ReactNode;

package/src/content/Card.ts

@@ -6,7 +6,7 @@ import { ArcCard } from '@arclux/arc-ui/card';
 
 export interface CardProps {
   href?: string;
-  padding?: 'none' | 'sm' | 'lg';
+  padding?: 'none' | 'sm' | 'md' | 'lg';
   interactive?: boolean;
   className?: string;
   children?: React.ReactNode;

package/src/content/Column.ts

@@ -5,6 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcColumn } from '@arclux/arc-ui/column';
 
 export interface ColumnProps {
+  field?: string;
   key?: string;
   label?: string;
   sortable?: boolean;

package/src/content/Image.ts

@@ -8,8 +8,8 @@ export interface ImageProps {
   src?: string;
   alt?: string;
   aspect?: '1/1' | '4/3' | '16/9' | '21/9' | '3/4' | '9/16';
-  fit?: 'contain' | 'fill' | 'none' | 'scale-down';
-  loading?: string;
+  fit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+  loading?: 'lazy' | 'eager';
   fallback?: string;
   className?: string;
   children?: React.ReactNode;

package/src/content/Marquee.ts

@@ -6,7 +6,7 @@ import { ArcMarquee } from '@arclux/arc-ui/marquee';
 
 export interface MarqueeProps {
   speed?: number;
-  direction?: string;
+  direction?: 'left' | 'right';
   pauseOnHover?: boolean;
   gap?: string;
   className?: string;

package/src/content/QrCode.ts

@@ -7,7 +7,7 @@ import { ArcQrCode } from '@arclux/arc-ui/qr-code';
 export interface QrCodeProps {
   value?: string;
   size?: number;
-  level?: string;
+  level?: 'L' | 'M' | 'Q' | 'H';
   label?: string;
   quietZone?: number;
   contrast?: boolean;

package/src/content/ScrollIndicator.ts

@@ -6,9 +6,9 @@ import { ArcScrollIndicator } from '@arclux/arc-ui/scroll-indicator';
 
 export interface ScrollIndicatorProps {
   target?: string;
-  position?: 'bottom';
+  position?: 'top' | 'bottom';
   size?: 'sm' | 'md' | 'lg';
-  color?: 'gradient';
+  color?: 'accent' | 'gradient';
   className?: string;
   children?: React.ReactNode;
 }

package/src/content/Separator.ts

@@ -5,9 +5,9 @@ import { createComponent } from '@lit/react';
 import { ArcSeparator } from '@arclux/arc-ui/separator';
 
 export interface SeparatorProps {
-  orientation?: 'vertical';
+  orientation?: 'horizontal' | 'vertical';
   label?: string;
-  variant?: 'dashed' | 'dotted' | 'fade';
+  variant?: 'line' | 'dashed' | 'dotted' | 'fade';
   className?: string;
   children?: React.ReactNode;
 }

package/src/content/Stack.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcStack } from '@arclux/arc-ui/stack';
 
 export interface StackProps {
-  direction?: 'horizontal' | 'vertical';
+  direction?: 'vertical' | 'horizontal';
   gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
   align?: 'start' | 'center' | 'end' | 'stretch';
   justify?: 'start' | 'center' | 'end' | 'between' | 'around';

package/src/data/AnimatedNumber.ts

@@ -7,7 +7,7 @@ import { ArcAnimatedNumber } from '@arclux/arc-ui/animated-number';
 export interface AnimatedNumberProps {
   value?: number;
   duration?: number;
-  format?: string;
+  format?: 'number' | 'currency' | 'percent';
   prefix?: string;
   suffix?: string;
   decimals?: number;

package/src/data/Badge.ts

@@ -5,8 +5,8 @@ import { createComponent } from '@lit/react';
 import { ArcBadge } from '@arclux/arc-ui/badge';
 
 export interface BadgeProps {
-  variant?: 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
-  size?: 'sm' | 'lg';
+  variant?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'info';
+  size?: 'sm' | 'md' | 'lg';
   color?: string;
   className?: string;
   children?: React.ReactNode;

package/src/data/Chart.ts

@@ -5,14 +5,14 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcChart } from '@arclux/arc-ui/chart';
 
 export interface ChartProps {
-  type?: string;
-  series?: unknown[];
-  labels?: unknown[];
+  type?: 'line' | 'area' | 'bar' | 'donut';
+  series?: Array<{label:string,data:number[]}>;
+  labels?: string[];
   stacked?: boolean;
   hideLegend?: boolean;
   hideAxis?: boolean;
   height?: number;
-  valueFormat?: string;
+  valueFormat?: 'number' | 'percent' | 'currency';
   currency?: string;
   className?: string;
   children?: React.ReactNode;

package/src/data/DataGrid.ts

@@ -5,9 +5,9 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcDataGrid } from '@arclux/arc-ui/data-grid';
 
 export interface DataGridProps {
-  columns?: unknown[];
-  rows?: unknown[];
-  sort?: unknown[];
+  columns?: Array<{key:string,label:string,sortable?:boolean,editable?:boolean,pinned?:boolean,width?:string,align?:string}>;
+  rows?: Array<Record<string, any>>;
+  sort?: Array<{key:string,direction:'asc'|'desc'}>;
   manualSort?: boolean;
   selectable?: boolean;
   virtual?: boolean;

package/src/data/DataTable.ts

@@ -5,11 +5,11 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcDataTable } from '@arclux/arc-ui/data-table';
 
 export interface DataTableProps {
-  rows?: unknown[];
+  rows?: Array<Record<string, any>>;
   sortable?: boolean;
   selectable?: boolean;
   sortColumn?: string;
-  sortDirection?: string;
+  sortDirection?: 'asc' | 'desc';
   virtual?: boolean;
   rowHeight?: number;
   className?: string;

package/src/data/Diff.ts

@@ -7,7 +7,7 @@ import { ArcDiff } from '@arclux/arc-ui/diff';
 export interface DiffProps {
   before?: string;
   after?: string;
-  mode?: 'side-by-side';
+  mode?: 'inline' | 'side-by-side';
   className?: string;
   children?: React.ReactNode;
 }

package/src/data/EventCalendar.ts

@@ -5,8 +5,8 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcEventCalendar } from '@arclux/arc-ui/event-calendar';
 
 export interface EventCalendarProps {
-  events?: unknown[];
-  view?: 'week';
+  events?: Array<{date:string,end?:string,label:string,color?:number}>;
+  view?: 'month' | 'week';
   date?: string;
   className?: string;
   children?: React.ReactNode;

package/src/data/Kanban.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcKanban } from '@arclux/arc-ui/kanban';
 
 export interface KanbanProps {
-  columns?: unknown[];
+  columns?: Array<{id:string,title?:string,limit?:number,items:Array<{id:string,label:string,description?:string,tag?:string,variant?:string}>}>;
   disabled?: boolean;
   className?: string;
   children?: React.ReactNode;

package/src/data/List.ts

@@ -5,8 +5,8 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcList } from '@arclux/arc-ui/list';
 
 export interface ListProps {
-  variant?: 'bordered' | 'separated';
-  size?: 'sm' | 'lg';
+  variant?: 'default' | 'bordered' | 'separated';
+  size?: 'sm' | 'md' | 'lg';
   selectable?: boolean;
   multiple?: boolean;
   value?: string;

package/src/data/Sparkline.ts

@@ -6,7 +6,7 @@ import { ArcSparkline } from '@arclux/arc-ui/sparkline';
 
 export interface SparklineProps {
   data?: string;
-  type?: string;
+  type?: 'line' | 'bar';
   color?: string;
   width?: number;
   height?: number;

package/src/data/Table.ts

@@ -5,8 +5,8 @@ import { createComponent } from '@lit/react';
 import { ArcTable } from '@arclux/arc-ui/table';
 
 export interface TableProps {
-  columns?: unknown[];
-  rows?: unknown[];
+  columns?: string[];
+  rows?: string[][];
   striped?: boolean;
   compact?: boolean;
   className?: string;

package/src/data/Tag.ts

@@ -5,8 +5,8 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcTag } from '@arclux/arc-ui/tag';
 
 export interface TagProps {
-  variant?: 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
-  size?: 'sm' | 'lg';
+  variant?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
+  size?: 'sm' | 'md' | 'lg';
   removable?: boolean;
   disabled?: boolean;
   color?: string;

package/src/feedback/Alert.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcAlert } from '@arclux/arc-ui/alert';
 
 export interface AlertProps {
-  variant?: string;
+  variant?: 'info' | 'success' | 'warning' | 'error';
   compact?: boolean;
   dismissible?: boolean;
   heading?: string;

package/src/feedback/Announcement.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcAnnouncement } from '@arclux/arc-ui/announcement';
 
 export interface AnnouncementProps {
-  politeness?: string;
+  politeness?: 'polite' | 'assertive';
   message?: string;
   className?: string;
   children?: React.ReactNode;

package/src/feedback/Banner.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcBanner } from '@arclux/arc-ui/banner';
 
 export interface BannerProps {
-  variant?: string;
+  variant?: 'info' | 'success' | 'warning' | 'error';
   dismissible?: boolean;
   sticky?: boolean;
   className?: string;

package/src/feedback/Confirm.ts

@@ -10,7 +10,7 @@ export interface ConfirmProps {
   message?: string;
   confirmLabel?: string;
   cancelLabel?: string;
-  variant?: string;
+  variant?: 'default' | 'danger';
   className?: string;
   children?: React.ReactNode;
   onArcConfirm?: (e: CustomEvent) => void;

package/src/feedback/Dialog.ts

@@ -10,7 +10,7 @@ export interface DialogProps {
   message?: string;
   confirmLabel?: string;
   cancelLabel?: string;
-  variant?: string;
+  variant?: 'default' | 'danger';
   className?: string;
   children?: React.ReactNode;
   onArcConfirm?: (e: CustomEvent) => void;

package/src/feedback/HoverCard.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcHoverCard } from '@arclux/arc-ui/hover-card';
 
 export interface HoverCardProps {
-  position?: string;
+  position?: 'bottom' | 'top' | 'left' | 'right';
   openDelay?: number;
   closeDelay?: number;
   className?: string;

package/src/feedback/InlineMessage.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcInlineMessage } from '@arclux/arc-ui/inline-message';
 
 export interface InlineMessageProps {
-  variant?: string;
+  variant?: 'info' | 'success' | 'warning' | 'error';
   className?: string;
   children?: React.ReactNode;
 }

package/src/feedback/NotificationPanel.ts

@@ -6,7 +6,7 @@ import { ArcNotificationPanel } from '@arclux/arc-ui/notification-panel';
 
 export interface NotificationPanelProps {
   open?: boolean;
-  position?: 'top-left' | 'top-right';
+  position?: 'top-right' | 'top-left';
   maxHeight?: string;
   className?: string;
   children?: React.ReactNode;

package/src/feedback/Popover.ts

@@ -6,7 +6,7 @@ import { ArcPopover } from '@arclux/arc-ui/popover';
 
 export interface PopoverProps {
   open?: boolean;
-  position?: string;
+  position?: 'top' | 'bottom' | 'left' | 'right';
   trigger?: string;
   className?: string;
   children?: React.ReactNode;

package/src/feedback/Progress.ts

@@ -6,7 +6,7 @@ import { ArcProgress } from '@arclux/arc-ui/progress';
 
 export interface ProgressProps {
   value?: number;
-  variant?: string;
+  variant?: 'bar' | 'spinner';
   size?: 'sm' | 'md' | 'lg';
   indeterminate?: boolean;
   showValue?: boolean;

package/src/feedback/ProgressToast.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcProgressToast } from '@arclux/arc-ui/progress-toast';
 
 export interface ProgressToastProps {
-  position?: 'bottom-right' | 'top-right';
+  position?: 'top-right' | 'bottom-right';
   className?: string;
   children?: React.ReactNode;
   onArcComplete?: (e: CustomEvent) => void;

package/src/feedback/ToastManager.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcToastManager } from '@arclux/arc-ui/toast-manager';
 
 export interface ToastManagerProps {
-  position?: string;
+  position?: 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
   duration?: number;
   maxVisible?: number;
   dedupe?: boolean;

package/src/input/Button.ts

@@ -10,7 +10,7 @@ export interface ButtonProps {
   href?: string;
   disabled?: boolean;
   loading?: boolean;
-  type?: string;
+  type?: 'button' | 'submit' | 'reset';
   className?: string;
   children?: React.ReactNode;
   onClick?: (e: Event) => void;

package/src/input/ButtonGroup.ts

@@ -5,8 +5,8 @@ import { createComponent } from '@lit/react';
 import { ArcButtonGroup } from '@arclux/arc-ui/button-group';
 
 export interface ButtonGroupProps {
-  orientation?: 'vertical';
-  size?: string;
+  orientation?: 'horizontal' | 'vertical';
+  size?: 'sm' | 'md' | 'lg';
   variant?: string;
   className?: string;
   children?: React.ReactNode;

package/src/input/Checkbox.ts

@@ -8,7 +8,7 @@ export interface CheckboxProps {
   checked?: boolean;
   indeterminate?: boolean;
   disabled?: boolean;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   label?: string;
   name?: string;
   value?: string;

package/src/input/ColorPicker.ts

@@ -7,7 +7,7 @@ import { ArcColorPicker } from '@arclux/arc-ui/color-picker';
 export interface ColorPickerProps {
   value?: string;
   name?: string;
-  presets?: unknown[];
+  presets?: string[];
   disabled?: boolean;
   label?: string;
   className?: string;

package/src/input/DateRangePicker.ts

@@ -11,7 +11,7 @@ export interface DateRangePickerProps {
   min?: string;
   max?: string;
   months?: number;
-  presets?: unknown[];
+  presets?: Array<{label:string,days:number}>;
   placeholder?: string;
   disabled?: boolean;
   required?: boolean;

package/src/input/Fieldset.ts

@@ -9,7 +9,7 @@ export interface FieldsetProps {
   description?: string;
   disabled?: boolean;
   error?: string;
-  variant?: 'card';
+  variant?: 'default' | 'card';
   className?: string;
   children?: React.ReactNode;
 }

package/src/input/Input.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcInput } from '@arclux/arc-ui/input';
 
 export interface InputProps {
-  type?: string;
+  type?: 'text' | 'email' | 'tel' | 'url' | 'password';
   name?: string;
   label?: string;
   placeholder?: string;
@@ -13,7 +13,7 @@ export interface InputProps {
   disabled?: boolean;
   required?: boolean;
   error?: string;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   multiline?: boolean;
   rows?: number;
   className?: string;

package/src/input/InputGroup.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcInputGroup } from '@arclux/arc-ui/input-group';
 
 export interface InputGroupProps {
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   className?: string;
   children?: React.ReactNode;
 }

package/src/input/Label.ts

@@ -7,7 +7,7 @@ import { ArcLabel } from '@arclux/arc-ui/label';
 export interface LabelProps {
   for?: string;
   required?: boolean;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   disabled?: boolean;
   className?: string;
   children?: React.ReactNode;

package/src/input/MultiSelect.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcMultiSelect } from '@arclux/arc-ui/multi-select';
 
 export interface MultiSelectProps {
-  value?: unknown[];
+  value?: string[];
   placeholder?: string;
   label?: string;
   name?: string;

package/src/input/OtpInput.ts

@@ -9,7 +9,7 @@ export interface OtpInputProps {
   value?: string;
   name?: string;
   disabled?: boolean;
-  type?: string;
+  type?: 'number' | 'text';
   className?: string;
   children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;

package/src/input/PasswordInput.ts

@@ -12,7 +12,7 @@ export interface PasswordInputProps {
   disabled?: boolean;
   required?: boolean;
   error?: string;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   autocomplete?: string;
   showStrength?: boolean;
   className?: string;

package/src/input/PinInput.ts

@@ -10,7 +10,7 @@ export interface PinInputProps {
   name?: string;
   disabled?: boolean;
   mask?: boolean;
-  type?: string;
+  type?: 'number' | 'alphanumeric' | 'text';
   separator?: number;
   label?: string;
   className?: string;

package/src/input/RadioGroup.ts

@@ -8,8 +8,8 @@ export interface RadioGroupProps {
   value?: string;
   name?: string;
   disabled?: boolean;
-  size?: 'sm' | 'lg';
-  orientation?: 'horizontal';
+  size?: 'sm' | 'md' | 'lg';
+  orientation?: 'vertical' | 'horizontal';
   className?: string;
   children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;

package/src/input/Select.ts

@@ -10,7 +10,7 @@ export interface SelectProps {
   label?: string;
   name?: string;
   disabled?: boolean;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   error?: string;
   open?: boolean;
   className?: string;

package/src/input/SwitchGroup.ts

@@ -6,8 +6,8 @@ import { ArcSwitchGroup } from '@arclux/arc-ui/switch-group';
 
 export interface SwitchGroupProps {
   label?: string;
-  orientation?: 'horizontal';
-  size?: string;
+  orientation?: 'vertical' | 'horizontal';
+  size?: 'sm' | 'md' | 'lg';
   disabled?: boolean;
   className?: string;
   children?: React.ReactNode;

package/src/input/TagInput.ts

@@ -5,8 +5,8 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcTagInput } from '@arclux/arc-ui/tag-input';
 
 export interface TagInputProps {
-  value?: unknown[];
-  suggestions?: unknown[];
+  value?: string[];
+  suggestions?: string[];
   delimiter?: string;
   maxTags?: number;
   allowCustom?: boolean;

package/src/input/Textarea.ts

@@ -13,7 +13,7 @@ export interface TextareaProps {
   disabled?: boolean;
   readonly?: boolean;
   resize?: 'none' | 'vertical' | 'horizontal' | 'both';
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   autoResize?: boolean;
   error?: string;
   className?: string;

package/src/input/ThemeToggle.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcThemeToggle } from '@arclux/arc-ui/theme-toggle';
 
 export interface ThemeToggleProps {
-  theme?: string;
+  theme?: 'dark' | 'light' | 'auto';
   disabled?: boolean;
   iconOnly?: boolean;
   className?: string;

package/src/input/Toggle.ts

@@ -7,7 +7,7 @@ import { ArcToggle } from '@arclux/arc-ui/toggle';
 export interface ToggleProps {
   checked?: boolean;
   disabled?: boolean;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   label?: string;
   name?: string;
   className?: string;

package/src/input/TransferList.ts

@@ -5,8 +5,8 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcTransferList } from '@arclux/arc-ui/transfer-list';
 
 export interface TransferListProps {
-  options?: unknown[];
-  value?: unknown[];
+  options?: Array<{value:string,label:string,disabled?:boolean}>;
+  value?: string[];
   name?: string;
   disabled?: boolean;
   searchable?: boolean;

package/src/layout/AspectGrid.ts

@@ -6,7 +6,7 @@ import { ArcAspectGrid } from '@arclux/arc-ui/aspect-grid';
 
 export interface AspectGridProps {
   columns?: number;
-  ratio?: string;
+  ratio?: '1/1' | '16/9' | '4/3';
   gap?: 'sm' | 'md' | 'lg';
   className?: string;
   children?: React.ReactNode;

package/src/layout/AuthShell.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcAuthShell } from '@arclux/arc-ui/auth-shell';
 
 export interface AuthShellProps {
-  variant?: string;
+  variant?: 'centered' | 'split';
   className?: string;
   children?: React.ReactNode;
 }

package/src/layout/Container.ts

@@ -7,7 +7,7 @@ import { ArcContainer } from '@arclux/arc-ui/container';
 export interface ContainerProps {
   narrow?: boolean;
   size?: 'sm' | 'md' | 'lg' | 'xl' | 'full';
-  padding?: 'none' | 'sm' | 'lg';
+  padding?: 'none' | 'sm' | 'md' | 'lg';
   className?: string;
   children?: React.ReactNode;
 }

package/src/layout/FloatBar.ts

@@ -6,7 +6,7 @@ import { ArcFloatBar } from '@arclux/arc-ui/float-bar';
 
 export interface FloatBarProps {
   open?: boolean;
-  position?: 'top';
+  position?: 'bottom' | 'top';
   className?: string;
   children?: React.ReactNode;
 }

package/src/layout/PageLayout.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcPageLayout } from '@arclux/arc-ui/page-layout';
 
 export interface PageLayoutProps {
-  layout?: 'centered' | 'wide' | 'sidebar-left' | 'sidebar-right';
+  layout?: 'sidebar-left' | 'sidebar-right' | 'centered' | 'wide';
   maxWidth?: string;
   gap?: string;
   className?: string;

package/src/layout/SettingsLayout.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcSettingsLayout } from '@arclux/arc-ui/settings-layout';
 
 export interface SettingsLayoutProps {
-  navPosition?: string;
+  navPosition?: 'left' | 'top';
   className?: string;
   children?: React.ReactNode;
 }

package/src/layout/SplitPane.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcSplitPane } from '@arclux/arc-ui/split-pane';
 
 export interface SplitPaneProps {
-  orientation?: 'vertical' | 'horizontal';
+  orientation?: 'horizontal' | 'vertical';
   ratio?: number;
   minRatio?: number;
   maxRatio?: number;

package/src/layout/StatusBar.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcStatusBar } from '@arclux/arc-ui/status-bar';
 
 export interface StatusBarProps {
-  position?: 'fixed';
+  position?: 'static' | 'fixed';
   className?: string;
   children?: React.ReactNode;
 }

package/src/layout/Toolbar.ts

@@ -6,7 +6,7 @@ import { ArcToolbar } from '@arclux/arc-ui/toolbar';
 
 export interface ToolbarProps {
   sticky?: boolean;
-  size?: 'sm';
+  size?: 'md' | 'sm';
   border?: boolean;
   overflow?: boolean;
   className?: string;

package/src/navigation/AnchorNav.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcAnchorNav } from '@arclux/arc-ui/anchor-nav';
 
 export interface AnchorNavProps {
-  orientation?: 'vertical';
+  orientation?: 'vertical' | 'horizontal';
   value?: string;
   items?: string;
   className?: string;

package/src/navigation/Footer.ts

@@ -8,7 +8,7 @@ export interface FooterProps {
   compact?: boolean;
   border?: boolean;
   contained?: string;
-  align?: 'center';
+  align?: 'left' | 'center';
   className?: string;
   children?: React.ReactNode;
 }

package/src/navigation/Link.ts

@@ -6,8 +6,8 @@ import { ArcLink } from '@arclux/arc-ui/link';
 
 export interface LinkProps {
   href?: string;
-  variant?: 'muted' | 'nav';
-  underline?: 'always' | 'never';
+  variant?: 'default' | 'muted' | 'nav';
+  underline?: 'hover' | 'always' | 'never';
   active?: boolean;
   external?: boolean;
   className?: string;

package/src/navigation/Menubar.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcMenubar } from '@arclux/arc-ui/menubar';
 
 export interface MenubarProps {
-  items?: unknown[];
+  items?: Array<{label:string,disabled?:boolean,items:Array<{label?:string,shortcut?:string,disabled?:boolean,divider?:boolean,items?:Array<{label:string,shortcut?:string,disabled?:boolean}>}>}>;
   className?: string;
   children?: React.ReactNode;
   onArcSelect?: (e: CustomEvent) => void;

package/src/navigation/NavItem.ts

@@ -7,7 +7,7 @@ import { ArcNavItem } from '@arclux/arc-ui/nav-item';
 export interface NavItemProps {
   href?: string;
   active?: boolean;
-  variant?: string;
+  variant?: 'default' | 'primary' | 'muted';
   description?: string;
   className?: string;
   children?: React.ReactNode;

package/src/navigation/Sidebar.ts

@@ -7,7 +7,7 @@ import { ArcSidebar } from '@arclux/arc-ui/sidebar';
 export interface SidebarProps {
   active?: string;
   collapsed?: boolean;
-  position?: 'right';
+  position?: 'left' | 'right';
   width?: string;
   glow?: boolean;
   label?: string;

package/src/navigation/SpeedDial.ts

@@ -6,7 +6,7 @@ import { ArcSpeedDial } from '@arclux/arc-ui/speed-dial';
 
 export interface SpeedDialProps {
   open?: boolean;
-  direction?: 'down' | 'left' | 'right';
+  direction?: 'up' | 'down' | 'left' | 'right';
   position?: 'bottom-right' | 'bottom-left';
   items?: string;
   className?: string;

package/src/navigation/StepperNav.ts

@@ -5,7 +5,7 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcStepperNav } from '@arclux/arc-ui/stepper-nav';
 
 export interface StepperNavProps {
-  steps?: string;
+  steps?: Array<string>;
   active?: number;
   linear?: boolean;
   className?: string;

package/src/navigation/Tabs.ts

@@ -6,9 +6,9 @@ import { ArcTabs } from '@arclux/arc-ui/tabs';
 
 export interface TabsProps {
   selected?: number;
-  align?: 'center' | 'end';
-  variant?: 'pills';
-  orientation?: 'vertical';
+  align?: 'start' | 'center' | 'end';
+  variant?: 'underline' | 'pills';
+  orientation?: 'horizontal' | 'vertical';
   className?: string;
   children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;

package/src/typography/Blockquote.ts

@@ -6,7 +6,7 @@ import { ArcBlockquote } from '@arclux/arc-ui/blockquote';
 
 export interface BlockquoteProps {
   cite?: string;
-  variant?: 'accent';
+  variant?: 'default' | 'accent';
   className?: string;
   children?: React.ReactNode;
 }

package/src/typography/CodeBlock.ts

@@ -8,7 +8,7 @@ export interface CodeBlockProps {
   language?: string;
   filename?: string;
   code?: string;
-  variant?: 'window' | 'basic';
+  variant?: 'default' | 'window' | 'basic';
   className?: string;
   children?: React.ReactNode;
 }

package/src/typography/GradientText.ts

@@ -5,7 +5,7 @@ import { createComponent } from '@lit/react';
 import { ArcGradientText } from '@arclux/arc-ui/gradient-text';
 
 export interface GradientTextProps {
-  variant?: 'accent' | 'display' | 'sunset' | 'ocean';
+  variant?: 'accent' | 'display' | 'sunset' | 'ocean' | 'custom';
   gradient?: string;
   animate?: boolean;
   className?: string;

package/src/typography/NumberFormat.ts

@@ -6,11 +6,11 @@ import { ArcNumberFormat } from '@arclux/arc-ui/number-format';
 
 export interface NumberFormatProps {
   value?: number;
-  type?: string;
+  type?: 'number' | 'currency' | 'percent' | 'compact';
   locale?: string;
   currency?: string;
   decimals?: number;
-  notation?: string;
+  notation?: 'standard' | 'compact';
   className?: string;
   children?: React.ReactNode;
 }

package/src/typography/Text.ts

@@ -5,8 +5,8 @@ import { createComponent } from '@lit/react';
 import { ArcText } from '@arclux/arc-ui/text';
 
 export interface TextProps {
-  variant?: 'accent' | 'code';
-  as?: string;
+  variant?: 'display' | 'heading' | 'body' | 'muted' | 'ghost' | 'accent' | 'label' | 'wordmark' | 'code';
+  as?: 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';
   className?: string;
   children?: React.ReactNode;
 }