@strictly/react-form 0.0.7 → 0.0.8

package/mantine/specs/__snapshots__/checkbox_hooks.tests.tsx.snap

@@ -1,68 +1,5 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`mantine checkbox hooks > renders CustomError 1`] = `
-<div>
-  <style
-    data-mantine-styles="classes"
-  >
-    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
-  </style>
-  <div
-    class="m_bf2d988c mantine-Checkbox-root m_5f75b09e mantine-Checkbox-root"
-    data-checked="true"
-    data-label-position="right"
-    style="--checkbox-color: var(--mantine-color-blue-filled);"
-  >
-    <div
-      class="m_5f6e695e mantine-Checkbox-body"
-    >
-      <div
-        class="m_26062bec mantine-Checkbox-inner"
-        data-label-position="right"
-      >
-        <input
-          checked=""
-          class="mantine-focus-auto m_26063560 mantine-Checkbox-input"
-          data-error="true"
-          id="mantine-0cyk5rcyk"
-          name="$"
-          type="checkbox"
-        />
-        <svg
-          aria-hidden="true"
-          class="m_bf295423 mantine-Checkbox-icon"
-          fill="none"
-          viewBox="0 0 10 7"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            clip-rule="evenodd"
-            d="M4 4.586L1.707 2.293A1 1 0 1 0 .293 3.707l3 3a.997.997 0 0 0 1.414 0l5-5A1 1 0 1 0 8.293.293L4 4.586z"
-            fill="currentColor"
-            fill-rule="evenodd"
-          />
-        </svg>
-      </div>
-      <div
-        class="m_d3ea56bb mantine-Checkbox-labelWrapper"
-      >
-        <label
-          class="m_8ee546b8 mantine-Checkbox-label"
-          for="mantine-0cyk5rcyk"
-        >
-          Checkbox
-        </label>
-        <p
-          class="m_8e8a99cc mantine-Checkbox-error m_8f816625 mantine-InputWrapper-error"
-        >
-          custom error
-        </p>
-      </div>
-    </div>
-  </div>
-</div>
-`;
-
 exports[`mantine checkbox hooks > renders Disabled 1`] = `
 <div>
   <style
@@ -176,7 +113,7 @@ exports[`mantine checkbox hooks > renders Error 1`] = `
         <p
           class="m_8e8a99cc mantine-Checkbox-error m_8f816625 mantine-InputWrapper-error"
         >
-          error
+          Error error
         </p>
       </div>
     </div>

package/mantine/specs/__snapshots__/fields_view_hooks.tests.tsx.snap

@@ -1,6 +1,6 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`field view hooks > renders CustomError 1`] = `
+exports[`field view hooks > renders Disabled 1`] = `
 <div>
   <style
     data-mantine-styles="classes"
@@ -13,7 +13,6 @@ exports[`field view hooks > renders CustomError 1`] = `
   >
     <div
       class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
-      data-error="true"
     >
       <label
         class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
@@ -24,27 +23,20 @@ exports[`field view hooks > renders CustomError 1`] = `
       </label>
       <div
         class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
-        data-error="true"
+        data-disabled="true"
         data-variant="default"
-        style="--input-margin-bottom: calc(var(--mantine-spacing-xs) / 2);"
       >
         <input
-          aria-describedby="mantine-0cyk5rcyk-error"
-          aria-invalid="true"
+          aria-invalid="false"
           class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
-          data-error="true"
+          data-disabled="true"
           data-variant="default"
+          disabled=""
           id="mantine-0cyk5rcyk"
           name="$"
           value="xxx"
         />
       </div>
-      <p
-        class="m_8f816625 mantine-InputWrapper-error mantine-TextInput-error"
-        id="mantine-0cyk5rcyk-error"
-      >
-        form error
-      </p>
     </div>
     <div
       class="m_6d731127 mantine-Stack-root"
@@ -52,7 +44,6 @@ exports[`field view hooks > renders CustomError 1`] = `
     >
       <div
         class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
-        data-error="true"
       >
         <label
           class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
@@ -63,27 +54,20 @@ exports[`field view hooks > renders CustomError 1`] = `
         </label>
         <div
           class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
-          data-error="true"
+          data-disabled="true"
           data-variant="default"
-          style="--input-margin-bottom: calc(var(--mantine-spacing-xs) / 2);"
         >
           <input
-            aria-describedby="mantine-0px4bipx4-error"
-            aria-invalid="true"
+            aria-invalid="false"
             class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
-            data-error="true"
+            data-disabled="true"
             data-variant="default"
+            disabled=""
             id="mantine-0px4bipx4"
             name="$"
-            value="xxx"
+            value="yyy"
           />
         </div>
-        <p
-          class="m_8f816625 mantine-InputWrapper-error mantine-TextInput-error"
-          id="mantine-0px4bipx4-error"
-        >
-          sub form error
-        </p>
       </div>
       <button
         class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
@@ -105,7 +89,7 @@ exports[`field view hooks > renders CustomError 1`] = `
 </div>
 `;
 
-exports[`field view hooks > renders Disabled 1`] = `
+exports[`field view hooks > renders Empty 1`] = `
 <div>
   <style
     data-mantine-styles="classes"
@@ -121,25 +105,22 @@ exports[`field view hooks > renders Disabled 1`] = `
     >
       <label
         class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
-        for="mantine-0cyk5rcyk"
-        id="mantine-0cyk5rcyk-label"
+        for="mantine-0px4bipx4"
+        id="mantine-0px4bipx4-label"
       >
         fields view
       </label>
       <div
         class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
-        data-disabled="true"
         data-variant="default"
       >
         <input
           aria-invalid="false"
           class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
-          data-disabled="true"
           data-variant="default"
-          disabled=""
-          id="mantine-0cyk5rcyk"
+          id="mantine-0px4bipx4"
           name="$"
-          value="xxx"
+          value=""
         />
       </div>
     </div>
@@ -152,25 +133,22 @@ exports[`field view hooks > renders Disabled 1`] = `
       >
         <label
           class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
-          for="mantine-0px4bipx4"
-          id="mantine-0px4bipx4-label"
+          for="mantine-12voha2vo"
+          id="mantine-12voha2vo-label"
         >
           sub fields view
         </label>
         <div
           class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
-          data-disabled="true"
           data-variant="default"
         >
           <input
             aria-invalid="false"
             class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
-            data-disabled="true"
             data-variant="default"
-            disabled=""
-            id="mantine-0px4bipx4"
+            id="mantine-12voha2vo"
             name="$"
-            value="yyy"
+            value=""
           />
         </div>
       </div>
@@ -194,7 +172,7 @@ exports[`field view hooks > renders Disabled 1`] = `
 </div>
 `;
 
-exports[`field view hooks > renders Empty 1`] = `
+exports[`field view hooks > renders Errors 1`] = `
 <div>
   <style
     data-mantine-styles="classes"
@@ -207,27 +185,38 @@ exports[`field view hooks > renders Empty 1`] = `
   >
     <div
       class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+      data-error="true"
     >
       <label
         class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
-        for="mantine-0px4bipx4"
-        id="mantine-0px4bipx4-label"
+        for="mantine-0cyk5rcyk"
+        id="mantine-0cyk5rcyk-label"
       >
         fields view
       </label>
       <div
         class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+        data-error="true"
         data-variant="default"
+        style="--input-margin-bottom: calc(var(--mantine-spacing-xs) / 2);"
       >
         <input
-          aria-invalid="false"
+          aria-describedby="mantine-0cyk5rcyk-error"
+          aria-invalid="true"
           class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+          data-error="true"
           data-variant="default"
-          id="mantine-0px4bipx4"
+          id="mantine-0cyk5rcyk"
           name="$"
-          value=""
+          value="xxx"
         />
       </div>
+      <p
+        class="m_8f816625 mantine-InputWrapper-error mantine-TextInput-error"
+        id="mantine-0cyk5rcyk-error"
+      >
+        error form error
+      </p>
     </div>
     <div
       class="m_6d731127 mantine-Stack-root"
@@ -235,27 +224,38 @@ exports[`field view hooks > renders Empty 1`] = `
     >
       <div
         class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+        data-error="true"
       >
         <label
           class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
-          for="mantine-12voha2vo"
-          id="mantine-12voha2vo-label"
+          for="mantine-0px4bipx4"
+          id="mantine-0px4bipx4-label"
         >
           sub fields view
         </label>
         <div
           class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+          data-error="true"
           data-variant="default"
+          style="--input-margin-bottom: calc(var(--mantine-spacing-xs) / 2);"
         >
           <input
-            aria-invalid="false"
+            aria-describedby="mantine-0px4bipx4-error"
+            aria-invalid="true"
             class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+            data-error="true"
             data-variant="default"
-            id="mantine-12voha2vo"
+            id="mantine-0px4bipx4"
             name="$"
-            value=""
+            value="xxx"
           />
         </div>
+        <p
+          class="m_8f816625 mantine-InputWrapper-error mantine-TextInput-error"
+          id="mantine-0px4bipx4-error"
+        >
+          error sub form error
+        </p>
       </div>
       <button
         class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"

package/mantine/specs/__snapshots__/radio_group_hooks.tests.tsx.snap

@@ -1,183 +1,5 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`mantine radio group hooks > renders CustomError 1`] = `
-<div>
-  <style
-    data-mantine-styles="classes"
-  >
-    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
-  </style>
-  <div
-    class="m_46b77525 mantine-InputWrapper-root mantine-RadioGroup-root"
-    data-error="true"
-  >
-    <div
-      class="m_8fdc1311 mantine-InputWrapper-label mantine-RadioGroup-label"
-      id="mantine-1fu8n1fu8-label"
-    >
-      Radio Group
-    </div>
-    <div
-      aria-describedby="mantine-1fu8n1fu8-error"
-      aria-labelledby="mantine-1fu8n1fu8-label"
-      role="radiogroup"
-    >
-      <div
-        class="m_6d731127 mantine-Stack-root"
-        style="--stack-gap: var(--mantine-spacing-md); --stack-align: stretch; --stack-justify: flex-start;"
-      >
-        <div
-          class="m_f3f1af94 mantine-Radio-root m_5f75b09e mantine-Radio-root"
-          data-label-position="right"
-          style="--radio-color: var(--mantine-color-blue-filled);"
-        >
-          <div
-            class="m_5f6e695e mantine-Radio-body"
-          >
-            <div
-              class="m_89c4f5e4 mantine-Radio-inner"
-              data-label-position="right"
-            >
-              <input
-                class="mantine-focus-auto m_8a3dbb89 mantine-Radio-radio"
-                id="mantine-0cyk5rcyk"
-                name="$"
-                type="radio"
-                value="1"
-              />
-              <svg
-                aria-hidden="true"
-                class="m_f3ed6b2b mantine-Radio-icon"
-                fill="none"
-                viewBox="0 0 5 5"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <circle
-                  cx="2.5"
-                  cy="2.5"
-                  fill="currentColor"
-                  r="2.5"
-                />
-              </svg>
-            </div>
-            <div
-              class="m_d3ea56bb mantine-Radio-labelWrapper"
-            >
-              <label
-                class="m_8ee546b8 mantine-Radio-label"
-                for="mantine-0cyk5rcyk"
-              >
-                One
-              </label>
-            </div>
-          </div>
-        </div>
-        <div
-          class="m_f3f1af94 mantine-Radio-root m_5f75b09e mantine-Radio-root"
-          data-checked="true"
-          data-label-position="right"
-          style="--radio-color: var(--mantine-color-blue-filled);"
-        >
-          <div
-            class="m_5f6e695e mantine-Radio-body"
-          >
-            <div
-              class="m_89c4f5e4 mantine-Radio-inner"
-              data-label-position="right"
-            >
-              <input
-                checked=""
-                class="mantine-focus-auto m_8a3dbb89 mantine-Radio-radio"
-                id="mantine-0px4bipx4"
-                name="$"
-                type="radio"
-                value="2"
-              />
-              <svg
-                aria-hidden="true"
-                class="m_f3ed6b2b mantine-Radio-icon"
-                fill="none"
-                viewBox="0 0 5 5"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <circle
-                  cx="2.5"
-                  cy="2.5"
-                  fill="currentColor"
-                  r="2.5"
-                />
-              </svg>
-            </div>
-            <div
-              class="m_d3ea56bb mantine-Radio-labelWrapper"
-            >
-              <label
-                class="m_8ee546b8 mantine-Radio-label"
-                for="mantine-0px4bipx4"
-              >
-                Two
-              </label>
-            </div>
-          </div>
-        </div>
-        <div
-          class="m_f3f1af94 mantine-Radio-root m_5f75b09e mantine-Radio-root"
-          data-label-position="right"
-          style="--radio-color: var(--mantine-color-blue-filled);"
-        >
-          <div
-            class="m_5f6e695e mantine-Radio-body"
-          >
-            <div
-              class="m_89c4f5e4 mantine-Radio-inner"
-              data-label-position="right"
-            >
-              <input
-                class="mantine-focus-auto m_8a3dbb89 mantine-Radio-radio"
-                id="mantine-12voha2vo"
-                name="$"
-                type="radio"
-                value="3"
-              />
-              <svg
-                aria-hidden="true"
-                class="m_f3ed6b2b mantine-Radio-icon"
-                fill="none"
-                viewBox="0 0 5 5"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <circle
-                  cx="2.5"
-                  cy="2.5"
-                  fill="currentColor"
-                  r="2.5"
-                />
-              </svg>
-            </div>
-            <div
-              class="m_d3ea56bb mantine-Radio-labelWrapper"
-            >
-              <label
-                class="m_8ee546b8 mantine-Radio-label"
-                for="mantine-12voha2vo"
-              >
-                Three
-              </label>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <p
-      class="m_8f816625 mantine-InputWrapper-error mantine-RadioGroup-error"
-      id="mantine-1fu8n1fu8-error"
-    >
-      custom error
-    </p>
-  </div>
-</div>
-`;
-
 exports[`mantine radio group hooks > renders Disabled 1`] = `
 <div>
   <style
@@ -697,7 +519,7 @@ exports[`mantine radio group hooks > renders Error 1`] = `
       class="m_8f816625 mantine-InputWrapper-error mantine-RadioGroup-error"
       id="mantine-1fu8n1fu8-error"
     >
-      error
+      custom error error
     </p>
   </div>
 </div>

package/mantine/specs/__snapshots__/select_hooks.tests.tsx.snap

@@ -1,87 +1,5 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
-exports[`mantine select hooks > renders CustomErrorSelect 1`] = `
-<div>
-  <style
-    data-mantine-styles="classes"
-  >
-    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
-  </style>
-  <div
-    class="m_46b77525 mantine-InputWrapper-root mantine-Select-root"
-    data-error="true"
-  >
-    <label
-      class="m_8fdc1311 mantine-InputWrapper-label mantine-Select-label"
-      data-required="true"
-      for="mantine-12voha2vo"
-      id="mantine-12voha2vo-label"
-    >
-      Select
-      <span
-        aria-hidden="true"
-        class="m_78a94662 mantine-InputWrapper-required mantine-Select-required"
-      >
-         *
-      </span>
-    </label>
-    <div
-      class="m_6c018570 mantine-Input-wrapper mantine-Select-wrapper"
-      data-error="true"
-      data-pointer="true"
-      data-variant="default"
-      data-with-right-section="true"
-      style="--input-margin-bottom: calc(var(--mantine-spacing-xs) / 2); --input-right-section-pointer-events: none;"
-    >
-      <input
-        aria-describedby="mantine-12voha2vo-error"
-        aria-haspopup="listbox"
-        aria-invalid="true"
-        autocomplete="off"
-        class="m_8fb7ebe7 mantine-Input-input mantine-Select-input"
-        data-error="true"
-        data-variant="default"
-        id="mantine-12voha2vo"
-        readonly=""
-        required=""
-        value="c"
-      />
-      <div
-        class="m_82577fc2 mantine-Input-section mantine-Select-section"
-        data-position="right"
-      >
-        <svg
-          class="m_2943220b mantine-ComboboxChevron-chevron"
-          data-combobox-chevron="true"
-          data-error="[object Object]"
-          fill="none"
-          viewBox="0 0 15 15"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <path
-            clip-rule="evenodd"
-            d="M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z"
-            fill="currentColor"
-            fill-rule="evenodd"
-          />
-        </svg>
-      </div>
-    </div>
-    <p
-      class="m_8f816625 mantine-InputWrapper-error mantine-Select-error"
-      id="mantine-12voha2vo-error"
-    >
-      custom error
-    </p>
-  </div>
-  <input
-    name="$"
-    type="hidden"
-    value="c"
-  />
-</div>
-`;
-
 exports[`mantine select hooks > renders DisabledSelect 1`] = `
 <div>
   <style
@@ -275,7 +193,7 @@ exports[`mantine select hooks > renders InvalidSelect 1`] = `
       class="m_8f816625 mantine-InputWrapper-error mantine-Select-error"
       id="mantine-12voha2vo-error"
     >
-      invalid option
+      Error invalid option
     </p>
   </div>
   <input