@arclux/arc-ui-react 1.0.0

package/src/content/Meter.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 { ArcMeter } from '@arclux/arc-ui';
+
+export interface MeterProps {
+  value?: number;
+  min?: number;
+  max?: number;
+  low?: number;
+  high?: number;
+  optimum?: number;
+  label?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Meter = createComponent({
+  tagName: 'arc-meter',
+  elementClass: ArcMeter,
+  react: React,
+});

package/src/content/ScrollArea.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 { ArcScrollArea } from '@arclux/arc-ui';
+
+export interface ScrollAreaProps {
+  maxHeight?: string;
+  orientation?: 'vertical' | 'horizontal' | 'both';
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const ScrollArea = createComponent({
+  tagName: 'arc-scroll-area',
+  elementClass: ArcScrollArea,
+  react: React,
+});

package/src/content/Skeleton.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 { ArcSkeleton } from '@arclux/arc-ui';
+
+export interface SkeletonProps {
+  variant?: 'text' | 'circle' | 'rect';
+  width?: string;
+  height?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Skeleton = createComponent({
+  tagName: 'arc-skeleton',
+  elementClass: ArcSkeleton,
+  react: React,
+});

package/src/content/Spinner.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 { ArcSpinner } from '@arclux/arc-ui';
+
+export interface SpinnerProps {
+  size?: 'sm' | 'md' | 'lg';
+  variant?: 'primary' | 'secondary' | 'white';
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Spinner = createComponent({
+  tagName: 'arc-spinner',
+  elementClass: ArcSpinner,
+  react: React,
+});

package/src/content/Stack.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 { ArcStack } from '@arclux/arc-ui';
+
+export interface StackProps {
+  direction?: 'horizontal' | 'vertical';
+  gap?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+  align?: 'start' | 'center' | 'end' | 'stretch';
+  justify?: 'start' | 'center' | 'end' | 'between' | 'around';
+  wrap?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Stack = createComponent({
+  tagName: 'arc-stack',
+  elementClass: ArcStack,
+  react: React,
+});

package/src/content/Stat.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 { ArcStat } from '@arclux/arc-ui';
+
+export interface StatProps {
+  value?: string;
+  label?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Stat = createComponent({
+  tagName: 'arc-stat',
+  elementClass: ArcStat,
+  react: React,
+});

package/src/content/Step.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 { ArcStep } from '@arclux/arc-ui';
+
+export interface StepProps {
+  label?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Step = createComponent({
+  tagName: 'arc-step',
+  elementClass: ArcStep,
+  react: React,
+});

package/src/content/Stepper.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 { ArcStepper } from '@arclux/arc-ui';
+
+export interface StepperProps {
+  active?: number;
+  _steps?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Stepper = createComponent({
+  tagName: 'arc-stepper',
+  elementClass: ArcStepper,
+  react: React,
+});

package/src/content/Table.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 { ArcTable } from '@arclux/arc-ui';
+
+export interface TableProps {
+  columns?: unknown[];
+  rows?: unknown[];
+  striped?: boolean;
+  compact?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Table = createComponent({
+  tagName: 'arc-table',
+  elementClass: ArcTable,
+  react: React,
+});

package/src/content/Tag.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 { ArcTag } from '@arclux/arc-ui';
+
+export interface TagProps {
+  variant?: 'primary' | 'secondary' | 'success' | 'warning' | 'danger';
+  removable?: boolean;
+  disabled?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcRemove?: (e: CustomEvent) => void;
+}
+
+export const Tag = createComponent({
+  tagName: 'arc-tag',
+  elementClass: ArcTag,
+  react: React,
+  events: {
+    onArcRemove: 'arc-remove' as EventName<CustomEvent>,
+  },
+});

package/src/content/Text.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 { ArcText } from '@arclux/arc-ui';
+
+export interface TextProps {
+  variant?: 'accent' | 'code';
+  as?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Text = createComponent({
+  tagName: 'arc-text',
+  elementClass: ArcText,
+  react: React,
+});

package/src/content/Timeline.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 { ArcTimeline } from '@arclux/arc-ui';
+
+export interface TimelineProps {
+  _items?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Timeline = createComponent({
+  tagName: 'arc-timeline',
+  elementClass: ArcTimeline,
+  react: React,
+});

package/src/content/TimelineItem.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 { ArcTimelineItem } from '@arclux/arc-ui';
+
+export interface TimelineItemProps {
+  heading?: string;
+  date?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const TimelineItem = createComponent({
+  tagName: 'arc-timeline-item',
+  elementClass: ArcTimelineItem,
+  react: React,
+});

package/src/content/Truncate.ts

@@ -0,0 +1,22 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcTruncate } from '@arclux/arc-ui';
+
+export interface TruncateProps {
+  lines?: number;
+  expanded?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcToggle?: (e: CustomEvent) => void;
+}
+
+export const Truncate = createComponent({
+  tagName: 'arc-truncate',
+  elementClass: ArcTruncate,
+  react: React,
+  events: {
+    onArcToggle: 'arc-toggle' as EventName<CustomEvent>,
+  },
+});

package/src/content/ValueCard.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 { ArcValueCard } from '@arclux/arc-ui';
+
+export interface ValueCardProps {
+  icon?: string;
+  heading?: string;
+  description?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const ValueCard = createComponent({
+  tagName: 'arc-value-card',
+  elementClass: ArcValueCard,
+  react: React,
+});

package/src/content/index.ts

@@ -0,0 +1,119 @@
+// ARC UI React — Content tier
+// Static display components: cards, badges, text, tables, etc.
+
+export { Accordion } from './Accordion.js';
+export type { AccordionProps } from './Accordion.js';
+
+export { AccordionItem } from './AccordionItem.js';
+export type { AccordionItemProps } from './AccordionItem.js';
+
+export { AnimatedNumber } from './AnimatedNumber.js';
+export type { AnimatedNumberProps } from './AnimatedNumber.js';
+
+export { AspectRatio } from './AspectRatio.js';
+export type { AspectRatioProps } from './AspectRatio.js';
+
+export { Avatar } from './Avatar.js';
+export type { AvatarProps } from './Avatar.js';
+
+export { AvatarGroup } from './AvatarGroup.js';
+export type { AvatarGroupProps } from './AvatarGroup.js';
+
+export { Badge } from './Badge.js';
+export type { BadgeProps } from './Badge.js';
+
+export { Callout } from './Callout.js';
+export type { CalloutProps } from './Callout.js';
+
+export { Card } from './Card.js';
+export type { CardProps } from './Card.js';
+
+export { Carousel } from './Carousel.js';
+export type { CarouselProps } from './Carousel.js';
+
+export { CodeBlock } from './CodeBlock.js';
+export type { CodeBlockProps } from './CodeBlock.js';
+
+export { Collapsible } from './Collapsible.js';
+export type { CollapsibleProps } from './Collapsible.js';
+
+export { Column } from './Column.js';
+export type { ColumnProps } from './Column.js';
+
+export { ColorSwatch } from './ColorSwatch.js';
+export type { ColorSwatchProps } from './ColorSwatch.js';
+
+export { DataTable } from './DataTable.js';
+export type { DataTableProps } from './DataTable.js';
+
+export { Divider } from './Divider.js';
+export type { DividerProps } from './Divider.js';
+
+export { EmptyState } from './EmptyState.js';
+export type { EmptyStateProps } from './EmptyState.js';
+
+export { FeatureCard } from './FeatureCard.js';
+export type { FeatureCardProps } from './FeatureCard.js';
+
+export { Highlight } from './Highlight.js';
+export type { HighlightProps } from './Highlight.js';
+
+export { Icon } from './Icon.js';
+export type { IconProps } from './Icon.js';
+
+export { InfiniteScroll } from './InfiniteScroll.js';
+export type { InfiniteScrollProps } from './InfiniteScroll.js';
+
+export { Kbd } from './Kbd.js';
+export type { KbdProps } from './Kbd.js';
+
+export { Markdown } from './Markdown.js';
+export type { MarkdownProps } from './Markdown.js';
+
+export { Marquee } from './Marquee.js';
+export type { MarqueeProps } from './Marquee.js';
+
+export { Meter } from './Meter.js';
+export type { MeterProps } from './Meter.js';
+
+export { ScrollArea } from './ScrollArea.js';
+export type { ScrollAreaProps } from './ScrollArea.js';
+
+export { Skeleton } from './Skeleton.js';
+export type { SkeletonProps } from './Skeleton.js';
+
+export { Spinner } from './Spinner.js';
+export type { SpinnerProps } from './Spinner.js';
+
+export { Stack } from './Stack.js';
+export type { StackProps } from './Stack.js';
+
+export { Stat } from './Stat.js';
+export type { StatProps } from './Stat.js';
+
+export { Step } from './Step.js';
+export type { StepProps } from './Step.js';
+
+export { Stepper } from './Stepper.js';
+export type { StepperProps } from './Stepper.js';
+
+export { Table } from './Table.js';
+export type { TableProps } from './Table.js';
+
+export { Tag } from './Tag.js';
+export type { TagProps } from './Tag.js';
+
+export { Text } from './Text.js';
+export type { TextProps } from './Text.js';
+
+export { Timeline } from './Timeline.js';
+export type { TimelineProps } from './Timeline.js';
+
+export { TimelineItem } from './TimelineItem.js';
+export type { TimelineItemProps } from './TimelineItem.js';
+
+export { Truncate } from './Truncate.js';
+export type { TruncateProps } from './Truncate.js';
+
+export { ValueCard } from './ValueCard.js';
+export type { ValueCardProps } from './ValueCard.js';

package/src/create-component.ts

@@ -0,0 +1,6 @@
+/**
+ * Re-exports @lit/react createComponent.
+ * Individual wrappers import @lit/react directly — this file exists
+ * only for backwards compatibility with any external consumers.
+ */
+export { createComponent, type EventName } from '@lit/react';

package/src/feedback/Alert.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 { ArcAlert } from '@arclux/arc-ui';
+
+export interface AlertProps {
+  variant?: 'info' | 'success' | 'warning' | 'error';
+  dismissible?: boolean;
+  heading?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcDismiss?: (e: CustomEvent) => void;
+}
+
+export const Alert = createComponent({
+  tagName: 'arc-alert',
+  elementClass: ArcAlert,
+  react: React,
+  events: {
+    onArcDismiss: 'arc-dismiss' as EventName<CustomEvent>,
+  },
+});

package/src/feedback/CommandItem.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 { ArcCommandItem } from '@arclux/arc-ui';
+
+export interface CommandItemProps {
+  shortcut?: string;
+  icon?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const CommandItem = createComponent({
+  tagName: 'arc-command-item',
+  elementClass: ArcCommandItem,
+  react: React,
+});

package/src/feedback/CommandPalette.ts

@@ -0,0 +1,27 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcCommandPalette } from '@arclux/arc-ui';
+
+export interface CommandPaletteProps {
+  open?: boolean;
+  placeholder?: string;
+  _query?: string;
+  _focusedIndex?: string;
+  _items?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcSelect?: (e: CustomEvent) => void;
+  onArcClose?: (e: CustomEvent) => void;
+}
+
+export const CommandPalette = createComponent({
+  tagName: 'arc-command-palette',
+  elementClass: ArcCommandPalette,
+  react: React,
+  events: {
+    onArcSelect: 'arc-select' as EventName<CustomEvent>,
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+  },
+});

package/src/feedback/ContextMenu.ts

@@ -0,0 +1,31 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcContextMenu } from '@arclux/arc-ui';
+
+export interface ContextMenuProps {
+  open?: boolean;
+  _x?: string;
+  _y?: string;
+  _activeIndex?: string;
+  _children?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcOpen?: (e: CustomEvent) => void;
+  onArcClose?: (e: CustomEvent) => void;
+  onArcSelect?: (e: CustomEvent) => void;
+  onClick?: (e: Event) => void;
+}
+
+export const ContextMenu = createComponent({
+  tagName: 'arc-context-menu',
+  elementClass: ArcContextMenu,
+  react: React,
+  events: {
+    onArcOpen: 'arc-open' as EventName<CustomEvent>,
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+    onArcSelect: 'arc-select' as EventName<CustomEvent>,
+    onClick: 'click' as EventName<Event>,
+  },
+});

package/src/feedback/Dialog.ts

@@ -0,0 +1,28 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcDialog } from '@arclux/arc-ui';
+
+export interface DialogProps {
+  open?: boolean;
+  heading?: string;
+  message?: string;
+  variant?: 'danger';
+  className?: string;
+  children?: React.ReactNode;
+  onArcConfirm?: (e: CustomEvent) => void;
+  onArcCancel?: (e: CustomEvent) => void;
+  onClick?: (e: Event) => void;
+}
+
+export const Dialog = createComponent({
+  tagName: 'arc-dialog',
+  elementClass: ArcDialog,
+  react: React,
+  events: {
+    onArcConfirm: 'arc-confirm' as EventName<CustomEvent>,
+    onArcCancel: 'arc-cancel' as EventName<CustomEvent>,
+    onClick: 'click' as EventName<Event>,
+  },
+});

package/src/feedback/DropdownMenu.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 { ArcDropdownMenu } from '@arclux/arc-ui';
+
+export interface DropdownMenuProps {
+  open?: boolean;
+  _focusedIndex?: string;
+  _children?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcClose?: (e: CustomEvent) => void;
+  onArcSelect?: (e: CustomEvent) => void;
+}
+
+export const DropdownMenu = createComponent({
+  tagName: 'arc-dropdown-menu',
+  elementClass: ArcDropdownMenu,
+  react: React,
+  events: {
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+    onArcSelect: 'arc-select' as EventName<CustomEvent>,
+  },
+});

package/src/feedback/HoverCard.ts

@@ -0,0 +1,26 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcHoverCard } from '@arclux/arc-ui';
+
+export interface HoverCardProps {
+  position?: 'bottom' | 'top' | 'left' | 'right';
+  openDelay?: number;
+  closeDelay?: number;
+  _visible?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcOpen?: (e: CustomEvent) => void;
+  onArcClose?: (e: CustomEvent) => void;
+}
+
+export const HoverCard = createComponent({
+  tagName: 'arc-hover-card',
+  elementClass: ArcHoverCard,
+  react: React,
+  events: {
+    onArcOpen: 'arc-open' as EventName<CustomEvent>,
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+  },
+});

package/src/feedback/Modal.ts

@@ -0,0 +1,26 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import React from 'react';
+import { createComponent, type EventName } from '@lit/react';
+import { ArcModal } from '@arclux/arc-ui';
+
+export interface ModalProps {
+  open?: boolean;
+  heading?: string;
+  size?: 'sm' | 'md' | 'lg';
+  closable?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcClose?: (e: CustomEvent) => void;
+  onArcOpen?: (e: CustomEvent) => void;
+}
+
+export const Modal = createComponent({
+  tagName: 'arc-modal',
+  elementClass: ArcModal,
+  react: React,
+  events: {
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+    onArcOpen: 'arc-open' as EventName<CustomEvent>,
+  },
+});

package/src/feedback/NotificationPanel.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 { ArcNotificationPanel } from '@arclux/arc-ui';
+
+export interface NotificationPanelProps {
+  open?: boolean;
+  position?: string;
+  maxHeight?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcOpen?: (e: CustomEvent) => void;
+  onArcClose?: (e: CustomEvent) => void;
+}
+
+export const NotificationPanel = createComponent({
+  tagName: 'arc-notification-panel',
+  elementClass: ArcNotificationPanel,
+  react: React,
+  events: {
+    onArcOpen: 'arc-open' as EventName<CustomEvent>,
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+  },
+});