@arclux/arc-ui-angular 1.0.0

package/src/content/index.ts

@@ -0,0 +1,37 @@
+// Auto-generated by @arclux/prism — do not edit manually
+export { AvatarGroup } from './AvatarGroup.js';
+export { Badge } from './Badge.js';
+export { Callout } from './Callout.js';
+export { Card } from './Card.js';
+export { CodeBlock } from './CodeBlock.js';
+export { ColorSwatch } from './ColorSwatch.js';
+export { Divider } from './Divider.js';
+export { EmptyState } from './EmptyState.js';
+export { FeatureCard } from './FeatureCard.js';
+export { Icon } from './Icon.js';
+export { Kbd } from './Kbd.js';
+export { Link } from './Link.js';
+export { Skeleton } from './Skeleton.js';
+export { Spinner } from './Spinner.js';
+export { Step } from './Step.js';
+export { Stepper } from './Stepper.js';
+export { Table } from './Table.js';
+export { Text } from './Text.js';
+export { TimelineItem } from './TimelineItem.js';
+export { ValueCard } from './ValueCard.js';
+export { AnimatedNumber } from './AnimatedNumber.js';
+export { AspectRatio } from './AspectRatio.js';
+export { Highlight } from './Highlight.js';
+export { Markdown } from './Markdown.js';
+export { Marquee } from './Marquee.js';
+export { Meter } from './Meter.js';
+export { ScrollArea } from './ScrollArea.js';
+export { Stack } from './Stack.js';
+export { AccordionItem } from './AccordionItem.js';
+export { Carousel } from './Carousel.js';
+export { Collapsible } from './Collapsible.js';
+export { Column } from './Column.js';
+export { DataTable } from './DataTable.js';
+export { InfiniteScroll } from './InfiniteScroll.js';
+export { Tag } from './Tag.js';
+export { Truncate } from './Truncate.js';

package/src/feedback/Alert.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-alert',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-alert [attr.variant]="variant" [dismissible]="dismissible" [attr.heading]="heading" (arc-dismiss)="arcDismiss.emit($event)"><ng-content /></arc-alert>`,
+})
+export class Alert {
+  @Input() variant: 'info' | 'success' | 'warning' | 'error' = 'info';
+  @Input() dismissible: boolean = false;
+  @Input() heading: string = '';
+  @Output() arcDismiss = new EventEmitter<CustomEvent>();
+}

package/src/feedback/CommandItem.ts

@@ -0,0 +1,15 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-command-item',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-command-item [attr.shortcut]="shortcut" [attr.icon]="icon"><ng-content /></arc-command-item>`,
+})
+export class CommandItem {
+  @Input() shortcut: string = '';
+  @Input() icon: string = '';
+}

package/src/feedback/CommandPalette.ts

@@ -0,0 +1,20 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-command-palette',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-command-palette [open]="open" [attr.placeholder]="placeholder" [attr._query]="_query" [attr._focusedIndex]="_focusedIndex" [attr._items]="_items" (arc-select)="arcSelect.emit($event)" (arc-close)="arcClose.emit($event)"><ng-content /></arc-command-palette>`,
+})
+export class CommandPalette {
+  @Input() open: boolean = false;
+  @Input() placeholder: string = 'Type a command...';
+  @Input() _query: string = '';
+  @Input() _focusedIndex: string = 0;
+  @Input() _items: string = [];
+  @Output() arcSelect = new EventEmitter<CustomEvent>();
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+}

package/src/feedback/ContextMenu.ts

@@ -0,0 +1,21 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-context-menu',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-context-menu [open]="open" [attr._x]="_x" [attr._y]="_y" [attr._activeIndex]="_activeIndex" [attr._children]="_children" (arc-open)="arcOpen.emit($event)" (arc-close)="arcClose.emit($event)" (arc-select)="arcSelect.emit($event)"><ng-content /></arc-context-menu>`,
+})
+export class ContextMenu {
+  @Input() open: boolean = false;
+  @Input() _x: string = 0;
+  @Input() _y: string = 0;
+  @Input() _activeIndex: string = -1;
+  @Input() _children: string = [];
+  @Output() arcOpen = new EventEmitter<CustomEvent>();
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+  @Output() arcSelect = new EventEmitter<CustomEvent>();
+}

package/src/feedback/Dialog.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-dialog',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-dialog [open]="open" [attr.heading]="heading" [attr.message]="message" [attr.variant]="variant" (arc-confirm)="arcConfirm.emit($event)" (arc-cancel)="arcCancel.emit($event)"><ng-content /></arc-dialog>`,
+})
+export class Dialog {
+  @Input() open: boolean = false;
+  @Input() heading: string = '';
+  @Input() message: string = '';
+  @Input() variant: 'danger' = 'default';
+  @Output() arcConfirm = new EventEmitter<CustomEvent>();
+  @Output() arcCancel = new EventEmitter<CustomEvent>();
+}

package/src/feedback/DropdownMenu.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-dropdown-menu',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-dropdown-menu [open]="open" [attr._focusedIndex]="_focusedIndex" [attr._children]="_children" (arc-close)="arcClose.emit($event)" (arc-select)="arcSelect.emit($event)"><ng-content /></arc-dropdown-menu>`,
+})
+export class DropdownMenu {
+  @Input() open: boolean = false;
+  @Input() _focusedIndex: string = -1;
+  @Input() _children: string = [];
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+  @Output() arcSelect = new EventEmitter<CustomEvent>();
+}

package/src/feedback/HoverCard.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-hover-card',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-hover-card [attr.position]="position" [attr.openDelay]="openDelay" [attr.closeDelay]="closeDelay" [attr._visible]="_visible" (arc-open)="arcOpen.emit($event)" (arc-close)="arcClose.emit($event)"><ng-content /></arc-hover-card>`,
+})
+export class HoverCard {
+  @Input() position: 'bottom' | 'top' | 'left' | 'right' = 'bottom';
+  @Input() openDelay: number = 400;
+  @Input() closeDelay: number = 300;
+  @Input() _visible: string = false;
+  @Output() arcOpen = new EventEmitter<CustomEvent>();
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+}

package/src/feedback/Modal.ts

@@ -0,0 +1,19 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-modal',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-modal [open]="open" [attr.heading]="heading" [attr.size]="size" [closable]="closable" (arc-close)="arcClose.emit($event)" (arc-open)="arcOpen.emit($event)"><ng-content /></arc-modal>`,
+})
+export class Modal {
+  @Input() open: boolean = false;
+  @Input() heading: string = '';
+  @Input() size: 'sm' | 'md' | 'lg' = 'md';
+  @Input() closable: boolean = true;
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+  @Output() arcOpen = new EventEmitter<CustomEvent>();
+}

package/src/feedback/NotificationPanel.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-notification-panel',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-notification-panel [open]="open" [attr.position]="position" [attr.maxHeight]="maxHeight" (arc-open)="arcOpen.emit($event)" (arc-close)="arcClose.emit($event)"><ng-content /></arc-notification-panel>`,
+})
+export class NotificationPanel {
+  @Input() open: boolean = false;
+  @Input() position: string = 'top-right';
+  @Input() maxHeight: string = '400px';
+  @Output() arcOpen = new EventEmitter<CustomEvent>();
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+}

package/src/feedback/Popover.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-popover',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-popover [open]="open" [attr.position]="position" [attr.trigger]="trigger" (arc-close)="arcClose.emit($event)"><ng-content /></arc-popover>`,
+})
+export class Popover {
+  @Input() open: boolean = false;
+  @Input() position: 'bottom' | 'top' | 'left' | 'right' = 'bottom';
+  @Input() trigger: string = '';
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+}

package/src/feedback/Progress.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-progress',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-progress [attr.value]="value" [attr.variant]="variant" [attr.size]="size" [indeterminate]="indeterminate" [attr.label]="label"><ng-content /></arc-progress>`,
+})
+export class Progress {
+  @Input() value: number = 0;
+  @Input() variant: string = 'bar';
+  @Input() size: 'sm' | 'md' | 'lg' = 'md';
+  @Input() indeterminate: boolean = false;
+  @Input() label: string = '';
+}

package/src/feedback/Sheet.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-sheet',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-sheet [open]="open" [attr.side]="side" [attr.heading]="heading" (arc-close)="arcClose.emit($event)" (arc-open)="arcOpen.emit($event)"><ng-content /></arc-sheet>`,
+})
+export class Sheet {
+  @Input() open: boolean = false;
+  @Input() side: 'bottom' | 'right' = 'bottom';
+  @Input() heading: string = '';
+  @Output() arcClose = new EventEmitter<CustomEvent>();
+  @Output() arcOpen = new EventEmitter<CustomEvent>();
+}

package/src/feedback/Toast.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-toast',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-toast [attr.position]="position" [attr.duration]="duration" [attr._toasts]="_toasts" (arc-dismiss)="arcDismiss.emit($event)"><ng-content /></arc-toast>`,
+})
+export class Toast {
+  @Input() position: 'top-right' | 'top-left' | 'top-center' | 'bottom-right' | 'bottom-left' | 'bottom-center' = 'top-right';
+  @Input() duration: number = 4000;
+  @Input() _toasts: string = [];
+  @Output() arcDismiss = new EventEmitter<CustomEvent>();
+}

package/src/feedback/Tooltip.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-tooltip',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-tooltip [attr.content]="content" [attr.position]="position" [attr.delay]="delay" [attr._visible]="_visible"><ng-content /></arc-tooltip>`,
+})
+export class Tooltip {
+  @Input() content: string = '';
+  @Input() position: 'top' | 'bottom' | 'left' | 'right' = 'top';
+  @Input() delay: number = 200;
+  @Input() _visible: string = false;
+}

package/src/index.ts

@@ -0,0 +1,116 @@
+// Auto-generated by @arclux/prism — do not edit manually
+export { AvatarGroup } from './content/AvatarGroup.js';
+export { Avatar } from './content/Avatar.js';
+export { Badge } from './content/Badge.js';
+export { Callout } from './content/Callout.js';
+export { Card } from './content/Card.js';
+export { CodeBlock } from './content/CodeBlock.js';
+export { ColorSwatch } from './content/ColorSwatch.js';
+export { Divider } from './content/Divider.js';
+export { EmptyState } from './content/EmptyState.js';
+export { FeatureCard } from './content/FeatureCard.js';
+export { Icon } from './content/Icon.js';
+export { Kbd } from './content/Kbd.js';
+export { Link } from './content/Link.js';
+export { Skeleton } from './content/Skeleton.js';
+export { Spinner } from './content/Spinner.js';
+export { Stat } from './content/Stat.js';
+export { Step } from './content/Step.js';
+export { Stepper } from './content/Stepper.js';
+export { Table } from './content/Table.js';
+export { Text } from './content/Text.js';
+export { TimelineItem } from './content/TimelineItem.js';
+export { Timeline } from './content/Timeline.js';
+export { ValueCard } from './content/ValueCard.js';
+export { AccordionItem } from './reactive/AccordionItem.js';
+export { Accordion } from './reactive/Accordion.js';
+export { Alert } from './reactive/Alert.js';
+export { Button } from './reactive/Button.js';
+export { Calendar } from './reactive/Calendar.js';
+export { Checkbox } from './reactive/Checkbox.js';
+export { Column } from './reactive/Column.js';
+export { Combobox } from './reactive/Combobox.js';
+export { CommandItem } from './reactive/CommandItem.js';
+export { CommandPalette } from './reactive/CommandPalette.js';
+export { ContextMenu } from './reactive/ContextMenu.js';
+export { CopyButton } from './reactive/CopyButton.js';
+export { DataTable } from './reactive/DataTable.js';
+export { DatePicker } from './reactive/DatePicker.js';
+export { Drawer } from './reactive/Drawer.js';
+export { DropdownMenu } from './reactive/DropdownMenu.js';
+export { FileUpload } from './reactive/FileUpload.js';
+export { Form } from './reactive/Form.js';
+export { HoverCard } from './reactive/HoverCard.js';
+export { IconButton } from './reactive/IconButton.js';
+export { Input } from './reactive/Input.js';
+export { Modal } from './reactive/Modal.js';
+export { MultiSelect } from './reactive/MultiSelect.js';
+export { Pagination } from './reactive/Pagination.js';
+export { Popover } from './reactive/Popover.js';
+export { Progress } from './reactive/Progress.js';
+export { RadioGroup } from './reactive/RadioGroup.js';
+export { Radio } from './reactive/Radio.js';
+export { Search } from './reactive/Search.js';
+export { Select } from './reactive/Select.js';
+export { Slider } from './reactive/Slider.js';
+export { Suggestion } from './reactive/Suggestion.js';
+export { Tab } from './reactive/Tab.js';
+export { Tabs } from './reactive/Tabs.js';
+export { Tag } from './reactive/Tag.js';
+export { Textarea } from './reactive/Textarea.js';
+export { ThemeToggle } from './reactive/ThemeToggle.js';
+export { Toast } from './reactive/Toast.js';
+export { Toggle } from './reactive/Toggle.js';
+export { Tooltip } from './reactive/Tooltip.js';
+export { TreeItem } from './reactive/TreeItem.js';
+export { TreeView } from './reactive/TreeView.js';
+export { AppShell } from './application/AppShell.js';
+export { AuthShell } from './application/AuthShell.js';
+export { BreadcrumbItem } from './application/BreadcrumbItem.js';
+export { Breadcrumb } from './application/Breadcrumb.js';
+export { Container } from './application/Container.js';
+export { DashboardGrid } from './application/DashboardGrid.js';
+export { Footer } from './application/Footer.js';
+export { NavItem } from './application/NavItem.js';
+export { NavigationMenu } from './application/NavigationMenu.js';
+export { NotificationPanel } from './application/NotificationPanel.js';
+export { PageHeader } from './application/PageHeader.js';
+export { PageLayout } from './application/PageLayout.js';
+export { Resizable } from './application/Resizable.js';
+export { ScrollSpy } from './application/ScrollSpy.js';
+export { Section } from './application/Section.js';
+export { SettingsLayout } from './application/SettingsLayout.js';
+export { SidebarLink } from './application/SidebarLink.js';
+export { SidebarSection } from './application/SidebarSection.js';
+export { Sidebar } from './application/Sidebar.js';
+export { SplitPane } from './application/SplitPane.js';
+export { SpyLink } from './application/SpyLink.js';
+export { StatusBar } from './application/StatusBar.js';
+export { Toolbar } from './application/Toolbar.js';
+export { TopBar } from './application/TopBar.js';
+export { AnimatedNumber } from './content/AnimatedNumber.js';
+export { AspectRatio } from './content/AspectRatio.js';
+export { Highlight } from './content/Highlight.js';
+export { Markdown } from './content/Markdown.js';
+export { Marquee } from './content/Marquee.js';
+export { Meter } from './content/Meter.js';
+export { ScrollArea } from './content/ScrollArea.js';
+export { Stack } from './content/Stack.js';
+export { Carousel } from './reactive/Carousel.js';
+export { Chip } from './reactive/Chip.js';
+export { Collapsible } from './reactive/Collapsible.js';
+export { ColorPicker } from './reactive/ColorPicker.js';
+export { Dialog } from './reactive/Dialog.js';
+export { InfiniteScroll } from './reactive/InfiniteScroll.js';
+export { NumberInput } from './reactive/NumberInput.js';
+export { OtpInput } from './reactive/OtpInput.js';
+export { PinInput } from './reactive/PinInput.js';
+export { Rating } from './reactive/Rating.js';
+export { ScrollToTop } from './reactive/ScrollToTop.js';
+export { SegmentedControl } from './reactive/SegmentedControl.js';
+export { Sheet } from './reactive/Sheet.js';
+export { SortableList } from './reactive/SortableList.js';
+export { Truncate } from './reactive/Truncate.js';
+export { MenuDivider } from './shared/MenuDivider.js';
+export { MenuItem } from './shared/MenuItem.js';
+export { Option } from './shared/Option.js';

package/src/input/Button.ts

@@ -0,0 +1,18 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-button',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-button [attr.variant]="variant" [attr.size]="size" [attr.href]="href" [disabled]="disabled" [attr.type]="type"><ng-content /></arc-button>`,
+})
+export class Button {
+  @Input() variant: 'primary' | 'secondary' | 'ghost' = 'primary';
+  @Input() size: 'sm' | 'md' | 'lg' = 'md';
+  @Input() href: string = '';
+  @Input() disabled: boolean = false;
+  @Input() type: string = 'button';
+}

package/src/input/Calendar.ts

@@ -0,0 +1,21 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-calendar',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-calendar [attr.value]="value" [attr.min]="min" [attr.max]="max" [attr.month]="month" [attr.year]="year" [attr._focusedDay]="_focusedDay" (arc-navigate)="arcNavigate.emit($event)" (arc-change)="arcChange.emit($event)"><ng-content /></arc-calendar>`,
+})
+export class Calendar {
+  @Input() value: string = '';
+  @Input() min: string = '';
+  @Input() max: string = '';
+  @Input() month: number = 'now.getMonth()';
+  @Input() year: number = 'now.getFullYear()';
+  @Input() _focusedDay: string = 'null';
+  @Output() arcNavigate = new EventEmitter<CustomEvent>();
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+}

package/src/input/Checkbox.ts

@@ -0,0 +1,20 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-checkbox',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-checkbox [checked]="checked" [indeterminate]="indeterminate" [disabled]="disabled" [attr.label]="label" [attr.name]="name" [attr.value]="value" (arc-change)="arcChange.emit($event)"><ng-content /></arc-checkbox>`,
+})
+export class Checkbox {
+  @Input() checked: boolean = false;
+  @Input() indeterminate: boolean = false;
+  @Input() disabled: boolean = false;
+  @Input() label: string = '';
+  @Input() name: string = '';
+  @Input() value: string = '';
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+}

package/src/input/Chip.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-chip',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-chip [selected]="selected" [disabled]="disabled" [attr.value]="value" (arc-change)="arcChange.emit($event)"><ng-content /></arc-chip>`,
+})
+export class Chip {
+  @Input() selected: boolean = false;
+  @Input() disabled: boolean = false;
+  @Input() value: string = '';
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+}

package/src/input/ColorPicker.ts

@@ -0,0 +1,24 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-color-picker',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-color-picker [attr.value]="value" [attr.presets]="presets" [disabled]="disabled" [attr.label]="label" [attr._hue]="_hue" [attr._sat]="_sat" [attr._lit]="_lit" [attr._hexInput]="_hexInput" [attr._draggingArea]="_draggingArea" [attr._draggingHue]="_draggingHue" (arc-change)="arcChange.emit($event)"><ng-content /></arc-color-picker>`,
+})
+export class ColorPicker {
+  @Input() value: string = '#4d7ef7';
+  @Input() presets: unknown[] = [];
+  @Input() disabled: boolean = false;
+  @Input() label: string = '';
+  @Input() _hue: string = 225;
+  @Input() _sat: string = 92;
+  @Input() _lit: string = 64;
+  @Input() _hexInput: string = '#4d7ef7';
+  @Input() _draggingArea: string = false;
+  @Input() _draggingHue: string = false;
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+}

package/src/input/Combobox.ts

@@ -0,0 +1,22 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-combobox',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-combobox [attr.value]="value" [attr.placeholder]="placeholder" [attr.label]="label" [disabled]="disabled" [attr._query]="_query" [attr._open]="_open" [attr._activeIndex]="_activeIndex" [attr._options]="_options" (arc-change)="arcChange.emit($event)"><ng-content /></arc-combobox>`,
+})
+export class Combobox {
+  @Input() value: string = '';
+  @Input() placeholder: string = '';
+  @Input() label: string = '';
+  @Input() disabled: boolean = false;
+  @Input() _query: string = '';
+  @Input() _open: string = false;
+  @Input() _activeIndex: string = -1;
+  @Input() _options: string = [];
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+}

package/src/input/CopyButton.ts

@@ -0,0 +1,17 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-copy-button',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-copy-button [attr.value]="value" [disabled]="disabled" [attr._copied]="_copied" (arc-copy)="arcCopy.emit($event)"><ng-content /></arc-copy-button>`,
+})
+export class CopyButton {
+  @Input() value: string = '';
+  @Input() disabled: boolean = false;
+  @Input() _copied: string = false;
+  @Output() arcCopy = new EventEmitter<CustomEvent>();
+}

package/src/input/DatePicker.ts

@@ -0,0 +1,24 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-date-picker',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-date-picker [attr.value]="value" [attr.min]="min" [attr.max]="max" [attr.placeholder]="placeholder" [disabled]="disabled" [attr.label]="label" [attr._open]="_open" [attr._viewMonth]="_viewMonth" [attr._viewYear]="_viewYear" [attr._mode]="_mode" (arc-change)="arcChange.emit($event)"><ng-content /></arc-date-picker>`,
+})
+export class DatePicker {
+  @Input() value: string = '';
+  @Input() min: string = '';
+  @Input() max: string = '';
+  @Input() placeholder: string = 'Select date';
+  @Input() disabled: boolean = false;
+  @Input() label: string = '';
+  @Input() _open: string = false;
+  @Input() _viewMonth: string = 'today.getMonth()';
+  @Input() _viewYear: string = 'today.getFullYear()';
+  @Input() _mode: string = 'days';
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+}

package/src/input/FileUpload.ts

@@ -0,0 +1,22 @@
+// Auto-generated by @arclux/prism — do not edit manually
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA, Input, Output, EventEmitter } from '@angular/core';
+import '@arclux/arc-ui';
+
+@Component({
+  selector: 'arc-file-upload',
+  standalone: true,
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  template: `<arc-file-upload [attr.accept]="accept" [multiple]="multiple" [attr.maxSize]="maxSize" [disabled]="disabled" [attr._files]="_files" [attr._dragOver]="_dragOver" [attr._error]="_error" (arc-change)="arcChange.emit($event)" (arc-remove)="arcRemove.emit($event)"><ng-content /></arc-file-upload>`,
+})
+export class FileUpload {
+  @Input() accept: string = '';
+  @Input() multiple: boolean = false;
+  @Input() maxSize: number = 0;
+  @Input() disabled: boolean = false;
+  @Input() _files: string = [];
+  @Input() _dragOver: string = false;
+  @Input() _error: string = '';
+  @Output() arcChange = new EventEmitter<CustomEvent>();
+  @Output() arcRemove = new EventEmitter<CustomEvent>();
+}