@helpway/react 0.8.3 → 0.9.0

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@helpway/react",
3
- "version": "0.8.3",
3
+ "version": "0.9.0",
4
4
  "description": "Official React SDK for Helpway — drop-in AI chat support widget with headless hooks for custom UIs.",
5
5
  "keywords": [
6
6
  "helpway",
@@ -476,12 +476,16 @@
476
476
  align-items: center;
477
477
  justify-content: center;
478
478
  border-radius: 10px;
479
- overflow: hidden;
480
479
  }
481
480
  .hw-hero-bot-icon svg {
482
481
  width: 32px;
483
482
  height: 32px;
484
483
  }
484
+ .hw-hero-bot-icon .hw-agent-img,
485
+ .hw-hero-bot-icon .hw-agent-icon {
486
+ border-radius: inherit;
487
+ overflow: hidden;
488
+ }
485
489
 
486
490
  .hw-hero-greeting {
487
491
  font-size: 26px;
@@ -583,7 +587,6 @@
583
587
  align-items: center;
584
588
  justify-content: center;
585
589
  border-radius: 8px;
586
- overflow: hidden;
587
590
  /* Two-tier fallback so site overrides still win cleanly:
588
591
  1. Site stylesheet → `--hw-agent-bg` (highest priority)
589
592
  2. Widget smart default → `--hw-agent-bg-default` (set when the
@@ -605,6 +608,12 @@
605
608
  width: 100%;
606
609
  height: 100%;
607
610
  object-fit: cover;
611
+ border-radius: inherit;
612
+ }
613
+ .hw-header-bot-icon .hw-agent-img,
614
+ .hw-header-bot-icon .hw-agent-icon {
615
+ border-radius: inherit;
616
+ overflow: hidden;
608
617
  }
609
618
  .hw-header-bot-icon .hw-agent-img {
610
619
  object-fit: var(--hw-agent-fit, var(--hw-agent-fit-default, cover));
@@ -1535,6 +1544,85 @@
1535
1544
  }
1536
1545
  }
1537
1546
 
1547
+ /* ── Streaming cursor ────────────────────── */
1548
+
1549
+ .hw-streaming-cursor {
1550
+ display: inline-block;
1551
+ width: 2px;
1552
+ height: 1em;
1553
+ background: currentColor;
1554
+ opacity: 0.6;
1555
+ margin-left: 1px;
1556
+ vertical-align: text-bottom;
1557
+ animation: hw-cursor-blink 0.8s step-end infinite;
1558
+ }
1559
+
1560
+ @keyframes hw-cursor-blink {
1561
+ 50% { opacity: 0; }
1562
+ }
1563
+
1564
+ /* ── Link preview card ───────────────────── */
1565
+
1566
+ .hw-link-preview {
1567
+ display: flex;
1568
+ flex-direction: column;
1569
+ border: 1px solid rgba(0, 0, 0, 0.08);
1570
+ border-radius: 10px;
1571
+ overflow: hidden;
1572
+ text-decoration: none;
1573
+ color: inherit;
1574
+ margin-top: 6px;
1575
+ transition: background 0.15s;
1576
+ }
1577
+
1578
+ .hw-link-preview:hover {
1579
+ background: rgba(0, 0, 0, 0.02);
1580
+ }
1581
+
1582
+ .hw-link-preview-img {
1583
+ width: 100%;
1584
+ max-height: 140px;
1585
+ object-fit: cover;
1586
+ }
1587
+
1588
+ .hw-link-preview-body {
1589
+ padding: 10px 12px;
1590
+ display: flex;
1591
+ flex-direction: column;
1592
+ gap: 3px;
1593
+ }
1594
+
1595
+ .hw-link-preview-favicon {
1596
+ width: 16px;
1597
+ height: 16px;
1598
+ border-radius: 2px;
1599
+ }
1600
+
1601
+ .hw-link-preview-title {
1602
+ font-size: 13px;
1603
+ font-weight: 600;
1604
+ line-height: 1.3;
1605
+ color: var(--hw-text, #1a1a1a);
1606
+ }
1607
+
1608
+ .hw-link-preview-desc {
1609
+ font-size: 12px;
1610
+ line-height: 1.4;
1611
+ color: var(--hw-text-muted, #6b7280);
1612
+ }
1613
+
1614
+ .hw-link-preview-url {
1615
+ font-size: 11px;
1616
+ color: var(--hw-text-muted, #9ca3af);
1617
+ }
1618
+
1619
+ .hw-msg-links {
1620
+ display: flex;
1621
+ flex-direction: column;
1622
+ gap: 6px;
1623
+ max-width: 280px;
1624
+ }
1625
+
1538
1626
  /* ════════════════════════════════════════════════
1539
1627
  LOADING STATE
1540
1628
  ════════════════════════════════════════════════ */
@@ -1891,7 +1979,10 @@
1891
1979
  }
1892
1980
 
1893
1981
  .hw-composer-input {
1894
- flex: 1;
1982
+ /* No `flex: 1` — column flex with `flex-basis: 0%` makes the browser
1983
+ ignore both `style.height` (JS resize) AND `field-sizing: content`,
1984
+ clamping the textarea to `min-height` after 2 lines. Cross-axis
1985
+ stretch still gives full width via the parent's `align-items` default. */
1895
1986
  resize: none;
1896
1987
  border: none;
1897
1988
  padding: 12px 16px 4px;