@hugpy/video-intelligence-ui 0.1.0 → 0.3.0

package/src/stations/GoalComposer.tsx

@@ -44,6 +44,8 @@ export interface GoalComposerProps {
   rows?: number;
   disabled?: boolean;
   hint?: ReactNode;
+  /** k93: keep the <label> for a11y but render it visually hidden (.vi-sr-only). */
+  hideLabel?: boolean;
   /**
    * Fired when the textarea loses focus. Optional and inert unless wired: the studio
    * movie composer uses it to classify what was typed (scene vs direction) ON BLUR —
@@ -65,15 +67,21 @@ export function GoalComposer({
   rows = 2,
   disabled = false,
   hint,
+  hideLabel = false,
   onBlur,
   attachments,
   attached,
 }: GoalComposerProps) {
+  const labelClass = hideLabel ? "vi-sr-only" : undefined;
   const hasToolbar = !!attachments && attachments.length > 0;
   const hasChips = !!attached && attached.length > 0;
   return (
     <div className="vi-knob vi-goal-composer">
-      {id ? <label htmlFor={id}>{label}</label> : <label>{label}</label>}
+      {id ? (
+        <label htmlFor={id} className={labelClass}>{label}</label>
+      ) : (
+        <label className={labelClass}>{label}</label>
+      )}
       <div className="vi-goal-composer-field">
         <textarea
           id={id}