@arclux/arc-ui-react 1.0.0

package/src/input/index.ts

@@ -0,0 +1,86 @@
+// ARC UI React — Input tier
+// Form controls and interactive input components
+
+export { Button } from './Button.js';
+export type { ButtonProps } from './Button.js';
+
+export { Calendar } from './Calendar.js';
+export type { CalendarProps } from './Calendar.js';
+
+export { Checkbox } from './Checkbox.js';
+export type { CheckboxProps } from './Checkbox.js';
+
+export { Chip } from './Chip.js';
+export type { ChipProps } from './Chip.js';
+
+export { ColorPicker } from './ColorPicker.js';
+export type { ColorPickerProps } from './ColorPicker.js';
+
+export { Combobox } from './Combobox.js';
+export type { ComboboxProps } from './Combobox.js';
+
+export { CopyButton } from './CopyButton.js';
+export type { CopyButtonProps } from './CopyButton.js';
+
+export { DatePicker } from './DatePicker.js';
+export type { DatePickerProps } from './DatePicker.js';
+
+export { FileUpload } from './FileUpload.js';
+export type { FileUploadProps } from './FileUpload.js';
+
+export { Form } from './Form.js';
+export type { FormProps } from './Form.js';
+
+export { IconButton } from './IconButton.js';
+export type { IconButtonProps } from './IconButton.js';
+
+export { Input } from './Input.js';
+export type { InputProps } from './Input.js';
+
+export { MultiSelect } from './MultiSelect.js';
+export type { MultiSelectProps } from './MultiSelect.js';
+
+export { NumberInput } from './NumberInput.js';
+export type { NumberInputProps } from './NumberInput.js';
+
+export { OtpInput } from './OtpInput.js';
+export type { OtpInputProps } from './OtpInput.js';
+
+export { PinInput } from './PinInput.js';
+export type { PinInputProps } from './PinInput.js';
+
+export { Radio } from './Radio.js';
+export type { RadioProps } from './Radio.js';
+
+export { RadioGroup } from './RadioGroup.js';
+export type { RadioGroupProps } from './RadioGroup.js';
+
+export { Rating } from './Rating.js';
+export type { RatingProps } from './Rating.js';
+
+export { Search } from './Search.js';
+export type { SearchProps } from './Search.js';
+
+export { SegmentedControl } from './SegmentedControl.js';
+export type { SegmentedControlProps } from './SegmentedControl.js';
+
+export { Select } from './Select.js';
+export type { SelectProps } from './Select.js';
+
+export { Slider } from './Slider.js';
+export type { SliderProps } from './Slider.js';
+
+export { SortableList } from './SortableList.js';
+export type { SortableListProps } from './SortableList.js';
+
+export { Suggestion } from './Suggestion.js';
+export type { SuggestionProps } from './Suggestion.js';
+
+export { Textarea } from './Textarea.js';
+export type { TextareaProps } from './Textarea.js';
+
+export { ThemeToggle } from './ThemeToggle.js';
+export type { ThemeToggleProps } from './ThemeToggle.js';
+
+export { Toggle } from './Toggle.js';
+export type { ToggleProps } from './Toggle.js';

package/src/layout/AppShell.ts

@@ -0,0 +1,20 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcAppShell } from '@arclux/arc-ui';
+
+export interface AppShellProps {
+  sidebarOpen?: boolean;
+  breakpoint?: number;
+  _mobile?: string;
+  _hasToc?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const AppShell = createComponent({
+  tagName: 'arc-app-shell',
+  elementClass: ArcAppShell,
+  react: React,
+});

package/src/layout/AuthShell.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcAuthShell } from '@arclux/arc-ui';
+
+export interface AuthShellProps {
+  variant?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const AuthShell = createComponent({
+  tagName: 'arc-auth-shell',
+  elementClass: ArcAuthShell,
+  react: React,
+});

package/src/layout/Container.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcContainer } from '@arclux/arc-ui';
+
+export interface ContainerProps {
+  narrow?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Container = createComponent({
+  tagName: 'arc-container',
+  elementClass: ArcContainer,
+  react: React,
+});

package/src/layout/DashboardGrid.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcDashboardGrid } from '@arclux/arc-ui';
+
+export interface DashboardGridProps {
+  columns?: number;
+  gap?: string;
+  minColumnWidth?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const DashboardGrid = createComponent({
+  tagName: 'arc-dashboard-grid',
+  elementClass: ArcDashboardGrid,
+  react: React,
+});

package/src/layout/PageHeader.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcPageHeader } from '@arclux/arc-ui';
+
+export interface PageHeaderProps {
+  heading?: string;
+  description?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const PageHeader = createComponent({
+  tagName: 'arc-page-header',
+  elementClass: ArcPageHeader,
+  react: React,
+});

package/src/layout/PageLayout.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcPageLayout } from '@arclux/arc-ui';
+
+export interface PageLayoutProps {
+  layout?: string;
+  maxWidth?: string;
+  gap?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const PageLayout = createComponent({
+  tagName: 'arc-page-layout',
+  elementClass: ArcPageLayout,
+  react: React,
+});

package/src/layout/Resizable.ts

@@ -0,0 +1,25 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcResizable } from '@arclux/arc-ui';
+
+export interface ResizableProps {
+  direction?: 'horizontal' | 'vertical';
+  minSize?: number;
+  maxSize?: number;
+  size?: number;
+  _dragging?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcResize?: (e: CustomEvent) => void;
+}
+
+export const Resizable = createComponent({
+  tagName: 'arc-resizable',
+  elementClass: ArcResizable,
+  react: React,
+  events: {
+    onArcResize: 'arc-resize' as EventName<CustomEvent>,
+  },
+});

package/src/layout/Section.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcSection } from '@arclux/arc-ui';
+
+export interface SectionProps {
+  label?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Section = createComponent({
+  tagName: 'arc-section',
+  elementClass: ArcSection,
+  react: React,
+});

package/src/layout/SettingsLayout.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcSettingsLayout } from '@arclux/arc-ui';
+
+export interface SettingsLayoutProps {
+  navPosition?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const SettingsLayout = createComponent({
+  tagName: 'arc-settings-layout',
+  elementClass: ArcSettingsLayout,
+  react: React,
+});

package/src/layout/SplitPane.ts

@@ -0,0 +1,24 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcSplitPane } from '@arclux/arc-ui';
+
+export interface SplitPaneProps {
+  orientation?: string;
+  ratio?: number;
+  minRatio?: number;
+  maxRatio?: number;
+  className?: string;
+  children?: React.ReactNode;
+  onArcResize?: (e: CustomEvent) => void;
+}
+
+export const SplitPane = createComponent({
+  tagName: 'arc-split-pane',
+  elementClass: ArcSplitPane,
+  react: React,
+  events: {
+    onArcResize: 'arc-resize' as EventName<CustomEvent>,
+  },
+});

package/src/layout/StatusBar.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcStatusBar } from '@arclux/arc-ui';
+
+export interface StatusBarProps {
+  position?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const StatusBar = createComponent({
+  tagName: 'arc-status-bar',
+  elementClass: ArcStatusBar,
+  react: React,
+});

package/src/layout/Toolbar.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcToolbar } from '@arclux/arc-ui';
+
+export interface ToolbarProps {
+  sticky?: boolean;
+  size?: string;
+  border?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Toolbar = createComponent({
+  tagName: 'arc-toolbar',
+  elementClass: ArcToolbar,
+  react: React,
+});

package/src/layout/index.ts

@@ -0,0 +1,38 @@
+// ARC UI React — Layout tier
+// App shells, containers, and structural layout components
+
+export { AppShell } from './AppShell.js';
+export type { AppShellProps } from './AppShell.js';
+
+export { AuthShell } from './AuthShell.js';
+export type { AuthShellProps } from './AuthShell.js';
+
+export { Container } from './Container.js';
+export type { ContainerProps } from './Container.js';
+
+export { DashboardGrid } from './DashboardGrid.js';
+export type { DashboardGridProps } from './DashboardGrid.js';
+
+export { PageHeader } from './PageHeader.js';
+export type { PageHeaderProps } from './PageHeader.js';
+
+export { PageLayout } from './PageLayout.js';
+export type { PageLayoutProps } from './PageLayout.js';
+
+export { Resizable } from './Resizable.js';
+export type { ResizableProps } from './Resizable.js';
+
+export { Section } from './Section.js';
+export type { SectionProps } from './Section.js';
+
+export { SettingsLayout } from './SettingsLayout.js';
+export type { SettingsLayoutProps } from './SettingsLayout.js';
+
+export { SplitPane } from './SplitPane.js';
+export type { SplitPaneProps } from './SplitPane.js';
+
+export { StatusBar } from './StatusBar.js';
+export type { StatusBarProps } from './StatusBar.js';
+
+export { Toolbar } from './Toolbar.js';
+export type { ToolbarProps } from './Toolbar.js';

package/src/navigation/Breadcrumb.ts

@@ -0,0 +1,21 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcBreadcrumb } from '@arclux/arc-ui';
+
+export interface BreadcrumbProps {
+  _items?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcNavigate?: (e: CustomEvent) => void;
+}
+
+export const Breadcrumb = createComponent({
+  tagName: 'arc-breadcrumb',
+  elementClass: ArcBreadcrumb,
+  react: React,
+  events: {
+    onArcNavigate: 'arc-navigate' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/BreadcrumbItem.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcBreadcrumbItem } from '@arclux/arc-ui';
+
+export interface BreadcrumbItemProps {
+  href?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const BreadcrumbItem = createComponent({
+  tagName: 'arc-breadcrumb-item',
+  elementClass: ArcBreadcrumbItem,
+  react: React,
+});

package/src/navigation/Drawer.ts

@@ -0,0 +1,25 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcDrawer } from '@arclux/arc-ui';
+
+export interface DrawerProps {
+  open?: boolean;
+  position?: 'left' | 'right';
+  heading?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcClose?: (e: CustomEvent) => void;
+  onClick?: (e: Event) => void;
+}
+
+export const Drawer = createComponent({
+  tagName: 'arc-drawer',
+  elementClass: ArcDrawer,
+  react: React,
+  events: {
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+    onClick: 'click' as EventName<Event>,
+  },
+});

package/src/navigation/Footer.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcFooter } from '@arclux/arc-ui';
+
+export interface FooterProps {
+  compact?: boolean;
+  border?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Footer = createComponent({
+  tagName: 'arc-footer',
+  elementClass: ArcFooter,
+  react: React,
+});

package/src/navigation/Link.ts

@@ -0,0 +1,20 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcLink } from '@arclux/arc-ui';
+
+export interface LinkProps {
+  href?: string;
+  variant?: 'muted' | 'nav';
+  active?: boolean;
+  external?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Link = createComponent({
+  tagName: 'arc-link',
+  elementClass: ArcLink,
+  react: React,
+});

package/src/navigation/NavItem.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcNavItem } from '@arclux/arc-ui';
+
+export interface NavItemProps {
+  href?: string;
+  active?: boolean;
+  description?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const NavItem = createComponent({
+  tagName: 'arc-nav-item',
+  elementClass: ArcNavItem,
+  react: React,
+});

package/src/navigation/NavigationMenu.ts

@@ -0,0 +1,25 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcNavigationMenu } from '@arclux/arc-ui';
+
+export interface NavigationMenuProps {
+  _items?: string;
+  _openIndex?: string;
+  _mobileOpen?: string;
+  _mobileClosing?: string;
+  _mobileExpandedIndex?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcMobileMenuToggle?: (e: CustomEvent) => void;
+}
+
+export const NavigationMenu = createComponent({
+  tagName: 'arc-navigation-menu',
+  elementClass: ArcNavigationMenu,
+  react: React,
+  events: {
+    onArcMobileMenuToggle: 'arc-mobile-menu-toggle' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/Pagination.ts

@@ -0,0 +1,25 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcPagination } from '@arclux/arc-ui';
+
+export interface PaginationProps {
+  total?: number;
+  current?: number;
+  siblings?: number;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+  onClick?: (e: Event) => void;
+}
+
+export const Pagination = createComponent({
+  tagName: 'arc-pagination',
+  elementClass: ArcPagination,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+    onClick: 'click' as EventName<Event>,
+  },
+});

package/src/navigation/ScrollSpy.ts

@@ -0,0 +1,24 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcScrollSpy } from '@arclux/arc-ui';
+
+export interface ScrollSpyProps {
+  active?: string;
+  offset?: number;
+  _active?: string;
+  _links?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+}
+
+export const ScrollSpy = createComponent({
+  tagName: 'arc-scroll-spy',
+  elementClass: ArcScrollSpy,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/ScrollToTop.ts

@@ -0,0 +1,25 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcScrollToTop } from '@arclux/arc-ui';
+
+export interface ScrollToTopProps {
+  threshold?: number;
+  smooth?: boolean;
+  position?: 'bottom-right' | 'bottom-left';
+  offset?: string;
+  _visible?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onClick?: (e: Event) => void;
+}
+
+export const ScrollToTop = createComponent({
+  tagName: 'arc-scroll-to-top',
+  elementClass: ArcScrollToTop,
+  react: React,
+  events: {
+    onClick: 'click' as EventName<Event>,
+  },
+});

package/src/navigation/Sidebar.ts

@@ -0,0 +1,21 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcSidebar } from '@arclux/arc-ui';
+
+export interface SidebarProps {
+  active?: string;
+  collapsed?: boolean;
+  width?: string;
+  glow?: boolean;
+  _sections?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Sidebar = createComponent({
+  tagName: 'arc-sidebar',
+  elementClass: ArcSidebar,
+  react: React,
+});

package/src/navigation/SidebarLink.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcSidebarLink } from '@arclux/arc-ui';
+
+export interface SidebarLinkProps {
+  href?: string;
+  active?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const SidebarLink = createComponent({
+  tagName: 'arc-sidebar-link',
+  elementClass: ArcSidebarLink,
+  react: React,
+});

package/src/navigation/SidebarSection.ts

@@ -0,0 +1,23 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcSidebarSection } from '@arclux/arc-ui';
+
+export interface SidebarSectionProps {
+  heading?: string;
+  collapsible?: boolean;
+  open?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcToggle?: (e: CustomEvent) => void;
+}
+
+export const SidebarSection = createComponent({
+  tagName: 'arc-sidebar-section',
+  elementClass: ArcSidebarSection,
+  react: React,
+  events: {
+    onArcToggle: 'arc-toggle' as EventName<CustomEvent>,
+  },
+});