@helpway/react 0.17.0 → 0.17.1

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@helpway/react",
-	"version": "0.17.0",
+	"version": "0.17.1",
 	"description": "Official React SDK for Helpway — drop-in AI chat support widget with headless hooks for custom UIs.",
 	"keywords": [
 		"helpway",
@@ -43,8 +43,9 @@
 		"test": "bun test",
 		"sync:icons": "bun scripts/sync-icons.ts",
 		"prepublishOnly": "bun run build",
-		"prepack": "bun run build && bun scripts/apply-publish-config.ts",
-		"postpack": "bun scripts/apply-publish-config.ts --restore"
+		"prepack": "bun scripts/sync-icons.ts --check && bun run build && bun scripts/apply-publish-config.ts",
+		"postpack": "bun scripts/apply-publish-config.ts --restore",
+		"check:icons": "bun scripts/sync-icons.ts --check"
 	},
 	"//": "publishConfig swaps main/types/exports to the built dist on publish. Workspace consumers get raw src (fast HMR, no build step); npm consumers get compiled dist with .d.ts. Standard monorepo pattern.",
 	"dependencies": {

package/src/themed/styles.css

@@ -370,6 +370,48 @@
 	height: min(800px, calc(100vh - 112px));
 }
 
+/* The mobile SDK's sheet (widget.js mobile mode, #268): the native sheet IS
+   the window, at every width. An iPad's page sheet is wider than the 480px
+   phone breakpoint, and without this the floating panel would sit in a
+   corner of it. No open animation either — the sheet already slid up, and
+   a second slide inside it reads as the app stuttering. :host only matches
+   inside the embed's shadow root, so @helpway/react consumers never see it. */
+:host([data-hw-mode="mobile"]) .hw-window,
+:host([data-hw-mode="mobile"]) .hw-window--reading {
+	position: fixed;
+	inset: 0;
+	width: 100%;
+	height: var(--hw-visible-height, 100%);
+	border-radius: 0;
+	box-shadow: none;
+	animation: none;
+}
+/* The bubble is the launcher, and the app's own Help row is the launcher
+   here. hideLauncher does not remove it (it only stops click-outside from
+   closing the panel), so without this a black × sat over the send button. */
+/* The hero is a gradient (background-image), so its computed
+   background-color was transparent and the SDK could not tell the native
+   sheet what colour sits under iOS's grabber. The gradient's own top-left
+   stop, as a solid underneath it: invisible here, measurable there
+   (widget-embed mobile-chrome.ts). */
+:host([data-hw-mode="mobile"]) .hw-hero {
+	background-color: color-mix(in srgb, var(--hw-primary) 60%, black);
+}
+:host([data-hw-mode="mobile"]) .hw-bubble {
+	display: none;
+}
+
+/* Keyboard open (default-widget.tsx sets data-hw-keyboard from
+   visualViewport). The home-indicator inset is under the keyboard, so
+   padding for it leaves an empty band between composer and keys; and the
+   "Powered by" line costs a row the conversation needs more. */
+.hw-window[data-hw-keyboard] .hw-composer {
+	padding-bottom: 8px;
+}
+.hw-window[data-hw-keyboard] .hw-powered {
+	display: none;
+}
+
 @keyframes hw-window-open {
 	from {
 		opacity: 0;
@@ -2687,6 +2729,16 @@
 	.hw-powered {
 		padding-bottom: calc(5px + env(safe-area-inset-bottom, 0px));
 	}
+	/* The inset belongs to whatever is LAST in the window. With "Powered by"
+	   under the composer (or the tabs), both were padding for the same home
+	   indicator — the empty band above "Powered by" in Ali's simulator run of
+	   the mobile SDK. The line carries it; what sits above it does not. */
+	.hw-window:has(.hw-powered) .hw-composer {
+		padding-bottom: 8px;
+	}
+	.hw-window:has(.hw-powered) .hw-tabs {
+		padding-bottom: 0;
+	}
 
 	/* Touch targets */
 	.hw-header-close,