@helpway/react 0.6.0 → 0.7.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@helpway/react",
-	"version": "0.6.0",
+	"version": "0.7.0",
 	"description": "Official React SDK for Helpway — drop-in AI chat support widget with headless hooks for custom UIs.",
 	"keywords": [
 		"helpway",

package/src/themed/styles.css

@@ -241,6 +241,26 @@
 	border-radius: 0; /* bubble itself handles rounding */
 }
 
+/* Logo variant (admin-uploaded launcherIconUrl OR website.logoUrl) —
+   logos carry their own padding rules and shouldn't be cropped. Use
+   `contain` + inner padding so SVG/PNG marks render at intended
+   proportion inside the rounded bubble. `object-fit: cover` is correct
+   only for face avatars. Padding is applied directly on the img so it
+   works regardless of whether the parent has --logo / --avatar class. */
+.hw-agent-img.hw-agent-img--logo {
+	object-fit: contain;
+	padding: 10px;
+	box-sizing: border-box;
+}
+/* Higher-specificity override: .hw-bubble--avatar's inner img rule sets
+   width/height + border-radius:0 with 3-class specificity. Match that
+   so logo padding actually applies inside the bubble. */
+.hw-bubble--avatar .hw-bubble-icon--bot .hw-agent-img.hw-agent-img--logo {
+	padding: 10px;
+	box-sizing: border-box;
+	object-fit: contain;
+}
+
 .hw-bubble-icon--close svg {
 	width: 22px;
 	height: 22px;
@@ -557,6 +577,11 @@
 	justify-content: center;
 	border-radius: 8px;
 	overflow: hidden;
+	/* Public override hook — light SVG/PNG logos disappear on white
+	   chat-header cards. Site stylesheet sets `--hw-agent-bg` to a
+	   contrast color (e.g. brand color) and the avatar gets a tinted
+	   circle behind it. Default `transparent` preserves legacy look. */
+	background: var(--hw-agent-bg, transparent);
 }
 .hw-header-bot-icon svg {
 	width: 24px;
@@ -569,7 +594,14 @@
 .hw-header-agent-img {
 	width: 100%;
 	height: 100%;
-	object-fit: cover;
+	/* Override hooks: `--hw-agent-fit` swaps cover→contain so logos
+	   aren't cropped, `--hw-agent-pad` adds breathing room around the
+	   logo inside the circle. Defaults match legacy face-photo
+	   behavior. Padding requires border-box so it stays inside the
+	   circle rather than expanding the img. */
+	object-fit: var(--hw-agent-fit, cover);
+	padding: var(--hw-agent-pad, 0);
+	box-sizing: border-box;
 }
 .hw-header-agent-initials {
 	font-size: 11px;