@e-llm-studio/feedback-flow 0.1.31 → 0.1.32

package/dist/StarRating.js

@@ -11,6 +11,6 @@ function StarRating({ value, onChange, disabled = false, groupLabel = 'Rate this
     const displayedRating = hovered ?? (value === null ? 0 : Math.floor(value) + (value % 1 ? 0.5 : 0));
     return ((0, jsx_runtime_1.jsx)("div", { className: ['cw-feedback-stars', className, classNames?.root].filter(Boolean).join(' '), style: { ...style, ...styles?.root }, role: "radiogroup", "aria-label": groupLabel, children: [1, 2, 3, 4, 5].map((star) => {
             const fill = Math.max(0, Math.min(1, displayedRating - star + 1)) * 100;
-            return ((0, jsx_runtime_1.jsxs)("button", { type: "button", role: "radio", "aria-checked": Math.ceil(value ?? 0) === star, "aria-label": starLabel(star), disabled: disabled, className: classNames?.starButton, style: styles?.starButton, onMouseEnter: () => { setHovered(star); onHoverChange?.(star); }, onMouseLeave: () => { setHovered(null); onHoverChange?.(null); }, onFocus: () => { setHovered(star); onHoverChange?.(star); }, onBlur: () => { setHovered(null); onHoverChange?.(null); }, onClick: () => onChange(star), children: [(0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 2.5L12.2503 7.16667L17.3337 7.91667L13.667 11.5L14.5003 16.5833L10.0003 14.1667L5.50033 16.5833L6.33366 11.5L2.66699 7.91667L7.75033 7.16667L10.0003 2.5Z", stroke: mergedTheme.starEmpty ?? '#cbd5e1', strokeWidth: "1.33333", strokeLinejoin: "round" }) }), fill > 0 && ((0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", className: "cw-feedback-stars__filled", style: { clipPath: `inset(0 ${100 - fill}% 0 0)` }, children: (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 2.5L12.2503 7.16667L17.3337 7.91667L13.667 11.5L14.5003 16.5833L10.0003 14.1667L5.50033 16.5833L6.33366 11.5L2.66699 7.91667L7.75033 7.16667L10.0003 2.5Z", fill: mergedTheme.accent ?? '#5b21e6', stroke: mergedTheme.accent ?? '#5b21e6', strokeWidth: "1.33333", strokeLinejoin: "round" }) }))] }, star));
+            return ((0, jsx_runtime_1.jsxs)("button", { type: "button", role: "radio", "aria-checked": Math.ceil(value ?? 0) === star, "aria-label": starLabel(star), disabled: disabled, className: classNames?.starButton, style: { width: 20, height: 20, flex: '0 0 20px', ...styles?.starButton }, onMouseEnter: () => { setHovered(star); onHoverChange?.(star); }, onMouseLeave: () => { setHovered(null); onHoverChange?.(null); }, onFocus: () => { setHovered(star); onHoverChange?.(star); }, onBlur: () => { setHovered(null); onHoverChange?.(null); }, onClick: () => onChange(star), children: [(0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 2.5L12.2503 7.16667L17.3337 7.91667L13.667 11.5L14.5003 16.5833L10.0003 14.1667L5.50033 16.5833L6.33366 11.5L2.66699 7.91667L7.75033 7.16667L10.0003 2.5Z", stroke: mergedTheme.starEmpty ?? '#cbd5e1', strokeWidth: "1.33333", strokeLinejoin: "round" }) }), fill > 0 && ((0, jsx_runtime_1.jsx)("svg", { viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", className: "cw-feedback-stars__filled", style: { clipPath: `inset(0 ${100 - fill}% 0 0)` }, children: (0, jsx_runtime_1.jsx)("path", { d: "M10.0003 2.5L12.2503 7.16667L17.3337 7.91667L13.667 11.5L14.5003 16.5833L10.0003 14.1667L5.50033 16.5833L6.33366 11.5L2.66699 7.91667L7.75033 7.16667L10.0003 2.5Z", fill: mergedTheme.accent ?? '#5b21e6', stroke: mergedTheme.accent ?? '#5b21e6', strokeWidth: "1.33333", strokeLinejoin: "round" }) }))] }, star));
         }) }));
 }

package/dist/feedback.css

@@ -462,10 +462,25 @@ body.cw-feedback-capturing .cw-feedback-prompt {
     cursor: pointer;
 }
 .cw-feedback-prompt:has(.cw-feedback-review) {
-    min-width: 270px;
+    display: grid;
+    grid-template-columns: max-content auto;
+    column-gap: 10px;
+    align-items: end;
+    min-width: 0;
 }
 .cw-feedback-prompt:has(.cw-feedback-review) .cw-feedback-stars {
-    padding-right: 64px;
+    grid-column: 1;
+    padding-right: 0;
+}
+.cw-feedback-prompt:has(.cw-feedback-review) .cw-feedback-prompt__label {
+    grid-column: 1 / -1;
+}
+.cw-feedback-prompt:has(.cw-feedback-review) .cw-feedback-review {
+    position: static;
+    grid-column: 2;
+    align-self: end;
+    padding: 0;
+    white-space: nowrap;
 }
 .cw-feedback-stars button:disabled {
     cursor: default;
@@ -596,7 +611,7 @@ body.cw-feedback-capturing .cw-feedback-prompt {
     color: #16a34a;
 }
 .cw-feedback-prompt:has(.cw-feedback-review) .cw-feedback-stars {
-    padding-right: 76px;
+    padding-right: 0;
 }
 .cw-feedback-hint {
     font-size: 12px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@e-llm-studio/feedback-flow",
-  "version": "0.1.31",
+  "version": "0.1.32",
   "private": false,
   "description": "Reusable configurable feedback rating and progressive feedback screens",
   "main": "./dist/index.js",