@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 +20 -5
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +20 -5
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.cts
CHANGED
|
@@ -84,6 +84,8 @@ interface WidgetBubbleConfig {
|
|
|
84
84
|
size?: number;
|
|
85
85
|
/** Icon size inside bubble in pixels */
|
|
86
86
|
iconSize?: number;
|
|
87
|
+
/** Text label shown next to bubble icon (pill shape when set) */
|
|
88
|
+
label?: string;
|
|
87
89
|
}
|
|
88
90
|
interface WidgetShadowsConfig {
|
|
89
91
|
/** Widget container shadow (CSS box-shadow) */
|
package/dist/index.d.ts
CHANGED
|
@@ -84,6 +84,8 @@ interface WidgetBubbleConfig {
|
|
|
84
84
|
size?: number;
|
|
85
85
|
/** Icon size inside bubble in pixels */
|
|
86
86
|
iconSize?: number;
|
|
87
|
+
/** Text label shown next to bubble icon (pill shape when set) */
|
|
88
|
+
label?: string;
|
|
87
89
|
}
|
|
88
90
|
interface WidgetShadowsConfig {
|
|
89
91
|
/** Widget container shadow (CSS box-shadow) */
|
package/dist/index.js
CHANGED
|
@@ -1369,7 +1369,8 @@ var DEFAULT_WIDGET_STYLES = {
|
|
|
1369
1369
|
// ═══════════════════════════════════════════════════════════
|
|
1370
1370
|
bubble: {
|
|
1371
1371
|
size: 48,
|
|
1372
|
-
iconSize: 24
|
|
1372
|
+
iconSize: 24,
|
|
1373
|
+
label: ""
|
|
1373
1374
|
},
|
|
1374
1375
|
// ═══════════════════════════════════════════════════════════
|
|
1375
1376
|
// SHADOWS
|
|
@@ -2307,14 +2308,20 @@ function ShadowContainer({
|
|
|
2307
2308
|
ShadowContainer.displayName = "ShadowContainer";
|
|
2308
2309
|
function ChatBubble({ isExpanded, onClick }) {
|
|
2309
2310
|
const { styles } = useWidgetStyleContext();
|
|
2310
|
-
|
|
2311
|
+
const label = styles.bubble.label;
|
|
2312
|
+
const showLabel = !isExpanded && !!label;
|
|
2313
|
+
return /* @__PURE__ */ jsxs(
|
|
2311
2314
|
"button",
|
|
2312
2315
|
{
|
|
2313
2316
|
onClick,
|
|
2314
|
-
className: "crow-fixed crow-z-[999999] crow-
|
|
2317
|
+
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",
|
|
2315
2318
|
style: {
|
|
2316
|
-
width: styles.bubble.size,
|
|
2317
2319
|
height: styles.bubble.size,
|
|
2320
|
+
width: showLabel ? "auto" : styles.bubble.size,
|
|
2321
|
+
paddingLeft: showLabel ? styles.bubble.size * 0.3 : 0,
|
|
2322
|
+
paddingRight: showLabel ? styles.bubble.size * 0.4 : 0,
|
|
2323
|
+
gap: showLabel ? 6 : 0,
|
|
2324
|
+
borderRadius: 9999,
|
|
2318
2325
|
right: styles.position.bubbleRight,
|
|
2319
2326
|
bottom: styles.position.bubbleBottom,
|
|
2320
2327
|
background: styles.colors.bubbleBackground,
|
|
@@ -2323,7 +2330,15 @@ function ChatBubble({ isExpanded, onClick }) {
|
|
|
2323
2330
|
color: styles.colors.bubbleIcon
|
|
2324
2331
|
},
|
|
2325
2332
|
"aria-label": isExpanded ? "Close Chat" : "Open Chat",
|
|
2326
|
-
children:
|
|
2333
|
+
children: [
|
|
2334
|
+
isExpanded ? /* @__PURE__ */ jsx(ChevronDown, { size: styles.bubble.iconSize, strokeWidth: 2 }) : /* @__PURE__ */ jsx(MessageCircle, { size: styles.bubble.iconSize, strokeWidth: 2 }),
|
|
2335
|
+
showLabel && /* @__PURE__ */ jsx("span", { style: {
|
|
2336
|
+
fontSize: styles.bubble.iconSize * 0.6,
|
|
2337
|
+
fontWeight: 500,
|
|
2338
|
+
whiteSpace: "nowrap",
|
|
2339
|
+
fontFamily: "system-ui, sans-serif"
|
|
2340
|
+
}, children: label })
|
|
2341
|
+
]
|
|
2327
2342
|
}
|
|
2328
2343
|
);
|
|
2329
2344
|
}
|