@mirai/core 0.3.356 → 0.3.357

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

@@ -2,46 +2,46 @@
 
 exports[`component:<Signup> inherit:className 1`] = `
 <DocumentFragment>
-  <ui_view
+  <ui-view
     class="view"
   >
-    <ui_view
+    <ui-view
       class="view wide"
     >
-      <ui_text
+      <ui-text
         class="text bold headline-2"
       >
         user.label.title_signup
-      </ui_text>
-      <ui_text
+      </ui-text>
+      <ui-text
         class="text paragraph"
       >
         user.label.description_signup
-      </ui_text>
-    </ui_view>
+      </ui-text>
+    </ui-view>
     <form
       class="mirai"
     >
-      <ui_text
+      <ui-text
         class="text small"
       >
         <span>
           *
         </span>
          common.label.required_field
-      </ui_text>
-      <ui_input_text
+      </ui-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-firstName"
+              htmlfor="input.signup-firstName"
             >
               common.label.name
               <span
@@ -49,7 +49,7 @@ exports[`component:<Signup> inherit:className 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-firstName"
@@ -58,21 +58,21 @@ exports[`component:<Signup> inherit:className 1`] = `
               type="text"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_text
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-lastName"
+              htmlfor="input.signup-lastName"
             >
               common.label.lastname
               <span
@@ -80,7 +80,7 @@ exports[`component:<Signup> inherit:className 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-lastName"
@@ -89,21 +89,21 @@ exports[`component:<Signup> inherit:className 1`] = `
               type="text"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_text
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-email"
+              htmlfor="input.signup-email"
             >
               common.label.email
               <span
@@ -111,7 +111,7 @@ exports[`component:<Signup> inherit:className 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-email"
@@ -120,21 +120,21 @@ exports[`component:<Signup> inherit:className 1`] = `
               type="email"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_date
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-dateOfBirth"
+              htmlfor="input.signup-dateOfBirth"
             >
               user.label.date_of_birth
               <span
@@ -142,7 +142,7 @@ exports[`component:<Signup> inherit:className 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-dateOfBirth"
@@ -153,21 +153,21 @@ exports[`component:<Signup> inherit:className 1`] = `
               type="inputDate"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_date>
-      <ui_view
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-select
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="signup-country"
+              htmlfor="signup-country"
             >
               user.label.country
               <span
@@ -175,7 +175,7 @@ exports[`component:<Signup> inherit:className 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <select
               class="select empty input withLabel empty"
               id="signup-country"
@@ -183,8 +183,8 @@ exports[`component:<Signup> inherit:className 1`] = `
               placeholder="common.label.select"
               required=""
             />
-          </ui_view>
-          <ui_icon
+          </ui-view>
+          <ui-icon
             class="icon headline-3 icon expand"
           >
             <svg
@@ -205,21 +205,21 @@ exports[`component:<Signup> inherit:className 1`] = `
                 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_view>
-      <ui_input_text
+          </ui-icon>
+        </ui-view>
+      </ui-input-select>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-password"
+              htmlfor="input.signup-password"
             >
               common.label.password
               <span
@@ -227,7 +227,7 @@ exports[`component:<Signup> inherit:className 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-password"
@@ -236,12 +236,12 @@ exports[`component:<Signup> inherit:className 1`] = `
               type="password"
               value=""
             />
-          </ui_view>
-          <ui_pressable
+          </ui-view>
+          <ui-pressable
             class="pressable"
             tabindex="-1"
           >
-            <ui_icon
+            <ui-icon
               class="icon headline-3 icon password"
             >
               <svg
@@ -261,20 +261,20 @@ exports[`component:<Signup> inherit:className 1`] = `
                   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
+            </ui-icon>
+          </ui-pressable>
+        </ui-view>
+        <ui-text
           class="text small text hint"
         >
           user.label.password_hint
-        </ui_text>
-      </ui_input_text>
-      <ui_input_option
+        </ui-text>
+      </ui-input-text>
+      <ui-input-option
         class="pressable inputOption"
         tabindex="0"
       >
-        <ui_checkbox
+        <ui-checkbox
           class="checkbox"
         >
           <input
@@ -284,7 +284,7 @@ exports[`component:<Signup> inherit:className 1`] = `
             type="checkbox"
             value="true"
           />
-          <ui_icon
+          <ui-icon
             class="icon paragraph icon"
           >
             <svg
@@ -304,21 +304,21 @@ exports[`component:<Signup> inherit:className 1`] = `
                 d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"
               />
             </svg>
-          </ui_icon>
-        </ui_checkbox>
-        <label
+          </ui-icon>
+        </ui-checkbox>
+        <ui-label
           class="text small text label"
-          for="subscribed"
+          htmlfor="subscribed"
         >
           user.label.subscribe
-        </label>
-      </ui_input_option>
-      <ui_input_option
+        </ui-label>
+      </ui-input-option>
+      <ui-input-option
         class="pressable inputOption"
         id="signup-privacy"
         tabindex="0"
       >
-        <ui_checkbox
+        <ui-checkbox
           class="checkbox"
         >
           <input
@@ -327,10 +327,10 @@ exports[`component:<Signup> inherit:className 1`] = `
             type="checkbox"
             value=""
           />
-        </ui_checkbox>
-        <label
+        </ui-checkbox>
+        <ui-label
           class="text small text label"
-          for="signup-privacy"
+          htmlfor="signup-privacy"
         >
           user.label.privacy_policy
           <span
@@ -338,70 +338,70 @@ exports[`component:<Signup> inherit:className 1`] = `
           >
              *
           </span>
-        </label>
-      </ui_input_option>
+        </ui-label>
+      </ui-input-option>
       <button
         class="pressable button large wide"
         tabindex="0"
       >
-        <ui_view
+        <ui-view
           class="view busyContainer"
         >
-          <ui_view
+          <ui-view
             class="view spinner"
           />
-        </ui_view>
-        <ui_view
+        </ui-view>
+        <ui-view
           class="view row children"
         >
           user.action.signup
-        </ui_view>
+        </ui-view>
       </button>
     </form>
-  </ui_view>
+  </ui-view>
 </DocumentFragment>
 `;
 
 exports[`component:<Signup> renders 1`] = `
 <DocumentFragment>
-  <ui_view
+  <ui-view
     class="view"
   >
-    <ui_view
+    <ui-view
       class="view wide"
     >
-      <ui_text
+      <ui-text
         class="text bold headline-2"
       >
         user.label.title_signup
-      </ui_text>
-      <ui_text
+      </ui-text>
+      <ui-text
         class="text paragraph"
       >
         user.label.description_signup
-      </ui_text>
-    </ui_view>
+      </ui-text>
+    </ui-view>
     <form>
-      <ui_text
+      <ui-text
         class="text small"
       >
         <span>
           *
         </span>
          common.label.required_field
-      </ui_text>
-      <ui_input_text
+      </ui-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-firstName"
+              htmlfor="input.signup-firstName"
             >
               common.label.name
               <span
@@ -409,7 +409,7 @@ exports[`component:<Signup> renders 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-firstName"
@@ -418,21 +418,21 @@ exports[`component:<Signup> renders 1`] = `
               type="text"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_text
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-lastName"
+              htmlfor="input.signup-lastName"
             >
               common.label.lastname
               <span
@@ -440,7 +440,7 @@ exports[`component:<Signup> renders 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-lastName"
@@ -449,21 +449,21 @@ exports[`component:<Signup> renders 1`] = `
               type="text"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_text
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-email"
+              htmlfor="input.signup-email"
             >
               common.label.email
               <span
@@ -471,7 +471,7 @@ exports[`component:<Signup> renders 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-email"
@@ -480,21 +480,21 @@ exports[`component:<Signup> renders 1`] = `
               type="email"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_date
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-dateOfBirth"
+              htmlfor="input.signup-dateOfBirth"
             >
               user.label.date_of_birth
               <span
@@ -502,7 +502,7 @@ exports[`component:<Signup> renders 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-dateOfBirth"
@@ -513,21 +513,21 @@ exports[`component:<Signup> renders 1`] = `
               type="inputDate"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_date>
-      <ui_view
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-select
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="signup-country"
+              htmlfor="signup-country"
             >
               user.label.country
               <span
@@ -535,7 +535,7 @@ exports[`component:<Signup> renders 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <select
               class="select empty input withLabel empty"
               id="signup-country"
@@ -543,8 +543,8 @@ exports[`component:<Signup> renders 1`] = `
               placeholder="common.label.select"
               required=""
             />
-          </ui_view>
-          <ui_icon
+          </ui-view>
+          <ui-icon
             class="icon headline-3 icon expand"
           >
             <svg
@@ -565,21 +565,21 @@ exports[`component:<Signup> renders 1`] = `
                 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_view>
-      <ui_input_text
+          </ui-icon>
+        </ui-view>
+      </ui-input-select>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-password"
+              htmlfor="input.signup-password"
             >
               common.label.password
               <span
@@ -587,7 +587,7 @@ exports[`component:<Signup> renders 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-password"
@@ -596,12 +596,12 @@ exports[`component:<Signup> renders 1`] = `
               type="password"
               value=""
             />
-          </ui_view>
-          <ui_pressable
+          </ui-view>
+          <ui-pressable
             class="pressable"
             tabindex="-1"
           >
-            <ui_icon
+            <ui-icon
               class="icon headline-3 icon password"
             >
               <svg
@@ -621,20 +621,20 @@ exports[`component:<Signup> renders 1`] = `
                   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
+            </ui-icon>
+          </ui-pressable>
+        </ui-view>
+        <ui-text
           class="text small text hint"
         >
           user.label.password_hint
-        </ui_text>
-      </ui_input_text>
-      <ui_input_option
+        </ui-text>
+      </ui-input-text>
+      <ui-input-option
         class="pressable inputOption"
         tabindex="0"
       >
-        <ui_checkbox
+        <ui-checkbox
           class="checkbox"
         >
           <input
@@ -644,7 +644,7 @@ exports[`component:<Signup> renders 1`] = `
             type="checkbox"
             value="true"
           />
-          <ui_icon
+          <ui-icon
             class="icon paragraph icon"
           >
             <svg
@@ -664,21 +664,21 @@ exports[`component:<Signup> renders 1`] = `
                 d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"
               />
             </svg>
-          </ui_icon>
-        </ui_checkbox>
-        <label
+          </ui-icon>
+        </ui-checkbox>
+        <ui-label
           class="text small text label"
-          for="subscribed"
+          htmlfor="subscribed"
         >
           user.label.subscribe
-        </label>
-      </ui_input_option>
-      <ui_input_option
+        </ui-label>
+      </ui-input-option>
+      <ui-input-option
         class="pressable inputOption"
         id="signup-privacy"
         tabindex="0"
       >
-        <ui_checkbox
+        <ui-checkbox
           class="checkbox"
         >
           <input
@@ -687,10 +687,10 @@ exports[`component:<Signup> renders 1`] = `
             type="checkbox"
             value=""
           />
-        </ui_checkbox>
-        <label
+        </ui-checkbox>
+        <ui-label
           class="text small text label"
-          for="signup-privacy"
+          htmlfor="signup-privacy"
         >
           user.label.privacy_policy
           <span
@@ -698,72 +698,72 @@ exports[`component:<Signup> renders 1`] = `
           >
              *
           </span>
-        </label>
-      </ui_input_option>
+        </ui-label>
+      </ui-input-option>
       <button
         class="pressable button large wide"
         tabindex="0"
       >
-        <ui_view
+        <ui-view
           class="view busyContainer"
         >
-          <ui_view
+          <ui-view
             class="view spinner"
           />
-        </ui_view>
-        <ui_view
+        </ui-view>
+        <ui-view
           class="view row children"
         >
           user.action.signup
-        </ui_view>
+        </ui-view>
       </button>
     </form>
-  </ui_view>
+  </ui-view>
 </DocumentFragment>
 `;
 
 exports[`component:<Signup> testID 1`] = `
 <DocumentFragment>
-  <ui_view
+  <ui-view
     class="view"
   >
-    <ui_view
+    <ui-view
       class="view wide"
     >
-      <ui_text
+      <ui-text
         class="text bold headline-2"
       >
         user.label.title_signup
-      </ui_text>
-      <ui_text
+      </ui-text>
+      <ui-text
         class="text paragraph"
       >
         user.label.description_signup
-      </ui_text>
-    </ui_view>
+      </ui-text>
+    </ui-view>
     <form
       data-testid="mirai"
     >
-      <ui_text
+      <ui-text
         class="text small"
       >
         <span>
           *
         </span>
          common.label.required_field
-      </ui_text>
-      <ui_input_text
+      </ui-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-firstName"
+              htmlfor="input.signup-firstName"
             >
               common.label.name
               <span
@@ -771,7 +771,7 @@ exports[`component:<Signup> testID 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-firstName"
@@ -780,21 +780,21 @@ exports[`component:<Signup> testID 1`] = `
               type="text"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_text
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-lastName"
+              htmlfor="input.signup-lastName"
             >
               common.label.lastname
               <span
@@ -802,7 +802,7 @@ exports[`component:<Signup> testID 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-lastName"
@@ -811,21 +811,21 @@ exports[`component:<Signup> testID 1`] = `
               type="text"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_text
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-email"
+              htmlfor="input.signup-email"
             >
               common.label.email
               <span
@@ -833,7 +833,7 @@ exports[`component:<Signup> testID 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-email"
@@ -842,21 +842,21 @@ exports[`component:<Signup> testID 1`] = `
               type="email"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_text>
-      <ui_input_date
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-dateOfBirth"
+              htmlfor="input.signup-dateOfBirth"
             >
               user.label.date_of_birth
               <span
@@ -864,7 +864,7 @@ exports[`component:<Signup> testID 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-dateOfBirth"
@@ -875,21 +875,21 @@ exports[`component:<Signup> testID 1`] = `
               type="inputDate"
               value=""
             />
-          </ui_view>
-        </ui_view>
-      </ui_input_date>
-      <ui_view
+          </ui-view>
+        </ui-view>
+      </ui-input-text>
+      <ui-input-select
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="signup-country"
+              htmlfor="signup-country"
             >
               user.label.country
               <span
@@ -897,7 +897,7 @@ exports[`component:<Signup> testID 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <select
               class="select empty input withLabel empty"
               id="signup-country"
@@ -905,8 +905,8 @@ exports[`component:<Signup> testID 1`] = `
               placeholder="common.label.select"
               required=""
             />
-          </ui_view>
-          <ui_icon
+          </ui-view>
+          <ui-icon
             class="icon headline-3 icon expand"
           >
             <svg
@@ -927,21 +927,21 @@ exports[`component:<Signup> testID 1`] = `
                 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_view>
-      <ui_input_text
+          </ui-icon>
+        </ui-view>
+      </ui-input-select>
+      <ui-input-text
         class="view inputContainer"
       >
-        <ui_view
+        <ui-view
           class="view row inputBorder"
         >
-          <ui_view
+          <ui-view
             class="view wide content"
           >
-            <label
+            <ui-label
               class="text paragraph text label"
-              for="input.signup-password"
+              htmlfor="input.signup-password"
             >
               common.label.password
               <span
@@ -949,7 +949,7 @@ exports[`component:<Signup> testID 1`] = `
               >
                  *
               </span>
-            </label>
+            </ui-label>
             <input
               class="input input withLabel"
               id="input.signup-password"
@@ -958,12 +958,12 @@ exports[`component:<Signup> testID 1`] = `
               type="password"
               value=""
             />
-          </ui_view>
-          <ui_pressable
+          </ui-view>
+          <ui-pressable
             class="pressable"
             tabindex="-1"
           >
-            <ui_icon
+            <ui-icon
               class="icon headline-3 icon password"
             >
               <svg
@@ -983,20 +983,20 @@ exports[`component:<Signup> testID 1`] = `
                   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
+            </ui-icon>
+          </ui-pressable>
+        </ui-view>
+        <ui-text
           class="text small text hint"
         >
           user.label.password_hint
-        </ui_text>
-      </ui_input_text>
-      <ui_input_option
+        </ui-text>
+      </ui-input-text>
+      <ui-input-option
         class="pressable inputOption"
         tabindex="0"
       >
-        <ui_checkbox
+        <ui-checkbox
           class="checkbox"
         >
           <input
@@ -1006,7 +1006,7 @@ exports[`component:<Signup> testID 1`] = `
             type="checkbox"
             value="true"
           />
-          <ui_icon
+          <ui-icon
             class="icon paragraph icon"
           >
             <svg
@@ -1026,21 +1026,21 @@ exports[`component:<Signup> testID 1`] = `
                 d="M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"
               />
             </svg>
-          </ui_icon>
-        </ui_checkbox>
-        <label
+          </ui-icon>
+        </ui-checkbox>
+        <ui-label
           class="text small text label"
-          for="subscribed"
+          htmlfor="subscribed"
         >
           user.label.subscribe
-        </label>
-      </ui_input_option>
-      <ui_input_option
+        </ui-label>
+      </ui-input-option>
+      <ui-input-option
         class="pressable inputOption"
         id="signup-privacy"
         tabindex="0"
       >
-        <ui_checkbox
+        <ui-checkbox
           class="checkbox"
         >
           <input
@@ -1049,10 +1049,10 @@ exports[`component:<Signup> testID 1`] = `
             type="checkbox"
             value=""
           />
-        </ui_checkbox>
-        <label
+        </ui-checkbox>
+        <ui-label
           class="text small text label"
-          for="signup-privacy"
+          htmlfor="signup-privacy"
         >
           user.label.privacy_policy
           <span
@@ -1060,26 +1060,26 @@ exports[`component:<Signup> testID 1`] = `
           >
              *
           </span>
-        </label>
-      </ui_input_option>
+        </ui-label>
+      </ui-input-option>
       <button
         class="pressable button large wide"
         tabindex="0"
       >
-        <ui_view
+        <ui-view
           class="view busyContainer"
         >
-          <ui_view
+          <ui-view
             class="view spinner"
           />
-        </ui_view>
-        <ui_view
+        </ui-view>
+        <ui-view
           class="view row children"
         >
           user.action.signup
-        </ui_view>
+        </ui-view>
       </button>
     </form>
-  </ui_view>
+  </ui-view>
 </DocumentFragment>
 `;