@arclux/arc-ui-react 2.9.0 → 2.11.0

package/src/feedback/ProgressToast.ts

@@ -5,9 +5,8 @@ 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;
   onArcCancel?: (e: CustomEvent) => void;
 }

package/src/feedback/Snackbar.ts

@@ -8,7 +8,6 @@ export interface SnackbarProps {
   position?: 'bottom-center' | 'bottom-left' | 'bottom-right';
   duration?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcAction?: (e: CustomEvent) => void;
   onArcDismiss?: (e: CustomEvent) => void;
 }

package/src/feedback/Spotlight.ts

@@ -9,7 +9,6 @@ export interface SpotlightProps {
   active?: boolean;
   padding?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcDismiss?: (e: CustomEvent) => void;
 }
 

package/src/feedback/Toast.ts

@@ -8,7 +8,6 @@ export interface ToastProps {
   position?: 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center';
   duration?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcDismiss?: (e: CustomEvent) => void;
 }
 

package/src/feedback/ToastManager.ts

@@ -5,13 +5,12 @@ 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;
   queueLimit?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcQueueOverflow?: (e: CustomEvent) => void;
   onArcDismiss?: (e: CustomEvent) => void;
   onArcQueueChange?: (e: CustomEvent) => void;

package/src/input/Button.ts

@@ -10,9 +10,8 @@ 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/Calendar.ts

@@ -11,7 +11,6 @@ export interface CalendarProps {
   month?: number;
   year?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcNavigate?: (e: CustomEvent) => void;
   onArcChange?: (e: CustomEvent) => void;
   onClick?: (e: Event) => void;

package/src/input/Checkbox.ts

@@ -8,12 +8,11 @@ export interface CheckboxProps {
   checked?: boolean;
   indeterminate?: boolean;
   disabled?: boolean;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   label?: string;
   name?: string;
   value?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

package/src/input/ColorPicker.ts

@@ -7,11 +7,10 @@ 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;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

package/src/input/CopyButton.ts

@@ -8,7 +8,6 @@ export interface CopyButtonProps {
   value?: string;
   disabled?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcCopy?: (e: CustomEvent) => void;
   onClick?: (e: Event) => void;
 }

package/src/input/DatePicker.ts

@@ -13,7 +13,6 @@ export interface DatePickerProps {
   disabled?: boolean;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

package/src/input/DateRangePicker.ts

@@ -11,13 +11,12 @@ export interface DateRangePickerProps {
   min?: string;
   max?: string;
   months?: number;
-  presets?: unknown[];
+  presets?: Array<{label:string,days:number}>;
   placeholder?: string;
   disabled?: boolean;
   required?: boolean;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

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/FileUpload.ts

@@ -10,7 +10,6 @@ export interface FileUploadProps {
   maxSize?: number;
   disabled?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onArcRemove?: (e: CustomEvent) => void;
 }

package/src/input/ImageCropper.ts

@@ -10,7 +10,6 @@ export interface ImageCropperProps {
   aspect?: number;
   zoom?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcCropChange?: (e: CustomEvent) => void;
 }
 

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,11 +13,10 @@ export interface InputProps {
   disabled?: boolean;
   required?: boolean;
   error?: string;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   multiline?: boolean;
   rows?: number;
   className?: string;
-  children?: React.ReactNode;
   onArcInput?: (e: CustomEvent) => void;
   onArcChange?: (e: CustomEvent) => void;
 }

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,13 +5,12 @@ 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;
   disabled?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onClick?: (e: Event) => void;
 }

package/src/input/NumberInput.ts

@@ -13,7 +13,6 @@ export interface NumberInputProps {
   name?: string;
   disabled?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onClick?: (e: Event) => void;
 }

package/src/input/OtpInput.ts

@@ -9,9 +9,8 @@ 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,11 +12,10 @@ export interface PasswordInputProps {
   disabled?: boolean;
   required?: boolean;
   error?: string;
-  size?: 'sm' | 'lg';
+  size?: 'sm' | 'md' | 'lg';
   autocomplete?: string;
   showStrength?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcStrengthChange?: (e: CustomEvent) => void;
   onArcInput?: (e: CustomEvent) => void;
   onArcChange?: (e: CustomEvent) => void;

package/src/input/PinInput.ts

@@ -10,11 +10,10 @@ export interface PinInputProps {
   name?: string;
   disabled?: boolean;
   mask?: boolean;
-  type?: string;
+  type?: 'number' | 'alphanumeric' | 'text';
   separator?: number;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onArcComplete?: (e: CustomEvent) => void;
 }

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/RangeSlider.ts

@@ -15,7 +15,6 @@ export interface RangeSliderProps {
   label?: string;
   showValues?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcInput?: (e: CustomEvent) => void;
   onArcChange?: (e: CustomEvent) => void;
 }

package/src/input/Rating.ts

@@ -11,7 +11,6 @@ export interface RatingProps {
   disabled?: boolean;
   readonly?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

package/src/input/SegmentedControl.ts

@@ -8,7 +8,6 @@ export interface SegmentedControlProps {
   value?: string;
   disabled?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onClick?: (e: Event) => 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/Slider.ts

@@ -13,7 +13,6 @@ export interface SliderProps {
   disabled?: boolean;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcInput?: (e: CustomEvent) => void;
   onArcChange?: (e: CustomEvent) => void;
 }

package/src/input/SortableList.ts

@@ -7,7 +7,6 @@ import { ArcSortableList } from '@arclux/arc-ui/sortable-list';
 export interface SortableListProps {
   disabled?: boolean;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

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;
@@ -16,7 +16,6 @@ export interface TagInputProps {
   disabled?: boolean;
   error?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onArcInput?: (e: CustomEvent) => void;
 }

package/src/input/Textarea.ts

@@ -13,11 +13,10 @@ 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;
-  children?: React.ReactNode;
   onArcInput?: (e: CustomEvent) => void;
   onArcChange?: (e: CustomEvent) => void;
 }

package/src/input/ThemeToggle.ts

@@ -5,11 +5,10 @@ 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;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onClick?: (e: Event) => void;
 }

package/src/input/TimePicker.ts

@@ -15,7 +15,6 @@ export interface TimePickerProps {
   disabled?: boolean;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
   onClick?: (e: Event) => void;
 }

package/src/input/Toggle.ts

@@ -7,11 +7,10 @@ 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;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

package/src/input/TransferList.ts

@@ -5,15 +5,14 @@ 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;
   sourceLabel?: string;
   targetLabel?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

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,12 +5,11 @@ 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;
   className?: string;
-  children?: React.ReactNode;
   onArcResize?: (e: CustomEvent) => void;
 }
 

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/BottomNav.ts

@@ -8,7 +8,6 @@ export interface BottomNavProps {
   items?: string;
   value?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcChange?: (e: CustomEvent) => void;
 }
 

package/src/navigation/Breadcrumb.ts

@@ -8,7 +8,6 @@ export interface BreadcrumbProps {
   separator?: string;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcNavigate?: (e: CustomEvent) => void;
 }
 

package/src/navigation/BreadcrumbMenu.ts

@@ -8,7 +8,6 @@ export interface BreadcrumbMenuProps {
   items?: string;
   label?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcNavigate?: (e: CustomEvent) => void;
 }
 

package/src/navigation/CommandBar.ts

@@ -9,7 +9,6 @@ export interface CommandBarProps {
   value?: string;
   icon?: string;
   className?: string;
-  children?: React.ReactNode;
   onArcInput?: (e: CustomEvent) => void;
   onArcSubmit?: (e: CustomEvent) => void;
 }

package/src/navigation/Footer.ts

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

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,9 +5,8 @@ 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;
   onClick?: (e: Event) => void;
 }