@mirai/core 0.4.648 → 0.4.650

package/build/components/Signup/__tests__/__snapshots__/Signup.test.js.snap

@@ -0,0 +1,1040 @@
+// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
+
+exports[`<Signup> inherit:className 1`] = `
+<DocumentFragment>
+  <ui-signup
+    class="view"
+  >
+    <ui-view
+      class="view wide"
+    >
+      <ui-text
+        class="text bold headline-2"
+      >
+        core.label.title_signup
+      </ui-text>
+      <ui-text
+        class="text paragraph"
+      >
+        core.label.description_signup
+      </ui-text>
+    </ui-view>
+    <ui-form
+      class="mirai"
+    >
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-firstName"
+              id="signup-firstName-label"
+            >
+              common.label.name
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-firstName-label"
+              class="input input withLabel"
+              id="signup-firstName"
+              name="firstName"
+              required=""
+              type="text"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-lastName"
+              id="signup-lastName-label"
+            >
+              common.label.lastname
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-lastName-label"
+              class="input input withLabel"
+              id="signup-lastName"
+              name="lastName"
+              required=""
+              type="text"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-email"
+              id="signup-email-label"
+            >
+              common.label.email
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-email-label"
+              class="input input withLabel"
+              id="signup-email"
+              name="email"
+              required=""
+              type="email"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-dateOfBirth"
+              id="signup-dateOfBirth-label"
+            >
+              core.label.date_of_birth
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-dateOfBirth-label"
+              class="input input withLabel"
+              id="signup-dateOfBirth"
+              maxlength="10"
+              name="dateOfBirth"
+              placeholder="DD/MM/YYYY"
+              required=""
+              type="inputDate"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-select
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-country"
+            >
+              core.label.country
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <select
+              class="select empty input withLabel empty"
+              id="signup-country"
+              name="country"
+              placeholder="common.label.select"
+              required=""
+            />
+          </ui-view>
+          <ui-icon
+            class="icon headline-3 icon expand"
+          >
+            <svg
+              fill="currentColor"
+              height="1em"
+              stroke="currentColor"
+              stroke-width="0"
+              viewBox="0 0 24 24"
+              width="1em"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M24 24H0V0h24v24z"
+                fill="none"
+                opacity=".87"
+              />
+              <path
+                d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
+              />
+            </svg>
+          </ui-icon>
+        </ui-view>
+      </ui-input-select>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-password"
+              id="signup-password-label"
+            >
+              common.label.password
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-password-label"
+              class="input input withLabel"
+              id="signup-password"
+              name="password"
+              required=""
+              type="password"
+              value=""
+            />
+          </ui-view>
+          <ui-pressable
+            class="pressable"
+            tabindex="-1"
+          >
+            <ui-icon
+              class="icon headline-3 icon password"
+            >
+              <svg
+                fill="currentColor"
+                height="1em"
+                stroke="currentColor"
+                stroke-width="0"
+                viewBox="0 0 24 24"
+                width="1em"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z"
+                  fill="none"
+                />
+                <path
+                  d="M12 6a9.77 9.77 0 0 1 8.82 5.5 9.647 9.647 0 0 1-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68A11.738 11.738 0 0 0 1 11.5C2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5 2.61 2.61c-.04.01-.08.02-.12.02a2.5 2.5 0 0 1-2.5-2.5c0-.05.01-.08.01-.13zm-3.4-3.4 1.75 1.75a4.6 4.6 0 0 0-.36 1.78 4.507 4.507 0 0 0 6.27 4.14l.98.98c-.88.24-1.8.38-2.75.38a9.77 9.77 0 0 1-8.82-5.5c.7-1.43 1.72-2.61 2.93-3.53z"
+                />
+              </svg>
+            </ui-icon>
+          </ui-pressable>
+        </ui-view>
+        <ui-text
+          class="text small text hint"
+        >
+          core.label.password_hint
+        </ui-text>
+      </ui-input-text>
+      <ui-input-option
+        class="pressable inputOption"
+        tabindex="0"
+      >
+        <ui-checkbox
+          class="checkbox"
+        >
+          <input
+            aria-labelledby="subscribed-label"
+            class="input"
+            name="subscribed"
+            type="checkbox"
+            value=""
+          />
+        </ui-checkbox>
+        <ui-label
+          class="text small text label"
+          htmlfor="subscribed"
+          id="subscribed-label"
+        >
+          core.label.subscribe
+        </ui-label>
+      </ui-input-option>
+      <ui-input-option
+        class="pressable inputOption"
+        id="signup-privacy"
+        tabindex="0"
+      >
+        <ui-checkbox
+          class="checkbox"
+        >
+          <input
+            aria-labelledby="signup-privacy-label"
+            class="input"
+            name="privacy"
+            type="checkbox"
+            value=""
+          />
+        </ui-checkbox>
+        <ui-label
+          class="text small text label"
+          htmlfor="signup-privacy"
+          id="signup-privacy-label"
+        >
+          core.label.privacy_policy
+          <span
+            class="required error"
+          >
+            (common.label.required)
+          </span>
+        </ui-label>
+      </ui-input-option>
+      <ui-button
+        class="pressable button large wide"
+        data-testid="signup-button"
+        tabindex="0"
+      >
+        <ui-view
+          class="view busyContainer"
+        >
+          <ui-view
+            class="view spinner"
+          />
+        </ui-view>
+        <ui-view
+          class="view row children"
+        >
+          core.action.signup
+        </ui-view>
+      </ui-button>
+    </ui-form>
+  </ui-signup>
+</DocumentFragment>
+`;
+
+exports[`<Signup> renders 1`] = `
+<DocumentFragment>
+  <ui-signup
+    class="view"
+  >
+    <ui-view
+      class="view wide"
+    >
+      <ui-text
+        class="text bold headline-2"
+      >
+        core.label.title_signup
+      </ui-text>
+      <ui-text
+        class="text paragraph"
+      >
+        core.label.description_signup
+      </ui-text>
+    </ui-view>
+    <ui-form>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-firstName"
+              id="signup-firstName-label"
+            >
+              common.label.name
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-firstName-label"
+              class="input input withLabel"
+              id="signup-firstName"
+              name="firstName"
+              required=""
+              type="text"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-lastName"
+              id="signup-lastName-label"
+            >
+              common.label.lastname
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-lastName-label"
+              class="input input withLabel"
+              id="signup-lastName"
+              name="lastName"
+              required=""
+              type="text"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-email"
+              id="signup-email-label"
+            >
+              common.label.email
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-email-label"
+              class="input input withLabel"
+              id="signup-email"
+              name="email"
+              required=""
+              type="email"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-dateOfBirth"
+              id="signup-dateOfBirth-label"
+            >
+              core.label.date_of_birth
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-dateOfBirth-label"
+              class="input input withLabel"
+              id="signup-dateOfBirth"
+              maxlength="10"
+              name="dateOfBirth"
+              placeholder="DD/MM/YYYY"
+              required=""
+              type="inputDate"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-select
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-country"
+            >
+              core.label.country
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <select
+              class="select empty input withLabel empty"
+              id="signup-country"
+              name="country"
+              placeholder="common.label.select"
+              required=""
+            />
+          </ui-view>
+          <ui-icon
+            class="icon headline-3 icon expand"
+          >
+            <svg
+              fill="currentColor"
+              height="1em"
+              stroke="currentColor"
+              stroke-width="0"
+              viewBox="0 0 24 24"
+              width="1em"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M24 24H0V0h24v24z"
+                fill="none"
+                opacity=".87"
+              />
+              <path
+                d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
+              />
+            </svg>
+          </ui-icon>
+        </ui-view>
+      </ui-input-select>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-password"
+              id="signup-password-label"
+            >
+              common.label.password
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-password-label"
+              class="input input withLabel"
+              id="signup-password"
+              name="password"
+              required=""
+              type="password"
+              value=""
+            />
+          </ui-view>
+          <ui-pressable
+            class="pressable"
+            tabindex="-1"
+          >
+            <ui-icon
+              class="icon headline-3 icon password"
+            >
+              <svg
+                fill="currentColor"
+                height="1em"
+                stroke="currentColor"
+                stroke-width="0"
+                viewBox="0 0 24 24"
+                width="1em"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z"
+                  fill="none"
+                />
+                <path
+                  d="M12 6a9.77 9.77 0 0 1 8.82 5.5 9.647 9.647 0 0 1-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68A11.738 11.738 0 0 0 1 11.5C2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5 2.61 2.61c-.04.01-.08.02-.12.02a2.5 2.5 0 0 1-2.5-2.5c0-.05.01-.08.01-.13zm-3.4-3.4 1.75 1.75a4.6 4.6 0 0 0-.36 1.78 4.507 4.507 0 0 0 6.27 4.14l.98.98c-.88.24-1.8.38-2.75.38a9.77 9.77 0 0 1-8.82-5.5c.7-1.43 1.72-2.61 2.93-3.53z"
+                />
+              </svg>
+            </ui-icon>
+          </ui-pressable>
+        </ui-view>
+        <ui-text
+          class="text small text hint"
+        >
+          core.label.password_hint
+        </ui-text>
+      </ui-input-text>
+      <ui-input-option
+        class="pressable inputOption"
+        tabindex="0"
+      >
+        <ui-checkbox
+          class="checkbox"
+        >
+          <input
+            aria-labelledby="subscribed-label"
+            class="input"
+            name="subscribed"
+            type="checkbox"
+            value=""
+          />
+        </ui-checkbox>
+        <ui-label
+          class="text small text label"
+          htmlfor="subscribed"
+          id="subscribed-label"
+        >
+          core.label.subscribe
+        </ui-label>
+      </ui-input-option>
+      <ui-input-option
+        class="pressable inputOption"
+        id="signup-privacy"
+        tabindex="0"
+      >
+        <ui-checkbox
+          class="checkbox"
+        >
+          <input
+            aria-labelledby="signup-privacy-label"
+            class="input"
+            name="privacy"
+            type="checkbox"
+            value=""
+          />
+        </ui-checkbox>
+        <ui-label
+          class="text small text label"
+          htmlfor="signup-privacy"
+          id="signup-privacy-label"
+        >
+          core.label.privacy_policy
+          <span
+            class="required error"
+          >
+            (common.label.required)
+          </span>
+        </ui-label>
+      </ui-input-option>
+      <ui-button
+        class="pressable button large wide"
+        data-testid="signup-button"
+        tabindex="0"
+      >
+        <ui-view
+          class="view busyContainer"
+        >
+          <ui-view
+            class="view spinner"
+          />
+        </ui-view>
+        <ui-view
+          class="view row children"
+        >
+          core.action.signup
+        </ui-view>
+      </ui-button>
+    </ui-form>
+  </ui-signup>
+</DocumentFragment>
+`;
+
+exports[`<Signup> testID 1`] = `
+<DocumentFragment>
+  <ui-signup
+    class="view"
+  >
+    <ui-view
+      class="view wide"
+    >
+      <ui-text
+        class="text bold headline-2"
+      >
+        core.label.title_signup
+      </ui-text>
+      <ui-text
+        class="text paragraph"
+      >
+        core.label.description_signup
+      </ui-text>
+    </ui-view>
+    <ui-form
+      data-testid="mirai"
+    >
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-firstName"
+              id="signup-firstName-label"
+            >
+              common.label.name
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-firstName-label"
+              class="input input withLabel"
+              id="signup-firstName"
+              name="firstName"
+              required=""
+              type="text"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-lastName"
+              id="signup-lastName-label"
+            >
+              common.label.lastname
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-lastName-label"
+              class="input input withLabel"
+              id="signup-lastName"
+              name="lastName"
+              required=""
+              type="text"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-email"
+              id="signup-email-label"
+            >
+              common.label.email
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-email-label"
+              class="input input withLabel"
+              id="signup-email"
+              name="email"
+              required=""
+              type="email"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-dateOfBirth"
+              id="signup-dateOfBirth-label"
+            >
+              core.label.date_of_birth
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-dateOfBirth-label"
+              class="input input withLabel"
+              id="signup-dateOfBirth"
+              maxlength="10"
+              name="dateOfBirth"
+              placeholder="DD/MM/YYYY"
+              required=""
+              type="inputDate"
+              value=""
+            />
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-select
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-country"
+            >
+              core.label.country
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <select
+              class="select empty input withLabel empty"
+              id="signup-country"
+              name="country"
+              placeholder="common.label.select"
+              required=""
+            />
+          </ui-view>
+          <ui-icon
+            class="icon headline-3 icon expand"
+          >
+            <svg
+              fill="currentColor"
+              height="1em"
+              stroke="currentColor"
+              stroke-width="0"
+              viewBox="0 0 24 24"
+              width="1em"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <path
+                d="M24 24H0V0h24v24z"
+                fill="none"
+                opacity=".87"
+              />
+              <path
+                d="M16.59 8.59 12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z"
+              />
+            </svg>
+          </ui-icon>
+        </ui-view>
+      </ui-input-select>
+      <ui-input-text
+        class="view inputContainer"
+      >
+        <ui-view
+          class="view row inputBorder"
+        >
+          <ui-view
+            class="view wide content"
+          >
+            <ui-label
+              class="text paragraph text label"
+              htmlfor="signup-password"
+              id="signup-password-label"
+            >
+              common.label.password
+              <span
+                class="required error"
+              >
+                (common.label.required)
+              </span>
+            </ui-label>
+            <input
+              aria-labelledby="signup-password-label"
+              class="input input withLabel"
+              id="signup-password"
+              name="password"
+              required=""
+              type="password"
+              value=""
+            />
+          </ui-view>
+          <ui-pressable
+            class="pressable"
+            tabindex="-1"
+          >
+            <ui-icon
+              class="icon headline-3 icon password"
+            >
+              <svg
+                fill="currentColor"
+                height="1em"
+                stroke="currentColor"
+                stroke-width="0"
+                viewBox="0 0 24 24"
+                width="1em"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0zm0 0h24v24H0V0z"
+                  fill="none"
+                />
+                <path
+                  d="M12 6a9.77 9.77 0 0 1 8.82 5.5 9.647 9.647 0 0 1-2.41 3.12l1.41 1.41c1.39-1.23 2.49-2.77 3.18-4.53C21.27 7.11 17 4 12 4c-1.27 0-2.49.2-3.64.57l1.65 1.65C10.66 6.09 11.32 6 12 6zm-1.07 1.14L13 9.21c.57.25 1.03.71 1.28 1.28l2.07 2.07c.08-.34.14-.7.14-1.07C16.5 9.01 14.48 7 12 7c-.37 0-.72.05-1.07.14zM2.01 3.87l2.68 2.68A11.738 11.738 0 0 0 1 11.5C2.73 15.89 7 19 12 19c1.52 0 2.98-.29 4.32-.82l3.42 3.42 1.41-1.41L3.42 2.45 2.01 3.87zm7.5 7.5 2.61 2.61c-.04.01-.08.02-.12.02a2.5 2.5 0 0 1-2.5-2.5c0-.05.01-.08.01-.13zm-3.4-3.4 1.75 1.75a4.6 4.6 0 0 0-.36 1.78 4.507 4.507 0 0 0 6.27 4.14l.98.98c-.88.24-1.8.38-2.75.38a9.77 9.77 0 0 1-8.82-5.5c.7-1.43 1.72-2.61 2.93-3.53z"
+                />
+              </svg>
+            </ui-icon>
+          </ui-pressable>
+        </ui-view>
+        <ui-text
+          class="text small text hint"
+        >
+          core.label.password_hint
+        </ui-text>
+      </ui-input-text>
+      <ui-input-option
+        class="pressable inputOption"
+        tabindex="0"
+      >
+        <ui-checkbox
+          class="checkbox"
+        >
+          <input
+            aria-labelledby="subscribed-label"
+            class="input"
+            name="subscribed"
+            type="checkbox"
+            value=""
+          />
+        </ui-checkbox>
+        <ui-label
+          class="text small text label"
+          htmlfor="subscribed"
+          id="subscribed-label"
+        >
+          core.label.subscribe
+        </ui-label>
+      </ui-input-option>
+      <ui-input-option
+        class="pressable inputOption"
+        id="signup-privacy"
+        tabindex="0"
+      >
+        <ui-checkbox
+          class="checkbox"
+        >
+          <input
+            aria-labelledby="signup-privacy-label"
+            class="input"
+            name="privacy"
+            type="checkbox"
+            value=""
+          />
+        </ui-checkbox>
+        <ui-label
+          class="text small text label"
+          htmlfor="signup-privacy"
+          id="signup-privacy-label"
+        >
+          core.label.privacy_policy
+          <span
+            class="required error"
+          >
+            (common.label.required)
+          </span>
+        </ui-label>
+      </ui-input-option>
+      <ui-button
+        class="pressable button large wide"
+        data-testid="signup-button"
+        tabindex="0"
+      >
+        <ui-view
+          class="view busyContainer"
+        >
+          <ui-view
+            class="view spinner"
+          />
+        </ui-view>
+        <ui-view
+          class="view row children"
+        >
+          core.action.signup
+        </ui-view>
+      </ui-button>
+    </ui-form>
+  </ui-signup>
+</DocumentFragment>
+`;