@versini/ui-bubble 8.0.9 → 9.0.0

package/README.md

@@ -37,7 +37,7 @@ npm install @versini/ui-bubble
 ### Basic Bubbles
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
 
 function App() {
   return (
@@ -57,7 +57,7 @@ function App() {
 ### Bubble with Footer
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
 
 function App() {
   return (
@@ -79,7 +79,7 @@ function App() {
 ### Copy to Clipboard
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
 
 function App() {
   return (
@@ -111,7 +111,7 @@ function App() {
 ### Chat Interface
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
 
 function ChatExample() {
   const messages = [
@@ -151,7 +151,8 @@ function ChatExample() {
 ### Advanced Footer Usage
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
+import { BUBBLE_FOOTER_EMPTY } from "@versini/ui-bubble/constants";
 
 function AdvancedFooterExample() {
   return (
@@ -163,7 +164,7 @@ function AdvancedFooterExample() {
         footer={{
           "Message ID": "msg-123",
           Sent: "2:30 PM",
-          Status: Bubble.FOOTER_EMPTY, // Empty row that maintains height
+          Status: BUBBLE_FOOTER_EMPTY, // Empty row that maintains height
           Delivered: "2:31 PM",
           Read: "2:35 PM"
         }}
@@ -191,7 +192,7 @@ function AdvancedFooterExample() {
 ### Custom Width Control
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
 
 function CustomWidthExample() {
   return (
@@ -220,7 +221,7 @@ function CustomWidthExample() {
 ### Copy Functionality Variations
 
 ```tsx
-import { Bubble } from "@versini/ui-bubble";
+import { Bubble } from "@versini/ui-bubble/bubble";
 
 function CopyFunctionalityExample() {
   const handleCustomCopy = (text: any) => {
@@ -281,4 +282,4 @@ function CopyFunctionalityExample() {
 
 ### Special Values
 
-- `Bubble.FOOTER_EMPTY` - Use in footer to create an empty row that maintains height
+- `BUBBLE_FOOTER_EMPTY` - Import from `@versini/ui-bubble/constants` to create an empty footer row that maintains height

package/dist/common/constants.d.ts

@@ -0,0 +1 @@
+export declare const BUBBLE_CLASSNAME = "av-bubble";

package/dist/common/constants.js

@@ -0,0 +1,22 @@
+/*!
+  @versini/ui-bubble v9.0.0
+  © 2025 gizmette.com
+*/
+try {
+  if (!window.__VERSINI_UI_BUBBLE__) {
+    window.__VERSINI_UI_BUBBLE__ = {
+      version: "9.0.0",
+      buildTime: "12/22/2025 09:50 AM EST",
+      homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
+      license: "MIT",
+    };
+  }
+} catch (error) {
+  // nothing to declare officer
+}
+
+
+;// CONCATENATED MODULE: ./src/common/constants.ts
+const BUBBLE_CLASSNAME = "av-bubble";
+
+export { BUBBLE_CLASSNAME };

package/dist/components/Bubble/Bubble.d.ts

@@ -0,0 +1,2 @@
+import type { BubbleProps } from "./BubbleTypes";
+export declare const Bubble: ({ children, kind, className, contentClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode, copyToClipboardMode, noMaxWidth, tail, gradient, }: BubbleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/{index.js → components/Bubble/Bubble.js}

@@ -1,12 +1,12 @@
 /*!
-  @versini/ui-bubble v8.0.9
+  @versini/ui-bubble v9.0.0
   © 2025 gizmette.com
 */
 try {
   if (!window.__VERSINI_UI_BUBBLE__) {
     window.__VERSINI_UI_BUBBLE__ = {
-      version: "8.0.9",
-      buildTime: "12/16/2025 06:22 PM EST",
+      version: "9.0.0",
+      buildTime: "12/22/2025 09:50 AM EST",
       homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
       license: "MIT",
     };
@@ -19,10 +19,8 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { ButtonIcon } from "@versini/ui-button/button-icon";
 import { IconCopied, IconCopy } from "@versini/ui-icons";
 import { useEffect, useState } from "react";
-import clsx from "clsx";
-
-;// CONCATENATED MODULE: ./src/common/constants.ts
-const BUBBLE_CLASSNAME = "av-bubble";
+import { BUBBLE_FOOTER_EMPTY } from "../BubbleConstants/BubbleConstants.js";
+import { getBubbleClasses } from "./utilities.js";
 
 ;// CONCATENATED MODULE: external "react/jsx-runtime"
 
@@ -32,93 +30,9 @@ const BUBBLE_CLASSNAME = "av-bubble";
 
 ;// CONCATENATED MODULE: external "react"
 
-;// CONCATENATED MODULE: external "clsx"
-
-;// CONCATENATED MODULE: ./src/components/Bubble/utilities.ts
+;// CONCATENATED MODULE: external "../BubbleConstants/BubbleConstants.js"
 
-
-const getBubbleSizesClasses = ({ kind, noMaxWidth })=>{
-    return clsx("px-4 py-2", {
-        "max-w-xs sm:max-w-md md:max-w-2xl": !noMaxWidth,
-        "lg:max-w-3xl": kind === "left" && !noMaxWidth
-    });
-};
-const getBubbleColorClasses = ({ kind, gradient })=>{
-    // No gradient - solid colors
-    if (!gradient) {
-        return clsx({
-            "bg-surface-light dark:bg-surface-dark": kind === "left",
-            "bg-surface-accent": kind === "right"
-        });
-    }
-    // Gradient presets based on intensity
-    if (gradient === "light") {
-        return clsx({
-            "bg-gradient-to-b from-surface-light/80 to-surface-light dark:from-surface-dark/80 dark:to-surface-dark": kind === "left",
-            "bg-gradient-to-b from-surface-accent/80 to-surface-accent": kind === "right"
-        });
-    }
-    if (gradient === "medium") {
-        return clsx({
-            "bg-gradient-to-b from-surface-light/65 to-surface-light dark:from-surface-dark/65 dark:to-surface-dark": kind === "left",
-            "bg-gradient-to-b from-surface-accent/65 to-surface-accent": kind === "right"
-        });
-    }
-    // gradient === "strong"
-    return clsx({
-        "bg-gradient-to-b from-surface-light/50 to-surface-light dark:from-surface-dark/50 dark:to-surface-dark": kind === "left",
-        "bg-gradient-to-b from-surface-accent/50 to-surface-accent": kind === "right"
-    });
-};
-const getBubbleTypographyClasses = ({ kind })=>{
-    return clsx("prose prose-dark dark:prose-lighter", "prose-blockquote:my-1", "prose-ol:my-1 prose-ul:my-1", {
-        "text-copy-lighter": kind === "right"
-    });
-};
-const getBubbleBorderClasses = ({ kind, tail })=>{
-    if (tail) {
-        return clsx(`${BUBBLE_CLASSNAME}-${kind}-tail`, "rounded-3xl", "relative", "before:content-['']", "before:w-3", "before:h-2", "before:absolute", "before:bottom-0", {
-            "last-bubble-right:before:right-[2px] last-bubble-right:before:border-l-[8px] last-bubble-right:before:border-l-surface-accent last-bubble-right:before:rounded-bl-[100%]": kind === "right",
-            "last-bubble-left:before:left-[2px] last-bubble-left:before:border-r-[8px] last-bubble-left:before:border-r-surface-light last-bubble-left:dark:before:border-r-surface-dark last-bubble-left:before:rounded-br-[100%]": kind === "left"
-        });
-    }
-    if (!tail) {
-        return clsx("rounded-b-xl", {
-            "rounded-tr-xl": kind === "left",
-            "rounded-tl-xl": kind === "right"
-        });
-    }
-};
-const getBubbleClasses = ({ kind, className, contentClassName, noMaxWidth, tail, gradient })=>{
-    const wrapper = clsx(BUBBLE_CLASSNAME, `${BUBBLE_CLASSNAME}-${kind}`, "flex items-start", {
-        "flex-row-reverse": kind === "right"
-    }, className);
-    const main = clsx(`${BUBBLE_CLASSNAME}-content`, "flex flex-col empty:hidden", getBubbleSizesClasses({
-        kind,
-        noMaxWidth
-    }), getBubbleTypographyClasses({
-        kind
-    }), getBubbleColorClasses({
-        kind,
-        gradient
-    }), getBubbleBorderClasses({
-        kind,
-        tail
-    }), contentClassName);
-    const footer = "pr-2 pt-1 text-end text-xs text-copy-light";
-    const copyButton = clsx("flex flex-col-reverse sm:flex-row", {
-        "ml-2": kind === "left" && !tail,
-        "mr-2": kind === "right" && !tail,
-        "ml-1": kind === "left" && tail,
-        "mr-1": kind === "right" && tail
-    });
-    return {
-        wrapper,
-        main,
-        footer,
-        copyButton
-    };
-};
+;// CONCATENATED MODULE: external "./utilities.js"
 
 ;// CONCATENATED MODULE: ./src/components/Bubble/Bubble.tsx
 
@@ -126,8 +40,7 @@ const getBubbleClasses = ({ kind, className, contentClassName, noMaxWidth, tail,
 
 
 
-// Special symbol to represent an empty footer row that should maintain its height
-const BUBBLE_FOOTER_EMPTY = "FOOTER_EMPTY";
+
 const Bubble = ({ children, kind = "left", className, contentClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode = "system", copyToClipboardMode = "system", noMaxWidth = false, tail = false, gradient })=>{
     const [copied, setCopied] = useState(false);
     const bubbleClasses = getBubbleClasses({
@@ -227,8 +140,4 @@ const Bubble = ({ children, kind = "left", className, contentClassName, footer,
     });
 };
 
-;// CONCATENATED MODULE: ./src/components/index.ts
-
-
-
-export { BUBBLE_CLASSNAME, BUBBLE_FOOTER_EMPTY, Bubble };
+export { Bubble };

package/dist/{index.d.ts → components/Bubble/BubbleTypes.d.ts}

@@ -1,109 +1,101 @@
-import { JSX } from 'react/jsx-runtime';
-
-export declare const Bubble: ({ children, kind, className, contentClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode, copyToClipboardMode, noMaxWidth, tail, gradient, }: BubbleProps) => JSX.Element;
-
-export declare const BUBBLE_CLASSNAME = "av-bubble";
-
-export declare const BUBBLE_FOOTER_EMPTY = "FOOTER_EMPTY";
-
-export declare type BubbleProps = {
-    /**
-     * The text to render in the bubble.
-     */
-    children: React.ReactNode;
-    /**
-     * CSS class(es) to add to the main component wrapper.
-     * Bubble is made of a wrapper, a main content, and a footer. This prop
-     * allows you to add classes to the main component wrapper.
-     */
-    className?: string;
-    /**
-     * CSS class(es) to add to the content wrapper.
-     * Bubble is made of a wrapper, a main content, and a footer. This prop
-     * allows you to add classes to the content wrapper.
-     */
-    contentClassName?: string;
-    /**
-     * Whether or not to show a "copy/paste" icon next to the Bubble.
-     * - If a function is passed, it will be called with the text to copy.
-     * - If a string is passed, that string will be copied.
-     * - If a boolean is passed, the children will be copied, but only if they
-     * are of type string.
-     */
-    copyToClipboard?: boolean | string | ((text: any) => void);
-    /**
-     * The type of focus for the Copy Button. This will change the color
-     * of the focus ring around the Button.
-     */
-    copyToClipboardFocusMode?: "dark" | "light" | "system" | "alt-system";
-    /**
-     * The mode of Copy Button. This will change the color of the Button.
-     */
-    copyToClipboardMode?: "dark" | "light" | "system" | "alt-system";
-    /**
-     * Object depicting the extra rows for the Bubble.
-     * @example
-     * ```tsx
-     * <Bubble
-     * 	footer={{
-     * 		"Sent": "12:00 PM",
-     * 		"Delivered": "12:01 PM",
-     *    "Verified": Bubble.FOOTER_EMPTY,
-     * 		"Read": "12:02 PM",
-     * 	}}
-     * >Hello World</Bubble>
-     * ```
-     * This will create a footer with 4 rows, with the row before last being
-     * empty but taking the full height of a normal row.
-     *
-     */
-    footer?: {
-        [key: string]: string | number | undefined | null;
-    };
-    /**
-     * The gradient intensity applied to the Bubble background.
-     * - "light": Subtle gradient with 80% opacity at the top
-     * - "medium": Medium gradient with 65% opacity at the top
-     * - "strong": Strong gradient with 50% opacity at the top
-     * - undefined: No gradient, solid background color
-     *
-     * @default undefined
-     */
-    gradient?: "light" | "medium" | "strong";
-    /**
-     * The type of Bubble. This will change the color of the Bubble
-     * as well as the chevron location.
-     */
-    kind?: "left" | "right";
-    /**
-     * Same as "footer" but accepts raw JSX.
-     */
-    rawFooter?: React.ReactNode;
-    /**
-     * Whether or not the Bubble should have a default max-width.
-     * By default, bubble width will be responsive to the viewport,
-     * but in some cases, it may be useful to disable this behavior
-     * and allow the Bubble to grow to its content.
-     * You can also provide your own container class to control the width,
-     * based on the container's width.
-     * @see https://css-tricks.com/css-container-queries/#aa-container-length-units
-     *
-     * @example
-     * ```tsx
-     * <div> // this div should be declared as a container
-     *   <Bubble kind="left" noMaxWidth className="max-w-[95qcw]">
-     *     Hello World
-     *   </Bubble>
-     * </div>
-     * ```
-     * @default false
-     */
-    noMaxWidth?: boolean;
-    /**
-     * Whether or not the Bubble should have a tail.
-     * @default false
-     */
-    tail?: boolean;
-};
-
-export { }
+export type BubbleProps = {
+    /**
+     * The text to render in the bubble.
+     */
+    children: React.ReactNode;
+    /**
+     * CSS class(es) to add to the main component wrapper.
+     * Bubble is made of a wrapper, a main content, and a footer. This prop
+     * allows you to add classes to the main component wrapper.
+     */
+    className?: string;
+    /**
+     * CSS class(es) to add to the content wrapper.
+     * Bubble is made of a wrapper, a main content, and a footer. This prop
+     * allows you to add classes to the content wrapper.
+     */
+    contentClassName?: string;
+    /**
+     * Whether or not to show a "copy/paste" icon next to the Bubble.
+     * - If a function is passed, it will be called with the text to copy.
+     * - If a string is passed, that string will be copied.
+     * - If a boolean is passed, the children will be copied, but only if they
+     * are of type string.
+     */
+    copyToClipboard?: boolean | string | ((text: any) => void);
+    /**
+     * The type of focus for the Copy Button. This will change the color
+     * of the focus ring around the Button.
+     */
+    copyToClipboardFocusMode?: "dark" | "light" | "system" | "alt-system";
+    /**
+     * The mode of Copy Button. This will change the color of the Button.
+     */
+    copyToClipboardMode?: "dark" | "light" | "system" | "alt-system";
+    /**
+     * Object depicting the extra rows for the Bubble.
+     * @example
+     * ```tsx
+     * import { BUBBLE_FOOTER_EMPTY } from "@versini/ui-bubble/constants";
+     *
+     * <Bubble
+     * 	footer={{
+     * 		"Sent": "12:00 PM",
+     * 		"Delivered": "12:01 PM",
+     *    "Verified": BUBBLE_FOOTER_EMPTY,
+     * 		"Read": "12:02 PM",
+     * 	}}
+     * >Hello World</Bubble>
+     * ```
+     * This will create a footer with 4 rows, with the row before last being
+     * empty but taking the full height of a normal row.
+     *
+     */
+    footer?: {
+        [key: string]: string | number | undefined | null;
+    };
+    /**
+     * The gradient intensity applied to the Bubble background.
+     * - "light": Subtle gradient with 80% opacity at the top
+     * - "medium": Medium gradient with 65% opacity at the top
+     * - "strong": Strong gradient with 50% opacity at the top
+     * - undefined: No gradient, solid background color
+     *
+     * @default undefined
+     */
+    gradient?: "light" | "medium" | "strong";
+    /**
+     * The type of Bubble. This will change the color of the Bubble
+     * as well as the chevron location.
+     */
+    kind?: "left" | "right";
+    /**
+     * Same as "footer" but accepts raw JSX.
+     */
+    rawFooter?: React.ReactNode;
+    /**
+     * Whether or not the Bubble should have a default max-width.
+     * By default, bubble width will be responsive to the viewport,
+     * but in some cases, it may be useful to disable this behavior
+     * and allow the Bubble to grow to its content.
+     * You can also provide your own container class to control the width,
+     * based on the container's width.
+     * @see https://css-tricks.com/css-container-queries/#aa-container-length-units
+     *
+     * @example
+     * ```tsx
+     * <div> // this div should be declared as a container
+     *   <Bubble kind="left" noMaxWidth className="max-w-[95qcw]">
+     *     Hello World
+     *   </Bubble>
+     * </div>
+     * ```
+     * @default false
+     */
+    noMaxWidth?: boolean;
+    /**
+     * Whether or not the Bubble should have a tail.
+     * @default false
+     */
+    tail?: boolean;
+};

package/dist/components/Bubble/BubbleTypes.js

@@ -0,0 +1,21 @@
+/*!
+  @versini/ui-bubble v9.0.0
+  © 2025 gizmette.com
+*/
+try {
+  if (!window.__VERSINI_UI_BUBBLE__) {
+    window.__VERSINI_UI_BUBBLE__ = {
+      version: "9.0.0",
+      buildTime: "12/22/2025 09:50 AM EST",
+      homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
+      license: "MIT",
+    };
+  }
+} catch (error) {
+  // nothing to declare officer
+}
+
+
+;// CONCATENATED MODULE: ./src/components/Bubble/BubbleTypes.ts
+
+

package/dist/components/Bubble/utilities.d.ts

@@ -0,0 +1,9 @@
+import type { BubbleProps } from "./BubbleTypes";
+type PickedBubbleProps = Pick<BubbleProps, "kind" | "className" | "contentClassName" | "noMaxWidth" | "tail" | "gradient">;
+export declare const getBubbleClasses: ({ kind, className, contentClassName, noMaxWidth, tail, gradient, }: PickedBubbleProps) => {
+    wrapper: string;
+    main: string;
+    footer: string;
+    copyButton: string;
+};
+export {};

package/dist/components/Bubble/utilities.js

@@ -0,0 +1,111 @@
+/*!
+  @versini/ui-bubble v9.0.0
+  © 2025 gizmette.com
+*/
+try {
+  if (!window.__VERSINI_UI_BUBBLE__) {
+    window.__VERSINI_UI_BUBBLE__ = {
+      version: "9.0.0",
+      buildTime: "12/22/2025 09:50 AM EST",
+      homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
+      license: "MIT",
+    };
+  }
+} catch (error) {
+  // nothing to declare officer
+}
+
+import clsx from "clsx";
+import { BUBBLE_CLASSNAME } from "../../common/constants.js";
+
+;// CONCATENATED MODULE: external "clsx"
+
+;// CONCATENATED MODULE: external "../../common/constants.js"
+
+;// CONCATENATED MODULE: ./src/components/Bubble/utilities.ts
+
+
+const getBubbleSizesClasses = ({ kind, noMaxWidth })=>{
+    return clsx("px-4 py-2", {
+        "max-w-xs sm:max-w-md md:max-w-2xl": !noMaxWidth,
+        "lg:max-w-3xl": kind === "left" && !noMaxWidth
+    });
+};
+const getBubbleColorClasses = ({ kind, gradient })=>{
+    // No gradient - solid colors
+    if (!gradient) {
+        return clsx({
+            "bg-surface-light dark:bg-surface-dark": kind === "left",
+            "bg-surface-accent": kind === "right"
+        });
+    }
+    // Gradient presets based on intensity
+    if (gradient === "light") {
+        return clsx({
+            "bg-gradient-to-b from-surface-light/80 to-surface-light dark:from-surface-dark/80 dark:to-surface-dark": kind === "left",
+            "bg-gradient-to-b from-surface-accent/80 to-surface-accent": kind === "right"
+        });
+    }
+    if (gradient === "medium") {
+        return clsx({
+            "bg-gradient-to-b from-surface-light/65 to-surface-light dark:from-surface-dark/65 dark:to-surface-dark": kind === "left",
+            "bg-gradient-to-b from-surface-accent/65 to-surface-accent": kind === "right"
+        });
+    }
+    // gradient === "strong"
+    return clsx({
+        "bg-gradient-to-b from-surface-light/50 to-surface-light dark:from-surface-dark/50 dark:to-surface-dark": kind === "left",
+        "bg-gradient-to-b from-surface-accent/50 to-surface-accent": kind === "right"
+    });
+};
+const getBubbleTypographyClasses = ({ kind })=>{
+    return clsx("prose prose-dark dark:prose-lighter", "prose-blockquote:my-1", "prose-ol:my-1 prose-ul:my-1", {
+        "text-copy-lighter": kind === "right"
+    });
+};
+const getBubbleBorderClasses = ({ kind, tail })=>{
+    if (tail) {
+        return clsx(`${BUBBLE_CLASSNAME}-${kind}-tail`, "rounded-3xl", "relative", "before:content-['']", "before:w-3", "before:h-2", "before:absolute", "before:bottom-0", {
+            "last-bubble-right:before:right-[2px] last-bubble-right:before:border-l-[8px] last-bubble-right:before:border-l-surface-accent last-bubble-right:before:rounded-bl-[100%]": kind === "right",
+            "last-bubble-left:before:left-[2px] last-bubble-left:before:border-r-[8px] last-bubble-left:before:border-r-surface-light last-bubble-left:dark:before:border-r-surface-dark last-bubble-left:before:rounded-br-[100%]": kind === "left"
+        });
+    }
+    if (!tail) {
+        return clsx("rounded-b-xl", {
+            "rounded-tr-xl": kind === "left",
+            "rounded-tl-xl": kind === "right"
+        });
+    }
+};
+const getBubbleClasses = ({ kind, className, contentClassName, noMaxWidth, tail, gradient })=>{
+    const wrapper = clsx(BUBBLE_CLASSNAME, `${BUBBLE_CLASSNAME}-${kind}`, "flex items-start", {
+        "flex-row-reverse": kind === "right"
+    }, className);
+    const main = clsx(`${BUBBLE_CLASSNAME}-content`, "flex flex-col empty:hidden", getBubbleSizesClasses({
+        kind,
+        noMaxWidth
+    }), getBubbleTypographyClasses({
+        kind
+    }), getBubbleColorClasses({
+        kind,
+        gradient
+    }), getBubbleBorderClasses({
+        kind,
+        tail
+    }), contentClassName);
+    const footer = "pr-2 pt-1 text-end text-xs text-copy-light";
+    const copyButton = clsx("flex flex-col-reverse sm:flex-row", {
+        "ml-2": kind === "left" && !tail,
+        "mr-2": kind === "right" && !tail,
+        "ml-1": kind === "left" && tail,
+        "mr-1": kind === "right" && tail
+    });
+    return {
+        wrapper,
+        main,
+        footer,
+        copyButton
+    };
+};
+
+export { getBubbleClasses };

package/dist/components/BubbleConstants/BubbleConstants.d.ts

@@ -0,0 +1 @@
+export declare const BUBBLE_FOOTER_EMPTY = "FOOTER_EMPTY";

package/dist/components/BubbleConstants/BubbleConstants.js

@@ -0,0 +1,23 @@
+/*!
+  @versini/ui-bubble v9.0.0
+  © 2025 gizmette.com
+*/
+try {
+  if (!window.__VERSINI_UI_BUBBLE__) {
+    window.__VERSINI_UI_BUBBLE__ = {
+      version: "9.0.0",
+      buildTime: "12/22/2025 09:50 AM EST",
+      homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
+      license: "MIT",
+    };
+  }
+} catch (error) {
+  // nothing to declare officer
+}
+
+
+;// CONCATENATED MODULE: ./src/components/BubbleConstants/BubbleConstants.tsx
+// Side-effect free constants for ui-bubble.
+const BUBBLE_FOOTER_EMPTY = "FOOTER_EMPTY";
+
+export { BUBBLE_FOOTER_EMPTY };

package/dist/components/index.d.ts

@@ -0,0 +1,4 @@
+export * from "../common/constants";
+export * from "./Bubble/Bubble";
+export type * from "./Bubble/BubbleTypes";
+export { BUBBLE_FOOTER_EMPTY } from "./BubbleConstants/BubbleConstants";

package/dist/components/index.js

@@ -0,0 +1,30 @@
+/*!
+  @versini/ui-bubble v9.0.0
+  © 2025 gizmette.com
+*/
+try {
+  if (!window.__VERSINI_UI_BUBBLE__) {
+    window.__VERSINI_UI_BUBBLE__ = {
+      version: "9.0.0",
+      buildTime: "12/22/2025 09:50 AM EST",
+      homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
+      license: "MIT",
+    };
+  }
+} catch (error) {
+  // nothing to declare officer
+}
+
+import { BUBBLE_FOOTER_EMPTY } from "./BubbleConstants/BubbleConstants.js";
+export * from "../common/constants.js";
+export * from "./Bubble/Bubble.js";
+
+;// CONCATENATED MODULE: external "./BubbleConstants/BubbleConstants.js"
+
+;// CONCATENATED MODULE: ./src/components/index.ts
+
+
+// Export constants through a dedicated module entry for better tree-shaking.
+
+
+export { BUBBLE_FOOTER_EMPTY };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-bubble",
-	"version": "8.0.9",
+	"version": "9.0.0",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -12,8 +12,16 @@
 		"url": "git@github.com:aversini/ui-components.git"
 	},
 	"type": "module",
-	"main": "dist/index.js",
-	"types": "dist/index.d.ts",
+	"exports": {
+		"./bubble": {
+			"types": "./dist/components/Bubble/Bubble.d.ts",
+			"import": "./dist/components/Bubble/Bubble.js"
+		},
+		"./constants": {
+			"types": "./dist/components/BubbleConstants/BubbleConstants.d.ts",
+			"import": "./dist/components/BubbleConstants/BubbleConstants.js"
+		}
+	},
 	"files": [
 		"dist",
 		"README.md"
@@ -50,5 +58,5 @@
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "30d86d13d4369cc841fc267c970cca423d27bf2f"
+	"gitHead": "d82f2765a974c7bc1c4f0b43e9acdc8a11887502"
 }