@nypl/design-system-react-components 1.0.0 → 1.0.3-beta

package/src/components/RadioGroup/__snapshots__/RadioGroup.test.tsx.snap

@@ -1,1430 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`Radio Button renders the UI snapshot correctly 1`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-column"
->
-  <legend>
-    column
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="column"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="column"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 2`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-row"
->
-  <legend>
-    row
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1objuxj"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="row"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="row"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 3`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-noLabel"
->
-  <legend>
-    no label
-  </legend>
-  <div
-    aria-label="no label"
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="noLabel"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="noLabel"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 4`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-helperText"
->
-  <legend>
-    helperText
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="helperText"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="helperText"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-  <div
-    aria-atomic={true}
-    aria-live="off"
-    className="css-1xdhyk6"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "helper text",
-      }
-    }
-    data-isinvalid={false}
-    id="helperText-helperErrorText"
-  />
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 5`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-invalidText"
->
-  <legend>
-    invalidText
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="invalidText"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="invalidText"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 6`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-noRequiredLabel"
->
-  <legend>
-    no optional or required label
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          aria-required={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="noRequiredLabel"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={true}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          aria-required={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="noRequiredLabel"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={true}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 7`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-required"
->
-  <legend>
-    required
-    <span>
-       (Required)
-    </span>
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          aria-required={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="required"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={true}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          aria-required={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="required"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={true}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 8`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-invalid"
->
-  <legend>
-    invalid
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-        data-invalid=""
-      >
-        <input
-          aria-invalid={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="invalid"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          data-invalid=""
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          data-invalid=""
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-        data-invalid=""
-      >
-        <input
-          aria-invalid={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="invalid"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          data-invalid=""
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          data-invalid=""
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 9`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-disabled"
->
-  <legend>
-    disabled
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-        data-disabled=""
-      >
-        <input
-          aria-disabled={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={true}
-          id="radio-2"
-          name="disabled"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          data-disabled=""
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          data-disabled=""
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-        data-disabled=""
-      >
-        <input
-          aria-disabled={true}
-          checked={false}
-          className="chakra-radio__input"
-          disabled={true}
-          id="radio-3"
-          name="disabled"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          data-disabled=""
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          data-disabled=""
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 10`] = `
-<fieldset
-  className="css-1u8qly9"
-  id="radio-group-jsxLabels"
->
-  <legend>
-    RadioGroup example
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="arts"
-          name="a11y-test"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="arts"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          <div
-            className="css-k008qs"
-          >
-            <span>
-              Arts
-            </span>
-            <div
-              className="css-17xejub"
-            />
-            <span>
-              4
-            </span>
-          </div>
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="English"
-          name="a11y-test"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="English"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          <div
-            className="css-k008qs"
-          >
-            <span>
-              English
-            </span>
-            <div
-              className="css-17xejub"
-            />
-            <span>
-              23
-            </span>
-          </div>
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 11`] = `
-<fieldset
-  className="css-1y4kn3e"
-  id="radio-group-chakra"
->
-  <legend>
-    chakra
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="chakra"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="chakra"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;
-
-exports[`Radio Button renders the UI snapshot correctly 12`] = `
-<fieldset
-  className="css-1u8qly9"
-  data-testid="props"
-  id="radio-group-props"
->
-  <legend>
-    props
-  </legend>
-  <div
-    className="chakra-radio-group css-0"
-    role="radiogroup"
-  >
-    <div
-      className="chakra-stack css-1wdv1uh"
-    >
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-2"
-          name="props"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="2"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 2
-        </span>
-      </label>
-      <label
-        className="chakra-radio css-13p0l12"
-      >
-        <input
-          checked={false}
-          className="chakra-radio__input"
-          disabled={false}
-          id="radio-3"
-          name="props"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          onKeyDown={[Function]}
-          onKeyUp={[Function]}
-          required={false}
-          style={
-            Object {
-              "border": "0px",
-              "clip": "rect(0px, 0px, 0px, 0px)",
-              "height": "1px",
-              "margin": "-1px",
-              "overflow": "hidden",
-              "padding": "0px",
-              "position": "absolute",
-              "whiteSpace": "nowrap",
-              "width": "1px",
-            }
-          }
-          type="radio"
-          value="3"
-        />
-        <span
-          aria-hidden={true}
-          className="css-14wybg9"
-          onMouseDown={[Function]}
-          onMouseEnter={[Function]}
-          onMouseLeave={[Function]}
-          onMouseUp={[Function]}
-        />
-        <span
-          className="chakra-radio__label css-1y8kf23"
-          onMouseDown={[Function]}
-          onTouchStart={[Function]}
-        >
-          Radio 3
-        </span>
-      </label>
-    </div>
-  </div>
-</fieldset>
-`;