@pathscale/ui 0.1.1 → 1.2.0

package/dist/components/card/card.css

@@ -0,0 +1,171 @@
+@layer components {
+  .card {
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      border-radius: var(--radius-box);
+      outline-width: 2px;
+      transition: outline 0.2s ease-in-out;
+      outline: 0 solid #0000;
+      outline-offset: 2px;
+    }
+
+  .card:focus {
+      --tw-outline-style: none;
+      outline-style: none;
+    }
+
+  @media (forced-colors: active) {
+    .card:focus {
+      outline: 2px solid transparent;
+      outline-offset: 2px;
+    }
+    }
+
+  .card:focus-visible {
+      outline-color: currentColor;
+    }
+
+  .card :where(figure:first-child) {
+      overflow: hidden;
+      border-start-start-radius: inherit;
+      border-start-end-radius: inherit;
+      border-end-start-radius: unset;
+      border-end-end-radius: unset;
+    }
+
+  .card :where(figure:last-child) {
+      overflow: hidden;
+      border-start-start-radius: unset;
+      border-start-end-radius: unset;
+      border-end-start-radius: inherit;
+      border-end-end-radius: inherit;
+    }
+
+  .card figure {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+  .card:has(> input:is(input[type="checkbox"], input[type="radio"])) {
+      cursor: pointer;
+      user-select: none;
+    }
+
+  .card:has(> :checked) {
+      outline: 2px solid currentColor;
+    }
+
+  .card-body {
+      display: flex;
+      flex: auto;
+      flex-direction: column;
+      gap: calc(0.25rem * 2);
+      padding: var(--card-p, 1.5rem);
+      font-size: var(--card-fs, 0.875rem);
+    }
+
+  .card-body :where(p) {
+      flex-grow: 1;
+    }
+
+  .card-actions {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: flex-start;
+      gap: calc(0.25rem * 2);
+    }
+
+  .card-title {
+      display: flex;
+      align-items: center;
+      gap: calc(0.25rem * 2);
+      font-size: var(--cardtitle-fs, 1.125rem);
+      font-weight: 600;
+    }
+
+  .card-side {
+      align-items: stretch;
+      flex-direction: row;
+    }
+
+  .card-side :where(figure:first-child) {
+      overflow: hidden;
+      border-start-start-radius: inherit;
+      border-start-end-radius: unset;
+      border-end-start-radius: inherit;
+      border-end-end-radius: unset;
+    }
+
+  .card-side :where(figure:last-child) {
+      overflow: hidden;
+      border-start-start-radius: unset;
+      border-start-end-radius: inherit;
+      border-end-start-radius: unset;
+      border-end-end-radius: inherit;
+    }
+
+  .card-side figure > * {
+      max-width: unset;
+    }
+
+  .card-side :where(figure > *) {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
+  .card-lg .card-body {
+      --card-p: 2rem;
+      --card-fs: 1rem;
+    }
+
+  .card-lg .card-title {
+      --cardtitle-fs: 1.25rem;
+    }
+
+  .card-md .card-body {
+      --card-p: 1.5rem;
+      --card-fs: 0.875rem;
+    }
+
+  .card-md .card-title {
+      --cardtitle-fs: 1.125rem;
+    }
+
+  .card-sm .card-body {
+      --card-p: 1rem;
+      --card-fs: 0.75rem;
+    }
+
+  .card-sm .card-title {
+      --cardtitle-fs: 1rem;
+    }
+
+  .card-xl .card-body {
+      --card-p: 2.5rem;
+      --card-fs: 1.125rem;
+    }
+
+  .card-xl .card-title {
+      --cardtitle-fs: 1.375rem;
+    }
+
+  .card-xs .card-body {
+      --card-p: 0.5rem;
+      --card-fs: 0.6875rem;
+    }
+
+  .card-xs .card-title {
+      --cardtitle-fs: 0.875rem;
+    }
+
+  .card-border {
+      border: var(--border) solid var(--color-base-200);
+    }
+
+  .card-dash {
+      border: var(--border) dashed var(--color-base-200);
+    }
+}

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

@@ -1 +1 @@
-export { default } from "./Card";
+export { default, type CardProps } from "./Card";

package/dist/components/card/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__ from "./Card.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Card_js_d67c086a__["default"];
+export { __webpack_exports__default as default };

package/dist/components/carousel/Carousel.d.ts

@@ -1,3 +1,4 @@
+import "./carousel.css";
 import { type JSX, type ParentProps } from "solid-js";
 export type CarouselProps = JSX.HTMLAttributes<HTMLDivElement> & {
     snap?: "start" | "center" | "end";

package/dist/components/carousel/Carousel.js

@@ -0,0 +1,70 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./carousel.css";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__CarouselItem_js_1038c5b2__ from "./CarouselItem.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div><div class=carousel-content>");
+const Carousel = (props)=>{
+    const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "class",
+        "children",
+        "snap",
+        "direction",
+        "aria-label",
+        "aria-roledescription",
+        "aria-describedby",
+        "aria-labelledby",
+        "aria-live",
+        "aria-atomic"
+    ]);
+    const classes = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("carousel", local.class, (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])({
+            "carousel-start": "start" === local.snap || !local.snap,
+            "carousel-center": "center" === local.snap,
+            "carousel-end": "end" === local.snap,
+            "carousel-vertical": "vertical" === local.direction,
+            "carousel-horizontal": "horizontal" === local.direction
+        })));
+    const ariaRoleDescription = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local["aria-roledescription"] || "carousel");
+    const ariaLabel = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local["aria-label"]);
+    const ariaDescribedby = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local["aria-describedby"]);
+    const ariaLabelledby = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local["aria-labelledby"]);
+    const ariaLive = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local["aria-live"] || "polite");
+    const ariaAtomic = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local["aria-atomic"] || false);
+    return (()=>{
+        var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(rest, {
+            get ["class"] () {
+                return classes();
+            },
+            role: "region",
+            get ["aria-roledescription"] () {
+                return ariaRoleDescription();
+            },
+            get ["aria-label"] () {
+                return ariaLabel();
+            },
+            get ["aria-describedby"] () {
+                return ariaDescribedby();
+            },
+            get ["aria-labelledby"] () {
+                return ariaLabelledby();
+            }
+        }), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.children);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)((_p$)=>{
+            var _v$ = ariaLive(), _v$2 = ariaAtomic();
+            _v$ !== _p$.e && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$2, "aria-live", _p$.e = _v$);
+            _v$2 !== _p$.t && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$2, "aria-atomic", _p$.t = _v$2);
+            return _p$;
+        }, {
+            e: void 0,
+            t: void 0
+        });
+        return _el$;
+    })();
+};
+const carousel_Carousel = Object.assign(Carousel, {
+    Item: __WEBPACK_EXTERNAL_MODULE__CarouselItem_js_1038c5b2__["default"]
+});
+export { carousel_Carousel as default };

package/dist/components/carousel/CarouselItem.js

@@ -0,0 +1,27 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const CarouselItem_CarouselItem = (props)=>{
+    const [local, rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "class",
+        "children",
+        "aria-current"
+    ]);
+    const classes = (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("carousel-item", local.class);
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(rest, {
+            class: classes,
+            role: "group",
+            "aria-roledescription": "slide",
+            get ["aria-current"] () {
+                return local["aria-current"];
+            }
+        }), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>local.children);
+        return _el$;
+    })();
+};
+const CarouselItem = CarouselItem_CarouselItem;
+export { CarouselItem as default };

package/dist/components/carousel/carousel.css

@@ -0,0 +1,39 @@
+@layer components {
+  .carousel-item {
+      box-sizing: content-box;
+      display: flex;
+      flex: none;
+      scroll-snap-align: start;
+    }
+
+  .carousel {
+      display: inline-flex;
+      overflow-x: scroll;
+      scroll-snap-type: x mandatory;
+      scrollbar-width: none;
+    }
+
+  @media (prefers-reduced-motion: no-preference) {
+    .carousel {
+      scroll-behavior: smooth;
+    }
+    }
+
+  .carousel::-webkit-scrollbar {
+      display: none;
+    }
+
+  .carousel-vertical {
+      flex-direction: column;
+      overflow-y: scroll;
+      scroll-snap-type: y mandatory;
+    }
+
+  .carousel-center .carousel-item {
+      scroll-snap-align: center;
+    }
+
+  .carousel-end .carousel-item {
+      scroll-snap-align: end;
+    }
+}

package/dist/components/carousel/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__Carousel_js_a0787cfa__ from "./Carousel.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Carousel_js_a0787cfa__["default"];
+export { __webpack_exports__default as default };

package/dist/components/chatbubble/ChatBubble.d.ts

@@ -1,3 +1,4 @@
+import "./chat.css";
 import { type JSX } from "solid-js";
 import type { IComponentBaseProps } from "../types";
 export type ChatBubbleProps = IComponentBaseProps & JSX.HTMLAttributes<HTMLDivElement> & {

package/dist/components/chatbubble/ChatBubble.js

@@ -0,0 +1,48 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import "./chat.css";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__ChatBubbleHeader_js_27ae7dae__ from "./ChatBubbleHeader.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ChatBubbleTime_js_4a8b0bdd__ from "./ChatBubbleTime.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ChatBubbleAvatar_js_15308dcc__ from "./ChatBubbleAvatar.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ChatBubbleMessage_js_98a4ad66__ from "./ChatBubbleMessage.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ChatBubbleFooter_js_337289df__ from "./ChatBubbleFooter.js";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const ChatBubble = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "end",
+        "dataTheme",
+        "class",
+        "className",
+        "style"
+    ]);
+    const classes = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("chat", (0, __WEBPACK_EXTERNAL_MODULE_clsx__["default"])({
+            "chat-end": local.end,
+            "chat-start": !local.end
+        }), local.class, local.className));
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            get ["data-theme"] () {
+                return local.dataTheme;
+            },
+            get ["class"] () {
+                return classes();
+            },
+            get style () {
+                return local.style;
+            }
+        }), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, ()=>others.children);
+        return _el$;
+    })();
+};
+const chatbubble_ChatBubble = Object.assign(ChatBubble, {
+    Header: __WEBPACK_EXTERNAL_MODULE__ChatBubbleHeader_js_27ae7dae__["default"],
+    Time: __WEBPACK_EXTERNAL_MODULE__ChatBubbleTime_js_4a8b0bdd__["default"],
+    Avatar: __WEBPACK_EXTERNAL_MODULE__ChatBubbleAvatar_js_15308dcc__["default"],
+    Message: __WEBPACK_EXTERNAL_MODULE__ChatBubbleMessage_js_98a4ad66__["default"],
+    Footer: __WEBPACK_EXTERNAL_MODULE__ChatBubbleFooter_js_337289df__["default"]
+});
+export { chatbubble_ChatBubble as default };

package/dist/components/chatbubble/ChatBubbleAvatar.d.ts

@@ -1,6 +1,10 @@
 import type { JSX } from "solid-js";
-import type { AvatarProps } from "../avatar";
+import type { AvatarRootProps } from "../avatar";
 import type { IComponentBaseProps } from "../types";
-export type ChatBubbleAvatarProps = AvatarProps & IComponentBaseProps;
+export type ChatBubbleAvatarProps = {
+    src?: string;
+    alt?: string;
+    fallback?: string;
+} & Omit<AvatarRootProps, "children"> & IComponentBaseProps;
 declare const ChatBubbleAvatar: (props: ChatBubbleAvatarProps) => JSX.Element;
 export default ChatBubbleAvatar;

package/dist/components/chatbubble/ChatBubbleAvatar.js

@@ -0,0 +1,42 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__avatar_index_js_ad25bec4__ from "../avatar/index.js";
+const ChatBubbleAvatar = (props)=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__avatar_index_js_ad25bec4__["default"], {
+        get size () {
+            return props.size ?? "sm";
+        },
+        get color () {
+            return props.color;
+        },
+        get variant () {
+            return props.variant;
+        },
+        get ["class"] () {
+            return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("chat-image", props.class);
+        },
+        get dataTheme () {
+            return props.dataTheme;
+        },
+        get style () {
+            return props.style;
+        },
+        get children () {
+            return [
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!props.src)() && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__avatar_index_js_ad25bec4__["default"].Image, {
+                        get src () {
+                            return props.src;
+                        },
+                        get alt () {
+                            return props.alt;
+                        }
+                    })),
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__avatar_index_js_ad25bec4__["default"].Fallback, {
+                    get children () {
+                        return props.fallback ?? props.alt?.charAt(0) ?? "?";
+                    }
+                })
+            ];
+        }
+    });
+const chatbubble_ChatBubbleAvatar = ChatBubbleAvatar;
+export { chatbubble_ChatBubbleAvatar as default };

package/dist/components/chatbubble/ChatBubbleFooter.js

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const ChatBubbleFooter = (props)=>(()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            get ["class"] () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("chat-footer opacity-50", props.class);
+            }
+        }), false, false);
+        return _el$;
+    })();
+const chatbubble_ChatBubbleFooter = ChatBubbleFooter;
+export { chatbubble_ChatBubbleFooter as default };

package/dist/components/chatbubble/ChatBubbleHeader.js

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const ChatBubbleHeader_ChatBubbleHeader = (props)=>(()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            get ["class"] () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("chat-header", props.class);
+            }
+        }), false, false);
+        return _el$;
+    })();
+const ChatBubbleHeader = ChatBubbleHeader_ChatBubbleHeader;
+export { ChatBubbleHeader as default };

package/dist/components/chatbubble/ChatBubbleMessage.js

@@ -0,0 +1,28 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE_clsx__ from "clsx";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+const ChatBubbleMessage_ChatBubbleMessage = (props)=>{
+    const bubbleClass = (0, __WEBPACK_EXTERNAL_MODULE_clsx__.clsx)({
+        "chat-bubble": true,
+        "chat-bubble-neutral": "neutral" === props.color,
+        "chat-bubble-primary": "primary" === props.color,
+        "chat-bubble-secondary": "secondary" === props.color,
+        "chat-bubble-accent": "accent" === props.color,
+        "chat-bubble-info": "info" === props.color,
+        "chat-bubble-success": "success" === props.color,
+        "chat-bubble-warning": "warning" === props.color,
+        "chat-bubble-error": "error" === props.color
+    });
+    return (()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            get ["class"] () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(bubbleClass, props.class);
+            }
+        }), false, false);
+        return _el$;
+    })();
+};
+const ChatBubbleMessage = ChatBubbleMessage_ChatBubbleMessage;
+export { ChatBubbleMessage as default };

package/dist/components/chatbubble/ChatBubbleTime.js

@@ -0,0 +1,14 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<time>");
+const ChatBubbleTime = (props)=>(()=>{
+        var _el$ = _tmpl$();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(props, {
+            get ["class"] () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-xs opacity-50", props.class);
+            }
+        }), false, false);
+        return _el$;
+    })();
+const chatbubble_ChatBubbleTime = ChatBubbleTime;
+export { chatbubble_ChatBubbleTime as default };

package/dist/components/chatbubble/chat.css

@@ -0,0 +1,153 @@
+@layer components {
+  .chat-bubble {
+      position: relative;
+      display: block;
+      width: fit-content;
+      border-radius: var(--radius-field);
+      background-color: var(--color-base-300);
+      padding-inline: calc(0.25rem * 4);
+      padding-block: calc(0.25rem * 2);
+      color: var(--color-base-content);
+      grid-row-end: 3;
+      min-height: 2rem;
+      min-width: 2.5rem;
+      max-width: 90%;
+    }
+
+  .chat-bubble:before {
+      position: absolute;
+      bottom: calc(0.25rem * 0);
+      height: calc(0.25rem * 3);
+      width: calc(0.25rem * 3);
+      background-color: inherit;
+      content: "";
+      mask-repeat: no-repeat;
+      mask-image: var(--mask-chat);
+      mask-position: 0px -1px;
+      mask-size: 0.8125rem;
+    }
+
+  .chat-end {
+      place-items: end;
+      grid-template-columns: 1fr auto;
+    }
+
+  .chat-end .chat-header {
+      grid-column-start: 1;
+    }
+
+  .chat-end .chat-footer {
+      grid-column-start: 1;
+    }
+
+  .chat-end .chat-image {
+      grid-column-start: 2;
+    }
+
+  .chat-end .chat-bubble {
+      grid-column-start: 1;
+      border-end-end-radius: 0;
+    }
+
+  .chat-end .chat-bubble:before {
+      transform: rotateY(180deg);
+      inset-inline-start: 100%;
+    }
+
+  [dir="rtl"] .chat-end .chat-bubble:before {
+      transform: rotateY(0deg);
+    }
+
+  .chat-start {
+      place-items: start;
+      grid-template-columns: auto 1fr;
+    }
+
+  .chat-start .chat-header {
+      grid-column-start: 2;
+    }
+
+  .chat-start .chat-footer {
+      grid-column-start: 2;
+    }
+
+  .chat-start .chat-image {
+      grid-column-start: 1;
+    }
+
+  .chat-start .chat-bubble {
+      grid-column-start: 2;
+      border-end-start-radius: 0;
+    }
+
+  .chat-start .chat-bubble:before {
+      transform: rotateY(0deg);
+      inset-inline-start: -0.75rem;
+    }
+
+  [dir="rtl"] .chat-start .chat-bubble:before {
+      transform: rotateY(180deg);
+    }
+
+  .chat-image {
+      grid-row: span 2 / span 2;
+      align-self: flex-end;
+    }
+
+  .chat-footer {
+      grid-row-start: 3;
+      display: flex;
+      gap: calc(0.25rem * 1);
+      font-size: 0.6875rem;
+    }
+
+  .chat-header {
+      grid-row-start: 1;
+      display: flex;
+      gap: calc(0.25rem * 1);
+      font-size: 0.6875rem;
+    }
+
+  .chat {
+      display: grid;
+      grid-auto-rows: min-content;
+      column-gap: calc(0.25rem * 3);
+      padding-block: calc(0.25rem * 1);
+      --mask-chat: url("data:image/svg+xml,%3csvg width='13' height='13' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill='black' d='M0 11.5004C0 13.0004 2 13.0004 2 13.0004H12H13V0.00036329L12.5 0C12.5 0 11.977 2.09572 11.8581 2.50033C11.6075 3.35237 10.9149 4.22374 9 5.50036C6 7.50036 0 10.0004 0 11.5004Z'/%3e%3c/svg%3e");
+    }
+
+  .chat-bubble-accent {
+      background-color: var(--color-accent);
+      color: var(--color-accent-content);
+    }
+
+  .chat-bubble-error {
+      background-color: var(--color-error);
+      color: var(--color-error-content);
+    }
+
+  .chat-bubble-info {
+      background-color: var(--color-info);
+      color: var(--color-info-content);
+    }
+
+  .chat-bubble-primary {
+      background-color: var(--color-primary);
+      color: var(--color-primary-content);
+    }
+
+  .chat-bubble-secondary {
+      background-color: var(--color-secondary);
+      color: var(--color-secondary-content);
+    }
+
+  .chat-bubble-success {
+      background-color: var(--color-success);
+      color: var(--color-success-content);
+    }
+
+  .chat-bubble-warning {
+      background-color: var(--color-warning);
+      color: var(--color-warning-content);
+    }
+}

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

@@ -1 +1 @@
-export { default } from "./ChatBubble";
+export { default, type ChatBubbleProps } from "./ChatBubble";

package/dist/components/chatbubble/index.js

@@ -0,0 +1,3 @@
+import * as __WEBPACK_EXTERNAL_MODULE__ChatBubble_js_6824c835__ from "./ChatBubble.js";
+var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__ChatBubble_js_6824c835__["default"];
+export { __webpack_exports__default as default };