@sakura-ui/sakura-ui 0.1.10 → 0.1.11

package/packages/forms/coverage/lcov-report/src/components/LabelControl.tsx.html

@@ -32,7 +32,7 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">100% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>16/16</span>
+                <span class='fraction'>14/14</span>
             </div>
         
             
@@ -146,9 +146,9 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">11x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">17x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -156,19 +156,19 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">11x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">11x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">17x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">17x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">11x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">17x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -204,7 +204,7 @@ import { cx } from '../utils'
 import { ControllerContext } from './context'
 &nbsp;
 export interface LabelControlProps
-  extends React.ComponentPropsWithoutRef&lt;'label'&gt; {
+  extends React.ComponentPropsWithoutRef&lt;'div'&gt; {
   labelText: string
   helperText?: string
   errorMessage?: string
@@ -212,61 +212,61 @@ export interface LabelControlProps
   isRequired?: boolean
 }
 &nbsp;
-export const LabelControl = React.forwardRef&lt;
-  HTMLLabelElement,
-  LabelControlProps
-&gt;((props, ref) =&gt; {
-  const id = React.useId()
-  const {
-    labelText,
-    className,
-    helperText,
-    errorMessage,
-    isInvalid,
-    isRequired,
-    children,
-    ...restProps
-  } = props
+export const LabelControl = React.forwardRef&lt;HTMLDivElement, LabelControlProps&gt;(
+  (props, ref) =&gt; {
+    const id = React.useId()
+    const {
+      labelText,
+      className,
+      helperText,
+      errorMessage,
+      isInvalid,
+      isRequired,
+      children,
+      ...newProps
+    } = props
 &nbsp;
-  const context = {
-    id: props.htmlFor ?? `input-${id}`,
-    helperTextId: `helper-text-${id}`,
-    errorMessageId: `error-message-${id}`,
-    isInvalid: isInvalid ?? false,
-    isRequired: isRequired ?? false
-  }
-&nbsp;
-  return (
-    &lt;ControllerContext.Provider value={context}&gt;
-      &lt;div className={cx('mb-4', className)}&gt;
-        &lt;label
-          className={cx('block mb-2', isInvalid &amp;&amp; 'text-sun-800')}
-          htmlFor={context.id}
-          ref={ref}
-          {...restProps}
-        &gt;
-          {labelText}
-          {isRequired &amp;&amp; &lt;span className="text-sun-800"&gt;&amp;nbsp;*&lt;/span&gt;}
-        &lt;/label&gt;
-        {children}
+    const context = {
+      helperTextId: `helper-text-${id}`,
+      errorMessageId: `error-message-${id}`,
+      isInvalid: isInvalid ?? false,
+      isRequired: isRequired ?? false
+    }
 &nbsp;
-        {helperText &amp;&amp; (
-          &lt;p id={context.helperTextId} className="text-sm text-sumi-700 mt-2"&gt;
-            {helperText}
-          &lt;/p&gt;
-        )}
-        {isInvalid &amp;&amp; (
-          &lt;p
-            id={context.errorMessageId}
-            className={cx('text-sm text-sun-800', helperText ? 'mt-1' : 'mt-2')}
-          &gt;
-            {errorMessage}
-          &lt;/p&gt;
-        )}
-      &lt;/div&gt;
-    &lt;/ControllerContext.Provider&gt;
-  )
-})
+    return (
+      &lt;ControllerContext.Provider value={context}&gt;
+        &lt;div className={cx('mb-4', className)} ref={ref} {...newProps}&gt;
+          &lt;label&gt;
+            &lt;p className={cx('block mb-2', isInvalid &amp;&amp; 'text-sun-800')}&gt;
+              {labelText}
+              {isRequired &amp;&amp; &lt;span className="text-sun-800"&gt;&amp;nbsp;*&lt;/span&gt;}
+            &lt;/p&gt;
+            {children}
+            {helperText &amp;&amp; (
+              &lt;p
+                id={context.helperTextId}
+                className="text-sm text-sumi-700 mt-2"
+              &gt;
+                {helperText}
+              &lt;/p&gt;
+            )}
+            {isInvalid &amp;&amp; (
+              &lt;p
+                id={context.errorMessageId}
+                className={cx(
+                  'text-sm text-sun-800',
+                  helperText ? 'mt-1' : 'mt-2'
+                )}
+              &gt;
+                {errorMessage}
+              &lt;/p&gt;
+            )}
+          &lt;/label&gt;
+        &lt;/div&gt;
+      &lt;/ControllerContext.Provider&gt;
+    )
+  }
+)
 &nbsp;</pre></td></tr></table></pre>
 
                 <div class='push'></div><!-- for sticky footer -->
@@ -274,7 +274,7 @@ export const LabelControl = React.forwardRef&lt;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-30T13:17:37.839Z
+                at 2023-03-27T00:09:49.121Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/packages/forms/coverage/lcov-report/src/components/Radio.tsx.html

@@ -224,7 +224,7 @@ export const Radio = React.forwardRef<HTMLInputElement, Props>((props, ref
   `
   return (
     <label htmlFor={newProps.id} className={cx(style, className)}>
-      <span className="flex items-center">
+      <div className="flex items-center">
         <input
           className={styleInput}
           type="radio"
@@ -236,7 +236,7 @@ export const Radio = React.forwardRef<HTMLInputElement, Props>((props, ref
         />
         <span className={styleRadio}></span>
         {children}
-      </span>
+      </div>
     </label>
   )
 })
@@ -247,7 +247,7 @@ export const Radio = React.forwardRef<HTMLInputElement, Props>((props, ref
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-30T13:17:37.839Z
+                at 2023-03-27T00:09:49.121Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/packages/forms/coverage/lcov-report/src/components/Select.tsx.html

@@ -23,30 +23,30 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">90.9% </span>
+                <span class="strong">36.36% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>10/11</span>
+                <span class='fraction'>4/11</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">57.14% </span>
+                <span class="strong">0% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>4/7</span>
+                <span class='fraction'>0/5</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">100% </span>
+                <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>1/1</span>
+                <span class='fraction'>0/1</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">90.9% </span>
+                <span class="strong">36.36% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>10/11</span>
+                <span class='fraction'>4/11</span>
             </div>
         
             
@@ -61,7 +61,7 @@
             </div>
         </template>
     </div>
-    <div class='status-line high'></div>
+    <div class='status-line low'></div>
     <pre><table class="coverage">
 <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
 <a name='L2'></a><a href='#L2'>2</a>
@@ -119,9 +119,7 @@
 <a name='L54'></a><a href='#L54'>54</a>
 <a name='L55'></a><a href='#L55'>55</a>
 <a name='L56'></a><a href='#L56'>56</a>
-<a name='L57'></a><a href='#L57'>57</a>
-<a name='L58'></a><a href='#L58'>58</a>
-<a name='L59'></a><a href='#L59'>59</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
+<a name='L57'></a><a href='#L57'>57</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -129,17 +127,15 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -152,8 +148,8 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -186,17 +182,16 @@ import { ControllerContext } from './context'
 export interface SelectProps extends React.ComponentPropsWithoutRef&lt;'select'&gt; {}
 &nbsp;
 export const Select = React.forwardRef&lt;HTMLSelectElement, SelectProps&gt;(
-  (props, ref) =&gt; {
-    const { className, children, ...restProps } = props
-    const ctx = React.useContext(ControllerContext)
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (ctx.isRequired) {
-<span class="cstat-no" title="statement not covered" >      restProps.required = true</span>
+<span class="fstat-no" title="function not covered" >  (p</span>rops, ref) =&gt; {
+    const { className, children, ...newProps } = <span class="cstat-no" title="statement not covered" >props</span>
+    const ctx = <span class="cstat-no" title="statement not covered" >React.useContext(ControllerContext)</span>
+<span class="cstat-no" title="statement not covered" >    <span class="missing-if-branch" title="if path not taken" >I</span>if (ctx.isRequired) {</span>
+<span class="cstat-no" title="statement not covered" >      newProps.required = true</span>
     }
 &nbsp;
-    const invalidStyle = ctx.isInvalid ? <span class="branch-0 cbranch-no" title="branch not covered" >'border-sun-800' </span>: 'border-sumi-900'
+    const invalidStyle = <span class="cstat-no" title="statement not covered" >ctx.isInvalid ? 'border-sun-800' : 'border-sumi-900'</span>
 &nbsp;
-    const style = `
-      cursor-pointer
+    const style = <span class="cstat-no" title="statement not covered" >`</span>
       appearance-none
       text-base
       w-full
@@ -210,20 +205,19 @@ export const Select = React.forwardRef&lt;HTMLSelectElement, SelectProps&gt;(
       focus:outline-wood-500
     `
 &nbsp;
-    return (
-      &lt;span className="inline-block relative"&gt;
+<span class="cstat-no" title="statement not covered" >    return (</span>
+      &lt;div className="inline-block relative"&gt;
         &lt;select
-          id={restProps.id ?? ctx.id}
           className={cx(style, invalidStyle, props.className)}
           aria-describedby={ctx.helperTextId}
           aria-errormessage={ctx.errorMessageId}
-          aria-invalid={ctx.isInvalid ?? <span class="branch-1 cbranch-no" title="branch not covered" >false}</span>
-          {...restProps}
+          aria-invalid={ctx.isInvalid ?? false}
+          {...newProps}
           ref={ref}
         &gt;
           {children}
         &lt;/select&gt;
-        &lt;span className="flex items-center absolute inset-y-0 right-0 px-2 pointer-events-none"&gt;
+        &lt;div className="pointer-events-none absolute inset-y-0 right-0 flex items-center px-2"&gt;
           &lt;svg
             xmlns="http://www.w3.org/2000/svg"
             className="fill-sumi-900"
@@ -232,8 +226,8 @@ export const Select = React.forwardRef&lt;HTMLSelectElement, SelectProps&gt;(
           &gt;
             &lt;path d="M12 15.05 6.35 9.4 7.4 8.35l4.6 4.6 4.6-4.6 1.05 1.05Z" /&gt;
           &lt;/svg&gt;
-        &lt;/span&gt;
-      &lt;/span&gt;
+        &lt;/div&gt;
+      &lt;/div&gt;
     )
   }
 )
@@ -244,7 +238,7 @@ export const Select = React.forwardRef&lt;HTMLSelectElement, SelectProps&gt;(
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-30T13:17:37.839Z
+                at 2023-03-27T00:09:49.121Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/packages/forms/coverage/lcov-report/src/components/Text.tsx.html

@@ -30,9 +30,9 @@
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">85.71% </span>
+                <span class="strong">80% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>6/7</span>
+                <span class='fraction'>4/5</span>
             </div>
         
             
@@ -107,8 +107,7 @@
 <a name='L42'></a><a href='#L42'>42</a>
 <a name='L43'></a><a href='#L43'>43</a>
 <a name='L44'></a><a href='#L44'>44</a>
-<a name='L45'></a><a href='#L45'>45</a>
-<a name='L46'></a><a href='#L46'>46</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
+<a name='L45'></a><a href='#L45'>45</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -116,15 +115,15 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">8x</span>
-<span class="cline-any cline-yes">8x</span>
-<span class="cline-any cline-yes">8x</span>
+<span class="cline-any cline-yes">6x</span>
+<span class="cline-any cline-yes">6x</span>
+<span class="cline-any cline-yes">6x</span>
 <span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">8x</span>
+<span class="cline-any cline-yes">6x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">8x</span>
+<span class="cline-any cline-yes">6x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -139,8 +138,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">8x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-yes">6x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -161,10 +159,10 @@ export interface TextProps extends React.ComponentPropsWithoutRef&lt;'input'&gt;
 &nbsp;
 export const Text = React.forwardRef&lt;HTMLInputElement, TextProps&gt;(
   (props, ref) =&gt; {
-    const { className, ...restProps } = props
+    const { className, ...newProps } = props
     const ctx = React.useContext(ControllerContext)
     if (ctx.isRequired) {
-      restProps.required = true
+      newProps.required = true
     }
 &nbsp;
     const invalidStyle = ctx.isInvalid ? 'border-sun-800' : 'border-sumi-900'
@@ -187,12 +185,11 @@ export const Text = React.forwardRef&lt;HTMLInputElement, TextProps&gt;(
     return (
       &lt;input
         type="text"
-        id={restProps.id ?? ctx.id}
         className={cx(style, invalidStyle, className)}
         aria-describedby={ctx.helperTextId}
         aria-errormessage={ctx.errorMessageId}
         aria-invalid={ctx.isInvalid ?? <span class="branch-1 cbranch-no" title="branch not covered" >false}</span>
-        {...restProps}
+        {...newProps}
         ref={ref}
       /&gt;
     )
@@ -205,7 +202,7 @@ export const Text = React.forwardRef&lt;HTMLInputElement, TextProps&gt;(
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-30T13:17:37.839Z
+                at 2023-03-27T00:09:49.121Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/packages/forms/coverage/lcov-report/src/components/Textarea.tsx.html

@@ -23,30 +23,30 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">90.9% </span>
+                <span class="strong">36.36% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>10/11</span>
+                <span class='fraction'>4/11</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">57.14% </span>
+                <span class="strong">0% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>4/7</span>
+                <span class='fraction'>0/5</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">100% </span>
+                <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>1/1</span>
+                <span class='fraction'>0/1</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">90.9% </span>
+                <span class="strong">36.36% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>10/11</span>
+                <span class='fraction'>4/11</span>
             </div>
         
             
@@ -61,7 +61,7 @@
             </div>
         </template>
     </div>
-    <div class='status-line high'></div>
+    <div class='status-line low'></div>
     <pre><table class="coverage">
 <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
 <a name='L2'></a><a href='#L2'>2</a>
@@ -110,8 +110,7 @@
 <a name='L45'></a><a href='#L45'>45</a>
 <a name='L46'></a><a href='#L46'>46</a>
 <a name='L47'></a><a href='#L47'>47</a>
-<a name='L48'></a><a href='#L48'>48</a>
-<a name='L49'></a><a href='#L49'>49</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
+<a name='L48'></a><a href='#L48'>48</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -120,17 +119,16 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
-<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -144,8 +142,8 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">2x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -167,17 +165,17 @@ export interface TextareaProps
   extends React.ComponentPropsWithoutRef&lt;'textarea'&gt; {}
 &nbsp;
 export const Textarea = React.forwardRef&lt;HTMLTextAreaElement, TextareaProps&gt;(
-  (props, ref) =&gt; {
-    const { className, children, ...restProps } = props
+<span class="fstat-no" title="function not covered" >  (p</span>rops, ref) =&gt; {
+    const { className, children, ...newProps } = <span class="cstat-no" title="statement not covered" >props</span>
 &nbsp;
-    const ctx = React.useContext(ControllerContext)
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (ctx.isRequired) {
-<span class="cstat-no" title="statement not covered" >      restProps.required = true</span>
+    const ctx = <span class="cstat-no" title="statement not covered" >React.useContext(ControllerContext)</span>
+<span class="cstat-no" title="statement not covered" >    <span class="missing-if-branch" title="if path not taken" >I</span>if (ctx.isRequired) {</span>
+<span class="cstat-no" title="statement not covered" >      newProps.required = true</span>
     }
 &nbsp;
-    const invalidStyle = ctx.isInvalid ? <span class="branch-0 cbranch-no" title="branch not covered" >'border-sun-800' </span>: 'border-sumi-900'
+    const invalidStyle = <span class="cstat-no" title="statement not covered" >ctx.isInvalid ? 'border-sun-800' : 'border-sumi-900'</span>
 &nbsp;
-    const style = `
+    const style = <span class="cstat-no" title="statement not covered" >`</span>
       p-4
       rounded-lg
       border
@@ -192,14 +190,13 @@ export const Textarea = React.forwardRef&lt;HTMLTextAreaElement, TextareaProps&g
       disabled:border-sumi-500
     `
 &nbsp;
-    return (
+<span class="cstat-no" title="statement not covered" >    return (</span>
       &lt;textarea
-        id={restProps.id ?? ctx.id}
         className={cx(style, invalidStyle, className)}
         aria-describedby={ctx.helperTextId}
         aria-errormessage={ctx.errorMessageId}
-        aria-invalid={ctx.isInvalid ?? <span class="branch-1 cbranch-no" title="branch not covered" >false}</span>
-        {...restProps}
+        aria-invalid={ctx.isInvalid ?? false}
+        {...newProps}
         ref={ref}
       &gt;
         {children}
@@ -214,7 +211,7 @@ export const Textarea = React.forwardRef&lt;HTMLTextAreaElement, TextareaProps&g
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-30T13:17:37.839Z
+                at 2023-03-27T00:09:49.121Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/packages/forms/coverage/lcov-report/src/components/context.ts.html

@@ -79,9 +79,7 @@
 <a name='L14'></a><a href='#L14'>14</a>
 <a name='L15'></a><a href='#L15'>15</a>
 <a name='L16'></a><a href='#L16'>16</a>
-<a name='L17'></a><a href='#L17'>17</a>
-<a name='L18'></a><a href='#L18'>18</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L17'></a><a href='#L17'>17</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -100,7 +98,6 @@
 <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from 'react'
 &nbsp;
 export interface ControllerContextType {
-  id?: string
   groupName?: string
   helperTextId: string
   errorMessageId: string
@@ -121,7 +118,7 @@ export const ControllerContext = React.createContext&lt;ControllerContextType&gt
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-03-30T13:17:37.839Z
+                at 2023-03-27T00:09:49.121Z
             </div>
         <script src="../../prettify.js"></script>
         <script>