@arclux/arc-ui-react 1.9.2 → 1.10.1

package/src/layout/Sticky.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 { ArcSticky } from '@arclux/arc-ui';
+
+export interface StickyProps {
+  offset?: string;
+  stuck?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcStuck?: (e: CustomEvent) => void;
+}
+
+export const Sticky = createComponent({
+  tagName: 'arc-sticky',
+  elementClass: ArcSticky,
+  react: React,
+  events: {
+    onArcStuck: 'arc-stuck' as EventName<CustomEvent>,
+  },
+});

package/src/layout/index.ts

@@ -36,3 +36,30 @@ export type { StatusBarProps } from './StatusBar.js';
 
 export { Toolbar } from './Toolbar.js';
 export type { ToolbarProps } from './Toolbar.js';
+
+export { AspectGrid } from './AspectGrid.js';
+export type { AspectGridProps } from './AspectGrid.js';
+
+export { Center } from './Center.js';
+export type { CenterProps } from './Center.js';
+
+export { Cluster } from './Cluster.js';
+export type { ClusterProps } from './Cluster.js';
+
+export { Dock } from './Dock.js';
+export type { DockProps } from './Dock.js';
+
+export { FloatBar } from './FloatBar.js';
+export type { FloatBarProps } from './FloatBar.js';
+
+export { Inset } from './Inset.js';
+export type { InsetProps } from './Inset.js';
+
+export { Masonry } from './Masonry.js';
+export type { MasonryProps } from './Masonry.js';
+
+export { ResponsiveSwitcher } from './ResponsiveSwitcher.js';
+export type { ResponsiveSwitcherProps } from './ResponsiveSwitcher.js';
+
+export { Sticky } from './Sticky.js';
+export type { StickyProps } from './Sticky.js';

package/src/navigation/AnchorNav.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 { ArcAnchorNav } from '@arclux/arc-ui';
+
+export interface AnchorNavProps {
+  orientation?: 'vertical';
+  value?: string;
+  items?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+}
+
+export const AnchorNav = createComponent({
+  tagName: 'arc-anchor-nav',
+  elementClass: ArcAnchorNav,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/BottomNav.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 { ArcBottomNav } from '@arclux/arc-ui';
+
+export interface BottomNavProps {
+  items?: string;
+  value?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+}
+
+export const BottomNav = createComponent({
+  tagName: 'arc-bottom-nav',
+  elementClass: ArcBottomNav,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/BreadcrumbMenu.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 { ArcBreadcrumbMenu } from '@arclux/arc-ui';
+
+export interface BreadcrumbMenuProps {
+  items?: string;
+  _openIndex?: number;
+  className?: string;
+  children?: React.ReactNode;
+  onArcNavigate?: (e: CustomEvent) => void;
+}
+
+export const BreadcrumbMenu = createComponent({
+  tagName: 'arc-breadcrumb-menu',
+  elementClass: ArcBreadcrumbMenu,
+  react: React,
+  events: {
+    onArcNavigate: 'arc-navigate' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/CommandBar.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 { ArcCommandBar } from '@arclux/arc-ui';
+
+export interface CommandBarProps {
+  placeholder?: string;
+  value?: string;
+  icon?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcInput?: (e: CustomEvent) => void;
+  onArcSubmit?: (e: CustomEvent) => void;
+}
+
+export const CommandBar = createComponent({
+  tagName: 'arc-command-bar',
+  elementClass: ArcCommandBar,
+  react: React,
+  events: {
+    onArcInput: 'arc-input' as EventName<CustomEvent>,
+    onArcSubmit: 'arc-submit' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/Drawer.ts

@@ -11,7 +11,6 @@ export interface DrawerProps {
   className?: string;
   children?: React.ReactNode;
   onArcClose?: (e: CustomEvent) => void;
-  onClick?: (e: Event) => void;
 }
 
 export const Drawer = createComponent({
@@ -20,6 +19,5 @@ export const Drawer = createComponent({
   react: React,
   events: {
     onArcClose: 'arc-close' as EventName<CustomEvent>,
-    onClick: 'click' as EventName<Event>,
   },
 });

package/src/navigation/PageIndicator.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 { ArcPageIndicator } from '@arclux/arc-ui';
+
+export interface PageIndicatorProps {
+  count?: number;
+  value?: number;
+  clickable?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+}
+
+export const PageIndicator = createComponent({
+  tagName: 'arc-page-indicator',
+  elementClass: ArcPageIndicator,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/Rail.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 { ArcRail } from '@arclux/arc-ui';
+
+export interface RailProps {
+  items?: string;
+  value?: string;
+  expanded?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+}
+
+export const Rail = createComponent({
+  tagName: 'arc-rail',
+  elementClass: ArcRail,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/SkipLink.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 { ArcSkipLink } from '@arclux/arc-ui';
+
+export interface SkipLinkProps {
+  target?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const SkipLink = createComponent({
+  tagName: 'arc-skip-link',
+  elementClass: ArcSkipLink,
+  react: React,
+});

package/src/navigation/SpeedDial.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 { ArcSpeedDial } from '@arclux/arc-ui';
+
+export interface SpeedDialProps {
+  open?: boolean;
+  direction?: 'down' | 'left' | 'right';
+  position?: 'bottom-right' | 'bottom-left';
+  items?: string;
+  className?: string;
+  children?: React.ReactNode;
+  onArcAction?: (e: CustomEvent) => void;
+  onArcClose?: (e: CustomEvent) => void;
+}
+
+export const SpeedDial = createComponent({
+  tagName: 'arc-speed-dial',
+  elementClass: ArcSpeedDial,
+  react: React,
+  events: {
+    onArcAction: 'arc-action' as EventName<CustomEvent>,
+    onArcClose: 'arc-close' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/StepperNav.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 { ArcStepperNav } from '@arclux/arc-ui';
+
+export interface StepperNavProps {
+  steps?: string;
+  active?: number;
+  linear?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+  onArcChange?: (e: CustomEvent) => void;
+  onArcComplete?: (e: CustomEvent) => void;
+}
+
+export const StepperNav = createComponent({
+  tagName: 'arc-stepper-nav',
+  elementClass: ArcStepperNav,
+  react: React,
+  events: {
+    onArcChange: 'arc-change' as EventName<CustomEvent>,
+    onArcComplete: 'arc-complete' as EventName<CustomEvent>,
+  },
+});

package/src/navigation/Tabs.ts

@@ -5,7 +5,6 @@ import { createComponent, type EventName } from '@lit/react';
 import { ArcTabs } from '@arclux/arc-ui';
 
 export interface TabsProps {
-  items?: unknown[];
   selected?: number;
   align?: 'center' | 'end';
   variant?: 'pills';

package/src/navigation/index.ts

@@ -57,3 +57,30 @@ export type { TreeItemProps } from './TreeItem.js';
 
 export { TreeView } from './TreeView.js';
 export type { TreeViewProps } from './TreeView.js';
+
+export { AnchorNav } from './AnchorNav.js';
+export type { AnchorNavProps } from './AnchorNav.js';
+
+export { BottomNav } from './BottomNav.js';
+export type { BottomNavProps } from './BottomNav.js';
+
+export { BreadcrumbMenu } from './BreadcrumbMenu.js';
+export type { BreadcrumbMenuProps } from './BreadcrumbMenu.js';
+
+export { CommandBar } from './CommandBar.js';
+export type { CommandBarProps } from './CommandBar.js';
+
+export { PageIndicator } from './PageIndicator.js';
+export type { PageIndicatorProps } from './PageIndicator.js';
+
+export { Rail } from './Rail.js';
+export type { RailProps } from './Rail.js';
+
+export { SkipLink } from './SkipLink.js';
+export type { SkipLinkProps } from './SkipLink.js';
+
+export { SpeedDial } from './SpeedDial.js';
+export type { SpeedDialProps } from './SpeedDial.js';
+
+export { StepperNav } from './StepperNav.js';
+export type { StepperNavProps } from './StepperNav.js';

package/src/typography/CodeBlock.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 { ArcCodeBlock } from '@arclux/arc-ui';
+
+export interface CodeBlockProps {
+  language?: string;
+  filename?: string;
+  code?: string;
+  variant?: 'window' | 'basic';
+  _highlightedHtml?: string;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const CodeBlock = createComponent({
+  tagName: 'arc-code-block',
+  elementClass: ArcCodeBlock,
+  react: React,
+});

package/src/typography/Highlight.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 { ArcHighlight } from '@arclux/arc-ui';
+
+export interface HighlightProps {
+  text?: string;
+  query?: string;
+  caseSensitive?: boolean;
+  className?: string;
+  children?: React.ReactNode;
+}
+
+export const Highlight = createComponent({
+  tagName: 'arc-highlight',
+  elementClass: ArcHighlight,
+  react: React,
+});

package/src/typography/Kbd.ts

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

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

package/src/typography/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/typography/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>,
+  },
+});