@openuidev/react-ui 0.9.16

package/dist/components/BottomTray/stories/BottomTray.stories.js

@@ -0,0 +1,249 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ChatProvider } from "@openuidev/react-headless";
+import { MessageSquare, Sparkles, Zap } from "lucide-react";
+import { useState } from "react";
+import { Composer, Container, ConversationStarter, Header, MessageLoading, Messages, ScrollArea, ThreadContainer, Trigger, WelcomeScreen, } from "../../BottomTray";
+// @ts-ignore
+import styles from "./style.module.css";
+import logoUrl from "./thesysdev_logo.jpeg";
+function mockSSEResponse(text, delayMs = 500) {
+    return new Promise((resolve) => {
+        setTimeout(() => {
+            const events = `data: ${JSON.stringify({ type: "TEXT_MESSAGE_CONTENT", delta: text })}\n\ndata: [DONE]\n\n`;
+            const stream = new ReadableStream({
+                start(controller) {
+                    controller.enqueue(new TextEncoder().encode(events));
+                    controller.close();
+                },
+            });
+            resolve(new Response(stream));
+        }, delayMs);
+    });
+}
+export default {
+    title: "Components/BottomTray",
+    tags: ["dev"],
+    argTypes: {
+        defaultOpen: {
+            control: "boolean",
+            description: "Whether the tray starts open",
+        },
+        variant: {
+            control: "select",
+            options: ["short", "long"],
+            description: "Conversation starter variant",
+        },
+    },
+};
+const BottomTrayStory = ({ defaultOpen = false, variant = "short", }) => {
+    const [isOpen, setIsOpen] = useState(defaultOpen);
+    return (_jsxs("div", { className: styles.container, children: [_jsxs("div", { className: styles.content, children: [_jsx("h1", { children: "Bottom Tray Example (Composable)" }), _jsxs("p", { children: ["The chat interface uses a ", _jsx("strong", { children: "composition pattern" }), ". The trigger button is separate from the container, giving you full control over placement and styling."] }), _jsxs("p", { children: [_jsx("strong", { children: "Try it:" }), " Click the pill button (bottom-right) or the custom button below to toggle the tray."] }), _jsxs("button", { onClick: () => setIsOpen(!isOpen), className: styles.toggleButton, children: [isOpen ? "Close" : "Open", " Tray"] })] }), _jsxs(ChatProvider, { processMessage: async ({ threadId, messages, abortController }) => {
+                    await new Promise((resolve) => setTimeout(resolve, 1000));
+                    return mockSSEResponse("This is a response from the bottom tray assistant!", 0);
+                }, fetchThreadList: async () => {
+                    await new Promise((resolve) => setTimeout(resolve, 1000));
+                    return {
+                        threads: [
+                            { id: "1", title: "test", createdAt: Date.now() },
+                            { id: "2", title: "test 2", createdAt: Date.now() },
+                            { id: "3", title: "test 3", createdAt: Date.now() },
+                        ],
+                    };
+                }, createThread: async () => ({
+                    id: crypto.randomUUID(),
+                    title: "test",
+                    createdAt: Date.now(),
+                }), deleteThread: async () => { }, updateThread: async (t) => t, loadThread: async (threadId) => {
+                    if (!threadId)
+                        return [];
+                    return [
+                        {
+                            id: crypto.randomUUID(),
+                            role: "user",
+                            content: "Hello",
+                        },
+                        {
+                            id: crypto.randomUUID(),
+                            role: "assistant",
+                            content: "Hello! How can I help you today?",
+                        },
+                    ];
+                }, children: [_jsx(Trigger, { onClick: () => setIsOpen(!isOpen), isOpen: isOpen }), _jsx(Container, { logoUrl: logoUrl, agentName: "OpenUI Assistant", isOpen: isOpen, children: _jsxs(ThreadContainer, { children: [_jsx(Header, { onMinimize: () => setIsOpen(false) }), _jsx(ScrollArea, { children: _jsx(Messages, { loader: _jsx(MessageLoading, {}) }) }), _jsx(ConversationStarter, { variant: variant, starters: [
+                                        {
+                                            displayText: "Tell me about my portfolio",
+                                            prompt: "Tell me about the latest stock market trends and how they affect my portfolio",
+                                            icon: _jsx(Sparkles, { size: 16 }),
+                                        },
+                                        {
+                                            displayText: "Who is the president of Venezuela and where is he currently located (icon was not passed)",
+                                            prompt: "Who is the president of Venezuela and where is he currently located?",
+                                            // icon undefined = shows default lightbulb
+                                        },
+                                        {
+                                            displayText: "Tell me about major stock (no icon with empty fragment)",
+                                            prompt: "Tell me about major stock",
+                                            icon: _jsx(_Fragment, {}), // Empty fragment = no icon
+                                        },
+                                    ] }), _jsx(Composer, {})] }) })] })] }));
+};
+export const Default = {
+    args: {
+        defaultOpen: false,
+        variant: "short",
+    },
+    render: (args) => _jsx(BottomTrayStory, { ...args }),
+};
+export const OpenByDefault = {
+    args: {
+        defaultOpen: true,
+        variant: "short",
+    },
+    render: (args) => _jsx(BottomTrayStory, { ...args }),
+};
+export const LongVariant = {
+    args: {
+        defaultOpen: true,
+        variant: "long",
+    },
+    render: (args) => _jsx(BottomTrayStory, { ...args }),
+};
+// Example with custom trigger
+const CustomTriggerStory = ({ defaultOpen = false, variant = "short", }) => {
+    const [isOpen, setIsOpen] = useState(defaultOpen);
+    return (_jsxs("div", { className: styles.container, children: [_jsxs("div", { className: styles.content, children: [_jsx("h1", { children: "Custom Trigger Example" }), _jsx("p", { children: "Use a fully custom trigger with your own styling and content." })] }), _jsxs(ChatProvider, { processMessage: async () => {
+                    await new Promise((resolve) => setTimeout(resolve, 1000));
+                    return mockSSEResponse("This is a response from the assistant!", 0);
+                }, fetchThreadList: async () => {
+                    await new Promise((resolve) => setTimeout(resolve, 1000));
+                    return {
+                        threads: [
+                            { id: "1", title: "test", createdAt: Date.now() },
+                            { id: "2", title: "test 2", createdAt: Date.now() },
+                        ],
+                    };
+                }, createThread: async () => ({
+                    id: crypto.randomUUID(),
+                    title: "test",
+                    createdAt: Date.now(),
+                }), deleteThread: async () => { }, updateThread: async (t) => t, loadThread: async (threadId) => {
+                    if (!threadId)
+                        return [];
+                    return [
+                        { id: crypto.randomUUID(), role: "user", content: "Hello" },
+                        {
+                            id: crypto.randomUUID(),
+                            role: "assistant",
+                            content: "Hello! How can I help you today?",
+                        },
+                    ];
+                }, children: [_jsx(Trigger, { onClick: () => setIsOpen(!isOpen), isOpen: isOpen, className: styles.customTrigger, children: "\uD83D\uDCAC Need Help?" }), _jsx(Container, { logoUrl: logoUrl, agentName: "Support", isOpen: isOpen, children: _jsxs(ThreadContainer, { children: [_jsx(Header, { onMinimize: () => setIsOpen(false) }), _jsx(ScrollArea, { children: _jsx(Messages, { loader: _jsx(MessageLoading, {}) }) }), _jsx(ConversationStarter, { variant: variant, starters: [
+                                        {
+                                            displayText: "Help me understand what features are available and how to get started with this application",
+                                            prompt: "Help me understand what features are available and how to get started with this application",
+                                            icon: _jsx(Zap, { size: 16 }),
+                                        },
+                                        {
+                                            displayText: "What can you help me with today? I need assistance with multiple tasks",
+                                            prompt: "What can you help me with today? I need assistance with multiple tasks",
+                                            icon: _jsx(MessageSquare, { size: 16 }),
+                                        },
+                                        {
+                                            displayText: "No icon example - this is a shorter prompt",
+                                            prompt: "No icon example - this is a shorter prompt",
+                                            icon: _jsx(_Fragment, {}), // Empty fragment = no icon
+                                        },
+                                    ] }), _jsx(Composer, {})] }) })] })] }));
+};
+export const CustomTrigger = {
+    args: {
+        defaultOpen: false,
+        variant: "short",
+    },
+    render: (args) => _jsx(CustomTriggerStory, { ...args }),
+};
+export const CustomTriggerLongVariant = {
+    args: {
+        defaultOpen: true,
+        variant: "long",
+    },
+    render: (args) => _jsx(CustomTriggerStory, { ...args }),
+};
+// Example with WelcomeScreen
+const WelcomeScreenStory = ({ defaultOpen = true, variant = "short", }) => {
+    const [isOpen, setIsOpen] = useState(defaultOpen);
+    return (_jsxs("div", { className: styles.container, children: [_jsxs("div", { className: styles.content, children: [_jsx("h1", { children: "Welcome Screen Example" }), _jsx("p", { children: "This example shows the WelcomeScreen component with title, description, and logo." })] }), _jsxs(ChatProvider, { processMessage: async ({ messages }) => {
+                    await new Promise((resolve) => setTimeout(resolve, 1000));
+                    const lastUser = messages.filter((m) => m.role === "user").pop();
+                    const content = typeof lastUser?.content === "string" ? lastUser.content : "";
+                    return mockSSEResponse(`You asked: "${content}"`, 0);
+                }, fetchThreadList: async () => ({ threads: [] }), createThread: async () => ({
+                    id: crypto.randomUUID(),
+                    title: "New Chat",
+                    createdAt: Date.now(),
+                }), deleteThread: async () => { }, updateThread: async (t) => t, loadThread: async () => [], children: [_jsx(Trigger, { onClick: () => setIsOpen(!isOpen), isOpen: isOpen }), _jsx(Container, { logoUrl: logoUrl, agentName: "OpenUI Assistant", isOpen: isOpen, children: _jsxs(ThreadContainer, { children: [_jsx(Header, { onMinimize: () => setIsOpen(false) }), _jsx(WelcomeScreen, { title: "Hi, I'm OpenUI Assistant", description: "I can help you with questions about your account, products, and more.", image: { url: logoUrl } }), _jsx(ScrollArea, { children: _jsx(Messages, { loader: _jsx(MessageLoading, {}) }) }), _jsx(ConversationStarter, { variant: variant, starters: [
+                                        {
+                                            displayText: "Help me get started",
+                                            prompt: "Help me get started",
+                                            icon: _jsx(Sparkles, { size: 16 }),
+                                        },
+                                        {
+                                            displayText: "What can you do?",
+                                            prompt: "What can you do?",
+                                        },
+                                    ] }), _jsx(Composer, {})] }) })] })] }));
+};
+export const WithWelcomeScreen = {
+    args: {
+        defaultOpen: true,
+        variant: "short",
+    },
+    render: (args) => _jsx(WelcomeScreenStory, { ...args }),
+};
+export const WithWelcomeScreenLongVariant = {
+    args: {
+        defaultOpen: true,
+        variant: "long",
+    },
+    render: (args) => _jsx(WelcomeScreenStory, { ...args }),
+};
+// Example with custom children in WelcomeScreen
+const CustomWelcomeScreenStory = ({ defaultOpen = true, variant = "short", }) => {
+    const [isOpen, setIsOpen] = useState(defaultOpen);
+    return (_jsxs("div", { className: styles.container, children: [_jsxs("div", { className: styles.content, children: [_jsx("h1", { children: "Custom Welcome Screen Example" }), _jsx("p", { children: "This example shows WelcomeScreen with custom children instead of props." })] }), _jsxs(ChatProvider, { processMessage: async ({ messages }) => {
+                    await new Promise((resolve) => setTimeout(resolve, 1000));
+                    const lastUser = messages.filter((m) => m.role === "user").pop();
+                    const content = typeof lastUser?.content === "string" ? lastUser.content : "";
+                    return mockSSEResponse(`You asked: "${content}"`, 0);
+                }, fetchThreadList: async () => ({ threads: [] }), createThread: async () => ({
+                    id: crypto.randomUUID(),
+                    title: "New Chat",
+                    createdAt: Date.now(),
+                }), deleteThread: async () => { }, updateThread: async (t) => t, loadThread: async () => [], children: [_jsx(Trigger, { onClick: () => setIsOpen(!isOpen), isOpen: isOpen }), _jsx(Container, { logoUrl: logoUrl, agentName: "OpenUI Assistant", isOpen: isOpen, children: _jsxs(ThreadContainer, { children: [_jsx(Header, { onMinimize: () => setIsOpen(false) }), _jsx(WelcomeScreen, { children: _jsxs("div", { style: { textAlign: "center" }, children: [_jsx("div", { style: {
+                                                    width: 80,
+                                                    height: 80,
+                                                    borderRadius: 16,
+                                                    background: "linear-gradient(135deg, #667eea 0%, #764ba2 100%)",
+                                                    display: "flex",
+                                                    alignItems: "center",
+                                                    justifyContent: "center",
+                                                    margin: "0 auto 16px",
+                                                }, children: _jsx(Sparkles, { size: 40, color: "white" }) }), _jsx("h2", { style: { margin: "0 0 8px", fontSize: 20, fontWeight: 600 }, children: "Welcome to AI Assistant" }), _jsx("p", { style: { margin: 0, color: "rgba(0,0,0,0.5)", fontSize: 14 }, children: "Your personal AI helper for all your questions" })] }) }), _jsx(ScrollArea, { children: _jsx(Messages, { loader: _jsx(MessageLoading, {}) }) }), _jsx(ConversationStarter, { variant: variant, starters: [
+                                        {
+                                            displayText: "Help me get started",
+                                            prompt: "Help me get started",
+                                            icon: _jsx(Sparkles, { size: 16 }),
+                                        },
+                                        {
+                                            displayText: "What can you do?",
+                                            prompt: "What can you do?",
+                                        },
+                                    ] }), _jsx(Composer, {})] }) })] })] }));
+};
+export const WithCustomWelcomeScreen = {
+    args: {
+        defaultOpen: true,
+        variant: "short",
+    },
+    render: (args) => _jsx(CustomWelcomeScreenStory, { ...args }),
+};
+//# sourceMappingURL=BottomTray.stories.js.map

package/dist/components/BottomTray/stories/BottomTray.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BottomTray.stories.js","sourceRoot":"","sources":["../../../../src/components/BottomTray/stories/BottomTray.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/BottomTray/stories/style.module.css

@@ -0,0 +1 @@
+.container{display:flex;min-height:100vh;background:var(--openui-background, oklch(97% 0 89.876deg));position:relative}.content{flex-grow:1;padding:var(--openui-space-2xl, 36px)}.content h1{font:var(--openui-text-heading-lg);letter-spacing:var(--openui-text-heading-lg-letter-spacing);color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));margin-bottom:var(--openui-space-l, 18px)}.content p{font:var(--openui-text-body-default);letter-spacing:var(--openui-text-body-default-letter-spacing);color:var(--openui-text-neutral-secondary, oklch(9.7% 0 0deg / 0.5));margin-bottom:var(--openui-space-m, 12px)}.toggleButton{font:var(--openui-text-label-default);letter-spacing:var(--openui-text-label-default-letter-spacing);padding:var(--openui-space-s, 8px) var(--openui-space-l, 18px);background:var(--openui-sunk-light, oklch(9.7% 0 0deg / 0.02));color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));border:1px solid var(--openui-border-interactive, oklch(9.7% 0 0deg / 0.12));border-radius:var(--openui-radius-m, 8px);cursor:pointer;transition:all .2s ease}.toggleButton:hover{background:var(--openui-highlight, oklch(9.7% 0 0deg / 0.04))}.toggleButton:active{background:var(--openui-highlight-subtle, oklch(9.7% 0 0deg / 0.02))}.customTrigger{background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);padding:var(--openui-space-m, 12px) var(--openui-space-xl, 24px);font-size:1.1rem;font-weight:700;border:none}.customTrigger:hover{background:linear-gradient(135deg, #764ba2 0%, #667eea 100%);transform:translateY(-4px);box-shadow:var(--openui-shadow-3xl, 0 16px 32px -8px oklch(0% 0 0deg / 0.16), 0 32px 64px -12px oklch(0% 0 0deg / 0.22))}

package/dist/components/BottomTray/thread.css

@@ -0,0 +1 @@
+.openui-bottom-tray-thread-container{display:flex;flex:1;overflow:hidden;flex-direction:column}.openui-bottom-tray-thread-scroll-container{width:100%;flex:1;position:relative;overflow:hidden}.openui-bottom-tray-thread-scroll-gradient{position:absolute;bottom:0;left:0;right:0;height:40px;z-index:1;pointer-events:none;background:linear-gradient(to top, var(--openui-background, oklch(97% 0 89.876deg)) 0%, transparent)}.openui-bottom-tray-thread-scroll-area{width:100%;height:100%;overflow:auto;padding:var(--openui-space-m, 12px)}.openui-bottom-tray-thread-scroll-area--user-message-anchor .openui-bottom-tray-thread-messages>*:last-child{min-height:calc(-200px + 100dvh)}.openui-bottom-tray-thread-artifact-panel--mobile{position:absolute;top:0;left:0;right:0;bottom:0;z-index:10;background-color:var(--openui-foreground, oklch(99.4% 0 89.876deg));animation:openui-bottom-tray-slide-in-from-bottom .3s cubic-bezier(0.4, 0, 0.2, 1)}@keyframes openui-bottom-tray-slide-in-from-bottom{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.openui-bottom-tray-thread-messages{margin:0 auto;display:flex;flex-direction:column;gap:var(--openui-space-xl, 24px)}.openui-bottom-tray-thread-message-assistant{width:100%;overflow:hidden}.openui-bottom-tray-thread-message-assistant__content{display:flex;flex-direction:column;gap:var(--openui-space-s, 8px);overflow:hidden;overflow-wrap:break-word;flex-grow:1}.openui-bottom-tray-thread-message-assistant__text{color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg))}.openui-bottom-tray-thread-message-user{display:flex;justify-content:flex-end}.openui-bottom-tray-thread-message-user__content{padding:var(--openui-space-m, 12px) var(--openui-space-l, 18px);background-color:var(--openui-chat-user-response-bg, oklch(9.7% 0 0deg));color:var(--openui-chat-user-response-text, oklch(99.4% 0 89.876deg));border-radius:var(--openui-radius-2xl, 14px);overflow-wrap:break-word;max-width:100%;height:fit-content}.openui-bottom-tray-thread-composer{width:100%;padding:0 var(--openui-space-s, 8px) var(--openui-space-s, 8px)}.openui-bottom-tray-thread-composer__input-wrapper{background-color:var(--openui-foreground, oklch(99.4% 0 89.876deg));border:1.256px solid var(--openui-border-default, oklch(9.7% 0 0deg / 0.06));display:flex;align-items:flex-end;gap:var(--openui-space-s, 8px);padding:var(--openui-space-m, 12px);border-radius:var(--openui-radius-xl, 12px)}.openui-bottom-tray-thread-composer__input{flex-grow:1;padding:0;resize:none;margin:auto 0px;min-height:1lh;max-height:154px;outline:none;border:none;background:rgba(0,0,0,0);overflow:hidden;color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg))}.openui-bottom-tray-thread-composer__input::placeholder{color:var(--openui-text-neutral-tertiary, oklch(9.7% 0 0deg / 0.2))}

package/dist/components/BottomTray/threadList.css

@@ -0,0 +1 @@
+.openui-bottom-tray-thread-list-dropdown{display:flex;flex-direction:column;min-width:240px;max-width:320px;max-height:296px;padding:var(--openui-space-s, 8px);border:1px solid var(--openui-border-default, oklch(9.7% 0 0deg / 0.06));border-radius:var(--openui-radius-l, 10px);background-color:var(--openui-foreground, oklch(99.4% 0 89.876deg));box-shadow:var(--openui-shadow-l, 0 4px 4px -2px oklch(0% 0 0deg / 0.05), 0 4px 8px -2px oklch(0% 0 0deg / 0.04));z-index:9999;overflow:hidden}.openui-bottom-tray-thread-list-header{font:var(--openui-text-label-sm);letter-spacing:var(--openui-text-label-sm-letter-spacing);color:var(--openui-text-neutral-secondary, oklch(9.7% 0 0deg / 0.5));padding:var(--openui-space-xs, 6px) var(--openui-space-s, 8px);padding-bottom:var(--openui-space-s, 8px)}.openui-bottom-tray-thread-list-items{display:flex;flex-direction:column;gap:var(--openui-space-2xs, 4px);overflow-y:auto}.openui-bottom-tray-thread-list-empty{font:var(--openui-text-body-sm);letter-spacing:var(--openui-text-body-sm-letter-spacing);color:var(--openui-text-neutral-secondary, oklch(9.7% 0 0deg / 0.5));padding:var(--openui-space-m, 12px);text-align:center}.openui-bottom-tray-thread-item{display:flex;align-items:center;justify-content:space-between;width:100%;border-radius:var(--openui-radius-s, 6px);border:1px solid rgba(0,0,0,0);padding-right:var(--openui-space-xs, 6px)}.openui-bottom-tray-thread-item--selected{background-color:var(--openui-sunk, oklch(9.7% 0 0deg / 0.04));border-color:var(--openui-border-default, oklch(9.7% 0 0deg / 0.06))}.openui-bottom-tray-thread-item:hover{background-color:var(--openui-sunk, oklch(9.7% 0 0deg / 0.04))}.openui-bottom-tray-thread-item:hover .openui-bottom-tray-thread-item-menu-trigger{opacity:1}.openui-bottom-tray-thread-item-title{padding:0;border:0;background:rgba(0,0,0,0);font:var(--openui-text-body-sm);letter-spacing:var(--openui-text-body-sm-letter-spacing);color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));padding:var(--openui-space-xs, 6px) var(--openui-space-s, 8px);flex:1;text-align:left;cursor:pointer;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.openui-bottom-tray-thread-item-menu-trigger{padding:0;border:0;background:rgba(0,0,0,0);outline:none;color:var(--openui-text-neutral-secondary, oklch(9.7% 0 0deg / 0.5));padding:var(--openui-space-xs, 6px);flex-shrink:0;cursor:pointer;opacity:0;border-radius:var(--openui-radius-xs, 4px)}.openui-bottom-tray-thread-item-menu-trigger:hover{background-color:var(--openui-highlight, oklch(9.7% 0 0deg / 0.04))}.openui-bottom-tray-thread-item-menu-trigger[data-state=open]{opacity:1}.openui-bottom-tray-thread-item-menu{display:flex;flex-direction:column;padding:var(--openui-space-xs, 6px);border:1px solid var(--openui-border-default, oklch(9.7% 0 0deg / 0.06));border-radius:var(--openui-radius-m, 8px);background-color:var(--openui-foreground, oklch(99.4% 0 89.876deg));box-shadow:var(--openui-shadow-m, 0 4px 6px -2px oklch(0% 0 0deg / 0.025), 0 2px 2px -2px oklch(0% 0 0deg / 0.05));z-index:10000}.openui-bottom-tray-thread-item-menu-action{padding:0;border:0;background:rgba(0,0,0,0);font:var(--openui-text-body-sm);letter-spacing:var(--openui-text-body-sm-letter-spacing);outline:none;color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));padding:var(--openui-space-xs, 6px) var(--openui-space-s, 8px);display:flex;align-items:center;gap:var(--openui-space-xs, 6px);cursor:pointer;border-radius:var(--openui-radius-xs, 4px)}.openui-bottom-tray-thread-item-menu-action:hover{background-color:var(--openui-sunk, oklch(9.7% 0 0deg / 0.04))}.openui-bottom-tray-thread-item-menu-icon{color:var(--openui-text-neutral-secondary, oklch(9.7% 0 0deg / 0.5))}

package/dist/components/BottomTray/trigger.css

@@ -0,0 +1 @@
+.openui-bottom-tray-trigger{position:fixed;bottom:var(--openui-space-l, 18px);right:var(--openui-space-l, 18px);display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:var(--openui-radius-full, 9999px);background:var(--openui-inverted-background, oklch(9.7% 0 0deg));color:var(--openui-text-accent-primary, oklch(99.4% 0 89.876deg));box-shadow:var(--openui-shadow-xl, 0 8px 16px -4px oklch(0% 0 0deg / 0.08), 0 16px 32px -6px oklch(0% 0 0deg / 0.12));cursor:pointer;transition:all .1s ease;z-index:1000;overflow:hidden}.openui-bottom-tray-trigger:hover{background:var(--openui-interactive-accent-hover, oklch(9.7% 0 0deg / 0.8));box-shadow:var(--openui-shadow-2xl, 0 12px 24px -6px oklch(0% 0 0deg / 0.12), 0 24px 48px -8px oklch(0% 0 0deg / 0.16));transform:translateY(-2px)}.openui-bottom-tray-trigger:active{transform:translateY(0);scale:.95}.openui-bottom-tray-trigger--open{transform:scale(0.85)}@media(max-width: 768px){.openui-bottom-tray-trigger{bottom:var(--openui-space-m, 12px);right:var(--openui-space-m, 12px)}.openui-bottom-tray-trigger--open{display:none}}

package/dist/components/BottomTray/welcomeScreen.css

@@ -0,0 +1 @@
+.openui-bottom-tray-welcome-screen{display:flex;flex-direction:column;gap:var(--openui-space-l, 18px);height:100%;justify-content:center;align-items:center}.openui-bottom-tray-welcome-screen__image-container{display:flex;align-items:center;justify-content:center;flex-shrink:0}.openui-bottom-tray-welcome-screen__image{width:64px;height:64px;object-fit:cover;border-radius:var(--openui-radius-xl, 12px)}.openui-bottom-tray-welcome-screen__content{display:flex;flex-direction:column;align-items:center;gap:var(--openui-space-xs, 6px);text-align:center}.openui-bottom-tray-welcome-screen__title{font:var(--openui-text-heading-sm);letter-spacing:var(--openui-text-heading-sm-letter-spacing);color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));margin:0}.openui-bottom-tray-welcome-screen__description{font:var(--openui-text-body-sm);letter-spacing:var(--openui-text-body-sm-letter-spacing);color:var(--openui-text-neutral-secondary, oklch(9.7% 0 0deg / 0.5));margin:0;max-width:280px}

package/dist/components/Button/Button.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from "react";
+type ButtonVariant = "primary" | "secondary" | "tertiary";
+type ButtonSize = "extra-small" | "small" | "medium" | "large";
+type ButtonType = "normal" | "destructive";
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    iconLeft?: ReactNode;
+    iconRight?: ReactNode;
+    buttonType?: ButtonType;
+}
+export declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
+export {};
+//# sourceMappingURL=Button.d.ts.map

package/dist/components/Button/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,SAAS,EAAE,MAAM,OAAO,CAAC;AAE9C,KAAK,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAC1D,KAAK,UAAU,GAAG,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC/D,KAAK,UAAU,GAAG,QAAQ,GAAG,aAAa,CAAC;AAE3C,MAAM,WAAW,WAAY,SAAQ,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC;IAChF,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,UAAU,CAAC,EAAE,UAAU,CAAC;CACzB;AAqBD,eAAO,MAAM,MAAM,2GA2BlB,CAAC"}

package/dist/components/Button/Button.js

@@ -0,0 +1,25 @@
+import { jsxs as _jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { forwardRef } from "react";
+const normalVariantMap = {
+    primary: "openui-button-base-primary",
+    secondary: "openui-button-base-secondary",
+    tertiary: "openui-button-base-tertiary",
+};
+const destructiveVariantMap = {
+    primary: "openui-button-base-destructive-primary",
+    secondary: "openui-button-base-destructive-secondary",
+    tertiary: "openui-button-base-destructive-tertiary",
+};
+const sizeMap = {
+    "extra-small": "openui-button-base-extra-small",
+    small: "openui-button-base-small",
+    medium: "openui-button-base-medium",
+    large: "openui-button-base-large",
+};
+export const Button = forwardRef(({ children, variant = "primary", size = "medium", iconLeft, iconRight, className, buttonType = "normal", ...props }, ref) => {
+    const variantMap = buttonType === "destructive" ? destructiveVariantMap : normalVariantMap;
+    return (_jsxs("button", { ref: ref, className: clsx("openui-button-base", variantMap[variant], sizeMap[size], className), ...props, children: [iconLeft, children, iconRight] }));
+});
+Button.displayName = "Button";
+//# sourceMappingURL=Button.js.map

package/dist/components/Button/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.js","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,UAAU,EAAa,MAAM,OAAO,CAAC;AAc9C,MAAM,gBAAgB,GAAkC;IACtD,OAAO,EAAE,4BAA4B;IACrC,SAAS,EAAE,8BAA8B;IACzC,QAAQ,EAAE,6BAA6B;CACxC,CAAC;AAEF,MAAM,qBAAqB,GAAkC;IAC3D,OAAO,EAAE,wCAAwC;IACjD,SAAS,EAAE,0CAA0C;IACrD,QAAQ,EAAE,yCAAyC;CACpD,CAAC;AAEF,MAAM,OAAO,GAA+B;IAC1C,aAAa,EAAE,gCAAgC;IAC/C,KAAK,EAAE,0BAA0B;IACjC,MAAM,EAAE,2BAA2B;IACnC,KAAK,EAAE,0BAA0B;CAClC,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CACE,EACE,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,QAAQ,EACf,QAAQ,EACR,SAAS,EACT,SAAS,EACT,UAAU,GAAG,QAAQ,EACrB,GAAG,KAAK,EACT,EACD,GAAG,EACH,EAAE;IACF,MAAM,UAAU,GAAG,UAAU,KAAK,aAAa,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,gBAAgB,CAAC;IAC3F,OAAO,CACL,kBACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,oBAAoB,EAAE,UAAU,CAAC,OAAO,CAAC,EAAE,OAAO,CAAC,IAAI,CAAC,EAAE,SAAS,CAAC,KAChF,KAAK,aAER,QAAQ,EACR,QAAQ,EACR,SAAS,IACH,CACV,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,WAAW,GAAG,QAAQ,CAAC"}

package/dist/components/Button/button.css

@@ -0,0 +1 @@
+.openui-button-base{box-sizing:border-box;font:var(--openui-text-label-default);letter-spacing:var(--openui-text-label-default-letter-spacing);border-radius:var(--openui-radius-l, 10px);border:1px solid rgba(0,0,0,0);cursor:pointer;transition:all .12s ease;display:flex;gap:var(--openui-space-xs, 6px);align-items:center}.openui-button-base svg{height:1em;width:1em}.openui-button-base-primary{background-color:var(--openui-interactive-accent-default, oklch(9.7% 0 0deg));color:var(--openui-text-accent-primary, oklch(99.4% 0 89.876deg));border-color:var(--openui-border-accent, oklch(9.7% 0 0deg / 0.08));box-shadow:var(--openui-shadow-m, 0 4px 6px -2px oklch(0% 0 0deg / 0.025), 0 2px 2px -2px oklch(0% 0 0deg / 0.05))}.openui-button-base-primary:not(:disabled):hover{background-color:var(--openui-interactive-accent-hover, oklch(9.7% 0 0deg / 0.8));box-shadow:none}.openui-button-base-primary:disabled{background-color:var(--openui-interactive-accent-disabled, oklch(9.7% 0 0deg / 0.4));cursor:not-allowed;box-shadow:none}.openui-button-base-primary:not(:disabled):active{background-color:var(--openui-interactive-accent-pressed, oklch(9.7% 0 0deg))}.openui-button-base-secondary{background-color:rgba(0,0,0,0);color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));border-color:var(--openui-border-interactive, oklch(9.7% 0 0deg / 0.12));box-shadow:var(--openui-shadow-m, 0 4px 6px -2px oklch(0% 0 0deg / 0.025), 0 2px 2px -2px oklch(0% 0 0deg / 0.05))}.openui-button-base-secondary:not(:disabled):hover{background-color:var(--openui-highlight, oklch(9.7% 0 0deg / 0.04));box-shadow:none}.openui-button-base-secondary:disabled{background-color:rgba(0,0,0,0);box-shadow:none;color:var(--openui-text-neutral-tertiary, oklch(9.7% 0 0deg / 0.2));cursor:not-allowed}.openui-button-base-secondary:not(:disabled):active{background-color:var(--openui-highlight, oklch(9.7% 0 0deg / 0.04))}.openui-button-base-tertiary{background-color:rgba(0,0,0,0);color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg))}.openui-button-base-tertiary:not(:disabled):hover{background-color:var(--openui-highlight, oklch(9.7% 0 0deg / 0.04))}.openui-button-base-tertiary:disabled{background-color:rgba(0,0,0,0);border-color:var(--openui-border-default, oklch(9.7% 0 0deg / 0.06));color:var(--openui-text-neutral-tertiary, oklch(9.7% 0 0deg / 0.2));cursor:not-allowed}.openui-button-base-tertiary:not(:disabled):active{background-color:var(--openui-highlight, oklch(9.7% 0 0deg / 0.04));border-color:var(--openui-border-interactive, oklch(9.7% 0 0deg / 0.12))}.openui-button-base-destructive-primary{background-color:var(--openui-interactive-destructive-accent-default, oklch(57.7% 0.215 27.325deg));color:var(--openui-text-danger-inverted-primary, oklch(98.2% 0.009 17.303deg));border-color:var(--openui-border-accent, oklch(9.7% 0 0deg / 0.08))}.openui-button-base-destructive-primary:not(:disabled):hover{background-color:var(--openui-interactive-destructive-accent-hover, oklch(63.7% 0.208 25.331deg))}.openui-button-base-destructive-primary:disabled{background-color:var(--openui-interactive-destructive-accent-disabled, oklch(57.7% 0.215 27.325deg / 0.4));cursor:not-allowed}.openui-button-base-destructive-primary:not(:disabled):active{background-color:var(--openui-interactive-destructive-accent-pressed, oklch(50.5% 0.19 27.518deg))}.openui-button-base-destructive-secondary{background-color:var(--openui-interactive-destructive-default, oklch(57.7% 0.215 27.325deg / 0.02));color:var(--openui-text-danger-primary, oklch(50.5% 0.19 27.518deg));border-color:var(--openui-border-danger, oklch(57.7% 0.215 27.325deg / 0.08))}.openui-button-base-destructive-secondary:not(:disabled):hover{background-color:var(--openui-interactive-destructive-hover, oklch(57.7% 0.215 27.325deg / 0.08))}.openui-button-base-destructive-secondary:disabled{background-color:var(--openui-interactive-destructive-disabled, oklch(57.7% 0.215 27.325deg / 0.02));color:var(--openui-text-danger-tertiary, oklch(80.8% 0.103 19.571deg));cursor:not-allowed}.openui-button-base-destructive-secondary:not(:disabled):active{background-color:var(--openui-interactive-destructive-hover, oklch(57.7% 0.215 27.325deg / 0.08))}.openui-button-base-destructive-tertiary{background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0);color:var(--openui-text-danger-primary, oklch(50.5% 0.19 27.518deg))}.openui-button-base-destructive-tertiary:not(:disabled):hover{background-color:var(--openui-interactive-destructive-hover, oklch(57.7% 0.215 27.325deg / 0.08))}.openui-button-base-destructive-tertiary:disabled{color:var(--openui-text-danger-tertiary, oklch(80.8% 0.103 19.571deg));cursor:not-allowed}.openui-button-base-destructive-tertiary:not(:disabled):active{background-color:var(--openui-interactive-destructive-hover, oklch(57.7% 0.215 27.325deg / 0.08));border-color:var(--openui-border-danger, oklch(57.7% 0.215 27.325deg / 0.08))}.openui-button-base-extra-small{border-radius:var(--openui-radius-s, 6px);padding:calc(var(--openui-space-xs, 6px) - 1.75px) var(--openui-space-s, 8px);font:var(--openui-text-label-sm);letter-spacing:var(--openui-text-label-sm-letter-spacing)}.openui-button-base-small{border-radius:calc(var(--openui-radius-s, 6px) + 1px);padding:calc(var(--openui-space-s, 8px) - 1.75px) var(--openui-space-s-m, 10px);font:var(--openui-text-label-sm);letter-spacing:var(--openui-text-label-sm-letter-spacing)}.openui-button-base-medium{padding:calc(var(--openui-space-s, 8px) - 1px) var(--openui-space-s-m, 10px);border-radius:var(--openui-radius-m, 8px)}.openui-button-base-large{padding:calc(var(--openui-space-s-m, 10px) - 1px) var(--openui-space-m, 12px)}

package/dist/components/Button/dependencies.d.ts

@@ -0,0 +1,3 @@
+declare const dependencies: string[];
+export default dependencies;
+//# sourceMappingURL=dependencies.d.ts.map

package/dist/components/Button/dependencies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../../src/components/Button/dependencies.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,UAAa,CAAC;AAChC,eAAe,YAAY,CAAC"}

package/dist/components/Button/dependencies.js

@@ -0,0 +1,3 @@
+const dependencies = ["Button"];
+export default dependencies;
+//# sourceMappingURL=dependencies.js.map

package/dist/components/Button/dependencies.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../src/components/Button/dependencies.ts"],"names":[],"mappings":"AAAA,MAAM,YAAY,GAAG,CAAC,QAAQ,CAAC,CAAC;AAChC,eAAe,YAAY,CAAC"}

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

@@ -0,0 +1,2 @@
+export * from "./Button";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/components/Button/index.js

@@ -0,0 +1,2 @@
+export * from "./Button";
+//# sourceMappingURL=index.js.map

package/dist/components/Button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/components/Button/stories/Button.stories.d.ts

@@ -0,0 +1,11 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { Button } from "../Button";
+type Story = StoryObj<typeof Button>;
+export declare const Primary: Story;
+export declare const Secondary: Story;
+export declare const Tertiary: Story;
+export declare const WithLeftIcon: Story;
+export declare const WithRightIcon: Story;
+declare const meta: Meta<typeof Button>;
+export default meta;
+//# sourceMappingURL=Button.stories.d.ts.map

package/dist/components/Button/stories/Button.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Button/stories/Button.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAEnC,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC;AAGrC,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAMvB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAC;AAGF,eAAO,MAAM,YAAY,EAAE,KAgB1B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAgB3B,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAuD7B,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/Button/stories/Button.stories.js

@@ -0,0 +1,104 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ArrowRight, Download } from "lucide-react";
+import { Button } from "../Button";
+// Basic button stories
+export const Primary = {
+    args: {
+        children: "Primary Button",
+        variant: "primary",
+        size: "medium",
+        disabled: false,
+        buttonType: "normal",
+    },
+    render: (args) => (_jsx(Button, { variant: args.variant, size: args.size, disabled: args.disabled, buttonType: args.buttonType, children: args.children })),
+};
+export const Secondary = {
+    args: {
+        children: "Secondary",
+        variant: "secondary",
+        buttonType: "normal",
+    },
+};
+export const Tertiary = {
+    name: "Tertiary (Ghost)",
+    args: {
+        children: "Tertiary",
+        variant: "tertiary",
+        buttonType: "normal",
+    },
+};
+// With icons
+export const WithLeftIcon = {
+    args: {
+        children: "Download",
+        variant: "primary",
+        iconLeft: _jsx(Download, { size: 18 }),
+    },
+    render: (args) => (_jsx(Button, { variant: args.variant, size: args.size, disabled: args.disabled, iconLeft: args.iconLeft, children: args.children })),
+};
+export const WithRightIcon = {
+    args: {
+        children: "Next",
+        variant: "primary",
+        iconRight: _jsx(ArrowRight, { size: 18 }),
+    },
+    render: (args) => (_jsx(Button, { variant: args.variant, size: args.size, disabled: args.disabled, iconRight: args.iconRight, children: args.children })),
+};
+const meta = {
+    title: "Components/Button",
+    component: Button,
+    parameters: {
+        layout: "centered",
+        docs: {
+            description: {
+                component: "```tsx\nimport { Button } from '@openui-ui/react-ui';\n```",
+            },
+        },
+    },
+    argTypes: {
+        variant: {
+            control: "radio",
+            options: ["primary", "secondary", "tertiary"],
+            table: {
+                category: "Appearance",
+            },
+        },
+        size: {
+            control: "radio",
+            options: ["extra-small", "small", "medium", "large"],
+            table: {
+                category: "Appearance",
+            },
+        },
+        disabled: {
+            control: "boolean",
+            table: {
+                category: "State",
+            },
+        },
+        iconLeft: {
+            control: false,
+            description: "Any react icon component",
+            table: {
+                category: "Icons",
+            },
+        },
+        iconRight: {
+            control: false,
+            description: "Any react icon component",
+            table: {
+                category: "Icons",
+            },
+        },
+        buttonType: {
+            control: "radio",
+            options: ["normal", "destructive"],
+            table: {
+                category: "Appearance",
+            },
+        },
+    },
+    tags: ["autodocs", "!dev"],
+};
+export default meta;
+//# sourceMappingURL=Button.stories.js.map

package/dist/components/Button/stories/Button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../../src/components/Button/stories/Button.stories.tsx"],"names":[],"mappings":"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"}

package/dist/components/Buttons/Buttons.d.ts

@@ -0,0 +1,13 @@
+import { CSSProperties, HTMLAttributes, ReactElement } from "react";
+import { ButtonProps } from "../Button";
+import { IconButtonProps } from "../IconButton";
+type ButtonsVariant = "vertical" | "horizontal";
+export interface ButtonsProps extends HTMLAttributes<HTMLDivElement> {
+    variant?: ButtonsVariant;
+    children: ReactElement<ButtonProps | IconButtonProps> | ReactElement<ButtonProps | IconButtonProps>[];
+    className?: string;
+    style?: CSSProperties;
+}
+export declare const Buttons: import("react").ForwardRefExoticComponent<ButtonsProps & import("react").RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=Buttons.d.ts.map

package/dist/components/Buttons/Buttons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Buttons.d.ts","sourceRoot":"","sources":["../../../src/components/Buttons/Buttons.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAc,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAChF,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAEhD,KAAK,cAAc,GAAG,UAAU,GAAG,YAAY,CAAC;AAEhD,MAAM,WAAW,YAAa,SAAQ,cAAc,CAAC,cAAc,CAAC;IAClE,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,QAAQ,EACJ,YAAY,CAAC,WAAW,GAAG,eAAe,CAAC,GAC3C,YAAY,CAAC,WAAW,GAAG,eAAe,CAAC,EAAE,CAAC;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB;AAOD,eAAO,MAAM,OAAO,yGAYlB,CAAC"}

package/dist/components/Buttons/Buttons.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { forwardRef } from "react";
+const variantMap = {
+    vertical: "openui-buttons-vertical",
+    horizontal: "openui-buttons-horizontal",
+};
+export const Buttons = forwardRef((props, ref) => {
+    const { className, style, variant = "horizontal", children, ...rest } = props;
+    return (_jsx("div", { ref: ref, className: clsx("openui-buttons", variantMap[variant], className), style: style, ...rest, children: children }));
+});
+Buttons.displayName = "Buttons";
+//# sourceMappingURL=Buttons.js.map

package/dist/components/Buttons/Buttons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Buttons.js","sourceRoot":"","sources":["../../../src/components/Buttons/Buttons.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAiB,UAAU,EAAgC,MAAM,OAAO,CAAC;AAehF,MAAM,UAAU,GAAmC;IACjD,QAAQ,EAAE,yBAAyB;IACnC,UAAU,EAAE,2BAA2B;CACxC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,UAAU,CAA+B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC7E,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,GAAG,YAAY,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IAC9E,OAAO,CACL,cACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,EACjE,KAAK,EAAE,KAAK,KACR,IAAI,YAEP,QAAQ,GACL,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC"}

package/dist/components/Buttons/buttons.css

@@ -0,0 +1 @@
+.openui-buttons{display:flex;width:100%;gap:var(--openui-space-m, 12px);box-sizing:border-box}.openui-buttons-horizontal{flex-direction:row;flex-wrap:wrap}.openui-buttons-vertical{flex-direction:column}

package/dist/components/Buttons/dependencies.d.ts

@@ -0,0 +1,3 @@
+declare const dependencies: string[];
+export default dependencies;
+//# sourceMappingURL=dependencies.d.ts.map

package/dist/components/Buttons/dependencies.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../../src/components/Buttons/dependencies.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,YAAY,UAAc,CAAC;AACjC,eAAe,YAAY,CAAC"}

package/dist/components/Buttons/dependencies.js

@@ -0,0 +1,3 @@
+const dependencies = ["Buttons"];
+export default dependencies;
+//# sourceMappingURL=dependencies.js.map

package/dist/components/Buttons/dependencies.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../src/components/Buttons/dependencies.ts"],"names":[],"mappings":"AAAA,MAAM,YAAY,GAAG,CAAC,SAAS,CAAC,CAAC;AACjC,eAAe,YAAY,CAAC"}

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

@@ -0,0 +1,2 @@
+export * from "./Buttons";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Buttons/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Buttons/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC"}

package/dist/components/Buttons/index.js

@@ -0,0 +1,2 @@
+export * from "./Buttons";
+//# sourceMappingURL=index.js.map

package/dist/components/Buttons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Buttons/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC"}