entangle-ui 0.8.1 → 0.9.0

package/dist/types/components/Icons/ChevronLeftIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Chevron Left icon component for backward navigation and collapse.
+ *
+ * A subtle leftward chevron commonly used for previous-page navigation,
+ * collapsing side panels, and breadcrumb separators.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <ChevronLeftIcon />
+ *
+ * // With custom size and color
+ * <ChevronLeftIcon size="sm" color="muted" />
+ *
+ * // In a sidebar collapse button
+ * <IconButton icon={<ChevronLeftIcon />} label="Collapse sidebar" />
+ * ```
+ */
+declare const ChevronLeftIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { ChevronLeftIcon };

package/dist/types/components/Icons/ChevronRightIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Chevron Right icon component for forward navigation and expand.
+ *
+ * A subtle rightward chevron commonly used for next-page navigation,
+ * expanding side panels, and disclosure indicators.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <ChevronRightIcon />
+ *
+ * // With custom size and color
+ * <ChevronRightIcon size="sm" color="muted" />
+ *
+ * // In a sidebar expand button
+ * <IconButton icon={<ChevronRightIcon />} label="Expand sidebar" />
+ * ```
+ */
+declare const ChevronRightIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { ChevronRightIcon };

package/dist/types/components/Icons/CloudUploadIcon.d.ts

@@ -0,0 +1,27 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Cloud upload icon — a cloud silhouette with an upward arrow inside.
+ *
+ * Use for file-upload drop zones, "send to cloud" actions, and any other
+ * upload-to-remote affordance. For a generic up-arrow without the cloud,
+ * use `UploadIcon` instead.
+ *
+ * @example
+ * ```tsx
+ * <CloudUploadIcon size="lg" color="muted" />
+ * ```
+ */
+declare const CloudUploadIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { CloudUploadIcon };

package/dist/types/components/Icons/DotsHorizontalIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Dots Horizontal icon component for inline overflow menus.
+ *
+ * Three dots arranged horizontally, commonly used as a more-actions
+ * affordance in toolbars, card headers, and badge ends.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <DotsHorizontalIcon />
+ *
+ * // With custom size and color
+ * <DotsHorizontalIcon size="sm" color="muted" />
+ *
+ * // As an overflow menu trigger
+ * <IconButton icon={<DotsHorizontalIcon />} label="More" />
+ * ```
+ */
+declare const DotsHorizontalIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { DotsHorizontalIcon };

package/dist/types/components/Icons/DotsVerticalIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Dots Vertical icon component for contextual action menus.
+ *
+ * Three dots stacked vertically, typically used as the trigger
+ * for item-level action menus on cards, list rows, and table cells.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <DotsVerticalIcon />
+ *
+ * // With custom size and color
+ * <DotsVerticalIcon size="sm" color="muted" />
+ *
+ * // As a menu trigger
+ * <IconButton icon={<DotsVerticalIcon />} label="Actions" />
+ * ```
+ */
+declare const DotsVerticalIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { DotsVerticalIcon };

package/dist/types/components/Icons/ExternalLinkIcon.d.ts

@@ -0,0 +1,29 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * External link icon — a box with an arrow exiting the top-right corner.
+ *
+ * Use for links that open in a new tab/window or otherwise navigate
+ * outside the current surface. For an in-app link (chain shape) use
+ * `LinkIcon` instead.
+ *
+ * @example
+ * ```tsx
+ * <Link href="https://example.com" target="_blank">
+ *   Docs <ExternalLinkIcon size="sm" decorative />
+ * </Link>
+ * ```
+ */
+declare const ExternalLinkIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { ExternalLinkIcon };

package/dist/types/components/Icons/FileTextIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * File Text icon component for documents and text content.
+ *
+ * A document page with horizontal text lines, commonly used for
+ * documentation, notes, write-ups, and scribe-style personas.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <FileTextIcon />
+ *
+ * // With custom size and color
+ * <FileTextIcon size="md" color="secondary" />
+ *
+ * // In a documentation entry
+ * <Button icon={<FileTextIcon />}>Open Document</Button>
+ * ```
+ */
+declare const FileTextIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { FileTextIcon };

package/dist/types/components/Icons/FirstIcon.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Skip to first icon — vertical bar plus a leftward chevron.
+ *
+ * Used by Pagination's "first page" button and similar
+ * jump-to-start controls.
+ *
+ * @example
+ * ```tsx
+ * <IconButton aria-label="First page"><FirstIcon /></IconButton>
+ * ```
+ */
+declare const FirstIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { FirstIcon };

package/dist/types/components/Icons/FolderCogIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Folder Cog icon component for project-scoped settings.
+ *
+ * A folder with a small gear overlay, commonly used to distinguish
+ * project-level settings from general application settings.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <FolderCogIcon />
+ *
+ * // With custom size and color
+ * <FolderCogIcon size="md" color="secondary" />
+ *
+ * // In a settings sidebar entry
+ * <Button icon={<FolderCogIcon />}>Project Settings</Button>
+ * ```
+ */
+declare const FolderCogIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { FolderCogIcon };

package/dist/types/components/Icons/FolderOpenIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Folder Open icon component for opened directory states.
+ *
+ * An open folder with an angled front flap, commonly paired with the closed
+ * `FolderIcon` for project switchers, file explorer reveals, and breadcrumbs.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <FolderOpenIcon />
+ *
+ * // With custom size and color
+ * <FolderOpenIcon size="lg" color="primary" />
+ *
+ * // In a switch project action
+ * <Button icon={<FolderOpenIcon />}>Switch Project</Button>
+ * ```
+ */
+declare const FolderOpenIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { FolderOpenIcon };

package/dist/types/components/Icons/GitBranchIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Git Branch icon component for version-control branch contexts.
+ *
+ * A trunk line with a fork to a side node, commonly used for branch
+ * indicators in status bars, branch pickers, and VCS-related actions.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <GitBranchIcon />
+ *
+ * // With custom size and color
+ * <GitBranchIcon size="sm" color="muted" />
+ *
+ * // In a status bar
+ * <Button icon={<GitBranchIcon />}>main</Button>
+ * ```
+ */
+declare const GitBranchIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { GitBranchIcon };

package/dist/types/components/Icons/LastIcon.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Skip to last icon — rightward chevron plus a vertical bar.
+ *
+ * Used by Pagination's "last page" button and similar
+ * jump-to-end controls.
+ *
+ * @example
+ * ```tsx
+ * <IconButton aria-label="Last page"><LastIcon /></IconButton>
+ * ```
+ */
+declare const LastIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { LastIcon };

package/dist/types/components/Icons/MinusIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Minus icon component for remove/decrement actions.
+ *
+ * A single horizontal stroke commonly used to remove items, decrement
+ * counters, and zoom out. Pairs with `AddIcon` for [+/-] controls.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <MinusIcon />
+ *
+ * // With custom size and color
+ * <MinusIcon size="sm" color="muted" />
+ *
+ * // In a counter control
+ * <IconButton icon={<MinusIcon />} label="Decrease" />
+ * ```
+ */
+declare const MinusIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { MinusIcon };

package/dist/types/components/Icons/PauseIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Pause icon component for pausing playback and processes.
+ *
+ * Two parallel vertical bars commonly used to pause animations, video,
+ * preview playback, and long-running operations. Pairs with `PlayIcon`.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <PauseIcon />
+ *
+ * // With custom size and color
+ * <PauseIcon size="lg" color="primary" />
+ *
+ * // In a transport bar
+ * <IconButton icon={<PauseIcon />} label="Pause" />
+ * ```
+ */
+declare const PauseIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { PauseIcon };

package/dist/types/components/Icons/PinIcon.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Pin icon component for pinning items to keep them visible.
+ *
+ * A push-pin silhouette commonly used to pin tabs, conversations,
+ * or list items so they stay in view. A filled visual variant could
+ * indicate the pinned state.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <PinIcon />
+ *
+ * // With custom size and color
+ * <PinIcon size="sm" color="accent" />
+ *
+ * // In a pin/unpin toggle
+ * <IconButton icon={<PinIcon />} label="Pin item" />
+ * ```
+ */
+declare const PinIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { PinIcon };

package/dist/types/components/Icons/SendIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Send icon component for submitting messages and forms.
+ *
+ * A paper plane silhouette commonly used as the trigger for
+ * sending chat messages, dispatching commands, and form submissions.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <SendIcon />
+ *
+ * // With custom size and color
+ * <SendIcon size="md" color="accent" />
+ *
+ * // In a chat input
+ * <IconButton icon={<SendIcon />} label="Send message" />
+ * ```
+ */
+declare const SendIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { SendIcon };

package/dist/types/components/Icons/StopIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Stop icon component for halting playback and streams.
+ *
+ * A solid square commonly used to stop transport playback, abort
+ * generations, and cancel long-running streaming operations.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <StopIcon />
+ *
+ * // With custom size and color
+ * <StopIcon size="md" color="error" />
+ *
+ * // In a stop streaming button
+ * <IconButton icon={<StopIcon />} label="Stop" />
+ * ```
+ */
+declare const StopIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { StopIcon };

package/dist/types/components/Icons/TerminalIcon.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Terminal icon component for shells, command palettes, and CLI panels.
+ *
+ * A prompt caret with an underscore line, commonly used for terminal
+ * panels, command palette triggers, and shell-related actions.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <TerminalIcon />
+ *
+ * // With custom size and color
+ * <TerminalIcon size="md" color="secondary" />
+ *
+ * // In a command palette trigger
+ * <IconButton icon={<TerminalIcon />} label="Open terminal" />
+ * ```
+ */
+declare const TerminalIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { TerminalIcon };

package/dist/types/components/Icons/UnlinkIcon.d.ts

@@ -0,0 +1,29 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Unlink icon — a broken chain.
+ *
+ * Indicates that two values are decoupled (no longer linked). Pair with
+ * `LinkIcon` to render a toggle: link → unlink. Common in coordinate
+ * inputs, transform locks, color-channel groups.
+ *
+ * @example
+ * ```tsx
+ * <IconButton aria-label="Unlink axes">
+ *   <UnlinkIcon />
+ * </IconButton>
+ * ```
+ */
+declare const UnlinkIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { UnlinkIcon };

package/dist/types/components/Icons/UsersIcon.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import { IconSize, IconColor } from '../primitives/Icon/Icon.js';
+
+/**
+ * Users icon component for groups, teams, and multi-user contexts.
+ *
+ * Two overlapping user silhouettes commonly used for team membership,
+ * shared resources, and group-level actions. Pairs with `UserIcon` for
+ * single-user contexts.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <UsersIcon />
+ *
+ * // With custom size and color
+ * <UsersIcon size="md" color="secondary" />
+ *
+ * // In a team selector
+ * <Button icon={<UsersIcon />}>Team</Button>
+ * ```
+ */
+declare const UsersIcon: React.NamedExoticComponent<Omit<{
+    children: React.ReactNode;
+    size?: IconSize | undefined;
+    color?: IconColor | undefined;
+    className?: string | undefined;
+    title?: string | undefined;
+    decorative?: boolean | undefined;
+    testId?: string | undefined;
+    ref?: React.Ref<SVGSVGElement> | undefined;
+}, "children">>;
+
+export { UsersIcon };