@openuidev/react-ui 0.9.16

package/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2011-2024 Thesys Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,13 @@
+# @openuidev/react-ui
+
+React UI components and default libraries for OpenUI.
+
+## Install
+
+```bash
+pnpm add @openuidev/react-ui
+```
+
+## Docs
+
+Detailed documentation is available at [openui.com](https://openui.com).

package/dist/components/Accordion/Accordion.d.ts

@@ -0,0 +1,28 @@
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import React from "react";
+type AccordionVariant = "clear" | "card" | "sunk";
+export type AccordionProps = (AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & {
+    variant?: AccordionVariant;
+};
+export declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
+export interface AccordionItemProps extends React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item> {
+    className?: string;
+    style?: React.CSSProperties;
+    value: string;
+}
+export declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDivElement>>;
+export interface AccordionTriggerProps extends React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger> {
+    className?: string;
+    style?: React.CSSProperties;
+    icon?: React.ReactNode;
+    text: React.ReactNode;
+}
+export declare const AccordionTrigger: React.ForwardRefExoticComponent<AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+export interface AccordionContentProps extends React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content> {
+    className?: string;
+    style?: React.CSSProperties;
+    children?: React.ReactNode;
+}
+export declare const AccordionContent: React.ForwardRefExoticComponent<AccordionContentProps & React.RefAttributes<HTMLDivElement>>;
+export {};
+//# sourceMappingURL=Accordion.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAC;AAGhE,OAAO,KAAqB,MAAM,OAAO,CAAC;AAE1C,KAAK,gBAAgB,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAElD,MAAM,MAAM,cAAc,GAAG,CACzB,kBAAkB,CAAC,oBAAoB,GACvC,kBAAkB,CAAC,sBAAsB,CAC5C,GAAG;IACF,OAAO,CAAC,EAAE,gBAAgB,CAAC;CAC5B,CAAC;AAQF,eAAO,MAAM,SAAS,uFAUpB,CAAC;AAEH,MAAM,WAAW,kBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,IAAI,CAAC;IACtE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,aAAa,2FAWxB,CAAC;AAEH,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC;IACzE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;CACvB;AACD,eAAO,MAAM,gBAAgB,iGAkB3B,CAAC;AAEH,MAAM,WAAW,qBACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,kBAAkB,CAAC,OAAO,CAAC;IACzE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AACD,eAAO,MAAM,gBAAgB,8FAY3B,CAAC"}

package/dist/components/Accordion/Accordion.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+import clsx from "clsx";
+import { ChevronDownIcon } from "lucide-react";
+import { forwardRef } from "react";
+const variantMap = {
+    clear: "openui-accordion-clear",
+    card: "openui-accordion-card",
+    sunk: "openui-accordion-sunk",
+};
+export const Accordion = forwardRef(({ className, style, variant = "clear", ...props }, ref) => (_jsx(AccordionPrimitive.Root, { ref: ref, className: clsx("openui-accordion", variantMap[variant], className), style: style, ...props })));
+export const AccordionItem = forwardRef(({ className, style, value, ...props }, ref) => (_jsx(AccordionPrimitive.Item, { ref: ref, className: clsx("openui-accordion-item", className), style: style, value: value, ...props })));
+export const AccordionTrigger = forwardRef(({ className, style, text, icon, ...props }, ref) => (_jsx(AccordionPrimitive.Header, { className: clsx("openui-accordion-header"), children: _jsxs(AccordionPrimitive.Trigger, { ref: ref, className: clsx("openui-accordion-trigger", className), style: style, ...props, children: [_jsxs("div", { className: "openui-accordion-trigger-content", children: [icon && _jsx("span", { className: "openui-accordion-trigger-content-icon", children: icon }), text] }), _jsx(ChevronDownIcon, { className: "openui-accordion-trigger-icon" })] }) })));
+export const AccordionContent = forwardRef(({ className, style, children, ...props }, ref) => (_jsx(AccordionPrimitive.Content, { ref: ref, className: clsx("openui-accordion-content", className), style: style, ...props, children: _jsx("div", { className: "openui-accordion-content-wrapper", children: children }) })));
+//# sourceMappingURL=Accordion.js.map

package/dist/components/Accordion/Accordion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.js","sourceRoot":"","sources":["../../../src/components/Accordion/Accordion.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,kBAAkB,MAAM,2BAA2B,CAAC;AAChE,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAc,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAW1C,MAAM,UAAU,GAAqC;IACnD,KAAK,EAAE,wBAAwB;IAC/B,IAAI,EAAE,uBAAuB;IAC7B,IAAI,EAAE,uBAAuB;CAC9B,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CAGjC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,GAAG,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAC5D,KAAC,kBAAkB,CAAC,IAAI,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,kBAAkB,EAAE,UAAU,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,EACnE,KAAK,EAAE,KAAK,KACR,KAAK,GACT,CACH,CAAC,CAAC;AASH,MAAM,CAAC,MAAM,aAAa,GAAG,UAAU,CAGrC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAChD,KAAC,kBAAkB,CAAC,IAAI,IACtB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,uBAAuB,EAAE,SAAS,CAAC,EACnD,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,KACR,KAAK,GACT,CACH,CAAC,CAAC;AASH,MAAM,CAAC,MAAM,gBAAgB,GAAG,UAAU,CAGxC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACrD,KAAC,kBAAkB,CAAC,MAAM,IAAC,SAAS,EAAE,IAAI,CAAC,yBAAyB,CAAC,YACnE,MAAC,kBAAkB,CAAC,OAAO,IACzB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,0BAA0B,EAAE,SAAS,CAAC,EACtD,KAAK,EAAE,KAAK,KACR,KAAK,aAET,eAAK,SAAS,EAAC,kCAAkC,aAC9C,IAAI,IAAI,eAAM,SAAS,EAAC,uCAAuC,YAAE,IAAI,GAAQ,EAC7E,IAAI,IACD,EACN,KAAC,eAAe,IAAC,SAAS,EAAC,+BAA+B,GAAG,IAClC,GACH,CAC7B,CAAC,CAAC;AAQH,MAAM,CAAC,MAAM,gBAAgB,GAAG,UAAU,CAGxC,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACnD,KAAC,kBAAkB,CAAC,OAAO,IACzB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,0BAA0B,EAAE,SAAS,CAAC,EACtD,KAAK,EAAE,KAAK,KACR,KAAK,YAET,cAAK,SAAS,EAAC,kCAAkC,YAAE,QAAQ,GAAO,GACvC,CAC9B,CAAC,CAAC"}

package/dist/components/Accordion/accordion.css

@@ -0,0 +1 @@
+.openui-accordion{box-sizing:border-box;border-radius:var(--openui-radius-2xl, 14px);border:1px solid var(--openui-border-default, oklch(9.7% 0 0deg / 0.06));padding:calc(var(--openui-space-m, 12px) + 2px);padding-bottom:0}.openui-accordion-clear{border:1px solid rgba(0,0,0,0);box-shadow:none;padding:0}.openui-accordion-clear .openui-accordion-trigger{box-shadow:none;padding-left:0;padding-right:0;padding-top:var(--openui-space-l, 18px);padding-bottom:var(--openui-space-l, 18px)}.openui-accordion-clear .openui-accordion-item:first-child .openui-accordion-trigger{padding-top:0}.openui-accordion-clear .openui-accordion-item:last-child{border-bottom-left-radius:0px;border-bottom-right-radius:0px;border-bottom:1px solid rgba(0,0,0,0)}.openui-accordion-clear .openui-accordion-content-wrapper{padding:0;padding-bottom:var(--openui-space-l, 18px);gap:var(--openui-space-m, 12px)}.openui-accordion-card .openui-accordion-content-wrapper{padding:0;padding-bottom:var(--openui-space-m, 12px);gap:var(--openui-space-l, 18px)}.openui-accordion-card .openui-accordion-item:last-child .openui-accordion-trigger{border-bottom:none}.openui-accordion-card .openui-accordion-item:last-child{border-bottom-left-radius:0px;border-bottom-right-radius:0px;border-bottom:none}.openui-accordion-sunk{background-color:var(--openui-highlight-subtle, oklch(9.7% 0 0deg / 0.02))}.openui-accordion-sunk .openui-accordion-content-wrapper{padding:0;padding-bottom:var(--openui-space-m, 12px);gap:var(--openui-space-l, 18px)}.openui-accordion-sunk .openui-accordion-item:last-child .openui-accordion-trigger{border-bottom:none}.openui-accordion-item{box-sizing:border-box;overflow:hidden;border-bottom:1px solid var(--openui-border-default, oklch(9.7% 0 0deg / 0.06))}.openui-accordion-item:first-child{margin-top:0;border-top-left-radius:4px;border-top-right-radius:4px}.openui-accordion-item:first-child .openui-accordion-trigger{padding-top:0}.openui-accordion-item:last-child{border-bottom-left-radius:4px;border-bottom-right-radius:4px;border-bottom:none}.openui-accordion-item:focus-within{position:relative;z-index:1}.openui-accordion-header{display:flex;margin-block-start:0;margin-block-end:0;margin-inline-start:0;margin-inline-end:0}.openui-accordion-trigger{border:none;box-sizing:border-box;font:var(--openui-text-body-default);letter-spacing:var(--openui-text-body-default-letter-spacing);background-color:rgba(0,0,0,0);padding:var(--openui-space-l, 18px) 0;width:100%;flex:1;display:flex;align-items:center;justify-content:space-between;color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));cursor:pointer}.openui-accordion-trigger-content{display:flex;align-items:center;color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));gap:var(--openui-space-xs, 6px)}.openui-accordion-trigger-content-icon{display:flex;align-items:center;justify-content:center;height:16px;width:16px}.openui-accordion-trigger-icon{color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));height:16px;width:16px;transition:transform 300ms cubic-bezier(0.87, 0, 0.13, 1)}.openui-accordion-trigger[data-state=open] .openui-accordion-trigger-icon{transform:rotate(180deg)}.openui-accordion-content{overflow:hidden;color:var(--openui-text-neutral-primary, oklch(9.7% 0 0deg));font:var(--openui-text-body-default);letter-spacing:var(--openui-text-body-default-letter-spacing)}.openui-accordion-content[data-state=open]{animation:slideDown 300ms cubic-bezier(0.87, 0, 0.13, 1)}.openui-accordion-content[data-state=closed]{animation:slideUp 300ms cubic-bezier(0.87, 0, 0.13, 1)}.openui-accordion-content-wrapper{box-sizing:border-box;display:flex;flex-direction:column;padding:0;gap:var(--openui-space-l, 18px)}@keyframes slideDown{from{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes slideUp{from{height:var(--radix-accordion-content-height)}to{height:0}}

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

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

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

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

package/dist/components/Accordion/dependencies.js

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

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

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

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

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

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

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

package/dist/components/Accordion/index.js

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

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

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

package/dist/components/Accordion/stories/accordion.stories.d.ts

@@ -0,0 +1,15 @@
+import type { Meta, StoryObj } from "@storybook/react";
+interface AccordionStoryProps {
+    type: "single" | "multiple";
+    collapsible?: boolean;
+    defaultValue?: string;
+    variant?: "clear" | "card" | "sunk";
+    showIcons?: boolean;
+}
+declare const meta: Meta<AccordionStoryProps>;
+export default meta;
+type Story = StoryObj<AccordionStoryProps>;
+export declare const SingleAccordion: Story;
+export declare const MultipleAccordion: Story;
+export declare const WithIconsAccordion: Story;
+//# sourceMappingURL=accordion.stories.d.ts.map

package/dist/components/Accordion/stories/accordion.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"accordion.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/stories/accordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAOvD,UAAU,mBAAmB;IAC3B,IAAI,EAAE,QAAQ,GAAG,UAAU,CAAC;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,mBAAmB,CAgEnC,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,mBAAmB,CAAC,CAAC;AAsF3C,eAAO,MAAM,eAAe,EAAE,KA2B7B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,KA0B/B,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KA+BhC,CAAC"}

package/dist/components/Accordion/stories/accordion.stories.js

@@ -0,0 +1,187 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Bird, Dog, Fish } from "lucide-react";
+import { CardHeader } from "../../CardHeader";
+import { IconButton } from "../../IconButton";
+import { Image } from "../../Image";
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../Accordion";
+const meta = {
+    title: "Components/Accordion",
+    component: Accordion,
+    tags: ["autodocs", "!dev"],
+    parameters: {
+        layout: "centered",
+        docs: {
+            description: {
+                component: "```tsx\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@openui-ui/react-ui';\n```",
+            },
+        },
+    },
+    decorators: [
+        (Story) => (_jsx("div", { style: { width: "400px" }, children: _jsx(Story, {}) })),
+    ],
+    argTypes: {
+        type: {
+            control: "radio",
+            options: ["single", "multiple"],
+            description: "The type of accordion behavior - single item open or multiple items",
+            defaultValue: "single",
+            table: {
+                category: "Behavior",
+            },
+        },
+        collapsible: {
+            control: "boolean",
+            description: "Whether the accordion items can be collapsed (only available for single type)",
+            defaultValue: true,
+            if: { arg: "type", eq: "single" },
+            table: {
+                category: "Behavior",
+            },
+        },
+        defaultValue: {
+            description: 'The default opened item value (only for type="single")',
+            control: false,
+            table: {
+                category: "Behavior",
+            },
+        },
+        variant: {
+            control: "radio",
+            options: ["clear", "card", "sunk"],
+            description: "The visual style variant of the accordion",
+            defaultValue: "card",
+            table: {
+                category: "Appearance",
+            },
+        },
+        showIcons: {
+            control: "boolean",
+            description: "Whether to show icons in the accordion triggers",
+            defaultValue: false,
+            table: {
+                category: "Appearance",
+            },
+        },
+    },
+};
+export default meta;
+const cityItems = [
+    {
+        value: "city-1",
+        title: "New York",
+        subtitle: "The Big Apple",
+        description: "Iconic skyline and urban culture",
+        image: "https://images.pexels.com/photos/466685/pexels-photo-466685.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+    {
+        value: "city-2",
+        title: "Tokyo",
+        subtitle: "Modern Metropolis",
+        description: "Blend of tradition and technology",
+        image: "https://images.pexels.com/photos/2506923/pexels-photo-2506923.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+    {
+        value: "city-3",
+        title: "Paris",
+        subtitle: "City of Light",
+        description: "Romance and architecture",
+        image: "https://images.unsplash.com/photo-1499856871958-5b9627545d1a?q=80&w=3820&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+];
+const landscapeItems = [
+    {
+        value: "landscape-1",
+        title: "Mountains",
+        subtitle: "Alpine Views",
+        description: "Majestic mountain ranges",
+        image: "https://images.pexels.com/photos/1761279/pexels-photo-1761279.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+    {
+        value: "landscape-2",
+        title: "Beaches",
+        subtitle: "Coastal Beauty",
+        description: "Pristine shorelines",
+        image: "https://images.pexels.com/photos/1032650/pexels-photo-1032650.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+    {
+        value: "landscape-3",
+        title: "Forests",
+        subtitle: "Woodland Wonder",
+        description: "Dense forest landscapes",
+        image: "https://images.pexels.com/photos/240040/pexels-photo-240040.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+];
+const animalItems = [
+    {
+        value: "animal-1",
+        title: "Big Cats",
+        icon: _jsx(Dog, {}),
+        subtitle: "Majestic Felines",
+        description: "Lions, tigers, and leopards",
+        image: "https://images.pexels.com/photos/145939/pexels-photo-145939.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+    {
+        value: "animal-2",
+        title: "Marine Life",
+        icon: _jsx(Fish, {}),
+        subtitle: "Ocean Dwellers",
+        description: "Underwater creatures",
+        image: "https://plus.unsplash.com/premium_photo-1661835524331-cbba987ba74c?q=80&w=3878&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
+    },
+    {
+        value: "animal-3",
+        title: "Birds",
+        icon: _jsx(Bird, {}),
+        subtitle: "Aerial Beauty",
+        description: "Colorful avian species",
+        image: "https://images.pexels.com/photos/326900/pexels-photo-326900.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2",
+    },
+];
+export const SingleAccordion = {
+    args: {
+        type: "single",
+        collapsible: true,
+        variant: "clear",
+        showIcons: true,
+    },
+    parameters: {
+        docs: {
+            description: {
+                story: "An accordion showcasing different cities and their urban landscapes.",
+            },
+        },
+    },
+    render: (args) => (_jsx(Accordion, { type: args.type, collapsible: args.collapsible, variant: args.variant, children: cityItems.map((item) => (_jsxs(AccordionItem, { value: item.value, children: [_jsx(AccordionTrigger, { text: item.title }), _jsxs(AccordionContent, { children: [_jsx(CardHeader, { title: item.subtitle, subtitle: item.description }), _jsx(Image, { src: item.image, alt: item.title, scale: "fill" })] })] }, item.value))) })),
+};
+export const MultipleAccordion = {
+    args: {
+        type: "multiple",
+        variant: "card",
+        showIcons: true,
+    },
+    parameters: {
+        docs: {
+            description: {
+                story: "An example of an Accordion that allows multiple items to be open simultaneously.",
+            },
+        },
+    },
+    render: (args) => (_jsx(Accordion, { type: "multiple", variant: args.variant, children: landscapeItems.map((item) => (_jsxs(AccordionItem, { value: item.value, children: [_jsx(AccordionTrigger, { text: item.title }), _jsxs(AccordionContent, { children: [_jsx(CardHeader, { title: item.subtitle, subtitle: item.description }), _jsx(Image, { src: item.image, alt: item.title, scale: "fill" })] })] }, item.value))) })),
+};
+export const WithIconsAccordion = {
+    args: {
+        type: "single",
+        collapsible: true,
+        variant: "card",
+        showIcons: true,
+    },
+    parameters: {
+        docs: {
+            description: {
+                story: "An accordion displaying different categories of animals and wildlife.",
+            },
+        },
+    },
+    render: (args) => (_jsx(Accordion, { type: args.type, collapsible: args.collapsible, variant: args.variant, children: animalItems.map((item) => (_jsxs(AccordionItem, { value: item.value, children: [_jsx(AccordionTrigger, { text: item.title, icon: item.icon }), _jsxs(AccordionContent, { children: [_jsx(CardHeader, { title: item.subtitle, subtitle: item.description, actions: [_jsx(IconButton, { variant: "tertiary", size: "small", icon: item.icon })] }), _jsx(Image, { src: item.image, alt: item.title, scale: "fill" })] })] }, item.value))) })),
+};
+//# sourceMappingURL=accordion.stories.js.map

package/dist/components/Accordion/stories/accordion.stories.js.map

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

package/dist/components/BottomTray/Container.d.ts

@@ -0,0 +1,11 @@
+interface ContainerProps {
+    children?: React.ReactNode;
+    logoUrl: string;
+    agentName: string;
+    className?: string;
+    /** Control the open state of the tray */
+    isOpen?: boolean;
+}
+export declare const Container: ({ children, logoUrl, agentName, className, isOpen, }: ContainerProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Container.d.ts.map

package/dist/components/BottomTray/Container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.d.ts","sourceRoot":"","sources":["../../../src/components/BottomTray/Container.tsx"],"names":[],"mappings":"AAIA,UAAU,cAAc;IACtB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,SAAS,GAAI,sDAMvB,cAAc,4CAmBhB,CAAC"}

package/dist/components/BottomTray/Container.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import { LayoutContextProvider } from "../../context/LayoutContext";
+import { ShellStoreProvider } from "../Shell/store";
+export const Container = ({ children, logoUrl, agentName, className, isOpen = false, }) => {
+    return (_jsx(ShellStoreProvider, { logoUrl: logoUrl, agentName: agentName, children: _jsx(LayoutContextProvider, { layout: "tray", children: _jsx("div", { className: clsx("openui-bottom-tray-container", {
+                    "openui-bottom-tray-container--open": isOpen,
+                    "openui-bottom-tray-container--closed": !isOpen,
+                }, className), children: children }) }) }));
+};
+//# sourceMappingURL=Container.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sourceRoot":"","sources":["../../../src/components/BottomTray/Container.tsx"],"names":[],"mappings":";AAAA,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAWpD,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACxB,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,MAAM,GAAG,KAAK,GACC,EAAE,EAAE;IACnB,OAAO,CACL,KAAC,kBAAkB,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,SAAS,YACxD,KAAC,qBAAqB,IAAC,MAAM,EAAC,MAAM,YAClC,cACE,SAAS,EAAE,IAAI,CACb,8BAA8B,EAC9B;oBACE,oCAAoC,EAAE,MAAM;oBAC5C,sCAAsC,EAAE,CAAC,MAAM;iBAChD,EACD,SAAS,CACV,YAEA,QAAQ,GACL,GACgB,GACL,CACtB,CAAC;AACJ,CAAC,CAAC"}

package/dist/components/BottomTray/ConversationStarter.d.ts

@@ -0,0 +1,15 @@
+import { ConversationStarterProps } from "../../types/ConversationStarter";
+export type ConversationStarterVariant = "short" | "long";
+export interface ConversationStarterContainerProps {
+    starters: ConversationStarterProps[];
+    className?: string;
+    /**
+     * Variant of the conversation starter
+     * - "short": Pill-style horizontal buttons (default)
+     * - "long": List items with icons and hover arrow
+     */
+    variant?: ConversationStarterVariant;
+}
+export declare const ConversationStarter: ({ starters, className, variant, }: ConversationStarterContainerProps) => import("react/jsx-runtime").JSX.Element | null;
+export default ConversationStarter;
+//# sourceMappingURL=ConversationStarter.d.ts.map

package/dist/components/BottomTray/ConversationStarter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConversationStarter.d.ts","sourceRoot":"","sources":["../../../src/components/BottomTray/ConversationStarter.tsx"],"names":[],"mappings":"AAIA,OAAO,EAA2B,wBAAwB,EAAE,MAAM,iCAAiC,CAAC;AAIpG,MAAM,MAAM,0BAA0B,GAAG,OAAO,GAAG,MAAM,CAAC;AAuE1D,MAAM,WAAW,iCAAiC;IAChD,QAAQ,EAAE,wBAAwB,EAAE,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,0BAA0B,CAAC;CACtC;AAED,eAAO,MAAM,mBAAmB,GAAI,mCAIjC,iCAAiC,mDAkDnC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/BottomTray/ConversationStarter.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useThread } from "@openuidev/react-headless";
+import clsx from "clsx";
+import { ArrowUp, Lightbulb } from "lucide-react";
+import { Fragment } from "react";
+import { isChatEmpty } from "../OpenUIChat/utils";
+import { Separator } from "../Separator";
+/**
+ * Renders the appropriate icon based on the icon prop value
+ * - undefined: Show default lightbulb icon
+ * - ReactNode: Show the provided icon (use <></> or React.Fragment for no icon)
+ */
+const renderIcon = (icon) => {
+    if (icon === undefined) {
+        return _jsx(Lightbulb, { size: 16 });
+    }
+    return icon;
+};
+const ConversationStarterItem = ({ displayText, prompt, onClick, variant, icon, }) => {
+    const renderedIcon = renderIcon(icon);
+    if (variant === "short") {
+        return (_jsxs("button", { type: "button", className: "openui-bottom-tray-conversation-starter-item-short", onClick: () => onClick(prompt), children: [renderedIcon && (_jsx("span", { className: "openui-bottom-tray-conversation-starter-item-short__icon", children: renderedIcon })), _jsx("span", { className: "openui-bottom-tray-conversation-starter-item-short__text", children: displayText })] }));
+    }
+    // Long variant (detailed list style)
+    return (_jsxs("button", { type: "button", className: "openui-bottom-tray-conversation-starter-item-long", onClick: () => onClick(prompt), children: [_jsxs("div", { className: "openui-bottom-tray-conversation-starter-item-long__content", children: [renderedIcon && (_jsx("span", { className: "openui-bottom-tray-conversation-starter-item-long__icon", children: renderedIcon })), _jsx("span", { className: "openui-bottom-tray-conversation-starter-item-long__text", children: displayText })] }), _jsx("span", { className: "openui-bottom-tray-conversation-starter-item-long__arrow", children: _jsx(ArrowUp, { size: 16 }) })] }));
+};
+export const ConversationStarter = ({ starters, className, variant = "short", }) => {
+    const processMessage = useThread((s) => s.processMessage);
+    const isRunning = useThread((s) => s.isRunning);
+    const messages = useThread((s) => s.messages);
+    const isLoadingMessages = useThread((s) => s.isLoadingMessages);
+    const handleClick = (prompt) => {
+        if (isRunning)
+            return;
+        processMessage({
+            role: "user",
+            content: prompt,
+        });
+    };
+    // Only show when there are no messages
+    if (!isChatEmpty({ isLoadingMessages, messages })) {
+        return null;
+    }
+    if (starters.length === 0) {
+        return null;
+    }
+    return (_jsx("div", { className: clsx("openui-bottom-tray-conversation-starter", `openui-bottom-tray-conversation-starter--${variant}`, className), children: starters.map((item, index) => (_jsxs(Fragment, { children: [_jsx(ConversationStarterItem, { displayText: item.displayText, prompt: item.prompt, icon: item.icon, onClick: handleClick, variant: variant }), variant === "long" && index < starters.length - 1 && (_jsx("div", { className: "openui-bottom-tray-conversation-starter__separator", children: _jsx(Separator, {}) }))] }, `${item.displayText}-${index}`))) }));
+};
+export default ConversationStarter;
+//# sourceMappingURL=ConversationStarter.js.map

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

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

package/dist/components/BottomTray/Header.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from "react";
+export declare const BottomTrayNewChatButton: () => import("react/jsx-runtime").JSX.Element;
+interface HeaderProps {
+    className?: string;
+    /** Custom content to render on the rightmost side of the logo container */
+    rightChildren?: ReactNode;
+    /** Callback when minimize button is clicked */
+    onMinimize?: () => void;
+    /** Hide the minimize button */
+    hideMinimizeButton?: boolean;
+    /** Custom new chat button */
+    hideNewChatButton?: boolean;
+    /** Hide the thread list container */
+    hideThreadListContainer?: boolean;
+}
+export declare const Header: ({ className, rightChildren, onMinimize, hideMinimizeButton, hideNewChatButton, hideThreadListContainer, }: HeaderProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Header.d.ts.map

package/dist/components/BottomTray/Header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../src/components/BottomTray/Header.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKlC,eAAO,MAAM,uBAAuB,+CAYnC,CAAC;AAEF,UAAU,WAAW;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,+CAA+C;IAC/C,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,+BAA+B;IAC/B,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,6BAA6B;IAC7B,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,qCAAqC;IACrC,uBAAuB,CAAC,EAAE,OAAO,CAAC;CACnC;AAED,eAAO,MAAM,MAAM,GAAI,2GAOpB,WAAW,4CA4Bb,CAAC"}

package/dist/components/BottomTray/Header.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useThreadList } from "@openuidev/react-headless";
+import clsx from "clsx";
+import { SquarePen, X } from "lucide-react";
+import { IconButton } from "../IconButton";
+import { useShellStore } from "../Shell/store";
+import { ThreadListContainer } from "./ThreadListContainer";
+export const BottomTrayNewChatButton = () => {
+    const switchToNewThread = useThreadList((s) => s.switchToNewThread);
+    return (_jsx(IconButton, { icon: _jsx(SquarePen, { size: "1em" }), onClick: switchToNewThread, variant: "tertiary", "aria-label": "New chat", className: "openui-bottom-tray-header-new-chat-button" }));
+};
+export const Header = ({ className, rightChildren, onMinimize, hideMinimizeButton = false, hideNewChatButton = false, hideThreadListContainer = false, }) => {
+    const { logoUrl, agentName } = useShellStore((state) => ({
+        logoUrl: state.logoUrl,
+        agentName: state.agentName,
+    }));
+    return (_jsxs("div", { className: clsx("openui-bottom-tray-header", className), children: [_jsxs("div", { className: "openui-bottom-tray-header-logo-container", children: [_jsx("img", { className: "openui-bottom-tray-header-logo", src: logoUrl, alt: "Logo" }), _jsx("span", { className: "openui-bottom-tray-header-agent-name", children: agentName })] }), _jsxs("div", { className: "openui-bottom-tray-header-actions", children: [rightChildren, !hideThreadListContainer && _jsx(ThreadListContainer, {}), !hideNewChatButton && _jsx(BottomTrayNewChatButton, {}), !hideMinimizeButton && onMinimize && (_jsx(IconButton, { icon: _jsx(X, { size: "1em" }), onClick: onMinimize, variant: "tertiary", "aria-label": "Minimize chat", className: "openui-bottom-tray-header-minimize" }))] })] }));
+};
+//# sourceMappingURL=Header.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Header.js","sourceRoot":"","sources":["../../../src/components/BottomTray/Header.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAC1D,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,EAAE;IAC1C,MAAM,iBAAiB,GAAG,aAAa,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC;IAEpE,OAAO,CACL,KAAC,UAAU,IACT,IAAI,EAAE,KAAC,SAAS,IAAC,IAAI,EAAC,KAAK,GAAG,EAC9B,OAAO,EAAE,iBAAiB,EAC1B,OAAO,EAAC,UAAU,gBACP,UAAU,EACrB,SAAS,EAAC,2CAA2C,GACrD,CACH,CAAC;AACJ,CAAC,CAAC;AAgBF,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,EACrB,SAAS,EACT,aAAa,EACb,UAAU,EACV,kBAAkB,GAAG,KAAK,EAC1B,iBAAiB,GAAG,KAAK,EACzB,uBAAuB,GAAG,KAAK,GACnB,EAAE,EAAE;IAChB,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QACvD,OAAO,EAAE,KAAK,CAAC,OAAO;QACtB,SAAS,EAAE,KAAK,CAAC,SAAS;KAC3B,CAAC,CAAC,CAAC;IAEJ,OAAO,CACL,eAAK,SAAS,EAAE,IAAI,CAAC,2BAA2B,EAAE,SAAS,CAAC,aAC1D,eAAK,SAAS,EAAC,0CAA0C,aACvD,cAAK,SAAS,EAAC,gCAAgC,EAAC,GAAG,EAAE,OAAO,EAAE,GAAG,EAAC,MAAM,GAAG,EAC3E,eAAM,SAAS,EAAC,sCAAsC,YAAE,SAAS,GAAQ,IACrE,EACN,eAAK,SAAS,EAAC,mCAAmC,aAC/C,aAAa,EACb,CAAC,uBAAuB,IAAI,KAAC,mBAAmB,KAAG,EACnD,CAAC,iBAAiB,IAAI,KAAC,uBAAuB,KAAG,EACjD,CAAC,kBAAkB,IAAI,UAAU,IAAI,CACpC,KAAC,UAAU,IACT,IAAI,EAAE,KAAC,CAAC,IAAC,IAAI,EAAC,KAAK,GAAG,EACtB,OAAO,EAAE,UAAU,EACnB,OAAO,EAAC,UAAU,gBACP,eAAe,EAC1B,SAAS,EAAC,oCAAoC,GAC9C,CACH,IACG,IACF,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/components/BottomTray/Thread.d.ts

@@ -0,0 +1,48 @@
+import type { Message } from "@openuidev/react-headless";
+import React from "react";
+import { ScrollVariant } from "../../hooks/useScrollToBottom";
+import type { AssistantMessageComponent, UserMessageComponent } from "../OpenUIChat/types";
+export declare const ThreadContainer: ({ children, className, isArtifactActive, renderArtifact, }: {
+    children?: React.ReactNode;
+    className?: string;
+    isArtifactActive?: boolean;
+    renderArtifact?: () => React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const ScrollArea: ({ children, className, scrollVariant, userMessageSelector, }: {
+    children?: React.ReactNode;
+    className?: string;
+    /**
+     * Scroll to bottom once the last message is added
+     */
+    scrollVariant?: ScrollVariant;
+    /**
+     * Selector for the user message
+     */
+    userMessageSelector?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const AssistantMessageContainer: ({ children, className, }: {
+    children?: React.ReactNode;
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const UserMessageContainer: ({ children, className, }: {
+    children?: React.ReactNode;
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const RenderMessage: React.MemoExoticComponent<({ message, className, allMessages, assistantMessage: CustomAssistantMessage, userMessage: CustomUserMessage, }: {
+    message: Message;
+    className?: string;
+    allMessages: Message[];
+    assistantMessage?: AssistantMessageComponent;
+    userMessage?: UserMessageComponent;
+}) => import("react/jsx-runtime").JSX.Element | null>;
+export declare const MessageLoading: () => import("react/jsx-runtime").JSX.Element;
+export declare const Messages: ({ className, loader, assistantMessage, userMessage, }: {
+    className?: string;
+    loader?: React.ReactNode;
+    assistantMessage?: AssistantMessageComponent;
+    userMessage?: UserMessageComponent;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const Composer: ({ className }: {
+    className?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Thread.d.ts.map

package/dist/components/BottomTray/Thread.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Thread.d.ts","sourceRoot":"","sources":["../../../src/components/BottomTray/Thread.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAoB,OAAO,EAAe,MAAM,2BAA2B,CAAC;AAIxF,OAAO,KAAmD,MAAM,OAAO,CAAC;AAExE,OAAO,EAAE,aAAa,EAAqB,MAAM,+BAA+B,CAAC;AAIjF,OAAO,KAAK,EAAE,yBAAyB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAK3F,eAAO,MAAM,eAAe,GAAI,4DAK7B;IACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,cAAc,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;CACxC,4CAuBA,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,8DAKxB;IACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAC9B,4CA0CA,CAAC;AAEF,eAAO,MAAM,yBAAyB,GAAI,0BAGvC;IACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,4CAMA,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAI,0BAGlC;IACD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,4CAMA,CAAC;AAyEF,eAAO,MAAM,aAAa,6IAOrB;IACD,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,OAAO,EAAE,CAAC;IACvB,gBAAgB,CAAC,EAAE,yBAAyB,CAAC;IAC7C,WAAW,CAAC,EAAE,oBAAoB,CAAC;CACpC,oDA6BF,CAAC;AAEF,eAAO,MAAM,cAAc,+CAM1B,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,uDAKtB;IACD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,gBAAgB,CAAC,EAAE,yBAAyB,CAAC;IAC7C,WAAW,CAAC,EAAE,oBAAoB,CAAC;CACpC,4CAqBA,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,eAAe;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,4CAuD7D,CAAC"}