@ciridae/ui 0.2.0

package/dist/components/agentic/approval-request.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from "react";
+import { Button } from "@ciridae/ui/button";
+import { cn } from "@ciridae/ui/utils";
+const ApprovalRequestContext = createContext(null);
+const responseStates = [
+    "approval-responded",
+    "output-denied",
+    "output-error",
+    "output-available",
+];
+function useApprovalRequest() {
+    const context = useContext(ApprovalRequestContext);
+    if (!context)
+        throw new Error("ApprovalRequest components must be used within ApprovalRequest");
+    return context;
+}
+function ApprovalRequest({ approval, className, state, ...props }) {
+    const contextValue = useMemo(() => ({ approval, state }), [approval, state]);
+    if (!approval || state === "input-streaming" || state === "input-available")
+        return null;
+    return (_jsx(ApprovalRequestContext.Provider, { value: contextValue, children: _jsx("div", { "data-slot": "approval-request", className: cn("grid gap-2 rounded-lg border bg-card p-3 text-sm text-card-foreground", className), ...props }) }));
+}
+function ApprovalRequestTitle({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "approval-request-title", className: cn("font-medium text-foreground", className), ...props }));
+}
+function ApprovalRequestDescription({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "approval-request-description", className: cn("text-muted-foreground", className), ...props }));
+}
+function ApprovalRequestPending({ children }) {
+    const { state } = useApprovalRequest();
+    if (state !== "approval-requested")
+        return null;
+    return children;
+}
+function ApprovalRequestAccepted({ children }) {
+    const { approval, state } = useApprovalRequest();
+    if (!approval?.approved || !responseStates.includes(state))
+        return null;
+    return children;
+}
+function ApprovalRequestRejected({ children }) {
+    const { approval, state } = useApprovalRequest();
+    if (approval?.approved !== false || !responseStates.includes(state))
+        return null;
+    return children;
+}
+function ApprovalRequestActions({ className, ...props }) {
+    const { state } = useApprovalRequest();
+    if (state !== "approval-requested")
+        return null;
+    return (_jsx("div", { "data-slot": "approval-request-actions", className: cn("flex items-center justify-end gap-2", className), ...props }));
+}
+function ApprovalRequestAction({ className, size = "sm", type = "button", ...props }) {
+    return (_jsx(Button, { "data-slot": "approval-request-action", className: className, size: size, type: type, ...props }));
+}
+export { ApprovalRequest, ApprovalRequestAccepted, ApprovalRequestAction, ApprovalRequestActions, ApprovalRequestDescription, ApprovalRequestPending, ApprovalRequestRejected, ApprovalRequestTitle, };

package/dist/components/agentic/artifact.d.ts

@@ -0,0 +1,24 @@
+import type * as React from "react";
+import { Button } from "@ciridae/ui/button";
+type ArtifactProps = React.ComponentProps<"div">;
+type ArtifactHeaderProps = React.ComponentProps<"div">;
+type ArtifactCloseProps = React.ComponentProps<typeof Button>;
+type ArtifactTitleProps = React.ComponentProps<"p">;
+type ArtifactDescriptionProps = React.ComponentProps<"p">;
+type ArtifactActionsProps = React.ComponentProps<"div">;
+type ArtifactActionProps = React.ComponentProps<typeof Button> & {
+    label?: string;
+    mode?: "copy" | "download" | "open";
+    value?: string;
+};
+type ArtifactContentProps = React.ComponentProps<"div">;
+declare function Artifact({ className, ...props }: ArtifactProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactHeader({ className, ...props }: ArtifactHeaderProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactClose({ children, type, ...props }: ArtifactCloseProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactTitle({ className, ...props }: ArtifactTitleProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactDescription({ className, ...props }: ArtifactDescriptionProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactActions({ className, ...props }: ArtifactActionsProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactAction({ children, label, mode, type, value, onClick, ...props }: ArtifactActionProps): import("react/jsx-runtime").JSX.Element;
+declare function ArtifactContent({ className, ...props }: ArtifactContentProps): import("react/jsx-runtime").JSX.Element;
+export { Artifact, ArtifactAction, ArtifactActions, ArtifactClose, ArtifactContent, ArtifactDescription, ArtifactHeader, ArtifactTitle, };
+export type { ArtifactActionProps, ArtifactActionsProps, ArtifactCloseProps, ArtifactContentProps, ArtifactDescriptionProps, ArtifactHeaderProps, ArtifactProps, ArtifactTitleProps, };

package/dist/components/agentic/artifact.js

@@ -0,0 +1,72 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CheckIcon, CopyIcon, DownloadIcon, ExternalLinkIcon, XIcon } from "lucide-react";
+import { useState } from "react";
+import { Button } from "@ciridae/ui/button";
+import { cn } from "@ciridae/ui/utils";
+import { copyToClipboard } from "./clipboard";
+function Artifact({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "artifact", className: cn("flex h-full min-h-0 w-full flex-col overflow-hidden rounded-lg border bg-card text-card-foreground", className), ...props }));
+}
+function ArtifactHeader({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "artifact-header", className: cn("flex min-w-0 items-start justify-between gap-3 border-b px-4 py-3", className), ...props }));
+}
+function ArtifactClose({ children, type = "button", ...props }) {
+    return (_jsx(Button, { "aria-label": "Close artifact", size: "icon", variant: "ghost", ...props, type: type, children: children ?? _jsx(XIcon, { "aria-hidden": "true", className: "size-4" }) }));
+}
+function ArtifactTitle({ className, ...props }) {
+    return (_jsx("p", { "data-slot": "artifact-title", className: cn("truncate text-sm font-medium", className), ...props }));
+}
+function ArtifactDescription({ className, ...props }) {
+    return (_jsx("p", { "data-slot": "artifact-description", className: cn("text-sm text-muted-foreground", className), ...props }));
+}
+function ArtifactActions({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "artifact-actions", className: cn("flex shrink-0 items-center gap-1", className), ...props }));
+}
+function ArtifactAction({ children, label, mode = "open", type = "button", value = "", onClick, ...props }) {
+    const [copied, setCopied] = useState(false);
+    const Icon = copied
+        ? CheckIcon
+        : mode === "copy"
+            ? CopyIcon
+            : mode === "download"
+                ? DownloadIcon
+                : ExternalLinkIcon;
+    return (_jsx(Button, { "aria-label": copied ? "Copied" : label, size: "icon", variant: "ghost", ...props, type: type, onClick: (event) => {
+            onClick?.(event);
+            if (!event.defaultPrevented)
+                void runArtifactAction(mode, value, setCopied);
+        }, children: children ?? _jsx(Icon, { "aria-hidden": "true", className: "size-4" }) }));
+}
+function ArtifactContent({ className, ...props }) {
+    return (_jsx("div", { "data-slot": "artifact-content", className: cn("min-h-0 flex-1 overflow-auto p-4", className), ...props }));
+}
+async function runArtifactAction(mode, value, setCopied) {
+    if (!value)
+        return;
+    if (mode === "copy") {
+        await copyToClipboard(value, setCopied);
+        return;
+    }
+    if (mode === "download") {
+        const link = document.createElement("a");
+        link.href = value;
+        link.download = getArtifactDownloadName(value);
+        link.rel = "noreferrer";
+        document.body.appendChild(link);
+        link.click();
+        link.remove();
+        return;
+    }
+    window.open(value, "_blank", "noopener,noreferrer");
+}
+function getArtifactDownloadName(value) {
+    try {
+        const url = new URL(value, window.location.href);
+        const name = url.pathname.split("/").filter(Boolean).pop();
+        return name || "artifact";
+    }
+    catch {
+        return "artifact";
+    }
+}
+export { Artifact, ArtifactAction, ArtifactActions, ArtifactClose, ArtifactContent, ArtifactDescription, ArtifactHeader, ArtifactTitle, };

package/dist/components/agentic/attachments.d.ts

@@ -0,0 +1,124 @@
+import * as React from "react";
+import type { AgenticPromptAttachment, AgenticPromptAttachmentKind } from "@ciridae/ui/types";
+import { Button } from "@ciridae/ui/button";
+import { HoverCard, HoverCardContent, HoverCardTrigger } from "@ciridae/ui/hover-card";
+type AgenticAttachment = AgenticPromptAttachment & {
+    file?: File;
+    filename?: string;
+    title?: string;
+    type?: "file" | "source-document";
+};
+type AttachmentData = AgenticAttachment;
+type AttachmentMediaCategory = "image" | "video" | "audio" | "document" | "source" | "unknown";
+type AttachmentVariant = "grid" | "inline" | "list";
+type AttachmentErrorCode = "accept" | "max_attachments" | "max_attachment_size";
+type AttachmentError = {
+    code: AttachmentErrorCode;
+    message: string;
+};
+type AttachmentAddOptions = {
+    kind?: AgenticPromptAttachmentKind;
+};
+type AttachmentScreenshotStatus = "idle" | "capturing" | "unavailable" | "error";
+type AttachmentControllerContextValue = {
+    accept?: string;
+    add: (files: File[] | FileList, options?: AttachmentAddOptions) => void;
+    clear: () => void;
+    error?: AttachmentError;
+    files: AgenticAttachment[];
+    maxAttachmentSizeMb?: number;
+    maxAttachments?: number;
+    openFileDialog: () => void;
+    remove: (id: string) => void;
+    screenshotStatus: AttachmentScreenshotStatus;
+    takeScreenshot: () => Promise<void>;
+};
+type AttachmentProviderProps = {
+    accept?: string;
+    attachments?: AgenticAttachment[];
+    children: React.ReactNode;
+    defaultAttachments?: AgenticAttachment[];
+    maxAttachmentSizeMb?: number;
+    maxAttachments?: number;
+    multiple?: boolean;
+    onAttachmentError?: (error: AttachmentError) => void;
+    onAttachmentsChange?: (attachments: AgenticAttachment[]) => void;
+    onCaptureScreenshot?: () => File | null | Promise<File | null>;
+};
+type AttachmentsProps = React.ComponentProps<"div"> & {
+    variant?: AttachmentVariant;
+};
+type AttachmentProps = React.ComponentProps<"div"> & {
+    attachment?: AttachmentData;
+    data?: AttachmentData;
+    onRemove?: () => void;
+};
+type AttachmentPreviewProps = React.ComponentProps<"div"> & {
+    fallbackIcon?: React.ReactNode;
+};
+type AttachmentInfoProps = React.ComponentProps<"div"> & {
+    showMediaType?: boolean;
+};
+type AttachmentRemoveProps = React.ComponentProps<typeof Button> & {
+    attachmentId?: string;
+    label?: string;
+};
+type AttachmentHoverCardProps = React.ComponentProps<typeof HoverCard>;
+type AttachmentHoverCardTriggerProps = React.ComponentProps<typeof HoverCardTrigger>;
+type AttachmentHoverCardContentProps = React.ComponentProps<typeof HoverCardContent>;
+type AttachmentEmptyProps = React.ComponentProps<"div">;
+type AttachmentListProps = AttachmentsProps;
+type AttachmentNameProps = React.ComponentProps<"span">;
+type AttachmentMetaProps = React.ComponentProps<"span"> & {
+    attachment?: AttachmentData;
+    data?: AttachmentData;
+};
+type AttachmentActionRenderAs = "button" | "menu-item";
+type AttachmentActionAddFilesProps = React.ComponentProps<typeof Button> & {
+    label?: string;
+    renderAs?: AttachmentActionRenderAs;
+    tooltip?: string;
+};
+type AttachmentActionAddScreenshotProps = React.ComponentProps<typeof Button> & {
+    label?: string;
+    renderAs?: AttachmentActionRenderAs;
+    status?: AttachmentScreenshotStatus;
+    tooltip?: string;
+};
+declare function AttachmentProvider({ accept, attachments, children, defaultAttachments, maxAttachmentSizeMb, maxAttachments, multiple, onAttachmentError, onAttachmentsChange, onCaptureScreenshot, }: AttachmentProviderProps): import("react/jsx-runtime").JSX.Element;
+declare function useAttachments(): AttachmentControllerContextValue;
+declare function useOptionalAttachments(): AttachmentControllerContextValue | null;
+declare function useAttachmentsContext(): {
+    variant: AttachmentVariant;
+};
+declare function useAttachmentContext(): {
+    data: AttachmentData;
+    mediaCategory: AttachmentMediaCategory;
+    onRemove?: () => void;
+    variant: AttachmentVariant;
+};
+declare function Attachments({ variant, className, children, ...props }: AttachmentsProps): import("react/jsx-runtime").JSX.Element | null;
+declare function AttachmentList({ variant, ...props }: AttachmentListProps): import("react/jsx-runtime").JSX.Element;
+declare function Attachment({ attachment, children, className, data, onRemove, ...props }: AttachmentProps): import("react/jsx-runtime").JSX.Element | null;
+declare function AttachmentPreview({ fallbackIcon, className, ...props }: AttachmentPreviewProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentInfo({ showMediaType, className, ...props }: AttachmentInfoProps): import("react/jsx-runtime").JSX.Element | null;
+declare function AttachmentName({ className, children, ...props }: AttachmentNameProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentMeta({ attachment, children, className, data, ...props }: AttachmentMetaProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentRemove({ attachmentId, children, className, label, onClick, size, type, variant: buttonVariant, ...props }: AttachmentRemoveProps): import("react/jsx-runtime").JSX.Element | null;
+declare function AttachmentHoverCard({ closeDelay, openDelay, ...props }: AttachmentHoverCardProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentHoverCardTrigger(props: AttachmentHoverCardTriggerProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentHoverCardContent({ align, className, ...props }: AttachmentHoverCardContentProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentEmpty({ className, children, ...props }: AttachmentEmptyProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentActionAddFiles({ children, className, label, onClick, renderAs, size, tooltip, type, variant, ...props }: AttachmentActionAddFilesProps): import("react/jsx-runtime").JSX.Element;
+declare function AttachmentActionAddScreenshot({ children, className, disabled, label, onClick, renderAs, size, status, tooltip, type, variant, ...props }: AttachmentActionAddScreenshotProps): import("react/jsx-runtime").JSX.Element;
+declare function useAttachmentDropTarget({ global, ref, }: {
+    global?: boolean;
+    ref: React.RefObject<HTMLElement | null>;
+}): void;
+declare function prepareAttachmentsForSubmit(attachments: AgenticAttachment[]): Promise<AgenticAttachment[]>;
+declare function fileToAttachment(file: File, kind?: AgenticPromptAttachmentKind): AgenticAttachment;
+declare function getMediaCategory(data: AttachmentData): AttachmentMediaCategory;
+declare function getAttachmentLabel(data: AttachmentData): string;
+declare function captureBrowserScreenshot(): Promise<File | null>;
+export { Attachment, AttachmentActionAddFiles, AttachmentActionAddScreenshot, AttachmentEmpty, AttachmentHoverCard, AttachmentHoverCardContent, AttachmentHoverCardTrigger, AttachmentInfo, AttachmentList, AttachmentMeta, AttachmentName, AttachmentPreview, AttachmentProvider, AttachmentRemove, Attachments, captureBrowserScreenshot, fileToAttachment, getAttachmentLabel, getMediaCategory, prepareAttachmentsForSubmit, useAttachmentContext, useAttachmentDropTarget, useAttachments, useAttachmentsContext, useOptionalAttachments, };
+export type { AgenticAttachment, AttachmentActionAddFilesProps, AttachmentActionAddScreenshotProps, AttachmentAddOptions, AttachmentControllerContextValue as AttachmentContextValue, AttachmentData, AttachmentEmptyProps, AttachmentError, AttachmentErrorCode, AttachmentHoverCardContentProps, AttachmentHoverCardProps, AttachmentHoverCardTriggerProps, AttachmentInfoProps, AttachmentListProps, AttachmentMediaCategory, AttachmentMetaProps, AttachmentNameProps, AttachmentPreviewProps, AttachmentProps, AttachmentProviderProps, AttachmentRemoveProps, AttachmentScreenshotStatus, AttachmentVariant, AttachmentsProps, };