@agent-platform/ui 0.0.3 → 0.0.4

package/dist/components/agent/agent-input.js

@@ -4,6 +4,7 @@ import { Paperclip, PaperPlaneTilt } from '@phosphor-icons/react/dist/ssr';
 import { useCallback, useRef, useState } from 'react';
 import { cn } from '../../lib/utils';
 import { Button } from '../ui/button';
+import { Textarea } from '../ui/textarea';
 function AgentInput({ value: controlledValue, onChange, onSend, onAttach, placeholder = 'AIに相談してみましょう', disabled = false, isLoading = false, className, }) {
     const [uncontrolledValue, setUncontrolledValue] = useState('');
     const textareaRef = useRef(null);
@@ -45,6 +46,6 @@ function AgentInput({ value: controlledValue, onChange, onSend, onAttach, placeh
         }
     }, [handleSend]);
     const canSend = value.trim().length > 0 && !disabled && !isLoading;
-    return (_jsx("div", { "data-slot": "agent-input", className: cn('w-full border-t border-border bg-muted px-3 pb-3 pt-2', className), children: _jsxs("div", { className: "flex items-end gap-2 rounded-lg border border-border bg-background px-2.5 py-1.5 transition-colors focus-within:border-primary/40", children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: onAttach, disabled: disabled, "aria-label": "\u30D5\u30A1\u30A4\u30EB\u3092\u6DFB\u4ED8", className: "mb-0.5 text-muted-foreground hover:text-foreground", children: _jsx(Paperclip, { className: "size-5" }) }), _jsx("textarea", { ref: textareaRef, value: value, onChange: handleChange, onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled, rows: 1, className: "flex-1 resize-none bg-transparent text-sm leading-5 text-foreground placeholder:text-placeholder focus:outline-none disabled:cursor-not-allowed disabled:opacity-50", style: { maxHeight: '160px' } }), _jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: handleSend, disabled: !canSend, "aria-label": "\u9001\u4FE1 (\u2318+Enter)", className: "mb-0.5 text-muted-foreground hover:text-foreground disabled:opacity-30", children: _jsx(PaperPlaneTilt, { className: "size-5", weight: "fill" }) })] }) }));
+    return (_jsx("div", { "data-slot": "agent-input", className: cn('w-full border-t border-border bg-muted px-3 pb-3 pt-2', className), children: _jsxs("div", { className: "flex items-end gap-1 p-2 rounded-lg border border-border bg-background transition-colors", children: [_jsx(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: onAttach, disabled: disabled, "aria-label": "\u30D5\u30A1\u30A4\u30EB\u3092\u6DFB\u4ED8", className: "mb-0.5 text-muted-foreground hover:text-foreground", children: _jsx(Paperclip, { className: "size-4", weight: "bold" }) }), _jsx(Textarea, { ref: textareaRef, value: value, onChange: handleChange, onKeyDown: handleKeyDown, placeholder: placeholder, disabled: disabled, rows: 1, className: "border-none p-1 resize-none min-h-8 focus-visible:ring-0 focus-visible:border-0 bg-transparent" }), _jsx(Button, { type: "button", size: "icon-sm", onClick: handleSend, disabled: !canSend, "aria-label": "\u9001\u4FE1 (\u2318+Enter)", children: _jsx(PaperPlaneTilt, { className: "size-5", weight: "fill" }) })] }) }));
 }
 export { AgentInput };

package/dist/components/agent/agent-popup-widget.js

@@ -1,8 +1,8 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from 'react';
-import { Button } from '../ui/button';
 import { cn } from '../../lib/utils';
+import { Button } from '../ui/button';
 import { AgentContainer } from './agent-container';
 import { AgentProvider } from './provider';
 const DEFAULT_OFFSET = '1.5rem';

package/dist/components/agent/index.d.ts

@@ -1,5 +1,5 @@
-export { AgentScreen } from './agent-screen';
-export type { AgentScreenProps } from './agent-screen';
-export { AgentPopupWidget } from './agent-popup-widget';
 export type { AgentPopupWidgetProps } from './agent-popup-widget';
+export { AgentPopupWidget } from './agent-popup-widget';
+export type { AgentScreenProps } from './agent-screen';
+export { AgentScreen } from './agent-screen';
 export type { AgentHomeCardProps } from './types';

package/dist/components/agent/index.js

@@ -1,2 +1,2 @@
-export { AgentScreen } from './agent-screen';
 export { AgentPopupWidget } from './agent-popup-widget';
+export { AgentScreen } from './agent-screen';

package/dist/components/agent/message/markdown.js

@@ -43,21 +43,21 @@ const components = {
         if (className) {
             return _jsx("code", { className: cn('text-xs', className), children: children });
         }
-        return (_jsx("code", { className: "bg-background/50 px-1 py-0.5 rounded text-xs", children: children }));
+        return _jsx("code", { className: "bg-background/50 px-1 py-0.5 rounded text-xs", children: children });
     },
     a: ({ href, children }) => (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", className: "text-primary underline hover:text-primary/80", children: children })),
-    ul: ({ children }) => (_jsx("ul", { className: "list-disc list-inside pl-1 my-1.5 space-y-0.5", children: children })),
-    ol: ({ children }) => (_jsx("ol", { className: "list-decimal list-inside pl-1 my-1.5 space-y-0.5", children: children })),
+    ul: ({ children }) => _jsx("ul", { className: "list-disc list-inside pl-3 my-1", children: children }),
+    ol: ({ children }) => _jsx("ol", { className: "list-decimal list-inside pl-3 my-1", children: children }),
     li: ({ children }) => _jsx("li", { className: "leading-relaxed", children: children }),
-    p: ({ children }) => _jsx("p", { className: "my-1.5 first:mt-0 last:mb-0", children: children }),
-    h1: ({ children }) => (_jsx("h1", { className: "text-base font-bold mt-3 mb-1.5 first:mt-0", children: children })),
-    h2: ({ children }) => (_jsx("h2", { className: "text-sm font-bold mt-2.5 mb-1 first:mt-0", children: children })),
-    h3: ({ children }) => (_jsx("h3", { className: "text-sm font-semibold mt-2 mb-1 first:mt-0", children: children })),
+    p: ({ children }) => _jsx("p", { className: "first:mt-0 last:mb-0", children: children }),
+    h1: ({ children }) => _jsx("h1", { className: "text-base font-bold mt-3 mb-1 first:mt-0", children: children }),
+    h2: ({ children }) => _jsx("h2", { className: "text-sm font-bold mt-2.5 mb-1 first:mt-0", children: children }),
+    h3: ({ children }) => _jsx("h3", { className: "text-sm font-semibold mt-2 mb-1 first:mt-0", children: children }),
     blockquote: ({ children }) => (_jsx("blockquote", { className: "border-l-2 border-border pl-3 my-1.5 text-muted-foreground italic", children: children })),
     table: ({ children }) => (_jsx("div", { className: "overflow-x-auto my-1.5", children: _jsx("table", { className: "min-w-full border-collapse border border-border text-xs", children: children }) })),
-    thead: ({ children }) => (_jsx("thead", { className: "bg-muted/50", children: children })),
+    thead: ({ children }) => _jsx("thead", { className: "bg-muted/50", children: children }),
     th: ({ children }) => (_jsx("th", { className: "border border-border px-2 py-1.5 text-left font-semibold", children: children })),
-    td: ({ children }) => (_jsx("td", { className: "border border-border px-2 py-1.5", children: children })),
+    td: ({ children }) => _jsx("td", { className: "border border-border px-2 py-1.5", children: children }),
     hr: () => _jsx("hr", { className: "my-3 border-border" }),
 };
 export function Markdown({ content, className }) {

package/dist/components/agent/message/message-item.d.ts

@@ -4,4 +4,4 @@ export interface MessageItemProps {
     pendingToolCalls: ToolCallState[];
     toolNameLabels?: Record<string, string>;
 }
-export declare function MessageItem({ message, pendingToolCalls, toolNameLabels, }: MessageItemProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function MessageItem({ message, pendingToolCalls, toolNameLabels }: MessageItemProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/agent/message/message-item.js

@@ -3,7 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from '../../../lib/utils';
 import { Markdown } from './markdown';
 import { ToolCallCard } from './tool-call-card';
-export function MessageItem({ message, pendingToolCalls, toolNameLabels, }) {
+export function MessageItem({ message, pendingToolCalls, toolNameLabels }) {
     const isUser = message.role === 'user';
     // メッセージからテキストを抽出
     const textContent = message.content

package/dist/components/agent/message/message-list.js

@@ -8,7 +8,7 @@ export function MessageList({ messages, pendingToolCalls, toolNameLabels, isLoad
     // 新しいメッセージが追加されたら自動スクロール
     useEffect(() => {
         bottomRef.current?.scrollIntoView({ behavior: 'smooth' });
-    }, [messages, isLoading]);
+    }, []);
     if (messages.length === 0 && !isLoading) {
         return null;
     }
@@ -19,6 +19,7 @@ export function MessageList({ messages, pendingToolCalls, toolNameLabels, isLoad
     // Show loading indicator when:
     // 1. isLoading is true AND
     // 2. No messages yet OR last message is from user OR last assistant has no content
-    const showLoadingIndicator = isLoading && (messages.length === 0 || lastMessage?.role === 'user' || !lastAssistantHasContent);
+    const showLoadingIndicator = isLoading &&
+        (messages.length === 0 || lastMessage?.role === 'user' || !lastAssistantHasContent);
     return (_jsxs("div", { className: "flex flex-col gap-3 p-3", children: [messages.map((message) => (_jsx(MessageItem, { message: message, pendingToolCalls: pendingToolCalls, toolNameLabels: toolNameLabels }, message.id))), showLoadingIndicator && _jsx(MessageLoading, {}), _jsx("div", { ref: bottomRef })] }));
 }

package/dist/components/agent/message/message-loading.js

@@ -6,7 +6,7 @@ function BouncingDots() {
     return (_jsxs("span", { className: "flex gap-1", "aria-hidden": "true", children: [_jsx("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full bg-muted-foreground [animation-delay:0ms]" }), _jsx("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full bg-muted-foreground [animation-delay:150ms]" }), _jsx("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full bg-muted-foreground [animation-delay:300ms]" })] }));
 }
 export function MessageLoading({ className }) {
-    return (_jsx("div", { className: cn('flex justify-start', className), role: "status", "aria-label": "AI\u5FDC\u7B54\u3092\u5F85\u6A5F\u4E2D", children: _jsx("div", { className: "max-w-xl", children: _jsxs("div", { className: "rounded-lg border border-border bg-card px-3 py-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("div", { className: "relative flex items-center justify-center", children: [_jsx("div", { className: "absolute h-4 w-4 animate-ping rounded-full bg-primary/20" }), _jsx("div", { className: "relative h-2 w-2 animate-pulse rounded-full bg-primary" })] }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "\u8003\u3048\u4E2D" }), _jsx(BouncingDots, {})] })] }), _jsxs("div", { className: "mt-2 space-y-1.5", "aria-hidden": "true", children: [_jsx("div", { className: "h-2.5 w-full animate-shimmer rounded bg-gradient-to-r from-muted via-muted-foreground/10 to-muted bg-[length:200%_100%]" }), _jsx("div", { className: "h-2.5 w-3/4 animate-shimmer rounded bg-gradient-to-r from-muted via-muted-foreground/10 to-muted bg-[length:200%_100%] [animation-delay:100ms]" }), _jsx("div", { className: "h-2.5 w-1/2 animate-shimmer rounded bg-gradient-to-r from-muted via-muted-foreground/10 to-muted bg-[length:200%_100%] [animation-delay:200ms]" })] })] }) }) }));
+    return (_jsx("div", { className: cn('flex justify-start', className), role: "status", "aria-label": "AI\u5FDC\u7B54\u3092\u5F85\u6A5F\u4E2D", children: _jsx("div", { className: "max-w-xl", children: _jsxs("div", { className: "rounded-lg border border-border bg-card px-3 py-2", children: [_jsxs("div", { className: "flex it ems-center gap-2", children: [_jsxs("div", { className: "relative flex items-center justify-center", children: [_jsx("div", { className: "absolute h-4 w-4 animate-ping rounded-full bg-primary/20" }), _jsx("div", { className: "relative h-2 w-2 animate-pulse rounded-full bg-primary" })] }), _jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "\u8003\u3048\u4E2D" }), _jsx(BouncingDots, {})] })] }), _jsxs("div", { className: "mt-2 space-y-1.5", "aria-hidden": "true", children: [_jsx("div", { className: "h-2.5 w-full animate-shimmer rounded bg-linear-to-r from-muted via-muted-foreground/10 to-muted bg-size-[200%_100%]" }), _jsx("div", { className: "h-2.5 w-3/4 animate-shimmer rounded bg-linear-to-r from-muted via-muted-foreground/10 to-muted bg-size-[200%_100%] [animation-delay:100ms]" }), _jsx("div", { className: "h-2.5 w-1/2 animate-shimmer rounded bg-linear-to-r from-muted via-muted-foreground/10 to-muted bg-size-[200%_100%] [animation-delay:200ms]" })] })] }) }) }));
 }
 /**
  * Compact loading indicator for inline use (e.g., inside MessageItem during streaming)

package/dist/components/agent/provider/runtime-config.js

@@ -1,8 +1,15 @@
-const FIXED_AGENT_ENDPOINT = 'https://agent-server-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api/agent';
-const FIXED_API_BASE_URL = 'https://demo-scout-api-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api';
+const isDevelopment = process.env.NODE_ENV === 'development';
+const PRODUCTION_AGENT_ENDPOINT = 'https://agent-server-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api/agent';
+const DEVELOPMENT_AGENT_ENDPOINT = 'http://localhost:3002/api/agent';
+const FIXED_API_BASE_URL = isDevelopment
+    ? 'http://localhost:3001/api'
+    : 'https://demo-scout-api-prod--agent-platform-dev-8e3ae.asia-east1.hosted.app/api';
+function normalizeUrl(url) {
+    return url.replace(/\/$/, '');
+}
 export function resolveAgentRuntimeConfig() {
     return {
-        endpoint: FIXED_AGENT_ENDPOINT,
-        apiBaseUrl: FIXED_API_BASE_URL,
+        endpoint: normalizeUrl(isDevelopment ? DEVELOPMENT_AGENT_ENDPOINT : PRODUCTION_AGENT_ENDPOINT),
+        apiBaseUrl: normalizeUrl(FIXED_API_BASE_URL),
     };
 }

package/dist/components/agent/provider/types.d.ts

@@ -25,6 +25,7 @@ export type AgentHeadersProvider = () => Record<string, string> | Promise<Record
  */
 export interface AgentProviderConfig {
     agentId?: string;
+    /** 通信先URLは packages/ui 内部のruntime-configで解決される */
     /**
      * @deprecated 旧実装との後方互換用。
      * executeOn: 'client' のツールをブラウザ側で実行するコールバック

package/dist/components/ui/badge.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { type VariantProps } from "class-variance-authority";
 declare const badgeVariants: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare function Badge({ className, variant, asChild, ...props }: React.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
     asChild?: boolean;

package/dist/components/ui/button.d.ts

@@ -1,10 +1,10 @@
-import * as React from "react";
-import { type VariantProps } from "class-variance-authority";
+import { type VariantProps } from 'class-variance-authority';
+import type * as React from 'react';
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<'button'> & VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 export { Button, buttonVariants };

package/dist/components/ui/button.js

@@ -1,35 +1,35 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { cva } from "class-variance-authority";
-import { Slot } from "radix-ui";
-import { cn } from "../../lib/utils";
+import { cva } from 'class-variance-authority';
+import { Slot } from 'radix-ui';
+import { cn } from '../../lib/utils';
 const buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
     variants: {
         variant: {
-            default: "bg-primary text-primary-foreground hover:bg-primary/90",
-            destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-            outline: "border bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
-            secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
-            ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-            link: "text-primary underline-offset-4 hover:underline",
+            default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+            destructive: 'bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
+            outline: 'border bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
+            secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+            ghost: 'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
+            link: 'text-primary underline-offset-4 hover:underline',
         },
         size: {
-            default: "h-10 px-4 py-2 has-[>svg]:px-3",
+            default: 'h-10 px-4 py-2 has-[>svg]:px-3',
             xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
-            sm: "h-9 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
-            lg: "h-11 rounded-md px-6 has-[>svg]:px-4",
-            icon: "size-10",
-            "icon-xs": "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
-            "icon-sm": "size-8 min-h-12 min-w-12",
-            "icon-lg": "size-10",
+            sm: 'h-9 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
+            lg: 'h-11 rounded-md px-6 has-[>svg]:px-4',
+            icon: 'size-10',
+            'icon-xs': "size-6 rounded-md [&_svg:not([class*='size-'])]:size-3",
+            'icon-sm': "size-8 rounded-md [&_svg:not([class*='size-'])]:size-4",
+            'icon-lg': "size-10 rounded-md [&_svg:not([class*='size-'])]:size-5",
         },
     },
     defaultVariants: {
-        variant: "default",
-        size: "default",
+        variant: 'default',
+        size: 'default',
     },
 });
-function Button({ className, variant = "default", size = "default", asChild = false, ...props }) {
-    const Comp = asChild ? Slot.Root : "button";
+function Button({ className, variant = 'default', size = 'default', asChild = false, ...props }) {
+    const Comp = asChild ? Slot.Root : 'button';
     return (_jsx(Comp, { "data-slot": "button", "data-variant": variant, "data-size": size, className: cn(buttonVariants({ variant, size, className })), ...props }));
 }
 export { Button, buttonVariants };

package/dist/components/ui/textarea.d.ts

@@ -0,0 +1,3 @@
+import type * as React from 'react';
+declare function Textarea({ className, ...props }: React.ComponentProps<'textarea'>): import("react/jsx-runtime").JSX.Element;
+export { Textarea };

package/dist/components/ui/textarea.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '@/lib/utils';
+function Textarea({ className, ...props }) {
+    return (_jsx("textarea", { "data-slot": "textarea", className: cn('border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', className), ...props }));
+}
+export { Textarea };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-platform/ui",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "private": false,
   "type": "module",
   "sideEffects": false,