@versini/ui-bubble 10.0.1 → 10.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/dist/common/constants.js +3 -3
  2. package/dist/components/Bubble/Bubble.d.ts +1 -1
  3. package/dist/components/Bubble/Bubble.js +7 -6
  4. package/dist/components/Bubble/BubbleTypes.d.ts +6 -0
  5. package/dist/components/Bubble/BubbleTypes.js +3 -3
  6. package/dist/components/Bubble/utilities.d.ts +2 -2
  7. package/dist/components/Bubble/utilities.js +15 -15
  8. package/dist/components/BubbleConstants/BubbleConstants.js +3 -3
  9. package/dist/components/index.js +3 -3
  10. package/package.json +3 -3
package/dist/common/constants.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-bubble v10.0.1
2
+ @versini/ui-bubble v10.1.1
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_BUBBLE__) {
7
7
  window.__VERSINI_UI_BUBBLE__ = {
8
- version: "10.0.1",
9
- buildTime: "12/22/2025 03:48 PM EST",
8
+ version: "10.1.1",
9
+ buildTime: "12/24/2025 09:20 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
11
11
  license: "MIT",
12
12
  };
package/dist/components/Bubble/Bubble.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import type { BubbleProps } from "./BubbleTypes";
2
2
  export type { BubbleFooter, BubbleFooterItem, BubbleFooterKeyValue, BubbleFooterValueOnly, BubbleProps, } from "./BubbleTypes";
3
- export declare const Bubble: ({ children, kind, className, contentClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode, copyToClipboardMode, noMaxWidth, tail, gradient, }: BubbleProps) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const Bubble: ({ children, kind, className, contentClassName, footerClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode, copyToClipboardMode, noMaxWidth, tail, gradient, }: BubbleProps) => import("react/jsx-runtime").JSX.Element;
package/dist/components/Bubble/Bubble.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-bubble v10.0.1
2
+ @versini/ui-bubble v10.1.1
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_BUBBLE__) {
7
7
  window.__VERSINI_UI_BUBBLE__ = {
8
- version: "10.0.1",
9
- buildTime: "12/22/2025 03:48 PM EST",
8
+ version: "10.1.1",
9
+ buildTime: "12/24/2025 09:20 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
11
11
  license: "MIT",
12
12
  };
@@ -47,19 +47,20 @@ import { getBubbleClasses } from "./utilities.js";
47
47
  */ const isFooterKeyValue = (item)=>{
48
48
  return typeof item === "object" && item !== null && "key" in item && "value" in item;
49
49
  };
50
- const Bubble = ({ children, kind = "left", className, contentClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode = "system", copyToClipboardMode = "system", noMaxWidth = false, tail = false, gradient })=>{
50
+ const Bubble = ({ children, kind = "left", className, contentClassName, footerClassName, footer, rawFooter, copyToClipboard, copyToClipboardFocusMode = "system", copyToClipboardMode = "system", noMaxWidth = false, tail = false, gradient })=>{
51
51
  const [copied, setCopied] = useState(false);
52
52
  const bubbleClasses = getBubbleClasses({
53
53
  kind,
54
54
  className,
55
55
  contentClassName,
56
+ footerClassName,
56
57
  noMaxWidth,
57
58
  tail,
58
59
  gradient
59
60
  });
60
61
  const isCopyToClipboardEnabled = Boolean(copyToClipboard) && (typeof copyToClipboard === "function" || typeof copyToClipboard === "string" || typeof children === "string");
61
62
  // copy to clipboard function
62
- const handleCopyToClipboard = ()=>{
63
+ /* v8 ignore start - clipboard edge cases */ const handleCopyToClipboard = ()=>{
63
64
  setCopied(true);
64
65
  if (typeof copyToClipboard === "function") {
65
66
  copyToClipboard(children);
@@ -69,7 +70,7 @@ const Bubble = ({ children, kind = "left", className, contentClassName, footer,
69
70
  navigator.clipboard.writeText(children);
70
71
  }
71
72
  };
72
- // after 3 seconds, reset the copied state
73
+ /* v8 ignore stop */ // after 3 seconds, reset the copied state
73
74
  useEffect(()=>{
74
75
  let timeoutId;
75
76
  if (copied) {
package/dist/components/Bubble/BubbleTypes.d.ts CHANGED
@@ -40,6 +40,12 @@ export type BubbleProps = {
40
40
  * allows you to add classes to the content wrapper.
41
41
  */
42
42
  contentClassName?: string;
43
+ /**
44
+ * CSS class(es) to add to the footer wrapper.
45
+ * Bubble is made of a wrapper, a main content, and a footer. This prop
46
+ * allows you to add classes to the footer wrapper.
47
+ */
48
+ footerClassName?: string;
43
49
  /**
44
50
  * Whether or not to show a "copy/paste" icon next to the Bubble.
45
51
  * - If a function is passed, it will be called with the text to copy.
package/dist/components/Bubble/BubbleTypes.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-bubble v10.0.1
2
+ @versini/ui-bubble v10.1.1
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_BUBBLE__) {
7
7
  window.__VERSINI_UI_BUBBLE__ = {
8
- version: "10.0.1",
9
- buildTime: "12/22/2025 03:48 PM EST",
8
+ version: "10.1.1",
9
+ buildTime: "12/24/2025 09:20 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
11
11
  license: "MIT",
12
12
  };
package/dist/components/Bubble/utilities.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { BubbleProps } from "./BubbleTypes";
2
- type PickedBubbleProps = Pick<BubbleProps, "kind" | "className" | "contentClassName" | "noMaxWidth" | "tail" | "gradient">;
3
- export declare const getBubbleClasses: ({ kind, className, contentClassName, noMaxWidth, tail, gradient, }: PickedBubbleProps) => {
2
+ type PickedBubbleProps = Pick<BubbleProps, "kind" | "className" | "contentClassName" | "footerClassName" | "noMaxWidth" | "tail" | "gradient">;
3
+ export declare const getBubbleClasses: ({ kind, className, contentClassName, footerClassName, noMaxWidth, tail, gradient, }: PickedBubbleProps) => {
4
4
  wrapper: string;
5
5
  main: string;
6
6
  footer: string;
package/dist/components/Bubble/utilities.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-bubble v10.0.1
2
+ @versini/ui-bubble v10.1.1
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_BUBBLE__) {
7
7
  window.__VERSINI_UI_BUBBLE__ = {
8
- version: "10.0.1",
9
- buildTime: "12/22/2025 03:48 PM EST",
8
+ version: "10.1.1",
9
+ buildTime: "12/24/2025 09:20 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
11
11
  license: "MIT",
12
12
  };
@@ -42,20 +42,20 @@ const getBubbleColorClasses = ({ kind, gradient })=>{
42
42
  // Gradient presets based on intensity
43
43
  if (gradient === "light") {
44
44
  return clsx({
45
- "bg-gradient-to-b from-surface-light/80 to-surface-light dark:from-surface-dark/80 dark:to-surface-dark": kind === "left",
46
- "bg-gradient-to-b from-surface-accent/80 to-surface-accent": kind === "right"
45
+ "bg-linear-to-b from-surface-light/80 to-surface-light dark:from-surface-dark/80 dark:to-surface-dark": kind === "left",
46
+ "bg-linear-to-b from-surface-accent/80 to-surface-accent": kind === "right"
47
47
  });
48
48
  }
49
49
  if (gradient === "medium") {
50
50
  return clsx({
51
- "bg-gradient-to-b from-surface-light/65 to-surface-light dark:from-surface-dark/65 dark:to-surface-dark": kind === "left",
52
- "bg-gradient-to-b from-surface-accent/65 to-surface-accent": kind === "right"
51
+ "bg-linear-to-b from-surface-light/65 to-surface-light dark:from-surface-dark/65 dark:to-surface-dark": kind === "left",
52
+ "bg-linear-to-b from-surface-accent/65 to-surface-accent": kind === "right"
53
53
  });
54
54
  }
55
55
  // gradient === "strong"
56
56
  return clsx({
57
- "bg-gradient-to-b from-surface-light/50 to-surface-light dark:from-surface-dark/50 dark:to-surface-dark": kind === "left",
58
- "bg-gradient-to-b from-surface-accent/50 to-surface-accent": kind === "right"
57
+ "bg-linear-to-b from-surface-light/50 to-surface-light dark:from-surface-dark/50 dark:to-surface-dark": kind === "left",
58
+ "bg-linear-to-b from-surface-accent/50 to-surface-accent": kind === "right"
59
59
  });
60
60
  };
61
61
  const getBubbleTypographyClasses = ({ kind })=>{
@@ -66,18 +66,18 @@ const getBubbleTypographyClasses = ({ kind })=>{
66
66
  const getBubbleBorderClasses = ({ kind, tail })=>{
67
67
  if (tail) {
68
68
  return clsx(`${BUBBLE_CLASSNAME}-${kind}-tail`, "rounded-3xl", "relative", "before:content-['']", "before:w-3", "before:h-2", "before:absolute", "before:bottom-0", {
69
- "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",
70
- "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"
69
+ "last-bubble-right:before:right-0.5 last-bubble-right:before:border-l-8 last-bubble-right:before:border-l-surface-accent last-bubble-right:before:rounded-bl-[100%]": kind === "right",
70
+ "last-bubble-left:before:left-0.5 last-bubble-left:before:border-r-8 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"
71
71
  });
72
72
  }
73
- if (!tail) {
73
+ /* v8 ignore start - no-tail edge case */ if (!tail) {
74
74
  return clsx("rounded-b-xl", {
75
75
  "rounded-tr-xl": kind === "left",
76
76
  "rounded-tl-xl": kind === "right"
77
77
  });
78
78
  }
79
- };
80
- const getBubbleClasses = ({ kind, className, contentClassName, noMaxWidth, tail, gradient })=>{
79
+ /* v8 ignore stop */ };
80
+ const getBubbleClasses = ({ kind, className, contentClassName, footerClassName, noMaxWidth, tail, gradient })=>{
81
81
  const wrapper = clsx(BUBBLE_CLASSNAME, `${BUBBLE_CLASSNAME}-${kind}`, "flex items-start", {
82
82
  "flex-row-reverse": kind === "right"
83
83
  }, className);
@@ -93,7 +93,7 @@ const getBubbleClasses = ({ kind, className, contentClassName, noMaxWidth, tail,
93
93
  kind,
94
94
  tail
95
95
  }), contentClassName);
96
- const footer = "pr-2 pt-1 text-end text-xs text-copy-light";
96
+ const footer = clsx("pr-2 pt-1 text-end text-xs text-copy-light", footerClassName);
97
97
  const copyButton = clsx("flex flex-col-reverse sm:flex-row", {
98
98
  "ml-2": kind === "left" && !tail,
99
99
  "mr-2": kind === "right" && !tail,
package/dist/components/BubbleConstants/BubbleConstants.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-bubble v10.0.1
2
+ @versini/ui-bubble v10.1.1
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_BUBBLE__) {
7
7
  window.__VERSINI_UI_BUBBLE__ = {
8
- version: "10.0.1",
9
- buildTime: "12/22/2025 03:48 PM EST",
8
+ version: "10.1.1",
9
+ buildTime: "12/24/2025 09:20 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
11
11
  license: "MIT",
12
12
  };
package/dist/components/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  /*!
2
- @versini/ui-bubble v10.0.1
2
+ @versini/ui-bubble v10.1.1
3
3
  © 2025 gizmette.com
4
4
  */
5
5
  try {
6
6
  if (!window.__VERSINI_UI_BUBBLE__) {
7
7
  window.__VERSINI_UI_BUBBLE__ = {
8
- version: "10.0.1",
9
- buildTime: "12/22/2025 03:48 PM EST",
8
+ version: "10.1.1",
9
+ buildTime: "12/24/2025 09:20 AM EST",
10
10
  homepage: "https://www.npmjs.com/package/@versini/ui-bubble",
11
11
  license: "MIT",
12
12
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-bubble",
3
- "version": "10.0.1",
3
+ "version": "10.1.1",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -50,7 +50,7 @@
50
50
  },
51
51
  "dependencies": {
52
52
  "@tailwindcss/typography": "0.5.19",
53
- "@versini/ui-button": "11.0.0",
53
+ "@versini/ui-button": "11.0.1",
54
54
  "@versini/ui-icons": "4.15.1",
55
55
  "clsx": "2.1.1",
56
56
  "tailwindcss": "4.1.18"
@@ -58,5 +58,5 @@
58
58
  "sideEffects": [
59
59
  "**/*.css"
60
60
  ],
61
- "gitHead": "c129d519f4afee8d1fe8a2706033073fe4c38902"
61
+ "gitHead": "7b2640a0650a4c3aa6ca078888f765cb400f9f13"
62
62
  }