@usecrow/ui 0.1.64 → 0.1.65

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.
package/dist/index.cjs CHANGED
@@ -1395,7 +1395,8 @@ var DEFAULT_WIDGET_STYLES = {
1395
1395
  // ═══════════════════════════════════════════════════════════
1396
1396
  bubble: {
1397
1397
  size: 48,
1398
- iconSize: 24
1398
+ iconSize: 24,
1399
+ label: ""
1399
1400
  },
1400
1401
  // ═══════════════════════════════════════════════════════════
1401
1402
  // SHADOWS
@@ -2333,14 +2334,20 @@ function ShadowContainer({
2333
2334
  ShadowContainer.displayName = "ShadowContainer";
2334
2335
  function ChatBubble({ isExpanded, onClick }) {
2335
2336
  const { styles } = useWidgetStyleContext();
2336
- return /* @__PURE__ */ jsxRuntime.jsx(
2337
+ const label = styles.bubble.label;
2338
+ const showLabel = !isExpanded && !!label;
2339
+ return /* @__PURE__ */ jsxRuntime.jsxs(
2337
2340
  "button",
2338
2341
  {
2339
2342
  onClick,
2340
- className: "crow-fixed crow-z-[999999] crow-rounded-full crow-flex crow-items-center crow-justify-center crow-shadow-2xl hover:crow-scale-110 crow-transition-all crow-duration-500 crow-border crow-backdrop-blur-md",
2343
+ className: "crow-fixed crow-z-[999999] crow-flex crow-items-center crow-justify-center crow-shadow-2xl hover:crow-scale-110 crow-transition-all crow-duration-500 crow-border crow-backdrop-blur-md",
2341
2344
  style: {
2342
- width: styles.bubble.size,
2343
2345
  height: styles.bubble.size,
2346
+ width: showLabel ? "auto" : styles.bubble.size,
2347
+ paddingLeft: showLabel ? styles.bubble.size * 0.3 : 0,
2348
+ paddingRight: showLabel ? styles.bubble.size * 0.4 : 0,
2349
+ gap: showLabel ? 6 : 0,
2350
+ borderRadius: 9999,
2344
2351
  right: styles.position.bubbleRight,
2345
2352
  bottom: styles.position.bubbleBottom,
2346
2353
  background: styles.colors.bubbleBackground,
@@ -2349,7 +2356,15 @@ function ChatBubble({ isExpanded, onClick }) {
2349
2356
  color: styles.colors.bubbleIcon
2350
2357
  },
2351
2358
  "aria-label": isExpanded ? "Close Chat" : "Open Chat",
2352
- children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: styles.bubble.iconSize, strokeWidth: 2 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircle, { size: styles.bubble.iconSize, strokeWidth: 2 })
2359
+ children: [
2360
+ isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { size: styles.bubble.iconSize, strokeWidth: 2 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessageCircle, { size: styles.bubble.iconSize, strokeWidth: 2 }),
2361
+ showLabel && /* @__PURE__ */ jsxRuntime.jsx("span", { style: {
2362
+ fontSize: styles.bubble.iconSize * 0.6,
2363
+ fontWeight: 500,
2364
+ whiteSpace: "nowrap",
2365
+ fontFamily: "system-ui, sans-serif"
2366
+ }, children: label })
2367
+ ]
2353
2368
  }
2354
2369
  );
2355
2370
  }