CVE-2021-32641: Improper Neutralization of Input During Web Page Generation ('Cross-site Scripting') (CWE-79)
value: auth0-lock is Auth0's signin solution. Versions of nauth0-lock before and including `11.30.0` are vulnerable to reflected XSS. An attacker can execute arbitrary code when the library's `flashMessage` feature is utilized and user input or data from URL parameters is incorporated into the `flashMessage` or the library's `languageDictionary` feature is utilized and user input or data from URL parameters is incorporated into the `languageDictionary`. The vulnerability is patched in version 11.30.1.
CWE description: The product does not neutralize or incorrectly neutralizes user-controllable input before it is placed in output that is used as a web page that is served to other users.
CVSS v3 base score: 6.1
Published: 2021-06-04T21:15Z
Repository: https://github.com/auth0/lock
Language: Other
Files changed: .eslintrc.json, README.md, package.json, src/__tests__/connection/database/__snapshots__/password_reset_confirmation.test.jsx.snap, src/__tests__/connection/database/__snapshots__/signed_up_confirmation.test.jsx.snap, src/__tests__/connection/enterprise/actions.test.js, src/__tests__/connection/passwordless/__snapshots__/email_sent_confirmation.test.jsx.snap, src/__tests__/core/__snapshots__/signed_in_confirmation.test.jsx.snap, src/__tests__/field/__snapshots__/phone_number_pane.test.jsx.snap, src/__tests__/i18n.test.js, src/__tests__/ui/box/__snapshots__/chrome.test.jsx.snap, src/__tests__/ui/box/__snapshots__/confirmation_pane.test.jsx.snap, src/__tests__/ui/input/__snapshots__/email_input.test.jsx.snap, src/connection/enterprise/single_sign_on_notice.jsx, src/connection/passwordless/email_sent_confirmation.jsx, src/field/phone-number/phone_number_pane.jsx, src/i18n.js, src/ui/box/button.jsx, src/ui/box/chrome.jsx, src/ui/box/confirmation_pane.jsx, src/ui/box/success_pane.jsx, src/ui/input/captcha_input.jsx, src/ui/input/checkbox_input.jsx, src/ui/input/email_input.jsx, src/ui/input/input_wrap.jsx, src/ui/input/location_input.jsx, src/ui/input/mfa_code_input.jsx, src/ui/input/password_input.jsx, src/ui/input/phone_number_input.jsx, src/ui/input/select_input.jsx, src/ui/input/username_input.jsx, src/ui/input/vcode_input.jsx, yarn.lock
Commit date: 2021-06-04 10:57:07 +0100
Commit message: Merge pull request from GHSA-jr3j-whm4-9wwm

* Convert svg strings to elements

* Sanitizing usage of dangerouslySetInnerHTML

Co-authored-by: David <david.patrick@auth0.com>
Diff: diff --git a/.eslintrc.json b/.eslintrc.json
index d813c18b..c50e4781 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -7,8 +7,9 @@
   "parser": "babel-eslint",
   "rules": {
     "react/display-name": 0,
     "react/prop-types": 1,
     "react/no-find-dom-node": 1,
-    "react/no-string-refs": 1
+    "react/no-string-refs": 1,
+    "react/no-danger": 2
   }
 }
diff --git a/README.md b/README.md
index 38203575..b7388051 100644
--- a/README.md
+++ b/README.md
@@ -584,11 +584,12 @@ var options = {
   additionalSignUpFields: [{
     type: "checkbox",
     name: "newsletter",
     prefill: "true",
     placeholder: "I hereby agree that I want to receive marketing emails from your company",
-    // placeholderHTML - is an optional field  and overrides the value of placeholder
+    // placeholderHTML - is an optional field and overrides the value of placeholder
+    // do not use user inputted data for HTML fields as they are vulnerable to XSS
     placeholderHTML: "<b>I hereby agree that I want to receive marketing emails from your company</b>",
     // ariaLabel - is an optional field
     ariaLabel: "Activate Newsletter"
   }]
 }
diff --git a/package.json b/package.json
index 5e54698f..d517fce5 100644
--- a/package.json
+++ b/package.json
@@ -104,10 +104,11 @@
   },
   "dependencies": {
     "auth0-js": "^9.16.2",
     "auth0-password-policies": "^1.0.2",
     "blueimp-md5": "2.3.1",
+    "dompurify": "^2.2.8",
     "immutable": "^3.7.3",
     "jsonp": "^0.2.1",
     "password-sheriff": "^1.1.0",
     "prop-types": "^15.6.0",
     "qs": "^6.7.0",
diff --git a/src/__tests__/connection/database/__snapshots__/password_reset_confirmation.test.jsx.snap b/src/__tests__/connection/database/__snapshots__/password_reset_confirmation.test.jsx.snap
index 40554495..5dab121d 100644
--- a/src/__tests__/connection/database/__snapshots__/password_reset_confirmation.test.jsx.snap
+++ b/src/__tests__/connection/database/__snapshots__/password_reset_confirmation.test.jsx.snap
@@ -5,16 +5,37 @@ exports[`PasswordResetConfirmation renders correctly 1`] = `
   className="auth0-lock-confirmation"
 >
   <div
     className="auth0-lock-confirmation-content"
   >
-    <span
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
-        }
-      }
-    />
+    <span>
+      <svg
+        className="checkmark"
+        focusable="false"
+        height="56px"
+        version="1.1"
+        viewBox="0 0 52 52"
+        width="56px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+         
+        <circle
+          className="checkmark__circle"
+          cx="26"
+          cy="26"
+          fill="none"
+          r="25"
+        />
+         
+        <path
+          className="checkmark__check"
+          d="M14.1 27.2l7.1 7.2 16.7-16.8"
+          fill="none"
+        />
+         
+      </svg>
+    </span>
     <p />
   </div>
 </div>
 `;
diff --git a/src/__tests__/connection/database/__snapshots__/signed_up_confirmation.test.jsx.snap b/src/__tests__/connection/database/__snapshots__/signed_up_confirmation.test.jsx.snap
index c918cf42..d6923970 100644
--- a/src/__tests__/connection/database/__snapshots__/signed_up_confirmation.test.jsx.snap
+++ b/src/__tests__/connection/database/__snapshots__/signed_up_confirmation.test.jsx.snap
@@ -5,16 +5,37 @@ exports[`SignedUpConfirmation renders correctly 1`] = `
   className="auth0-lock-confirmation"
 >
   <div
     className="auth0-lock-confirmation-content"
   >
-    <span
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
-        }
-      }
-    />
+    <span>
+      <svg
+        className="checkmark"
+        focusable="false"
+        height="56px"
+        version="1.1"
+        viewBox="0 0 52 52"
+        width="56px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+         
+        <circle
+          className="checkmark__circle"
+          cx="26"
+          cy="26"
+          fill="none"
+          r="25"
+        />
+         
+        <path
+          className="checkmark__check"
+          d="M14.1 27.2l7.1 7.2 16.7-16.8"
+          fill="none"
+        />
+         
+      </svg>
+    </span>
     <p />
   </div>
 </div>
 `;
diff --git a/src/__tests__/connection/enterprise/actions.test.js b/src/__tests__/connection/enterprise/actions.test.js
index 99f840c6..55803314 100644
--- a/src/__tests__/connection/enterprise/actions.test.js
+++ b/src/__tests__/connection/enterprise/actions.test.js
@@ -35,11 +35,11 @@ describe('Login with connection scopes', () => {
   afterEach(() => {
     jest.resetAllMocks();
   });
 
   describe('for an SSO connection', () => {
-    it.only('passes connectionScopes to the connection', () => {
+    it('passes connectionScopes to the connection', () => {
       lock = l.setup('__lock__', 'client', 'domain', {
         auth: {
           connectionScopes: {
             'sso-connection': ['offline_access']
           }
@@ -65,11 +65,11 @@ describe('Login with connection scopes', () => {
       });
     });
   });
 
   describe('for a non-SSO connection', () => {
-    it.only('passes connectionScopes to the connection', () => {
+    it('passes connectionScopes to the connection', () => {
       lock = l.setup('__lock__', 'client', 'domain', {
         auth: {
           connectionScopes: {
             'enterprise-connection': ['offline_access']
           }
diff --git a/src/__tests__/connection/passwordless/__snapshots__/email_sent_confirmation.test.jsx.snap b/src/__tests__/connection/passwordless/__snapshots__/email_sent_confirmation.test.jsx.snap
index 82cf493d..b1742880 100644
--- a/src/__tests__/connection/passwordless/__snapshots__/email_sent_confirmation.test.jsx.snap
+++ b/src/__tests__/connection/passwordless/__snapshots__/email_sent_confirmation.test.jsx.snap
@@ -5,45 +5,106 @@ exports[`EmailSentConfirmation renders correctly 1`] = `
   className="auth0-lock-confirmation"
 >
   <span
     aria-label="close"
     className="auth0-lock-close-button"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 128 128\\" version=\\"1.1\\" viewBox=\\"0 0 128 128\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"><g><polygon fill=\\"#373737\\" points=\\"123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   \\"></polygon></g></svg>",
-      }
-    }
     id="__lock-id__-close-button"
     onClick={[Function]}
     onKeyPress={[Function]}
     role="button"
     tabIndex={0}
-  />
+  >
+    <svg
+      aria-hidden="true"
+      enableBackground="new 0 0 128 128"
+      focusable="false"
+      version="1.1"
+      viewBox="0 0 128 128"
+      xmlSpace="preserve"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+    >
+      <g>
+        <polygon
+          fill="#373737"
+          points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "
+        />
+      </g>
+    </svg>
+  </span>
   <span
     aria-label="back"
     className="auth0-lock-back-button"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 24 24\\" version=\\"1.0\\" viewBox=\\"0 0 24 24\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"> <polyline fill=\\"none\\" points=\\"12.5,21 3.5,12 12.5,3 \\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\"></polyline> <line fill=\\"none\\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\" x1=\\"22\\" x2=\\"3.5\\" y1=\\"12\\" y2=\\"12\\"></line> </svg>",
-      }
-    }
     id="__lock-id__-back-button"
     onClick={[Function]}
     onKeyPress={[Function]}
     role="button"
     tabIndex={0}
-  />
+  >
+    <svg
+      aria-hidden="true"
+      enableBackground="new 0 0 24 24"
+      focusable="false"
+      version="1.0"
+      viewBox="0 0 24 24"
+      xmlSpace="preserve"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+    >
+       
+      <polyline
+        fill="none"
+        points="12.5,21 3.5,12 12.5,3 "
+        stroke="#000000"
+        strokeMiterlimit="10"
+        strokeWidth="2"
+      />
+       
+      <line
+        fill="none"
+        stroke="#000000"
+        strokeMiterlimit="10"
+        strokeWidth="2"
+        x1="22"
+        x2="3.5"
+        y1="12"
+        y2="12"
+      />
+       
+    </svg>
+  </span>
   <div
     className="auth0-lock-confirmation-content"
   >
-    <span
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
-        }
-      }
-    />
+    <span>
+      <svg
+        className="checkmark"
+        focusable="false"
+        height="56px"
+        version="1.1"
+        viewBox="0 0 52 52"
+        width="56px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+         
+        <circle
+          className="checkmark__circle"
+          cx="26"
+          cy="26"
+          fill="none"
+          r="25"
+        />
+         
+        <path
+          className="checkmark__check"
+          d="M14.1 27.2l7.1 7.2 16.7-16.8"
+          fill="none"
+        />
+         
+      </svg>
+    </span>
     <p>
       <span
         dangerouslySetInnerHTML={
           Object {
             "__html": " ",
@@ -57,17 +118,35 @@ exports[`EmailSentConfirmation renders correctly 1`] = `
         href="#"
         onClick={[Function]}
       >
         
          
-        <span
-          dangerouslySetInnerHTML={
-            Object {
-              "__html": "<svg focusable=\\"false\\" height=\\"32px\\" style=\\"enable-background:new 0 0 32 32;\\" version=\\"1.1\\" viewBox=\\"0 0 32 32\\" width=\\"32px\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"> <path d=\\"M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z\\"></path> <path d=\\"M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z\\"></path> </svg>",
+        <span>
+          <svg
+            focusable="false"
+            height="32px"
+            style={
+              Object {
+                "enableBackground": "new 0 0 32 32",
+              }
             }
-          }
-        />
+            version="1.1"
+            viewBox="0 0 32 32"
+            width="32px"
+            xmlSpace="preserve"
+            xmlns="http://www.w3.org/2000/svg"
+            xmlnsXlink="http://www.w3.org/1999/xlink"
+          >
+             
+            <path
+              d="M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z"
+            />
+            <path
+              d="M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z"
+            />
+          </svg>
+        </span>
       </a>
     </span>
   </div>
 </div>
 `;
diff --git a/src/__tests__/core/__snapshots__/signed_in_confirmation.test.jsx.snap b/src/__tests__/core/__snapshots__/signed_in_confirmation.test.jsx.snap
index c95ee587..9a10415d 100644
--- a/src/__tests__/core/__snapshots__/signed_in_confirmation.test.jsx.snap
+++ b/src/__tests__/core/__snapshots__/signed_in_confirmation.test.jsx.snap
@@ -5,16 +5,37 @@ exports[`SignedInConfirmation renders correctly 1`] = `
   className="auth0-lock-confirmation"
 >
   <div
     className="auth0-lock-confirmation-content"
   >
-    <span
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
-        }
-      }
-    />
+    <span>
+      <svg
+        className="checkmark"
+        focusable="false"
+        height="56px"
+        version="1.1"
+        viewBox="0 0 52 52"
+        width="56px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+         
+        <circle
+          className="checkmark__circle"
+          cx="26"
+          cy="26"
+          fill="none"
+          r="25"
+        />
+         
+        <path
+          className="checkmark__check"
+          d="M14.1 27.2l7.1 7.2 16.7-16.8"
+          fill="none"
+        />
+         
+      </svg>
+    </span>
     <p />
   </div>
 </div>
 `;
diff --git a/src/__tests__/field/__snapshots__/phone_number_pane.test.jsx.snap b/src/__tests__/field/__snapshots__/phone_number_pane.test.jsx.snap
index 325d1e9d..e8dc458d 100644
--- a/src/__tests__/field/__snapshots__/phone_number_pane.test.jsx.snap
+++ b/src/__tests__/field/__snapshots__/phone_number_pane.test.jsx.snap
@@ -3,11 +3,11 @@
 exports[`PhoneNumberPane calls \`startOptionSelection\` when SelectInput is clicked 1`] = `
 Array [
   1,
   "location",
   "",
-  "<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>",
+  <UNDEFINED />,
 ]
 `;
 
 exports[`PhoneNumberPane calls \`swap\` when PhoneNumberInput changes 1`] = `
 Array [
@@ -21,11 +21,49 @@ Array [
 
 exports[`PhoneNumberPane disables input when submitting 1`] = `
 <div>
   <div
     data-__type="select_input"
-    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
+    data-icon={
+      <svg
+        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
+        focusable="false"
+        height="14px"
+        version="1.1"
+        viewBox="0 0 14 14"
+        width="14px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            fill="#919191"
+            id="Lock"
+            transform="translate(-201.000000, -3519.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                transform="translate(35.000000, 299.000000)"
+              >
+                <path
+                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
+                  id="Fill-349-Copy"
+                />
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    }
     data-isValid={false}
     data-label="humanLocation"
     data-name="location"
     data-onClick={[Function]}
     data-placeholder=""
@@ -44,11 +82,49 @@ exports[`PhoneNumberPane disables input when submitting 1`] = `
 
 exports[`PhoneNumberPane renders correctly 1`] = `
 <div>
   <div
     data-__type="select_input"
-    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
+    data-icon={
+      <svg
+        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
+        focusable="false"
+        height="14px"
+        version="1.1"
+        viewBox="0 0 14 14"
+        width="14px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            fill="#919191"
+            id="Lock"
+            transform="translate(-201.000000, -3519.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                transform="translate(35.000000, 299.000000)"
+              >
+                <path
+                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
+                  id="Fill-349-Copy"
+                />
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    }
     data-isValid={false}
     data-label="humanLocation"
     data-name="location"
     data-onClick={[Function]}
     data-placeholder=""
@@ -67,11 +143,49 @@ exports[`PhoneNumberPane renders correctly 1`] = `
 
 exports[`PhoneNumberPane sets isValid as true when \`isFieldVisiblyInvalid\` is false 1`] = `
 <div>
   <div
     data-__type="select_input"
-    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
+    data-icon={
+      <svg
+        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
+        focusable="false"
+        height="14px"
+        version="1.1"
+        viewBox="0 0 14 14"
+        width="14px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            fill="#919191"
+            id="Lock"
+            transform="translate(-201.000000, -3519.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                transform="translate(35.000000, 299.000000)"
+              >
+                <path
+                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
+                  id="Fill-349-Copy"
+                />
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    }
     data-isValid={true}
     data-label="humanLocation"
     data-name="location"
     data-onClick={[Function]}
     data-placeholder=""
@@ -95,11 +209,49 @@ exports[`PhoneNumberPane shows header when instructions are available 1`] = `
       instructions
     </span>
   </p>
   <div
     data-__type="select_input"
-    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
+    data-icon={
+      <svg
+        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
+        focusable="false"
+        height="14px"
+        version="1.1"
+        viewBox="0 0 14 14"
+        width="14px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            fill="#919191"
+            id="Lock"
+            transform="translate(-201.000000, -3519.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                transform="translate(35.000000, 299.000000)"
+              >
+                <path
+                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
+                  id="Fill-349-Copy"
+                />
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
+    }
     data-isValid={false}
     data-label="humanLocation"
     data-name="location"
     data-onClick={[Function]}
     data-placeholder=""
diff --git a/src/__tests__/i18n.test.js b/src/__tests__/i18n.test.js
index b562101f..bfe29950 100644
--- a/src/__tests__/i18n.test.js
+++ b/src/__tests__/i18n.test.js
@@ -47,6 +47,19 @@ describe('i18n', () => {
 
       i18n.initI18n(Immutable.fromJS({}));
       expect(syncSpy).toHaveBeenCalledTimes(1);
     });
   });
+
+  describe('when html is called', () => {
+    it('should sanitize the input and not allow for javascript to be passed through', () => {
+      const i18n = require('../i18n');
+      const strings = {
+        test: '<img src=1 href=1 onerror="javascript:alert(1)"></img>'
+      };
+      const m = Immutable.fromJS({ i18n: { strings } });
+      const html = i18n.html(m, 'test');
+      expect(html.props.dangerouslySetInnerHTML.__html).not.toMatch(/javascript:alert/);
+      expect(html.props.dangerouslySetInnerHTML.__html).toEqual('<img href="1" src="1">');
+    });
+  });
 });
diff --git a/src/__tests__/ui/box/__snapshots__/chrome.test.jsx.snap b/src/__tests__/ui/box/__snapshots__/chrome.test.jsx.snap
index e8b968e0..bd8ce35a 100644
--- a/src/__tests__/ui/box/__snapshots__/chrome.test.jsx.snap
+++ b/src/__tests__/ui/box/__snapshots__/chrome.test.jsx.snap
@@ -145,17 +145,70 @@ exports[`Chrome can dislay all global messages together 1`] = `
       >
         <div
           className="auth0-loading"
         />
       </div>
-      <span
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
-          }
-        }
-      />
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        height="42px"
+        version="1.1"
+        viewBox="0 0 43 42"
+        width="43px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          id="Page-1"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            id="Lock"
+            transform="translate(-280.000000, -3592.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                id="Group"
+              >
+                <g
+                  id="Login"
+                  transform="translate(0.000000, 369.000000)"
+                >
+                  <g
+                    id="Btn"
+                  >
+                    <g
+                      id="Oval-302-+-Shape"
+                      transform="translate(128.000000, 17.000000)"
+                    >
+                      <circle
+                        cx="20.5"
+                        cy="20"
+                        id="Oval-302"
+                        r="20"
+                        stroke="#FFFFFF"
+                        strokeWidth="2"
+                      />
+                      <path
+                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
+                        fill="#FFFFFF"
+                        id="Shape"
+                      />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
     </button>
   </div>
 </div>
 `;
 
@@ -276,17 +329,70 @@ exports[`Chrome renders correctly when there is a global information message 1`]
       >
         <div
           className="auth0-loading"
         />
       </div>
-      <span
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
-          }
-        }
-      />
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        height="42px"
+        version="1.1"
+        viewBox="0 0 43 42"
+        width="43px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          id="Page-1"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            id="Lock"
+            transform="translate(-280.000000, -3592.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                id="Group"
+              >
+                <g
+                  id="Login"
+                  transform="translate(0.000000, 369.000000)"
+                >
+                  <g
+                    id="Btn"
+                  >
+                    <g
+                      id="Oval-302-+-Shape"
+                      transform="translate(128.000000, 17.000000)"
+                    >
+                      <circle
+                        cx="20.5"
+                        cy="20"
+                        id="Oval-302"
+                        r="20"
+                        stroke="#FFFFFF"
+                        strokeWidth="2"
+                      />
+                      <path
+                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
+                        fill="#FFFFFF"
+                        id="Shape"
+                      />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
     </button>
   </div>
 </div>
 `;
 
@@ -407,17 +513,70 @@ exports[`Chrome renders correctly when there is a global message 1`] = `
       >
         <div
           className="auth0-loading"
         />
       </div>
-      <span
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
-          }
-        }
-      />
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        height="42px"
+        version="1.1"
+        viewBox="0 0 43 42"
+        width="43px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          id="Page-1"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            id="Lock"
+            transform="translate(-280.000000, -3592.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                id="Group"
+              >
+                <g
+                  id="Login"
+                  transform="translate(0.000000, 369.000000)"
+                >
+                  <g
+                    id="Btn"
+                  >
+                    <g
+                      id="Oval-302-+-Shape"
+                      transform="translate(128.000000, 17.000000)"
+                    >
+                      <circle
+                        cx="20.5"
+                        cy="20"
+                        id="Oval-302"
+                        r="20"
+                        stroke="#FFFFFF"
+                        strokeWidth="2"
+                      />
+                      <path
+                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
+                        fill="#FFFFFF"
+                        id="Shape"
+                      />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
     </button>
   </div>
 </div>
 `;
 
@@ -538,17 +697,70 @@ exports[`Chrome renders correctly when there is a global success message 1`] = `
       >
         <div
           className="auth0-loading"
         />
       </div>
-      <span
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
-          }
-        }
-      />
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        height="42px"
+        version="1.1"
+        viewBox="0 0 43 42"
+        width="43px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          id="Page-1"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            id="Lock"
+            transform="translate(-280.000000, -3592.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                id="Group"
+              >
+                <g
+                  id="Login"
+                  transform="translate(0.000000, 369.000000)"
+                >
+                  <g
+                    id="Btn"
+                  >
+                    <g
+                      id="Oval-302-+-Shape"
+                      transform="translate(128.000000, 17.000000)"
+                    >
+                      <circle
+                        cx="20.5"
+                        cy="20"
+                        id="Oval-302"
+                        r="20"
+                        stroke="#FFFFFF"
+                        strokeWidth="2"
+                      />
+                      <path
+                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
+                        fill="#FFFFFF"
+                        id="Shape"
+                      />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
     </button>
   </div>
 </div>
 `;
 
@@ -654,16 +866,69 @@ exports[`Chrome renders correctly with basic props 1`] = `
       >
         <div
           className="auth0-loading"
         />
       </div>
-      <span
-        dangerouslySetInnerHTML={
-          Object {
-            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
-          }
-        }
-      />
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        height="42px"
+        version="1.1"
+        viewBox="0 0 43 42"
+        width="43px"
+        xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+      >
+        <g
+          fill="none"
+          fillRule="evenodd"
+          id="Page-1"
+          stroke="none"
+          strokeWidth="1"
+        >
+          <g
+            id="Lock"
+            transform="translate(-280.000000, -3592.000000)"
+          >
+            <g
+              id="SMS"
+              transform="translate(153.000000, 3207.000000)"
+            >
+              <g
+                id="Group"
+              >
+                <g
+                  id="Login"
+                  transform="translate(0.000000, 369.000000)"
+                >
+                  <g
+                    id="Btn"
+                  >
+                    <g
+                      id="Oval-302-+-Shape"
+                      transform="translate(128.000000, 17.000000)"
+                    >
+                      <circle
+                        cx="20.5"
+                        cy="20"
+                        id="Oval-302"
+                        r="20"
+                        stroke="#FFFFFF"
+                        strokeWidth="2"
+                      />
+                      <path
+                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
+                        fill="#FFFFFF"
+                        id="Shape"
+                      />
+                    </g>
+                  </g>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </svg>
     </button>
   </div>
 </div>
 `;
diff --git a/src/__tests__/ui/box/__snapshots__/confirmation_pane.test.jsx.snap b/src/__tests__/ui/box/__snapshots__/confirmation_pane.test.jsx.snap
index 129fd5ca..4478a25c 100644
--- a/src/__tests__/ui/box/__snapshots__/confirmation_pane.test.jsx.snap
+++ b/src/__tests__/ui/box/__snapshots__/confirmation_pane.test.jsx.snap
@@ -5,47 +5,83 @@ exports[`ConfirmationPane renders correctly 1`] = `
   className="auth0-lock-confirmation"
 >
   <span
     aria-label="close"
     className="auth0-lock-close-button"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 128 128\\" version=\\"1.1\\" viewBox=\\"0 0 128 128\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"><g><polygon fill=\\"#373737\\" points=\\"123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   \\"></polygon></g></svg>",
-      }
-    }
     id="__lock-id__-close-button"
     onClick={[Function]}
     onKeyPress={[Function]}
     role="button"
     tabIndex={0}
-  />
+  >
+    <svg
+      aria-hidden="true"
+      enableBackground="new 0 0 128 128"
+      focusable="false"
+      version="1.1"
+      viewBox="0 0 128 128"
+      xmlSpace="preserve"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+    >
+      <g>
+        <polygon
+          fill="#373737"
+          points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "
+        />
+      </g>
+    </svg>
+  </span>
   <span
     aria-label="back"
     className="auth0-lock-back-button"
-    dangerouslySetInnerHTML={
-      Object {
-        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 24 24\\" version=\\"1.0\\" viewBox=\\"0 0 24 24\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"> <polyline fill=\\"none\\" points=\\"12.5,21 3.5,12 12.5,3 \\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\"></polyline> <line fill=\\"none\\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\" x1=\\"22\\" x2=\\"3.5\\" y1=\\"12\\" y2=\\"12\\"></line> </svg>",
-      }
-    }
     id="__lock-id__-back-button"
     onClick={[Function]}
     onKeyPress={[Function]}
     role="button"
     tabIndex={0}
-  />
+  >
+    <svg
+      aria-hidden="true"
+      enableBackground="new 0 0 24 24"
+      focusable="false"
+      version="1.0"
+      viewBox="0 0 24 24"
+      xmlSpace="preserve"
+      xmlns="http://www.w3.org/2000/svg"
+      xmlnsXlink="http://www.w3.org/1999/xlink"
+    >
+       
+      <polyline
+        fill="none"
+        points="12.5,21 3.5,12 12.5,3 "
+        stroke="#000000"
+        strokeMiterlimit="10"
+        strokeWidth="2"
+      />
+       
+      <line
+        fill="none"
+        stroke="#000000"
+        strokeMiterlimit="10"
+        strokeWidth="2"
+        x1="22"
+        x2="3.5"
+        y1="12"
+        y2="12"
+      />
+       
+    </svg>
+  </span>
   <div
     className="auth0-lock-confirmation-content"
   >
-    <span
-      dangerouslySetInnerHTML={
-        Object {
-          "__html": <svg>
-            svg
-          </svg>,
-        }
-      }
-    />
+    <span>
+      <svg>
+        svg
+      </svg>
+    </span>
     <span>
       test
     </span>
   </div>
 </div>
diff --git a/src/__tests__/ui/input/__snapshots__/email_input.test.jsx.snap b/src/__tests__/ui/input/__snapshots__/email_input.test.jsx.snap
index edc7c921..9839a09d 100644
--- a/src/__tests__/ui/input/__snapshots__/email_input.test.jsx.snap
+++ b/src/__tests__/ui/input/__snapshots__/email_input.test.jsx.snap
@@ -1,3 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`EmailInput renders without issue 1`] = `"<div data-__type=\\"input_wrap\\" data-invalidhint=\\"invalidHint\\" data-isvalid=\\"true\\" data-name=\\"email\\" data-icon=\\"<svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; width=&quot;14px&quot; height=&quot;13px&quot; viewBox=&quot;0 0 32 26&quot; version=&quot;1.1&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; xmlns:xlink=&quot;http://www.w3.org/1999/xlink&quot; xmlns:sketch=&quot;http://www.bohemiancoding.com/sketch/ns&quot; class=&quot;auth0-lock-icon auth0-lock-icon-box&quot;><g id=&quot;Page-1&quot; stroke=&quot;none&quot; stroke-width=&quot;1&quot; fill=&quot;none&quot; fill-rule=&quot;evenodd&quot; sketch:type=&quot;MSPage&quot;><g id=&quot;32px&quot; sketch:type=&quot;MSLayerGroup&quot; transform=&quot;translate(-2155.000000, -2317.000000)&quot; fill=&quot;#373A39&quot;><g id=&quot;Group-856&quot; transform=&quot;translate(1.000000, 1.000000)&quot; sketch:type=&quot;MSShapeGroup&quot;><path id=&quot;Fill-419&quot; d=&quot;M2184,2339 C2184,2339.55 2183.55,2340 2183,2340 L2157,2340 C2156.45,2340 2156,2339.55 2156,2339 L2156,2319 C2156,2318.45 2156.45,2318 2157,2318 L2183,2318 C2183.55,2318 2184,2318.45 2184,2319 L2184,2339 L2184,2339 Z M2184,2316 L2156,2316 C2154.89,2316 2154,2316.89 2154,2318 L2154,2340 C2154,2341.1 2154.89,2342 2156,2342 L2184,2342 C2185.1,2342 2186,2341.1 2186,2340 L2186,2318 C2186,2316.89 2185.1,2316 2184,2316 L2184,2316 Z M2176,2322 L2180,2322 L2180,2326 L2176,2326 L2176,2322 Z M2174,2328 L2182,2328 L2182,2320 L2174,2320 L2174,2328 Z M2158,2332 L2172,2332 L2172,2330 L2158,2330 L2158,2332 Z M2158,2336 L2172,2336 L2172,2334 L2158,2334 L2158,2336 Z&quot;></path></g></g></g></svg>\\"><input type=\\"email\\" id=\\"1-email\\" inputmode=\\"email\\" name=\\"email\\" class=\\"auth0-lock-input\\" placeholder=\\"yours@example.com\\" autocomplete=\\"off\\" autocapitalize=\\"off\\" aria-label=\\"Email\\" aria-invalid=\\"false\\" value=\\"value\\"></div>"`;
+exports[`EmailInput renders without issue 1`] = `"<div data-__type=\\"input_wrap\\" data-invalidhint=\\"invalidHint\\" data-isvalid=\\"true\\" data-name=\\"email\\" data-icon=\\"[object Object]\\"><input type=\\"email\\" id=\\"1-email\\" inputmode=\\"email\\" name=\\"email\\" class=\\"auth0-lock-input\\" placeholder=\\"yours@example.com\\" autocomplete=\\"off\\" autocapitalize=\\"off\\" aria-label=\\"Email\\" aria-invalid=\\"false\\" value=\\"value\\"></div>"`;
diff --git a/src/connection/enterprise/single_sign_on_notice.jsx b/src/connection/enterprise/single_sign_on_notice.jsx
index 5ae0138a..a3e5cf26 100644
--- a/src/connection/enterprise/single_sign_on_notice.jsx
+++ b/src/connection/enterprise/single_sign_on_notice.jsx
@@ -1,9 +1,8 @@
 import React from 'react';
-import { icon } from '../../ui/input/password_input';
+import { IconSvg } from '../../ui/input/password_input';
 
 export default ({ children }) => (
   <div className="auth0-sso-notice-container">
-    <span dangerouslySetInnerHTML={{ __html: icon }} /> {' '}
-    <span className="auth0-sso-notice">{children}</span>
+    <span>{IconSvg}</span> <span className="auth0-sso-notice">{children}</span>
   </div>
 );
diff --git a/src/connection/passwordless/email_sent_confirmation.jsx b/src/connection/passwordless/email_sent_confirmation.jsx
index 792a23a9..040c63c9 100644
--- a/src/connection/passwordless/email_sent_confirmation.jsx
+++ b/src/connection/passwordless/email_sent_confirmation.jsx
@@ -7,19 +7,34 @@ import * as c from '../../field/index';
 import { resendEmail, restart } from './actions';
 import * as m from './index';
 
 import * as i18n from '../../i18n'; // TODO: can't we get this from pops?
 
-const retrySvg =
-  '<svg focusable="false" height="32px" style="enable-background:new 0 0 32 32;" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d="M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z"></path> <path d="M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z"></path> </svg>';
+const RetrySvgIcon = (
+  <svg
+    focusable="false"
+    height="32px"
+    style={{ enableBackground: 'new 0 0 32 32' }}
+    version="1.1"
+    viewBox="0 0 32 32"
+    width="32px"
+    xmlSpace="preserve"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+  >
+    {' '}
+    <path d="M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z"></path>
+    <path d="M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z"></path>
+  </svg>
+);
 
 class ResendLink extends React.Component {
   render() {
     const { label, onClick } = this.props;
     return (
       <a className="auth0-lock-resend-link" href="#" onClick={onClick}>
-        {label} <span dangerouslySetInnerHTML={{ __html: retrySvg }} />
+        {label} <span>{RetrySvgIcon}</span>
       </a>
     );
   }
 }
 
diff --git a/src/field/phone-number/phone_number_pane.jsx b/src/field/phone-number/phone_number_pane.jsx
index 35bbfe93..f7853269 100644
--- a/src/field/phone-number/phone_number_pane.jsx
+++ b/src/field/phone-number/phone_number_pane.jsx
@@ -9,12 +9,35 @@ import { startOptionSelection } from '../actions';
 import * as c from '../index';
 import * as l from '../../core/index';
 import { swap, updateEntity } from '../../store/index';
 import { humanLocation, setPhoneNumber } from '../phone_number';
 
-export const icon =
-  '<svg focusable="false" width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><path id="Fill-349-Copy" d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"></path></g></g></g></g></svg>';
+export const IconSvg = (
+  <svg
+    focusable="false"
+    width="14px"
+    height="14px"
+    viewBox="0 0 14 14"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191">
+        <g id="SMS" transform="translate(153.000000, 3207.000000)">
+          <g transform="translate(35.000000, 299.000000)">
+            <path
+              id="Fill-349-Copy"
+              d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
+            ></path>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class PhoneNumberPane extends React.Component {
   handlePhoneNumberChange(e) {
     swap(updateEntity, 'lock', l.id(this.props.lock), setPhoneNumber, e.target.value);
   }
@@ -26,16 +49,16 @@ export default class PhoneNumberPane extends React.Component {
 
     return (
       <div>
         {header}
         <SelectInput
-          icon={icon}
+          icon={IconSvg}
           isValid={!c.isFieldVisiblyInvalid(lock, 'location')}
           name="location"
           placeholder=""
           label={humanLocation(lock)}
-          onClick={() => startOptionSelection(l.id(lock), 'location', '', icon)}
+          onClick={() => startOptionSelection(l.id(lock), 'location', '', <IconSvg />)}
         />
         <PhoneNumberInput
           value={c.phoneNumber(lock)}
           isValid={!c.isFieldVisiblyInvalid(lock, 'phoneNumber')}
           invalidHint={invalidHint}
diff --git a/src/i18n.js b/src/i18n.js
index ce7f34c8..87ba9cc6 100644
--- a/src/i18n.js
+++ b/src/i18n.js
@@ -1,8 +1,9 @@
 import React from 'react';
 import Immutable, { Map } from 'immutable';
 import { format } from 'util';
+import { sanitize } from 'dompurify';
 import sync from './sync';
 import * as l from './core/index';
 import { dataFns } from './utils/data_utils';
 const { get, set } = dataFns(['i18n']);
 import enDictionary from './i18n/en';
@@ -12,12 +13,15 @@ export function str(m, keyPath, ...args) {
   return format(get(m, ['strings'].concat(keyPath), ''), ...args);
 }
 
 export function html(m, keyPath, ...args) {
   const html = str(m, keyPath, ...args);
-
-  return html ? React.createElement('span', { dangerouslySetInnerHTML: { __html: html } }) : null;
+  // dangerouslySetInnerHTML input is sanitized using dompurify
+  // eslint-disable-next-line react/no-danger
+  return html
+    ? React.createElement('span', { dangerouslySetInnerHTML: { __html: sanitize(html) } })
+    : null;
 }
 
 export function group(m, keyPath) {
   return get(m, ['strings'].concat(keyPath), Map()).toJS();
 }
diff --git a/src/ui/box/button.jsx b/src/ui/box/button.jsx
index f76fe891..76afa48d 100644
--- a/src/ui/box/button.jsx
+++ b/src/ui/box/button.jsx
@@ -1,22 +1,65 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const svgs = {
-  back:
-    '<svg aria-hidden="true" focusable="false" enable-background="new 0 0 24 24" version="1.0" viewBox="0 0 24 24" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <polyline fill="none" points="12.5,21 3.5,12 12.5,3 " stroke="#000000" stroke-miterlimit="10" stroke-width="2"></polyline> <line fill="none" stroke="#000000" stroke-miterlimit="10" stroke-width="2" x1="22" x2="3.5" y1="12" y2="12"></line> </svg>',
-  close:
-    '<svg aria-hidden="true" focusable="false" enable-background="new 0 0 128 128" version="1.1" viewBox="0 0 128 128" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><polygon fill="#373737" points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "></polygon></g></svg>'
-};
+const SvgBackIcon = () => (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    enableBackground="new 0 0 24 24"
+    version="1.0"
+    viewBox="0 0 24 24"
+    xmlSpace="preserve"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+  >
+    {' '}
+    <polyline
+      fill="none"
+      points="12.5,21 3.5,12 12.5,3 "
+      stroke="#000000"
+      strokeMiterlimit="10"
+      strokeWidth="2"
+    ></polyline>{' '}
+    <line
+      fill="none"
+      stroke="#000000"
+      strokeMiterlimit="10"
+      strokeWidth="2"
+      x1="22"
+      x2="3.5"
+      y1="12"
+      y2="12"
+    ></line>{' '}
+  </svg>
+);
+const SvgCloseIcon = () => (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    enableBackground="new 0 0 128 128"
+    version="1.1"
+    viewBox="0 0 128 128"
+    xmlSpace="preserve"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+  >
+    <g>
+      <polygon
+        fill="#373737"
+        points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "
+      ></polygon>
+    </g>
+  </svg>
+);
 
 const IconButton = ({ lockId, name, onClick, svg }) => (
   <span
     id={`${lockId}-${name}-button`}
     role="button"
     tabIndex={0}
     className={`auth0-lock-${name}-button`}
-    dangerouslySetInnerHTML={{ __html: svg }}
     onClick={e => {
       e.preventDefault();
       onClick();
     }}
     onKeyPress={e => {
@@ -24,42 +67,31 @@ const IconButton = ({ lockId, name, onClick, svg }) => (
         e.preventDefault();
         onClick();
       }
     }}
     aria-label={name}
-  />
+  >
+    {svg}
+  </span>
 );
 
 IconButton.propTypes = {
   name: PropTypes.string.isRequired,
   onClick: PropTypes.func.isRequired,
-  svg: PropTypes.string.isRequired
+  svg: PropTypes.element.isRequired
 };
 
-// const createButton = name => {
-//   const f = ({onClick}) => (
-//     <IconButton name={name} svg={svgs[name]} onClick={onClick} />
-//   );
-//   f.displayName = `IconButton (${name})`;
-//   f.propTypes = { onClick: React.PropTypes.func.isRequired };
-//
-//   return f;
-// };
-//
-// export const CloseButton = createButton("close");
-// export const BackButton = createButton("back");
-
 export const CloseButton = ({ lockId, onClick }) => (
-  <IconButton lockId={lockId} name="close" svg={svgs['close']} onClick={onClick} />
+  <IconButton lockId={lockId} name="close" onClick={onClick} svg={<SvgCloseIcon />} />
 );
 
 CloseButton.propTypes = {
   onClick: PropTypes.func.isRequired
 };
 
 export const BackButton = ({ lockId, onClick }) => (
-  <IconButton lockId={lockId} name="back" svg={svgs['back']} onClick={onClick} />
+  <IconButton lockId={lockId} name="back" onClick={onClick} svg={<SvgBackIcon />} />
 );
 
 BackButton.propTypes = {
   onClick: PropTypes.func.isRequired
 };
diff --git a/src/ui/box/chrome.jsx b/src/ui/box/chrome.jsx
index 84d7e8a5..0945a568 100644
--- a/src/ui/box/chrome.jsx
+++ b/src/ui/box/chrome.jsx
@@ -1,18 +1,76 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import ReactDOM from 'react-dom';
+import { sanitize } from 'dompurify';
 import { TransitionGroup, CSSTransition } from 'react-transition-group';
 import MultisizeSlide from './multisize_slide';
 import GlobalMessage from './global_message';
 import * as l from '../../core/index';
 import Header from './header';
 
-const submitSvg =
-  '<svg aria-hidden="true" focusable="false" width="43px" height="42px" viewBox="0 0 43 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" sketch:type="MSArtboardGroup" transform="translate(-280.000000, -3592.000000)"><g id="SMS" sketch:type="MSLayerGroup" transform="translate(153.000000, 3207.000000)"><g id="Group" sketch:type="MSShapeGroup"><g id="Login" transform="translate(0.000000, 369.000000)"><g id="Btn"><g id="Oval-302-+-Shape" transform="translate(128.000000, 17.000000)"><circle id="Oval-302" stroke="#FFFFFF" stroke-width="2" cx="20.5" cy="20" r="20"></circle><path d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z" id="Shape" fill="#FFFFFF"></path></g></g></g></g></g></g></g></svg>';
-const submitText =
-  '<svg aria-hidden="true" focusable="false" class="icon-text" width="8px" height="12px" viewBox="0 0 8 12" version="1.1" xmlns="http://www.w3.org/2000/svg"><g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Web/Submit/Active" transform="translate(-148.000000, -32.000000)" fill="#FFFFFF"><polygon id="Shape" points="148 33.4 149.4 32 155.4 38 149.4 44 148 42.6 152.6 38"></polygon></g></g></svg>';
+const SubmitSvg = () => (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="43px"
+    height="42px"
+    viewBox="0 0 43 42"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+  >
+    <g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g id="Lock" transform="translate(-280.000000, -3592.000000)">
+        <g id="SMS" transform="translate(153.000000, 3207.000000)">
+          <g id="Group">
+            <g id="Login" transform="translate(0.000000, 369.000000)">
+              <g id="Btn">
+                <g id="Oval-302-+-Shape" transform="translate(128.000000, 17.000000)">
+                  <circle
+                    id="Oval-302"
+                    stroke="#FFFFFF"
+                    strokeWidth="2"
+                    cx="20.5"
+                    cy="20"
+                    r="20"
+                  ></circle>
+                  <path
+                    d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
+                    id="Shape"
+                    fill="#FFFFFF"
+                  ></path>
+                </g>
+              </g>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
+const SubmitTextSvg = () => (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    className="icon-text"
+    width="8px"
+    height="12px"
+    viewBox="0 0 8 12"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g id="Symbols" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g id="Web/Submit/Active" transform="translate(-148.000000, -32.000000)" fill="#FFFFFF">
+        <polygon
+          id="Shape"
+          points="148 33.4 149.4 32 155.4 38 149.4 44 148 42.6 152.6 38"
+        ></polygon>
+      </g>
+    </g>
+  </svg>
+);
 
 class SubmitButton extends React.Component {
   handleSubmit() {
     const { label, screenName, contentProps } = this.props;
     const { model } = contentProps;
@@ -41,14 +99,14 @@ class SubmitButton extends React.Component {
   render() {
     const { color, disabled, label, display } = this.props;
     const content = label ? (
       <span className="auth0-label-submit">
         {label}
-        <span dangerouslySetInnerHTML={{ __html: submitText }} />
+        <SubmitTextSvg />
       </span>
     ) : (
-      <span dangerouslySetInnerHTML={{ __html: submitSvg }} />
+      <SubmitSvg />
     );
 
     return (
       <button
         className="auth0-lock-submit"
@@ -69,10 +127,11 @@ class SubmitButton extends React.Component {
 }
 
 SubmitButton.propTypes = {
   color: PropTypes.string.isRequired,
   disabled: PropTypes.bool,
+  display: PropTypes.string,
   label: PropTypes.string,
   screenName: PropTypes.string,
   onSubmit: PropTypes.func,
   contentProps: PropTypes.object
 };
@@ -222,11 +281,13 @@ export default class Chrome extends React.Component {
 
     const shouldShowSubmitButton = showSubmitButton && !delayingShowSubmitButton;
 
     function wrapGlobalMessage(message) {
       return typeof message === 'string'
-        ? React.createElement('span', { dangerouslySetInnerHTML: { __html: message } })
+        ? // dangerouslySetInnerHTML input is sanitized using dompurify
+          // eslint-disable-next-line react/no-danger
+          React.createElement('span', { dangerouslySetInnerHTML: { __html: sanitize(message) } })
         : message;
     }
 
     const globalError = error ? (
       <GlobalMessage
diff --git a/src/ui/box/confirmation_pane.jsx b/src/ui/box/confirmation_pane.jsx
index 185518a4..109b6799 100644
--- a/src/ui/box/confirmation_pane.jsx
+++ b/src/ui/box/confirmation_pane.jsx
@@ -6,11 +6,11 @@ import * as l from '../../core/index';
 const ConfirmationPane = ({ lock, backHandler, children, closeHandler, svg }) => (
   <div className="auth0-lock-confirmation">
     {closeHandler && <CloseButton lockId={l.id(lock)} onClick={closeHandler} />}
     {backHandler && <BackButton lockId={l.id(lock)} onClick={backHandler} />}
     <div className="auth0-lock-confirmation-content">
-      <span dangerouslySetInnerHTML={{ __html: svg }} />
+      <span>{svg}</span>
       {children}
     </div>
   </div>
 );
 
@@ -19,9 +19,9 @@ ConfirmationPane.propTypes = {
   closeHandler: PropTypes.func,
   children: PropTypes.oneOfType([
     PropTypes.element.isRequired,
     PropTypes.arrayOf(PropTypes.element).isRequired
   ]),
-  svg: PropTypes.string.isRequired
+  svg: PropTypes.element.isRequired
 };
 
 export default ConfirmationPane;
diff --git a/src/ui/box/success_pane.jsx b/src/ui/box/success_pane.jsx
index 97e5a5a6..064fa675 100644
--- a/src/ui/box/success_pane.jsx
+++ b/src/ui/box/success_pane.jsx
@@ -1,9 +1,23 @@
 import React from 'react';
 import ConfirmationPane from './confirmation_pane';
 
-const svg =
-  '<svg focusable="false" width="56px" height="56px" viewBox="0 0 52 52" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="checkmark"> <circle cx="26" cy="26" r="25" fill="none" class="checkmark__circle"></circle> <path fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8" class="checkmark__check"></path> </svg>';
+const svg = (
+  <svg
+    focusable="false"
+    width="56px"
+    height="56px"
+    viewBox="0 0 52 52"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="checkmark"
+  >
+    {' '}
+    <circle cx="26" cy="26" r="25" fill="none" className="checkmark__circle"></circle>{' '}
+    <path fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8" className="checkmark__check"></path>{' '}
+  </svg>
+);
 
 const SuccessPane = props => <ConfirmationPane svg={svg} {...props} />;
 
 export default SuccessPane;
diff --git a/src/ui/input/captcha_input.jsx b/src/ui/input/captcha_input.jsx
index 67ba0064..77d05576 100644
--- a/src/ui/input/captcha_input.jsx
+++ b/src/ui/input/captcha_input.jsx
@@ -1,12 +1,56 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 
-const inputIconSVG =
-  '<svg class="auth0-lock-icon auth0-lock-icon-box" width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="icon/key"><path id="Shape" fill-rule="evenodd" clip-rule="evenodd" d="M16.3884 11.0145C14.4508 12.9522 11.3948 13.0447 9.32094 11.3401L7.20872 13.2642L9.60904 15.6697L8.83354 16.4466L6.39631 14.0048L4.88251 15.3832L7.39496 17.89L6.61586 18.6666L3.5 15.5587L3.53914 15.5198C3.47446 15.3363 3.51554 15.1287 3.67514 14.983L8.54211 10.5496C6.89425 8.47691 7.005 5.46384 8.92209 3.54636C10.9841 1.48455 14.3267 1.48455 16.3884 3.54636C18.4501 5.60846 18.4501 8.95239 16.3884 11.0145ZM15.6048 4.33856C13.98 2.71309 11.3454 2.71309 9.72062 4.33856C8.0958 5.9632 8.0958 8.59793 9.72062 10.2226C11.3454 11.8478 13.98 11.8478 15.6048 10.2226C17.2297 8.59793 17.2297 5.96292 15.6048 4.33856Z" fill="#888888"/></g></svg>';
+const InputIconSvg = (
+  <svg
+    className="auth0-lock-icon auth0-lock-icon-box"
+    width="21"
+    height="20"
+    viewBox="0 0 21 20"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <g id="icon/key">
+      <path
+        id="Shape"
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M16.3884 11.0145C14.4508 12.9522 11.3948 13.0447 9.32094 11.3401L7.20872 13.2642L9.60904 15.6697L8.83354 16.4466L6.39631 14.0048L4.88251 15.3832L7.39496 17.89L6.61586 18.6666L3.5 15.5587L3.53914 15.5198C3.47446 15.3363 3.51554 15.1287 3.67514 14.983L8.54211 10.5496C6.89425 8.47691 7.005 5.46384 8.92209 3.54636C10.9841 1.48455 14.3267 1.48455 16.3884 3.54636C18.4501 5.60846 18.4501 8.95239 16.3884 11.0145ZM15.6048 4.33856C13.98 2.71309 11.3454 2.71309 9.72062 4.33856C8.0958 5.9632 8.0958 8.59793 9.72062 10.2226C11.3454 11.8478 13.98 11.8478 15.6048 10.2226C17.2297 8.59793 17.2297 5.96292 15.6048 4.33856Z"
+        fill="#888888"
+      />
+    </g>
+  </svg>
+);
 
-const refreshIconSVG = `<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z" fill="black"/><mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="1" y="1" width="18" height="18"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z" fill="white"/></mask><g mask="url(#mask0)"></g></svg>`;
+const RefreshIconSvg = () => (
+  <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z"
+      fill="black"
+    />
+    <mask
+      id="mask0"
+      mask-type="alpha"
+      maskUnits="userSpaceOnUse"
+      x="1"
+      y="1"
+      width="18"
+      height="18"
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z"
+        fill="white"
+      />
+    </mask>
+    <g mask="url(#mask0)"></g>
+  </svg>
+);
 
 export default class CaptchaInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -47,19 +91,20 @@ export default class CaptchaInput extends React.Component {
           ></div>
           <button
             type="button"
             onClick={::this.handleReload}
             className="auth0-lock-captcha-refresh"
-            dangerouslySetInnerHTML={{ __html: refreshIconSVG }}
-          ></button>
+          >
+            <RefreshIconSvg />
+          </button>
         </div>
         <InputWrap
           focused={focused}
           invalidHint=""
           isValid={isValid}
           name="captcha"
-          icon={inputIconSVG}
+          icon={InputIconSvg}
         >
           <input
             id={`${lockId}-captcha`}
             ref="input"
             type="text"
diff --git a/src/ui/input/checkbox_input.jsx b/src/ui/input/checkbox_input.jsx
index 147b4475..5b048829 100644
--- a/src/ui/input/checkbox_input.jsx
+++ b/src/ui/input/checkbox_input.jsx
@@ -13,10 +13,12 @@ export default class CheckboxInput extends React.Component {
             onChange={::this.handleOnChange}
             name={name}
             aria-label={ariaLabel || name}
           />
           {placeholderHTML ? (
+            // placeholderHTML allows raw HTML
+            // eslint-disable-next-line react/no-danger
             <span dangerouslySetInnerHTML={{ __html: placeholderHTML }} />
           ) : (
             <span>{placeholder}</span>
           )}
         </label>
diff --git a/src/ui/input/email_input.jsx b/src/ui/input/email_input.jsx
index ebefd4ce..299bb191 100644
--- a/src/ui/input/email_input.jsx
+++ b/src/ui/input/email_input.jsx
@@ -1,10 +1,32 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 
-const svg =
-  '<svg aria-hidden="true" focusable="false" width="14px" height="13px" viewBox="0 0 32 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="32px" sketch:type="MSLayerGroup" transform="translate(-2155.000000, -2317.000000)" fill="#373A39"><g id="Group-856" transform="translate(1.000000, 1.000000)" sketch:type="MSShapeGroup"><path id="Fill-419" d="M2184,2339 C2184,2339.55 2183.55,2340 2183,2340 L2157,2340 C2156.45,2340 2156,2339.55 2156,2339 L2156,2319 C2156,2318.45 2156.45,2318 2157,2318 L2183,2318 C2183.55,2318 2184,2318.45 2184,2319 L2184,2339 L2184,2339 Z M2184,2316 L2156,2316 C2154.89,2316 2154,2316.89 2154,2318 L2154,2340 C2154,2341.1 2154.89,2342 2156,2342 L2184,2342 C2185.1,2342 2186,2341.1 2186,2340 L2186,2318 C2186,2316.89 2185.1,2316 2184,2316 L2184,2316 Z M2176,2322 L2180,2322 L2180,2326 L2176,2326 L2176,2322 Z M2174,2328 L2182,2328 L2182,2320 L2174,2320 L2174,2328 Z M2158,2332 L2172,2332 L2172,2330 L2158,2330 L2158,2332 Z M2158,2336 L2172,2336 L2172,2334 L2158,2334 L2158,2336 Z"></path></g></g></g></svg>';
+const SVG = (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="14px"
+    height="13px"
+    viewBox="0 0 32 26"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box"
+  >
+    <g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g id="32px" transform="translate(-2155.000000, -2317.000000)" fill="#373A39">
+        <g id="Group-856" transform="translate(1.000000, 1.000000)">
+          <path
+            id="Fill-419"
+            d="M2184,2339 C2184,2339.55 2183.55,2340 2183,2340 L2157,2340 C2156.45,2340 2156,2339.55 2156,2339 L2156,2319 C2156,2318.45 2156.45,2318 2157,2318 L2183,2318 C2183.55,2318 2184,2318.45 2184,2319 L2184,2339 L2184,2339 Z M2184,2316 L2156,2316 C2154.89,2316 2154,2316.89 2154,2318 L2154,2340 C2154,2341.1 2154.89,2342 2156,2342 L2184,2342 C2185.1,2342 2186,2341.1 2186,2340 L2186,2318 C2186,2316.89 2185.1,2316 2184,2316 L2184,2316 Z M2176,2322 L2180,2322 L2180,2326 L2176,2326 L2176,2322 Z M2174,2328 L2182,2328 L2182,2320 L2174,2320 L2174,2328 Z M2158,2332 L2172,2332 L2172,2330 L2158,2330 L2158,2332 Z M2158,2336 L2172,2336 L2172,2334 L2158,2334 L2158,2336 Z"
+          ></path>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class EmailInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -31,11 +53,11 @@ export default class EmailInput extends React.Component {
       <InputWrap
         focused={focused}
         invalidHint={invalidHint}
         isValid={isValid}
         name="email"
-        icon={svg}
+        icon={SVG}
       >
         <input
           id={`${lockId}-email`}
           ref="input"
           type="email"
diff --git a/src/ui/input/input_wrap.jsx b/src/ui/input/input_wrap.jsx
index 7392ea80..b1bfbac1 100644
--- a/src/ui/input/input_wrap.jsx
+++ b/src/ui/input/input_wrap.jsx
@@ -12,21 +12,11 @@ export default class InputWrap extends React.Component {
     let wrapClassName = 'auth0-lock-input-wrap';
     if (focused && isValid) {
       wrapClassName += ' auth0-lock-focused';
     }
 
-    // NOTE: Ugly hack until we upgrade to React 15 which has better
-    // support for SVG.
-    let iconElement = null;
-
-    if (typeof icon === 'string') {
-      iconElement = <span aria-hidden="true" dangerouslySetInnerHTML={{ __html: icon }} />;
-    } else if (icon) {
-      iconElement = icon;
-    }
-
-    if (iconElement) {
+    if (icon) {
       wrapClassName += ' auth0-lock-input-wrap-with-icon';
     }
 
     const errorTooltip =
       !isValid && invalidHint ? (
@@ -36,11 +26,11 @@ export default class InputWrap extends React.Component {
       ) : null;
 
     return (
       <div className={blockClassName}>
         <div className={wrapClassName}>
-          {iconElement}
+          {icon}
           {this.props.children}
           {after}
         </div>
         {errorTooltip}
       </div>
@@ -56,7 +46,7 @@ InputWrap.propTypes = {
   ]),
   focused: PropTypes.bool,
   invalidHint: PropTypes.node,
   isValid: PropTypes.bool.isRequired,
   name: PropTypes.string.isRequired,
-  svg: PropTypes.string
+  icon: PropTypes.object
 };
diff --git a/src/ui/input/location_input.jsx b/src/ui/input/location_input.jsx
index e74fb3da..28fb01cf 100644
--- a/src/ui/input/location_input.jsx
+++ b/src/ui/input/location_input.jsx
@@ -1,12 +1,64 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 
-export const icon =
-  '<svg aria-hidden="true" focusable="false" width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><path id="Fill-349-Copy" d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"></path></g></g></g></g></svg>';
-const arrowSvg =
-  '<svg aria-hidden="true" focusable="false" width="5px" height="10px" viewBox="0 0 5 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-arrow"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-396.000000, -3521.000000)" fill="#000000" opacity="0.539999962"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)"><path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path></g></g></g></g></g></svg>';
+export const IconSvg = (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="14px"
+    height="14px"
+    viewBox="0 0 14 14"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191">
+        <g id="SMS" transform="translate(153.000000, 3207.000000)">
+          <g transform="translate(35.000000, 299.000000)">
+            <path
+              id="Fill-349-Copy"
+              d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
+            ></path>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
+const ArrowIconSvg = () => (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="5px"
+    height="10px"
+    viewBox="0 0 5 10"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-arrow"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g
+        id="Lock"
+        transform="translate(-396.000000, -3521.000000)"
+        fill="#000000"
+        opacity="0.539999962"
+      >
+        <g id="SMS" transform="translate(153.000000, 3207.000000)">
+          <g transform="translate(35.000000, 299.000000)">
+            <g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)">
+              <path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class LocationInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -17,11 +69,11 @@ export default class LocationInput extends React.Component {
     const { focused } = this.state;
 
     const limitedValue = value.length > 23 ? `${value.substr(0, 20)}...` : value;
 
     return (
-      <InputWrap focused={focused} isValid={true} name="location" icon={icon}>
+      <InputWrap focused={focused} isValid={true} name="location" icon={IconSvg}>
         <input
           type="button"
           name="location"
           className="auth0-lock-input auth0-lock-input-location"
           value={limitedValue}
@@ -29,11 +81,13 @@ export default class LocationInput extends React.Component {
           onBlur={::this.handleBlur}
           onKeyDown={::this.handleKeyDown}
           onClick={onClick}
           aria-label="Location"
         />
-        <span dangerouslySetInnerHTML={{ __html: arrowSvg }} />
+        <span>
+          <ArrowIconSvg />
+        </span>
       </InputWrap>
     );
   }
 
   handleFocus() {
diff --git a/src/ui/input/mfa_code_input.jsx b/src/ui/input/mfa_code_input.jsx
index 0fcf6c28..fa596dab 100644
--- a/src/ui/input/mfa_code_input.jsx
+++ b/src/ui/input/mfa_code_input.jsx
@@ -1,9 +1,9 @@
 import PropTypes from 'prop-types';
 import React from 'react';
 import InputWrap from './input_wrap';
-import { icon } from './password_input';
+import { IconSvg } from './password_input';
 
 export default class MFACodeInput extends React.Component {
   static propTypes = {
     invalidHint: PropTypes.string.isRequired,
     isValid: PropTypes.bool.isRequired,
@@ -34,11 +34,11 @@ export default class MFACodeInput extends React.Component {
       <InputWrap
         focused={focused}
         invalidHint={invalidHint}
         isValid={isValid}
         name="mfa_code"
-        icon={icon}
+        icon={IconSvg}
       >
         <input
           id={`${lockId}-mfa_code`}
           ref="input"
           type="text"
diff --git a/src/ui/input/password_input.jsx b/src/ui/input/password_input.jsx
index 9fc8e551..4bc12044 100644
--- a/src/ui/input/password_input.jsx
+++ b/src/ui/input/password_input.jsx
@@ -2,12 +2,29 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import InputWrap from './input_wrap';
 import PasswordStrength from './password/password_strength';
 import * as l from '../../core/index';
 
-export const icon =
-  '<svg aria-hidden="true" focusable="false" width="11px" height="14px" viewBox="0 0 13 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="auth0-lock-icon auth0-lock-icon-box"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-288.000000, -1508.000000)" fill="#888888"><path d="M299,1523.998 L290,1523.998 C288.896,1523.998 288,1523.102 288,1521.999 L288,1515.999 C288,1514.895 288.896,1513.998 290,1513.998 L290,1513.998 L290,1512.499 C290,1510.015 292.015,1507.999 294.5,1507.999 C296.985,1507.999 299,1510.015 299,1512.499 L299,1513.999 C300.104,1513.999 301,1514.895 301,1515.999 L301,1521.999 C301,1523.103 300.104,1523.998 299,1523.998 L299,1523.998 Z M298,1512.499 C298,1510.566 296.433,1508.999 294.5,1508.999 C292.567,1508.999 291,1510.566 291,1512.499 L291,1513.998 L298,1513.998 L298,1512.499 L298,1512.499 Z M300,1515.999 C300,1515.446 299.552,1514.998 299,1514.998 L290,1514.998 C289.447,1514.998 289,1515.446 289,1515.999 L289,1521.999 C289,1522.551 289.447,1522.998 290,1522.998 L299,1522.998 C299.552,1522.998 300,1522.551 300,1521.999 L300,1515.999 L300,1515.999 Z M294.5,1520.998 C294.224,1520.998 294,1520.774 294,1520.498 L294,1517.498 C294,1517.223 294.224,1516.999 294.5,1516.999 C294.776,1516.999 295,1517.223 295,1517.498 L295,1520.498 C295,1520.774 294.776,1520.998 294.5,1520.998 L294.5,1520.998 Z"></path></g></g></svg>';
+export const IconSvg = (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="11px"
+    height="14px"
+    viewBox="0 0 13 16"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g transform="translate(-288.000000, -1508.000000)" fill="#888888">
+        <path d="M299,1523.998 L290,1523.998 C288.896,1523.998 288,1523.102 288,1521.999 L288,1515.999 C288,1514.895 288.896,1513.998 290,1513.998 L290,1513.998 L290,1512.499 C290,1510.015 292.015,1507.999 294.5,1507.999 C296.985,1507.999 299,1510.015 299,1512.499 L299,1513.999 C300.104,1513.999 301,1514.895 301,1515.999 L301,1521.999 C301,1523.103 300.104,1523.998 299,1523.998 L299,1523.998 Z M298,1512.499 C298,1510.566 296.433,1508.999 294.5,1508.999 C292.567,1508.999 291,1510.566 291,1512.499 L291,1513.998 L298,1513.998 L298,1512.499 L298,1512.499 Z M300,1515.999 C300,1515.446 299.552,1514.998 299,1514.998 L290,1514.998 C289.447,1514.998 289,1515.446 289,1515.999 L289,1521.999 C289,1522.551 289.447,1522.998 290,1522.998 L299,1522.998 C299.552,1522.998 300,1522.551 300,1521.999 L300,1515.999 L300,1515.999 Z M294.5,1520.998 C294.224,1520.998 294,1520.774 294,1520.498 L294,1517.498 C294,1517.223 294.224,1516.999 294.5,1516.999 C294.776,1516.999 295,1517.223 295,1517.498 L295,1520.498 C295,1520.774 294.776,1520.998 294.5,1520.998 L294.5,1520.998 Z"></path>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class PasswordInput extends React.Component {
   static propTypes = {
     invalidHint: PropTypes.string.isRequired,
     showPasswordStrengthMessage: PropTypes.bool.isRequired,
@@ -62,11 +79,11 @@ export default class PasswordInput extends React.Component {
         after={passwordStrength}
         focused={focused}
         invalidHint={invalidHint}
         isValid={isValid}
         name="password"
-        icon={icon}
+        icon={IconSvg}
       >
         <input
           ref="input"
           type={showPassword ? 'text' : 'password'}
           name="password"
diff --git a/src/ui/input/phone_number_input.jsx b/src/ui/input/phone_number_input.jsx
index bab3179b..cbe90f03 100644
--- a/src/ui/input/phone_number_input.jsx
+++ b/src/ui/input/phone_number_input.jsx
@@ -1,10 +1,31 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 
-const svg =
-  '<svg aria-hidden="true" focusable="false" width="9px" height="14px" viewBox="0 0 9 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-mobile"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-204.000000, -3459.000000)" fill="#888888"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 239.000000)"><path d="M24.1,15.625 L16.9,15.625 L16.9,14.75 C16.9,14.264375 17.30275,13.875 17.8,13.875 L23.2,13.875 C23.6968,13.875 24.1,14.264375 24.1,14.75 L24.1,15.625 L24.1,15.625 Z M16.9,16.5 L24.1,16.5 L24.1,21.75 L16.9,21.75 L16.9,16.5 Z M24.1,25.25 C24.1,25.73125 23.6968,26.125 23.2,26.125 L17.8,26.125 C17.30275,26.125 16.9,25.73125 16.9,25.25 L16.9,22.625 L24.1,22.625 L24.1,25.25 L24.1,25.25 Z M23.2,13 L17.8,13 C16.80595,13 16,13.783125 16,14.75 L16,25.25 C16,26.216875 16.80595,27 17.8,27 L23.2,27 C24.19405,27 25,26.216875 25,25.25 L25,14.75 C25,13.783125 24.19405,13 23.2,13 L23.2,13 Z M20.5,25.25 C20.9968,25.25 21.4,24.85625 21.4,24.375 C21.4,23.889375 20.9968,23.5 20.5,23.5 C20.00275,23.5 19.6,23.889375 19.6,24.375 C19.6,24.85625 20.00275,25.25 20.5,25.25 L20.5,25.25 Z"></path></g></g></g></g></svg>';
+const IconSvg = (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="9px"
+    height="14px"
+    viewBox="0 0 9 14"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-mobile"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g id="Lock" transform="translate(-204.000000, -3459.000000)" fill="#888888">
+        <g id="SMS" transform="translate(153.000000, 3207.000000)">
+          <g transform="translate(35.000000, 239.000000)">
+            <path d="M24.1,15.625 L16.9,15.625 L16.9,14.75 C16.9,14.264375 17.30275,13.875 17.8,13.875 L23.2,13.875 C23.6968,13.875 24.1,14.264375 24.1,14.75 L24.1,15.625 L24.1,15.625 Z M16.9,16.5 L24.1,16.5 L24.1,21.75 L16.9,21.75 L16.9,16.5 Z M24.1,25.25 C24.1,25.73125 23.6968,26.125 23.2,26.125 L17.8,26.125 C17.30275,26.125 16.9,25.73125 16.9,25.25 L16.9,22.625 L24.1,22.625 L24.1,25.25 L24.1,25.25 Z M23.2,13 L17.8,13 C16.80595,13 16,13.783125 16,14.75 L16,25.25 C16,26.216875 16.80595,27 17.8,27 L23.2,27 C24.19405,27 25,26.216875 25,25.25 L25,14.75 C25,13.783125 24.19405,13 23.2,13 L23.2,13 Z M20.5,25.25 C20.9968,25.25 21.4,24.85625 21.4,24.375 C21.4,23.889375 20.9968,23.5 20.5,23.5 C20.00275,23.5 19.6,23.889375 19.6,24.375 C19.6,24.85625 20.00275,25.25 20.5,25.25 L20.5,25.25 Z"></path>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class PhoneNumberInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -18,11 +39,11 @@ export default class PhoneNumberInput extends React.Component {
       <InputWrap
         focused={focused}
         isValid={isValid}
         invalidHint={invalidHint}
         name="phone-number"
-        icon={svg}
+        icon={IconSvg}
       >
         <input
           ref="input"
           type="tel"
           name="phoneNumber"
diff --git a/src/ui/input/select_input.jsx b/src/ui/input/select_input.jsx
index bc5c59c1..5fab5dcb 100644
--- a/src/ui/input/select_input.jsx
+++ b/src/ui/input/select_input.jsx
@@ -1,10 +1,38 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 
-const arrowSvg =
-  '<svg aria-hidden="true" focusable="false" width="5px" height="10px" viewBox="0 0 5 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon-arrow"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-396.000000, -3521.000000)" fill="#000000" opacity="0.539999962"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)"><path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path></g></g></g></g></g></svg>';
+const ArrowIconSvg = () => (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="5px"
+    height="10px"
+    viewBox="0 0 5 10"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon-arrow"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g
+        id="Lock"
+        transform="translate(-396.000000, -3521.000000)"
+        fill="#000000"
+        opacity="0.539999962"
+      >
+        <g id="SMS" transform="translate(153.000000, 3207.000000)">
+          <g transform="translate(35.000000, 299.000000)">
+            <g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)">
+              <path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path>
+            </g>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class SelectInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -40,11 +68,13 @@ export default class SelectInput extends React.Component {
           onKeyDown={::this.handleKeyDown}
           onClick={onClick}
           aria-label={ariaLabel || name}
           aria-invalid={!isValid}
         />
-        <span dangerouslySetInnerHTML={{ __html: arrowSvg }} />
+        <span>
+          <ArrowIconSvg />
+        </span>
       </InputWrap>
     );
   }
 
   handleFocus() {
diff --git a/src/ui/input/username_input.jsx b/src/ui/input/username_input.jsx
index 1160d123..429ca75d 100644
--- a/src/ui/input/username_input.jsx
+++ b/src/ui/input/username_input.jsx
@@ -1,10 +1,27 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 
-const svg =
-  '<svg aria-hidden="true" focusable="false" width="13px" height="14px" viewBox="0 0 15 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="auth0-lock-icon auth0-lock-icon-box"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-11.000000, -1471.000000)" fill="#888888"><path d="M25.552,1486.998 L11.449,1486.998 C10.667,1485.799 10.984,1483.399 11.766,1482.6 C12.139,1482.219 14.931,1481.5 16.267,1481.172 C14.856,1480.076 13.995,1478.042 13.995,1476.103 C13.995,1473.284 14.813,1470.999 18.498,1470.999 C22.182,1470.999 23,1473.284 23,1476.103 C23,1478.037 22.145,1480.065 20.74,1481.163 C22.046,1481.489 24.88,1482.228 25.241,1482.601 C26.019,1483.399 26.328,1485.799 25.552,1486.998 L25.552,1486.998 Z M24.6,1483.443 C24.087,1483.169 21.881,1482.548 20,1482.097 L20,1480.513 C21.254,1479.659 21.997,1477.806 21.997,1476.12 C21.997,1473.841 21.414,1471.993 18.499,1471.993 C15.583,1471.993 15,1473.841 15,1476.12 C15,1477.807 15.744,1479.662 17,1480.515 L17,1482.112 C15.109,1482.556 12.914,1483.166 12.409,1483.442 C12.082,1483.854 11.797,1485.173 12,1486 L25,1486 C25.201,1485.174 24.922,1483.858 24.6,1483.443 L24.6,1483.443 Z"></path></g></g></svg>';
+const IconSvg = (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="13px"
+    height="14px"
+    viewBox="0 0 15 16"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g transform="translate(-11.000000, -1471.000000)" fill="#888888">
+        <path d="M25.552,1486.998 L11.449,1486.998 C10.667,1485.799 10.984,1483.399 11.766,1482.6 C12.139,1482.219 14.931,1481.5 16.267,1481.172 C14.856,1480.076 13.995,1478.042 13.995,1476.103 C13.995,1473.284 14.813,1470.999 18.498,1470.999 C22.182,1470.999 23,1473.284 23,1476.103 C23,1478.037 22.145,1480.065 20.74,1481.163 C22.046,1481.489 24.88,1482.228 25.241,1482.601 C26.019,1483.399 26.328,1485.799 25.552,1486.998 L25.552,1486.998 Z M24.6,1483.443 C24.087,1483.169 21.881,1482.548 20,1482.097 L20,1480.513 C21.254,1479.659 21.997,1477.806 21.997,1476.12 C21.997,1473.841 21.414,1471.993 18.499,1471.993 C15.583,1471.993 15,1473.841 15,1476.12 C15,1477.807 15.744,1479.662 17,1480.515 L17,1482.112 C15.109,1482.556 12.914,1483.166 12.409,1483.442 C12.082,1483.854 11.797,1485.173 12,1486 L25,1486 C25.201,1485.174 24.922,1483.858 24.6,1483.443 L24.6,1483.443 Z"></path>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class UsernameInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -31,11 +48,11 @@ export default class UsernameInput extends React.Component {
       <InputWrap
         focused={focused}
         invalidHint={invalidHint}
         isValid={isValid}
         name="username"
-        icon={svg}
+        icon={IconSvg}
       >
         <input
           ref="input"
           type="text"
           name="username"
diff --git a/src/ui/input/vcode_input.jsx b/src/ui/input/vcode_input.jsx
index 983d8bab..30045b5b 100644
--- a/src/ui/input/vcode_input.jsx
+++ b/src/ui/input/vcode_input.jsx
@@ -1,11 +1,35 @@
 import React from 'react';
 import InputWrap from './input_wrap';
 import { isSmallScreen } from '../../utils/media_utils';
 
-const svg =
-  '<svg aria-hidden="true" focusable="false" width="12px" height="14px" viewBox="0 0 12 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g transform="translate(-964.000000, -3509.000000)" fill="#888888"><g transform="translate(915.000000, 3207.000000)"><g transform="translate(35.000000, 289.000000)"><path id="Fill-42" d="M25.0523108,22.8115806 L20.455448,26.0692401 L20.455448,20.6336024 L25.0523108,17.6924012 L25.0523108,22.8115806 L25.0523108,22.8115806 Z M20.1658456,19.763342 C20.1060864,19.786611 20.050924,19.8145338 19.9957617,19.8471103 C19.9451962,19.8191876 19.8946307,19.786611 19.8394683,19.7679958 L14.9392126,16.7616414 L19.986568,13.8949009 L25.0523108,16.7616414 L25.043117,16.7662952 L20.1658456,19.763342 L20.1658456,19.763342 Z M19.5360754,20.6336024 L19.5360754,26.0692401 L14.9392126,22.8115806 L14.9392126,17.6924012 L19.5360754,20.6336024 L19.5360754,20.6336024 Z M25.9716833,17.6924012 C25.9716833,17.5574411 25.9395053,17.4317885 25.8889398,17.3154435 C26.0728143,16.9664085 26.0314425,16.5242976 25.7418402,16.2311082 L20.4002856,13.2340614 C19.7980966,12.9408721 20.2393954,12.9036417 19.5590597,13.2340614 L14.2634738,16.2311082 C13.9692745,16.5242976 13.9279028,16.9571009 14.1071804,17.3107897 C14.0520181,17.4271347 14.01984,17.5527873 14.01984,17.6924012 L14.01984,22.8115806 C14.01984,23.3234985 14.4335577,23.7423404 14.9392126,23.7423404 L19.5360754,27 C19.7061593,27 19.8578558,26.9395006 19.9957617,26.8557322 C20.1336676,26.9395006 20.285364,27 20.455448,27 L25.511997,23.7423404 C26.017652,23.7423404 25.9716833,23.3234985 25.9716833,22.8115806 L25.9716833,17.6924012 L25.9716833,17.6924012 Z"></path></g></g></g></g></svg>';
+const IconSvg = (
+  <svg
+    aria-hidden="true"
+    focusable="false"
+    width="12px"
+    height="14px"
+    viewBox="0 0 12 14"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlnsXlink="http://www.w3.org/1999/xlink"
+    className="auth0-lock-icon auth0-lock-icon-box"
+  >
+    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
+      <g transform="translate(-964.000000, -3509.000000)" fill="#888888">
+        <g transform="translate(915.000000, 3207.000000)">
+          <g transform="translate(35.000000, 289.000000)">
+            <path
+              id="Fill-42"
+              d="M25.0523108,22.8115806 L20.455448,26.0692401 L20.455448,20.6336024 L25.0523108,17.6924012 L25.0523108,22.8115806 L25.0523108,22.8115806 Z M20.1658456,19.763342 C20.1060864,19.786611 20.050924,19.8145338 19.9957617,19.8471103 C19.9451962,19.8191876 19.8946307,19.786611 19.8394683,19.7679958 L14.9392126,16.7616414 L19.986568,13.8949009 L25.0523108,16.7616414 L25.043117,16.7662952 L20.1658456,19.763342 L20.1658456,19.763342 Z M19.5360754,20.6336024 L19.5360754,26.0692401 L14.9392126,22.8115806 L14.9392126,17.6924012 L19.5360754,20.6336024 L19.5360754,20.6336024 Z M25.9716833,17.6924012 C25.9716833,17.5574411 25.9395053,17.4317885 25.8889398,17.3154435 C26.0728143,16.9664085 26.0314425,16.5242976 25.7418402,16.2311082 L20.4002856,13.2340614 C19.7980966,12.9408721 20.2393954,12.9036417 19.5590597,13.2340614 L14.2634738,16.2311082 C13.9692745,16.5242976 13.9279028,16.9571009 14.1071804,17.3107897 C14.0520181,17.4271347 14.01984,17.5527873 14.01984,17.6924012 L14.01984,22.8115806 C14.01984,23.3234985 14.4335577,23.7423404 14.9392126,23.7423404 L19.5360754,27 C19.7061593,27 19.8578558,26.9395006 19.9957617,26.8557322 C20.1336676,26.9395006 20.285364,27 20.455448,27 L25.511997,23.7423404 C26.017652,23.7423404 25.9716833,23.3234985 25.9716833,22.8115806 L25.9716833,17.6924012 L25.9716833,17.6924012 Z"
+            ></path>
+          </g>
+        </g>
+      </g>
+    </g>
+  </svg>
+);
 
 export default class VcodeInput extends React.Component {
   constructor(props) {
     super(props);
     this.state = {};
@@ -23,11 +47,11 @@ export default class VcodeInput extends React.Component {
   render() {
     const { lockId, isValid, ...props } = this.props;
     const { focused } = this.state;
 
     return (
-      <InputWrap focused={focused} isValid={isValid} name="vcode" icon={svg}>
+      <InputWrap focused={focused} isValid={isValid} name="vcode" icon={IconSvg}>
         <input
           id={`${lockId}-vcode`}
           ref="input"
           type="tel"
           name="vcode"
diff --git a/yarn.lock b/yarn.lock
index 9e24cb24..169e64c7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3632,10 +3632,15 @@ domhandler@^4.0.0:
   resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-4.0.0.tgz#01ea7821de996d85f69029e81fa873c21833098e"
   integrity sha512-KPTbnGQ1JeEMQyO1iYXoagsI6so/C96HZiFyByU3T6iAzpXn8EGEvct6unm1ZGoed8ByO2oirxgwxBmqKF9haA==
   dependencies:
     domelementtype "^2.1.0"
 
+dompurify@^2.2.8:
+  version "2.2.8"
+  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.2.8.tgz#ce88e395f6d00b6dc53f80d6b2a6fdf5446873c6"
+  integrity sha512-9H0UL59EkDLgY3dUFjLV6IEUaHm5qp3mxSqWw7Yyx4Zhk2Jn2cmLe+CNPP3xy13zl8Bqg+0NehQzkdMoVhGRww==
+
 domutils@^2.4.3, domutils@^2.4.4:
   version "2.4.4"
   resolved "https://registry.yarnpkg.com/domutils/-/domutils-2.4.4.tgz#282739c4b150d022d34699797369aad8d19bbbd3"
   integrity sha512-jBC0vOsECI4OMdD0GC9mGn7NXPLb+Qt6KW1YDQzeQYRUFKmNG8lh7mO5HiELfr+lLQE7loDVI4QcAxV80HS+RA==
   dependencies:
@@ -9418,11 +9423,11 @@ prop-types-exact@^1.2.0:
   dependencies:
     has "^1.0.3"
     object.assign "^4.1.0"
     reflect.ownkeys "^0.2.0"
 
-prop-types@^15.5.10, prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15.5.10, prop-types@^15.6.2, prop-types@^15.7.0, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
   dependencies:
     loose-envify "^1.4.0"

Vulnerable code:     "react/no-string-refs": 1
    // placeholderHTML - is an optional field  and overrides the value of placeholder
    <span
      dangerouslySetInnerHTML={
        Object {
          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
        }
      }
    />
    <span
      dangerouslySetInnerHTML={
        Object {
          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
        }
      }
    />
    it.only('passes connectionScopes to the connection', () => {
    it.only('passes connectionScopes to the connection', () => {
    dangerouslySetInnerHTML={
      Object {
        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 128 128\\" version=\\"1.1\\" viewBox=\\"0 0 128 128\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"><g><polygon fill=\\"#373737\\" points=\\"123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   \\"></polygon></g></svg>",
      }
    }
  />
    dangerouslySetInnerHTML={
      Object {
        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 24 24\\" version=\\"1.0\\" viewBox=\\"0 0 24 24\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"> <polyline fill=\\"none\\" points=\\"12.5,21 3.5,12 12.5,3 \\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\"></polyline> <line fill=\\"none\\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\" x1=\\"22\\" x2=\\"3.5\\" y1=\\"12\\" y2=\\"12\\"></line> </svg>",
      }
    }
  />
    <span
      dangerouslySetInnerHTML={
        Object {
          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
        }
      }
    />
        <span
          dangerouslySetInnerHTML={
            Object {
              "__html": "<svg focusable=\\"false\\" height=\\"32px\\" style=\\"enable-background:new 0 0 32 32;\\" version=\\"1.1\\" viewBox=\\"0 0 32 32\\" width=\\"32px\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"> <path d=\\"M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z\\"></path> <path d=\\"M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z\\"></path> </svg>",
          }
        />
    <span
      dangerouslySetInnerHTML={
        Object {
          "__html": "<svg focusable=\\"false\\" width=\\"56px\\" height=\\"56px\\" viewBox=\\"0 0 52 52\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" class=\\"checkmark\\"> <circle cx=\\"26\\" cy=\\"26\\" r=\\"25\\" fill=\\"none\\" class=\\"checkmark__circle\\"></circle> <path fill=\\"none\\" d=\\"M14.1 27.2l7.1 7.2 16.7-16.8\\" class=\\"checkmark__check\\"></path> </svg>",
        }
      }
    />
  "<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>",
    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
    data-icon="<svg focusable=\\"false\\" width=\\"14px\\" height=\\"14px\\" viewBox=\\"0 0 14 14\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\" class=\\"auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location\\"><g stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" transform=\\"translate(-201.000000, -3519.000000)\\" fill=\\"#919191\\"><g id=\\"SMS\\" transform=\\"translate(153.000000, 3207.000000)\\"><g transform=\\"translate(35.000000, 299.000000)\\"><path id=\\"Fill-349-Copy\\" d=\\"M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z\\"></path></g></g></g></g></svg>"
      <span
        dangerouslySetInnerHTML={
          Object {
            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
          }
        }
      />
      <span
        dangerouslySetInnerHTML={
          Object {
            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
          }
        }
      />
      <span
        dangerouslySetInnerHTML={
          Object {
            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
          }
        }
      />
      <span
        dangerouslySetInnerHTML={
          Object {
            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
          }
        }
      />
      <span
        dangerouslySetInnerHTML={
          Object {
            "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" width=\\"43px\\" height=\\"42px\\" viewBox=\\"0 0 43 42\\" version=\\"1.1\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\" xmlns:sketch=\\"http://www.bohemiancoding.com/sketch/ns\\"><g id=\\"Page-1\\" stroke=\\"none\\" stroke-width=\\"1\\" fill=\\"none\\" fill-rule=\\"evenodd\\" sketch:type=\\"MSPage\\"><g id=\\"Lock\\" sketch:type=\\"MSArtboardGroup\\" transform=\\"translate(-280.000000, -3592.000000)\\"><g id=\\"SMS\\" sketch:type=\\"MSLayerGroup\\" transform=\\"translate(153.000000, 3207.000000)\\"><g id=\\"Group\\" sketch:type=\\"MSShapeGroup\\"><g id=\\"Login\\" transform=\\"translate(0.000000, 369.000000)\\"><g id=\\"Btn\\"><g id=\\"Oval-302-+-Shape\\" transform=\\"translate(128.000000, 17.000000)\\"><circle id=\\"Oval-302\\" stroke=\\"#FFFFFF\\" stroke-width=\\"2\\" cx=\\"20.5\\" cy=\\"20\\" r=\\"20\\"></circle><path d=\\"M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z\\" id=\\"Shape\\" fill=\\"#FFFFFF\\"></path></g></g></g></g></g></g></g></svg>",
          }
        }
      />
    dangerouslySetInnerHTML={
      Object {
        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 128 128\\" version=\\"1.1\\" viewBox=\\"0 0 128 128\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"><g><polygon fill=\\"#373737\\" points=\\"123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   \\"></polygon></g></svg>",
      }
    }
  />
    dangerouslySetInnerHTML={
      Object {
        "__html": "<svg aria-hidden=\\"true\\" focusable=\\"false\\" enable-background=\\"new 0 0 24 24\\" version=\\"1.0\\" viewBox=\\"0 0 24 24\\" xml:space=\\"preserve\\" xmlns=\\"http://www.w3.org/2000/svg\\" xmlns:xlink=\\"http://www.w3.org/1999/xlink\\"> <polyline fill=\\"none\\" points=\\"12.5,21 3.5,12 12.5,3 \\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\"></polyline> <line fill=\\"none\\" stroke=\\"#000000\\" stroke-miterlimit=\\"10\\" stroke-width=\\"2\\" x1=\\"22\\" x2=\\"3.5\\" y1=\\"12\\" y2=\\"12\\"></line> </svg>",
      }
    }
  />
    <span
      dangerouslySetInnerHTML={
        Object {
          "__html": <svg>
            svg
          </svg>,
        }
      }
    />
exports[`EmailInput renders without issue 1`] = `"<div data-__type=\\"input_wrap\\" data-invalidhint=\\"invalidHint\\" data-isvalid=\\"true\\" data-name=\\"email\\" data-icon=\\"<svg aria-hidden=&quot;true&quot; focusable=&quot;false&quot; width=&quot;14px&quot; height=&quot;13px&quot; viewBox=&quot;0 0 32 26&quot; version=&quot;1.1&quot; xmlns=&quot;http://www.w3.org/2000/svg&quot; xmlns:xlink=&quot;http://www.w3.org/1999/xlink&quot; xmlns:sketch=&quot;http://www.bohemiancoding.com/sketch/ns&quot; class=&quot;auth0-lock-icon auth0-lock-icon-box&quot;><g id=&quot;Page-1&quot; stroke=&quot;none&quot; stroke-width=&quot;1&quot; fill=&quot;none&quot; fill-rule=&quot;evenodd&quot; sketch:type=&quot;MSPage&quot;><g id=&quot;32px&quot; sketch:type=&quot;MSLayerGroup&quot; transform=&quot;translate(-2155.000000, -2317.000000)&quot; fill=&quot;#373A39&quot;><g id=&quot;Group-856&quot; transform=&quot;translate(1.000000, 1.000000)&quot; sketch:type=&quot;MSShapeGroup&quot;><path id=&quot;Fill-419&quot; d=&quot;M2184,2339 C2184,2339.55 2183.55,2340 2183,2340 L2157,2340 C2156.45,2340 2156,2339.55 2156,2339 L2156,2319 C2156,2318.45 2156.45,2318 2157,2318 L2183,2318 C2183.55,2318 2184,2318.45 2184,2319 L2184,2339 L2184,2339 Z M2184,2316 L2156,2316 C2154.89,2316 2154,2316.89 2154,2318 L2154,2340 C2154,2341.1 2154.89,2342 2156,2342 L2184,2342 C2185.1,2342 2186,2341.1 2186,2340 L2186,2318 C2186,2316.89 2185.1,2316 2184,2316 L2184,2316 Z M2176,2322 L2180,2322 L2180,2326 L2176,2326 L2176,2322 Z M2174,2328 L2182,2328 L2182,2320 L2174,2320 L2174,2328 Z M2158,2332 L2172,2332 L2172,2330 L2158,2330 L2158,2332 Z M2158,2336 L2172,2336 L2172,2334 L2158,2334 L2158,2336 Z&quot;></path></g></g></g></svg>\\"><input type=\\"email\\" id=\\"1-email\\" inputmode=\\"email\\" name=\\"email\\" class=\\"auth0-lock-input\\" placeholder=\\"yours@example.com\\" autocomplete=\\"off\\" autocapitalize=\\"off\\" aria-label=\\"Email\\" aria-invalid=\\"false\\" value=\\"value\\"></div>"`;
import { icon } from '../../ui/input/password_input';
    <span dangerouslySetInnerHTML={{ __html: icon }} /> {' '}
    <span className="auth0-sso-notice">{children}</span>
const retrySvg =
  '<svg focusable="false" height="32px" style="enable-background:new 0 0 32 32;" version="1.1" viewBox="0 0 32 32" width="32px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <path d="M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z"></path> <path d="M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z"></path> </svg>';
        {label} <span dangerouslySetInnerHTML={{ __html: retrySvg }} />
export const icon =
  '<svg focusable="false" width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><path id="Fill-349-Copy" d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"></path></g></g></g></g></svg>';
          icon={icon}
          onClick={() => startOptionSelection(l.id(lock), 'location', '', icon)}

  return html ? React.createElement('span', { dangerouslySetInnerHTML: { __html: html } }) : null;
const svgs = {
  back:
    '<svg aria-hidden="true" focusable="false" enable-background="new 0 0 24 24" version="1.0" viewBox="0 0 24 24" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <polyline fill="none" points="12.5,21 3.5,12 12.5,3 " stroke="#000000" stroke-miterlimit="10" stroke-width="2"></polyline> <line fill="none" stroke="#000000" stroke-miterlimit="10" stroke-width="2" x1="22" x2="3.5" y1="12" y2="12"></line> </svg>',
  close:
    '<svg aria-hidden="true" focusable="false" enable-background="new 0 0 128 128" version="1.1" viewBox="0 0 128 128" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g><polygon fill="#373737" points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "></polygon></g></svg>'
};
    dangerouslySetInnerHTML={{ __html: svg }}
  />
  svg: PropTypes.string.isRequired
// const createButton = name => {
//   const f = ({onClick}) => (
//     <IconButton name={name} svg={svgs[name]} onClick={onClick} />
//   );
//   f.displayName = `IconButton (${name})`;
//   f.propTypes = { onClick: React.PropTypes.func.isRequired };
//
//   return f;
// };
//
// export const CloseButton = createButton("close");
// export const BackButton = createButton("back");

  <IconButton lockId={lockId} name="close" svg={svgs['close']} onClick={onClick} />
  <IconButton lockId={lockId} name="back" svg={svgs['back']} onClick={onClick} />
const submitSvg =
  '<svg aria-hidden="true" focusable="false" width="43px" height="42px" viewBox="0 0 43 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" sketch:type="MSArtboardGroup" transform="translate(-280.000000, -3592.000000)"><g id="SMS" sketch:type="MSLayerGroup" transform="translate(153.000000, 3207.000000)"><g id="Group" sketch:type="MSShapeGroup"><g id="Login" transform="translate(0.000000, 369.000000)"><g id="Btn"><g id="Oval-302-+-Shape" transform="translate(128.000000, 17.000000)"><circle id="Oval-302" stroke="#FFFFFF" stroke-width="2" cx="20.5" cy="20" r="20"></circle><path d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z" id="Shape" fill="#FFFFFF"></path></g></g></g></g></g></g></g></svg>';
const submitText =
  '<svg aria-hidden="true" focusable="false" class="icon-text" width="8px" height="12px" viewBox="0 0 8 12" version="1.1" xmlns="http://www.w3.org/2000/svg"><g id="Symbols" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g id="Web/Submit/Active" transform="translate(-148.000000, -32.000000)" fill="#FFFFFF"><polygon id="Shape" points="148 33.4 149.4 32 155.4 38 149.4 44 148 42.6 152.6 38"></polygon></g></g></svg>';
        <span dangerouslySetInnerHTML={{ __html: submitText }} />
      <span dangerouslySetInnerHTML={{ __html: submitSvg }} />
        ? React.createElement('span', { dangerouslySetInnerHTML: { __html: message } })
      <span dangerouslySetInnerHTML={{ __html: svg }} />
  svg: PropTypes.string.isRequired
const svg =
  '<svg focusable="false" width="56px" height="56px" viewBox="0 0 52 52" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="checkmark"> <circle cx="26" cy="26" r="25" fill="none" class="checkmark__circle"></circle> <path fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8" class="checkmark__check"></path> </svg>';
const inputIconSVG =
  '<svg class="auth0-lock-icon auth0-lock-icon-box" width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg"><g id="icon/key"><path id="Shape" fill-rule="evenodd" clip-rule="evenodd" d="M16.3884 11.0145C14.4508 12.9522 11.3948 13.0447 9.32094 11.3401L7.20872 13.2642L9.60904 15.6697L8.83354 16.4466L6.39631 14.0048L4.88251 15.3832L7.39496 17.89L6.61586 18.6666L3.5 15.5587L3.53914 15.5198C3.47446 15.3363 3.51554 15.1287 3.67514 14.983L8.54211 10.5496C6.89425 8.47691 7.005 5.46384 8.92209 3.54636C10.9841 1.48455 14.3267 1.48455 16.3884 3.54636C18.4501 5.60846 18.4501 8.95239 16.3884 11.0145ZM15.6048 4.33856C13.98 2.71309 11.3454 2.71309 9.72062 4.33856C8.0958 5.9632 8.0958 8.59793 9.72062 10.2226C11.3454 11.8478 13.98 11.8478 15.6048 10.2226C17.2297 8.59793 17.2297 5.96292 15.6048 4.33856Z" fill="#888888"/></g></svg>';
const refreshIconSVG = `<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z" fill="black"/><mask id="mask0" mask-type="alpha" maskUnits="userSpaceOnUse" x="1" y="1" width="18" height="18"><path fill-rule="evenodd" clip-rule="evenodd" d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z" fill="white"/></mask><g mask="url(#mask0)"></g></svg>`;
            dangerouslySetInnerHTML={{ __html: refreshIconSVG }}
          ></button>
          icon={inputIconSVG}
const svg =
  '<svg aria-hidden="true" focusable="false" width="14px" height="13px" viewBox="0 0 32 26" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box"><g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="32px" sketch:type="MSLayerGroup" transform="translate(-2155.000000, -2317.000000)" fill="#373A39"><g id="Group-856" transform="translate(1.000000, 1.000000)" sketch:type="MSShapeGroup"><path id="Fill-419" d="M2184,2339 C2184,2339.55 2183.55,2340 2183,2340 L2157,2340 C2156.45,2340 2156,2339.55 2156,2339 L2156,2319 C2156,2318.45 2156.45,2318 2157,2318 L2183,2318 C2183.55,2318 2184,2318.45 2184,2319 L2184,2339 L2184,2339 Z M2184,2316 L2156,2316 C2154.89,2316 2154,2316.89 2154,2318 L2154,2340 C2154,2341.1 2154.89,2342 2156,2342 L2184,2342 C2185.1,2342 2186,2341.1 2186,2340 L2186,2318 C2186,2316.89 2185.1,2316 2184,2316 L2184,2316 Z M2176,2322 L2180,2322 L2180,2326 L2176,2326 L2176,2322 Z M2174,2328 L2182,2328 L2182,2320 L2174,2320 L2174,2328 Z M2158,2332 L2172,2332 L2172,2330 L2158,2330 L2158,2332 Z M2158,2336 L2172,2336 L2172,2334 L2158,2334 L2158,2336 Z"></path></g></g></g></svg>';
        icon={svg}
    // NOTE: Ugly hack until we upgrade to React 15 which has better
    // support for SVG.
    let iconElement = null;

    if (typeof icon === 'string') {
      iconElement = <span aria-hidden="true" dangerouslySetInnerHTML={{ __html: icon }} />;
    } else if (icon) {
      iconElement = icon;
    }

    if (iconElement) {
          {iconElement}
  svg: PropTypes.string
export const icon =
  '<svg aria-hidden="true" focusable="false" width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><path id="Fill-349-Copy" d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"></path></g></g></g></g></svg>';
const arrowSvg =
  '<svg aria-hidden="true" focusable="false" width="5px" height="10px" viewBox="0 0 5 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-arrow"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-396.000000, -3521.000000)" fill="#000000" opacity="0.539999962"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)"><path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path></g></g></g></g></g></svg>';
      <InputWrap focused={focused} isValid={true} name="location" icon={icon}>
        <span dangerouslySetInnerHTML={{ __html: arrowSvg }} />
import { icon } from './password_input';
        icon={icon}
export const icon =
  '<svg aria-hidden="true" focusable="false" width="11px" height="14px" viewBox="0 0 13 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="auth0-lock-icon auth0-lock-icon-box"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-288.000000, -1508.000000)" fill="#888888"><path d="M299,1523.998 L290,1523.998 C288.896,1523.998 288,1523.102 288,1521.999 L288,1515.999 C288,1514.895 288.896,1513.998 290,1513.998 L290,1513.998 L290,1512.499 C290,1510.015 292.015,1507.999 294.5,1507.999 C296.985,1507.999 299,1510.015 299,1512.499 L299,1513.999 C300.104,1513.999 301,1514.895 301,1515.999 L301,1521.999 C301,1523.103 300.104,1523.998 299,1523.998 L299,1523.998 Z M298,1512.499 C298,1510.566 296.433,1508.999 294.5,1508.999 C292.567,1508.999 291,1510.566 291,1512.499 L291,1513.998 L298,1513.998 L298,1512.499 L298,1512.499 Z M300,1515.999 C300,1515.446 299.552,1514.998 299,1514.998 L290,1514.998 C289.447,1514.998 289,1515.446 289,1515.999 L289,1521.999 C289,1522.551 289.447,1522.998 290,1522.998 L299,1522.998 C299.552,1522.998 300,1522.551 300,1521.999 L300,1515.999 L300,1515.999 Z M294.5,1520.998 C294.224,1520.998 294,1520.774 294,1520.498 L294,1517.498 C294,1517.223 294.224,1516.999 294.5,1516.999 C294.776,1516.999 295,1517.223 295,1517.498 L295,1520.498 C295,1520.774 294.776,1520.998 294.5,1520.998 L294.5,1520.998 Z"></path></g></g></svg>';
        icon={icon}
const svg =
  '<svg aria-hidden="true" focusable="false" width="9px" height="14px" viewBox="0 0 9 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-mobile"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-204.000000, -3459.000000)" fill="#888888"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 239.000000)"><path d="M24.1,15.625 L16.9,15.625 L16.9,14.75 C16.9,14.264375 17.30275,13.875 17.8,13.875 L23.2,13.875 C23.6968,13.875 24.1,14.264375 24.1,14.75 L24.1,15.625 L24.1,15.625 Z M16.9,16.5 L24.1,16.5 L24.1,21.75 L16.9,21.75 L16.9,16.5 Z M24.1,25.25 C24.1,25.73125 23.6968,26.125 23.2,26.125 L17.8,26.125 C17.30275,26.125 16.9,25.73125 16.9,25.25 L16.9,22.625 L24.1,22.625 L24.1,25.25 L24.1,25.25 Z M23.2,13 L17.8,13 C16.80595,13 16,13.783125 16,14.75 L16,25.25 C16,26.216875 16.80595,27 17.8,27 L23.2,27 C24.19405,27 25,26.216875 25,25.25 L25,14.75 C25,13.783125 24.19405,13 23.2,13 L23.2,13 Z M20.5,25.25 C20.9968,25.25 21.4,24.85625 21.4,24.375 C21.4,23.889375 20.9968,23.5 20.5,23.5 C20.00275,23.5 19.6,23.889375 19.6,24.375 C19.6,24.85625 20.00275,25.25 20.5,25.25 L20.5,25.25 Z"></path></g></g></g></g></svg>';
        icon={svg}
const arrowSvg =
  '<svg aria-hidden="true" focusable="false" width="5px" height="10px" viewBox="0 0 5 10" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon-arrow"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g id="Lock" transform="translate(-396.000000, -3521.000000)" fill="#000000" opacity="0.539999962"><g id="SMS" transform="translate(153.000000, 3207.000000)"><g transform="translate(35.000000, 299.000000)"><g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)"><path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path></g></g></g></g></g></svg>';
        <span dangerouslySetInnerHTML={{ __html: arrowSvg }} />
const svg =
  '<svg aria-hidden="true" focusable="false" width="13px" height="14px" viewBox="0 0 15 16" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="auth0-lock-icon auth0-lock-icon-box"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-11.000000, -1471.000000)" fill="#888888"><path d="M25.552,1486.998 L11.449,1486.998 C10.667,1485.799 10.984,1483.399 11.766,1482.6 C12.139,1482.219 14.931,1481.5 16.267,1481.172 C14.856,1480.076 13.995,1478.042 13.995,1476.103 C13.995,1473.284 14.813,1470.999 18.498,1470.999 C22.182,1470.999 23,1473.284 23,1476.103 C23,1478.037 22.145,1480.065 20.74,1481.163 C22.046,1481.489 24.88,1482.228 25.241,1482.601 C26.019,1483.399 26.328,1485.799 25.552,1486.998 L25.552,1486.998 Z M24.6,1483.443 C24.087,1483.169 21.881,1482.548 20,1482.097 L20,1480.513 C21.254,1479.659 21.997,1477.806 21.997,1476.12 C21.997,1473.841 21.414,1471.993 18.499,1471.993 C15.583,1471.993 15,1473.841 15,1476.12 C15,1477.807 15.744,1479.662 17,1480.515 L17,1482.112 C15.109,1482.556 12.914,1483.166 12.409,1483.442 C12.082,1483.854 11.797,1485.173 12,1486 L25,1486 C25.201,1485.174 24.922,1483.858 24.6,1483.443 L24.6,1483.443 Z"></path></g></g></svg>';
        icon={svg}
const svg =
  '<svg aria-hidden="true" focusable="false" width="12px" height="14px" viewBox="0 0 12 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" class="auth0-lock-icon auth0-lock-icon-box"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage"><g transform="translate(-964.000000, -3509.000000)" fill="#888888"><g transform="translate(915.000000, 3207.000000)"><g transform="translate(35.000000, 289.000000)"><path id="Fill-42" d="M25.0523108,22.8115806 L20.455448,26.0692401 L20.455448,20.6336024 L25.0523108,17.6924012 L25.0523108,22.8115806 L25.0523108,22.8115806 Z M20.1658456,19.763342 C20.1060864,19.786611 20.050924,19.8145338 19.9957617,19.8471103 C19.9451962,19.8191876 19.8946307,19.786611 19.8394683,19.7679958 L14.9392126,16.7616414 L19.986568,13.8949009 L25.0523108,16.7616414 L25.043117,16.7662952 L20.1658456,19.763342 L20.1658456,19.763342 Z M19.5360754,20.6336024 L19.5360754,26.0692401 L14.9392126,22.8115806 L14.9392126,17.6924012 L19.5360754,20.6336024 L19.5360754,20.6336024 Z M25.9716833,17.6924012 C25.9716833,17.5574411 25.9395053,17.4317885 25.8889398,17.3154435 C26.0728143,16.9664085 26.0314425,16.5242976 25.7418402,16.2311082 L20.4002856,13.2340614 C19.7980966,12.9408721 20.2393954,12.9036417 19.5590597,13.2340614 L14.2634738,16.2311082 C13.9692745,16.5242976 13.9279028,16.9571009 14.1071804,17.3107897 C14.0520181,17.4271347 14.01984,17.5527873 14.01984,17.6924012 L14.01984,22.8115806 C14.01984,23.3234985 14.4335577,23.7423404 14.9392126,23.7423404 L19.5360754,27 C19.7061593,27 19.8578558,26.9395006 19.9957617,26.8557322 C20.1336676,26.9395006 20.285364,27 20.455448,27 L25.511997,23.7423404 C26.017652,23.7423404 25.9716833,23.3234985 25.9716833,22.8115806 L25.9716833,17.6924012 L25.9716833,17.6924012 Z"></path></g></g></g></g></svg>';
      <InputWrap focused={focused} isValid={isValid} name="vcode" icon={svg}>
prop-types@^15.5.10, prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.7.2:
Fixed code:     "react/no-string-refs": 1,
    "react/no-danger": 2
    // placeholderHTML - is an optional field and overrides the value of placeholder
    // do not use user inputted data for HTML fields as they are vulnerable to XSS
    "dompurify": "^2.2.8",
    <span>
      <svg
        className="checkmark"
        focusable="false"
        height="56px"
        version="1.1"
        viewBox="0 0 52 52"
        width="56px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
         
        <circle
          className="checkmark__circle"
          cx="26"
          cy="26"
          fill="none"
          r="25"
        />
         
        <path
          className="checkmark__check"
          d="M14.1 27.2l7.1 7.2 16.7-16.8"
          fill="none"
        />
         
      </svg>
    </span>
    <span>
      <svg
        className="checkmark"
        focusable="false"
        height="56px"
        version="1.1"
        viewBox="0 0 52 52"
        width="56px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
         
        <circle
          className="checkmark__circle"
          cx="26"
          cy="26"
          fill="none"
          r="25"
        />
         
        <path
          className="checkmark__check"
          d="M14.1 27.2l7.1 7.2 16.7-16.8"
          fill="none"
        />
         
      </svg>
    </span>
    it('passes connectionScopes to the connection', () => {
    it('passes connectionScopes to the connection', () => {
  >
    <svg
      aria-hidden="true"
      enableBackground="new 0 0 128 128"
      focusable="false"
      version="1.1"
      viewBox="0 0 128 128"
      xmlSpace="preserve"
      xmlns="http://www.w3.org/2000/svg"
      xmlnsXlink="http://www.w3.org/1999/xlink"
    >
      <g>
        <polygon
          fill="#373737"
          points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "
        />
      </g>
    </svg>
  </span>
  >
    <svg
      aria-hidden="true"
      enableBackground="new 0 0 24 24"
      focusable="false"
      version="1.0"
      viewBox="0 0 24 24"
      xmlSpace="preserve"
      xmlns="http://www.w3.org/2000/svg"
      xmlnsXlink="http://www.w3.org/1999/xlink"
    >
       
      <polyline
        fill="none"
        points="12.5,21 3.5,12 12.5,3 "
        stroke="#000000"
        strokeMiterlimit="10"
        strokeWidth="2"
      />
       
      <line
        fill="none"
        stroke="#000000"
        strokeMiterlimit="10"
        strokeWidth="2"
        x1="22"
        x2="3.5"
        y1="12"
        y2="12"
      />
       
    </svg>
  </span>
    <span>
      <svg
        className="checkmark"
        focusable="false"
        height="56px"
        version="1.1"
        viewBox="0 0 52 52"
        width="56px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
         
        <circle
          className="checkmark__circle"
          cx="26"
          cy="26"
          fill="none"
          r="25"
        />
         
        <path
          className="checkmark__check"
          d="M14.1 27.2l7.1 7.2 16.7-16.8"
          fill="none"
        />
         
      </svg>
    </span>
        <span>
          <svg
            focusable="false"
            height="32px"
            style={
              Object {
                "enableBackground": "new 0 0 32 32",
              }
            version="1.1"
            viewBox="0 0 32 32"
            width="32px"
            xmlSpace="preserve"
            xmlns="http://www.w3.org/2000/svg"
            xmlnsXlink="http://www.w3.org/1999/xlink"
          >
             
            <path
              d="M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z"
            />
            <path
              d="M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z"
            />
          </svg>
        </span>
    <span>
      <svg
        className="checkmark"
        focusable="false"
        height="56px"
        version="1.1"
        viewBox="0 0 52 52"
        width="56px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
         
        <circle
          className="checkmark__circle"
          cx="26"
          cy="26"
          fill="none"
          r="25"
        />
         
        <path
          className="checkmark__check"
          d="M14.1 27.2l7.1 7.2 16.7-16.8"
          fill="none"
        />
         
      </svg>
    </span>
  <UNDEFINED />,
    data-icon={
      <svg
        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
        focusable="false"
        height="14px"
        version="1.1"
        viewBox="0 0 14 14"
        width="14px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          stroke="none"
          strokeWidth="1"
        >
          <g
            fill="#919191"
            id="Lock"
            transform="translate(-201.000000, -3519.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                transform="translate(35.000000, 299.000000)"
              >
                <path
                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
                  id="Fill-349-Copy"
                />
              </g>
            </g>
          </g>
        </g>
      </svg>
    }
    data-icon={
      <svg
        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
        focusable="false"
        height="14px"
        version="1.1"
        viewBox="0 0 14 14"
        width="14px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          stroke="none"
          strokeWidth="1"
        >
          <g
            fill="#919191"
            id="Lock"
            transform="translate(-201.000000, -3519.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                transform="translate(35.000000, 299.000000)"
              >
                <path
                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
                  id="Fill-349-Copy"
                />
              </g>
            </g>
          </g>
        </g>
      </svg>
    }
    data-icon={
      <svg
        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
        focusable="false"
        height="14px"
        version="1.1"
        viewBox="0 0 14 14"
        width="14px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          stroke="none"
          strokeWidth="1"
        >
          <g
            fill="#919191"
            id="Lock"
            transform="translate(-201.000000, -3519.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                transform="translate(35.000000, 299.000000)"
              >
                <path
                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
                  id="Fill-349-Copy"
                />
              </g>
            </g>
          </g>
        </g>
      </svg>
    }
    data-icon={
      <svg
        className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
        focusable="false"
        height="14px"
        version="1.1"
        viewBox="0 0 14 14"
        width="14px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          stroke="none"
          strokeWidth="1"
        >
          <g
            fill="#919191"
            id="Lock"
            transform="translate(-201.000000, -3519.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                transform="translate(35.000000, 299.000000)"
              >
                <path
                  d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
                  id="Fill-349-Copy"
                />
              </g>
            </g>
          </g>
        </g>
      </svg>
    }

  describe('when html is called', () => {
    it('should sanitize the input and not allow for javascript to be passed through', () => {
      const i18n = require('../i18n');
      const strings = {
        test: '<img src=1 href=1 onerror="javascript:alert(1)"></img>'
      };
      const m = Immutable.fromJS({ i18n: { strings } });
      const html = i18n.html(m, 'test');
      expect(html.props.dangerouslySetInnerHTML.__html).not.toMatch(/javascript:alert/);
      expect(html.props.dangerouslySetInnerHTML.__html).toEqual('<img href="1" src="1">');
    });
  });
      <svg
        aria-hidden="true"
        focusable="false"
        height="42px"
        version="1.1"
        viewBox="0 0 43 42"
        width="43px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          id="Page-1"
          stroke="none"
          strokeWidth="1"
        >
          <g
            id="Lock"
            transform="translate(-280.000000, -3592.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                id="Group"
              >
                <g
                  id="Login"
                  transform="translate(0.000000, 369.000000)"
                >
                  <g
                    id="Btn"
                  >
                    <g
                      id="Oval-302-+-Shape"
                      transform="translate(128.000000, 17.000000)"
                    >
                      <circle
                        cx="20.5"
                        cy="20"
                        id="Oval-302"
                        r="20"
                        stroke="#FFFFFF"
                        strokeWidth="2"
                      />
                      <path
                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
                        fill="#FFFFFF"
                        id="Shape"
                      />
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
      <svg
        aria-hidden="true"
        focusable="false"
        height="42px"
        version="1.1"
        viewBox="0 0 43 42"
        width="43px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          id="Page-1"
          stroke="none"
          strokeWidth="1"
        >
          <g
            id="Lock"
            transform="translate(-280.000000, -3592.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                id="Group"
              >
                <g
                  id="Login"
                  transform="translate(0.000000, 369.000000)"
                >
                  <g
                    id="Btn"
                  >
                    <g
                      id="Oval-302-+-Shape"
                      transform="translate(128.000000, 17.000000)"
                    >
                      <circle
                        cx="20.5"
                        cy="20"
                        id="Oval-302"
                        r="20"
                        stroke="#FFFFFF"
                        strokeWidth="2"
                      />
                      <path
                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
                        fill="#FFFFFF"
                        id="Shape"
                      />
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
      <svg
        aria-hidden="true"
        focusable="false"
        height="42px"
        version="1.1"
        viewBox="0 0 43 42"
        width="43px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          id="Page-1"
          stroke="none"
          strokeWidth="1"
        >
          <g
            id="Lock"
            transform="translate(-280.000000, -3592.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                id="Group"
              >
                <g
                  id="Login"
                  transform="translate(0.000000, 369.000000)"
                >
                  <g
                    id="Btn"
                  >
                    <g
                      id="Oval-302-+-Shape"
                      transform="translate(128.000000, 17.000000)"
                    >
                      <circle
                        cx="20.5"
                        cy="20"
                        id="Oval-302"
                        r="20"
                        stroke="#FFFFFF"
                        strokeWidth="2"
                      />
                      <path
                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
                        fill="#FFFFFF"
                        id="Shape"
                      />
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
      <svg
        aria-hidden="true"
        focusable="false"
        height="42px"
        version="1.1"
        viewBox="0 0 43 42"
        width="43px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          id="Page-1"
          stroke="none"
          strokeWidth="1"
        >
          <g
            id="Lock"
            transform="translate(-280.000000, -3592.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                id="Group"
              >
                <g
                  id="Login"
                  transform="translate(0.000000, 369.000000)"
                >
                  <g
                    id="Btn"
                  >
                    <g
                      id="Oval-302-+-Shape"
                      transform="translate(128.000000, 17.000000)"
                    >
                      <circle
                        cx="20.5"
                        cy="20"
                        id="Oval-302"
                        r="20"
                        stroke="#FFFFFF"
                        strokeWidth="2"
                      />
                      <path
                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
                        fill="#FFFFFF"
                        id="Shape"
                      />
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
      <svg
        aria-hidden="true"
        focusable="false"
        height="42px"
        version="1.1"
        viewBox="0 0 43 42"
        width="43px"
        xmlns="http://www.w3.org/2000/svg"
        xmlnsXlink="http://www.w3.org/1999/xlink"
      >
        <g
          fill="none"
          fillRule="evenodd"
          id="Page-1"
          stroke="none"
          strokeWidth="1"
        >
          <g
            id="Lock"
            transform="translate(-280.000000, -3592.000000)"
          >
            <g
              id="SMS"
              transform="translate(153.000000, 3207.000000)"
            >
              <g
                id="Group"
              >
                <g
                  id="Login"
                  transform="translate(0.000000, 369.000000)"
                >
                  <g
                    id="Btn"
                  >
                    <g
                      id="Oval-302-+-Shape"
                      transform="translate(128.000000, 17.000000)"
                    >
                      <circle
                        cx="20.5"
                        cy="20"
                        id="Oval-302"
                        r="20"
                        stroke="#FFFFFF"
                        strokeWidth="2"
                      />
                      <path
                        d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
                        fill="#FFFFFF"
                        id="Shape"
                      />
                    </g>
                  </g>
                </g>
              </g>
            </g>
          </g>
        </g>
      </svg>
  >
    <svg
      aria-hidden="true"
      enableBackground="new 0 0 128 128"
      focusable="false"
      version="1.1"
      viewBox="0 0 128 128"
      xmlSpace="preserve"
      xmlns="http://www.w3.org/2000/svg"
      xmlnsXlink="http://www.w3.org/1999/xlink"
    >
      <g>
        <polygon
          fill="#373737"
          points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "
        />
      </g>
    </svg>
  </span>
  >
    <svg
      aria-hidden="true"
      enableBackground="new 0 0 24 24"
      focusable="false"
      version="1.0"
      viewBox="0 0 24 24"
      xmlSpace="preserve"
      xmlns="http://www.w3.org/2000/svg"
      xmlnsXlink="http://www.w3.org/1999/xlink"
    >
       
      <polyline
        fill="none"
        points="12.5,21 3.5,12 12.5,3 "
        stroke="#000000"
        strokeMiterlimit="10"
        strokeWidth="2"
      />
       
      <line
        fill="none"
        stroke="#000000"
        strokeMiterlimit="10"
        strokeWidth="2"
        x1="22"
        x2="3.5"
        y1="12"
        y2="12"
      />
       
    </svg>
  </span>
    <span>
      <svg>
        svg
      </svg>
    </span>
exports[`EmailInput renders without issue 1`] = `"<div data-__type=\\"input_wrap\\" data-invalidhint=\\"invalidHint\\" data-isvalid=\\"true\\" data-name=\\"email\\" data-icon=\\"[object Object]\\"><input type=\\"email\\" id=\\"1-email\\" inputmode=\\"email\\" name=\\"email\\" class=\\"auth0-lock-input\\" placeholder=\\"yours@example.com\\" autocomplete=\\"off\\" autocapitalize=\\"off\\" aria-label=\\"Email\\" aria-invalid=\\"false\\" value=\\"value\\"></div>"`;
import { IconSvg } from '../../ui/input/password_input';
    <span>{IconSvg}</span> <span className="auth0-sso-notice">{children}</span>
const RetrySvgIcon = (
  <svg
    focusable="false"
    height="32px"
    style={{ enableBackground: 'new 0 0 32 32' }}
    version="1.1"
    viewBox="0 0 32 32"
    width="32px"
    xmlSpace="preserve"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
  >
    {' '}
    <path d="M27.877,19.662c0.385-1.23,0.607-2.531,0.607-3.884c0-7.222-5.83-13.101-13.029-13.194v4.238    c4.863,0.093,8.793,4.071,8.793,8.956c0,0.678-0.088,1.332-0.232,1.966l-3.963-1.966l2.76,8.199l8.197-2.762L27.877,19.662z"></path>
    <path d="M7.752,16.222c0-0.678,0.088-1.332,0.232-1.967l3.963,1.967l-2.76-8.199L0.99,10.785l3.133,1.553    c-0.384,1.23-0.607,2.531-0.607,3.885c0,7.223,5.83,13.1,13.03,13.194v-4.238C11.682,25.086,7.752,21.107,7.752,16.222z"></path>
  </svg>
);
        {label} <span>{RetrySvgIcon}</span>
export const IconSvg = (
  <svg
    focusable="false"
    width="14px"
    height="14px"
    viewBox="0 0 14 14"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191">
        <g id="SMS" transform="translate(153.000000, 3207.000000)">
          <g transform="translate(35.000000, 299.000000)">
            <path
              id="Fill-349-Copy"
              d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
            ></path>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
          icon={IconSvg}
          onClick={() => startOptionSelection(l.id(lock), 'location', '', <IconSvg />)}
import { sanitize } from 'dompurify';
  // dangerouslySetInnerHTML input is sanitized using dompurify
  // eslint-disable-next-line react/no-danger
  return html
    ? React.createElement('span', { dangerouslySetInnerHTML: { __html: sanitize(html) } })
    : null;
const SvgBackIcon = () => (
  <svg
    aria-hidden="true"
    focusable="false"
    enableBackground="new 0 0 24 24"
    version="1.0"
    viewBox="0 0 24 24"
    xmlSpace="preserve"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
  >
    {' '}
    <polyline
      fill="none"
      points="12.5,21 3.5,12 12.5,3 "
      stroke="#000000"
      strokeMiterlimit="10"
      strokeWidth="2"
    ></polyline>{' '}
    <line
      fill="none"
      stroke="#000000"
      strokeMiterlimit="10"
      strokeWidth="2"
      x1="22"
      x2="3.5"
      y1="12"
      y2="12"
    ></line>{' '}
  </svg>
);
const SvgCloseIcon = () => (
  <svg
    aria-hidden="true"
    focusable="false"
    enableBackground="new 0 0 128 128"
    version="1.1"
    viewBox="0 0 128 128"
    xmlSpace="preserve"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
  >
    <g>
      <polygon
        fill="#373737"
        points="123.5429688,11.59375 116.4765625,4.5185547 64.0019531,56.9306641 11.5595703,4.4882813     4.4882813,11.5595703 56.9272461,63.9970703 4.4570313,116.4052734 11.5244141,123.4814453 63.9985352,71.0683594     116.4423828,123.5117188 123.5126953,116.4414063 71.0732422,64.0019531   "
      ></polygon>
    </g>
  </svg>
);
  >
    {svg}
  </span>
  svg: PropTypes.element.isRequired
  <IconButton lockId={lockId} name="close" onClick={onClick} svg={<SvgCloseIcon />} />
  <IconButton lockId={lockId} name="back" onClick={onClick} svg={<SvgBackIcon />} />
import { sanitize } from 'dompurify';
const SubmitSvg = () => (
  <svg
    aria-hidden="true"
    focusable="false"
    width="43px"
    height="42px"
    viewBox="0 0 43 42"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
  >
    <g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g id="Lock" transform="translate(-280.000000, -3592.000000)">
        <g id="SMS" transform="translate(153.000000, 3207.000000)">
          <g id="Group">
            <g id="Login" transform="translate(0.000000, 369.000000)">
              <g id="Btn">
                <g id="Oval-302-+-Shape" transform="translate(128.000000, 17.000000)">
                  <circle
                    id="Oval-302"
                    stroke="#FFFFFF"
                    strokeWidth="2"
                    cx="20.5"
                    cy="20"
                    r="20"
                  ></circle>
                  <path
                    d="M17.8,15.4 L19.2,14 L25.2,20 L19.2,26 L17.8,24.6 L22.4,20 L17.8,15.4 Z"
                    id="Shape"
                    fill="#FFFFFF"
                  ></path>
                </g>
              </g>
            </g>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
const SubmitTextSvg = () => (
  <svg
    aria-hidden="true"
    focusable="false"
    className="icon-text"
    width="8px"
    height="12px"
    viewBox="0 0 8 12"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
  >
    <g id="Symbols" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g id="Web/Submit/Active" transform="translate(-148.000000, -32.000000)" fill="#FFFFFF">
        <polygon
          id="Shape"
          points="148 33.4 149.4 32 155.4 38 149.4 44 148 42.6 152.6 38"
        ></polygon>
      </g>
    </g>
  </svg>
);
        <SubmitTextSvg />
      <SubmitSvg />
  display: PropTypes.string,
        ? // dangerouslySetInnerHTML input is sanitized using dompurify
          // eslint-disable-next-line react/no-danger
          React.createElement('span', { dangerouslySetInnerHTML: { __html: sanitize(message) } })
      <span>{svg}</span>
  svg: PropTypes.element.isRequired
const svg = (
  <svg
    focusable="false"
    width="56px"
    height="56px"
    viewBox="0 0 52 52"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="checkmark"
  >
    {' '}
    <circle cx="26" cy="26" r="25" fill="none" className="checkmark__circle"></circle>{' '}
    <path fill="none" d="M14.1 27.2l7.1 7.2 16.7-16.8" className="checkmark__check"></path>{' '}
  </svg>
);
const InputIconSvg = (
  <svg
    className="auth0-lock-icon auth0-lock-icon-box"
    width="21"
    height="20"
    viewBox="0 0 21 20"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
  >
    <g id="icon/key">
      <path
        id="Shape"
        fillRule="evenodd"
        clipRule="evenodd"
        d="M16.3884 11.0145C14.4508 12.9522 11.3948 13.0447 9.32094 11.3401L7.20872 13.2642L9.60904 15.6697L8.83354 16.4466L6.39631 14.0048L4.88251 15.3832L7.39496 17.89L6.61586 18.6666L3.5 15.5587L3.53914 15.5198C3.47446 15.3363 3.51554 15.1287 3.67514 14.983L8.54211 10.5496C6.89425 8.47691 7.005 5.46384 8.92209 3.54636C10.9841 1.48455 14.3267 1.48455 16.3884 3.54636C18.4501 5.60846 18.4501 8.95239 16.3884 11.0145ZM15.6048 4.33856C13.98 2.71309 11.3454 2.71309 9.72062 4.33856C8.0958 5.9632 8.0958 8.59793 9.72062 10.2226C11.3454 11.8478 13.98 11.8478 15.6048 10.2226C17.2297 8.59793 17.2297 5.96292 15.6048 4.33856Z"
        fill="#888888"
      />
    </g>
  </svg>
);
const RefreshIconSvg = () => (
  <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z"
      fill="black"
    />
    <mask
      id="mask0"
      mask-type="alpha"
      maskUnits="userSpaceOnUse"
      x="1"
      y="1"
      width="18"
      height="18"
    >
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M17.5496 8.77262C17.007 5.01122 13.8021 2.11002 9.88989 2.11002C6.79596 2.11002 4.14611 3.93257 2.896 6.55065H7.11154C7.41852 6.55065 7.66749 6.79935 7.66749 7.10579C7.66749 7.41251 7.41879 7.66205 7.11154 7.66205H2.47938H1.30282C1.30781 7.64318 1.3092 7.62291 1.3142 7.60404C1.23426 7.56296 1.16987 7.50217 1.11824 7.42889C1.10325 7.40918 1.09048 7.39086 1.07827 7.36977C1.04746 7.3112 1.02998 7.24791 1.02193 7.17935C1.01776 7.15326 1 7.133 1 7.10552C1 7.08997 1.00722 7.0772 1.00888 7.06166V1.5582C1.00888 1.25176 1.25757 1.0025 1.56427 1.0025C1.87125 1.0025 2.11994 1.25148 2.11994 1.5582V5.61994C3.6293 2.87224 6.53311 1 9.88989 1C14.4182 1 18.1481 4.39195 18.6951 8.77235H17.5496V8.77262ZM9.88989 17.655C12.9841 17.655 15.6337 15.833 16.8841 13.2152H12.6685C12.3615 13.2152 12.1128 12.967 12.1128 12.6595C12.1128 12.3525 12.3615 12.1043 12.6685 12.1043H17.3004C17.3004 12.1041 17.3007 12.1035 17.3007 12.1032H18.4775C18.4725 12.1221 18.4709 12.1424 18.4659 12.161C18.5461 12.2021 18.6105 12.2631 18.6621 12.3367C18.6774 12.3564 18.6893 12.3744 18.7018 12.3955C18.7326 12.4541 18.7504 12.5174 18.7584 12.5859C18.7626 12.612 18.7803 12.632 18.7803 12.6598C18.7803 12.675 18.7728 12.6881 18.7717 12.7031V18.2076C18.7717 18.5144 18.523 18.7628 18.2161 18.7628C17.9091 18.7628 17.6604 18.5144 17.6604 18.2076V14.1451C16.151 16.8928 13.2469 18.765 9.89017 18.765C5.36209 18.765 1.63255 15.3739 1.08493 10.9935H2.23041C2.77331 14.7549 5.97799 17.655 9.88989 17.655Z"
        fill="white"
      />
    </mask>
    <g mask="url(#mask0)"></g>
  </svg>
);
          >
            <RefreshIconSvg />
          </button>
          icon={InputIconSvg}
            // placeholderHTML allows raw HTML
            // eslint-disable-next-line react/no-danger
const SVG = (
  <svg
    aria-hidden="true"
    focusable="false"
    width="14px"
    height="13px"
    viewBox="0 0 32 26"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box"
  >
    <g id="Page-1" stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g id="32px" transform="translate(-2155.000000, -2317.000000)" fill="#373A39">
        <g id="Group-856" transform="translate(1.000000, 1.000000)">
          <path
            id="Fill-419"
            d="M2184,2339 C2184,2339.55 2183.55,2340 2183,2340 L2157,2340 C2156.45,2340 2156,2339.55 2156,2339 L2156,2319 C2156,2318.45 2156.45,2318 2157,2318 L2183,2318 C2183.55,2318 2184,2318.45 2184,2319 L2184,2339 L2184,2339 Z M2184,2316 L2156,2316 C2154.89,2316 2154,2316.89 2154,2318 L2154,2340 C2154,2341.1 2154.89,2342 2156,2342 L2184,2342 C2185.1,2342 2186,2341.1 2186,2340 L2186,2318 C2186,2316.89 2185.1,2316 2184,2316 L2184,2316 Z M2176,2322 L2180,2322 L2180,2326 L2176,2326 L2176,2322 Z M2174,2328 L2182,2328 L2182,2320 L2174,2320 L2174,2328 Z M2158,2332 L2172,2332 L2172,2330 L2158,2330 L2158,2332 Z M2158,2336 L2172,2336 L2172,2334 L2158,2334 L2158,2336 Z"
          ></path>
        </g>
      </g>
    </g>
  </svg>
);
        icon={SVG}
    if (icon) {
          {icon}
  icon: PropTypes.object
export const IconSvg = (
  <svg
    aria-hidden="true"
    focusable="false"
    width="14px"
    height="14px"
    viewBox="0 0 14 14"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-location"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g id="Lock" transform="translate(-201.000000, -3519.000000)" fill="#919191">
        <g id="SMS" transform="translate(153.000000, 3207.000000)">
          <g transform="translate(35.000000, 299.000000)">
            <path
              id="Fill-349-Copy"
              d="M22.4023125,22.8 C22.543625,21.9425 22.625,20.9975 22.625,20 L26.125,20 C26.125,21.316875 25.69275,22.52 24.9853125,23.5175 C24.3255625,23.2025 23.4383125,22.953125 22.4023125,22.8 L22.4023125,22.8 Z M21.372875,25.954375 C21.72725,25.3725 22.0234375,24.5675 22.2404375,23.6225 C22.8975625,23.696875 23.483375,23.80625 23.9624375,23.9375 L24.67075,23.9375 C23.829875,24.92625 22.6849375,25.6525 21.372875,25.954375 L21.372875,25.954375 Z M20,26.125 C19.412875,26.125 18.896625,25.105625 18.579,23.5525 C19.034,23.521875 19.503875,23.5 20,23.5 C20.4956875,23.5 20.966,23.521875 21.421,23.5525 C21.1029375,25.105625 20.5866875,26.125 20,26.125 L20,26.125 Z M15.3288125,23.9375 L16.0375625,23.9375 C16.5161875,23.80625 17.1024375,23.696875 17.759125,23.6225 C17.976125,24.5675 18.2723125,25.3725 18.6266875,25.954375 C17.3150625,25.6525 16.170125,24.92625 15.3288125,23.9375 L15.3288125,23.9375 Z M15.0146875,23.5175 C14.3068125,22.52 13.875,21.316875 13.875,20 L17.375,20 C17.375,20.9975 17.4559375,21.9425 17.59725,22.8 C16.56125,22.953125 15.6744375,23.2025 15.0146875,23.5175 L15.0146875,23.5175 Z M15.030875,16.45625 C15.6796875,16.78 16.5634375,17.03375 17.60075,17.195625 C17.501,17.799375 17.428375,18.4425 17.3964375,19.125 L13.951125,19.125 C14.0933125,18.13625 14.477,17.230625 15.030875,16.45625 L15.030875,16.45625 Z M18.6266875,14.04125 C18.27275,14.623125 17.977,15.42375 17.760875,16.373125 C17.1265,16.294375 16.558625,16.189375 16.0944375,16.0625 L15.34325,16.0625 C16.180625,15.069375 17.3168125,14.343125 18.6266875,14.04125 L18.6266875,14.04125 Z M20,13.875 C20.585375,13.875 21.0959375,14.894375 21.4118125,16.443125 C20.959875,16.478125 20.492625,16.5 20,16.5 C19.5069375,16.5 19.0396875,16.478125 18.58775,16.443125 C18.903625,14.894375 19.4141875,13.875 20,13.875 L20,13.875 Z M18.2749375,19.125 C18.3020625,18.473125 18.362,17.865 18.441625,17.29625 C18.9408125,17.344375 19.4596875,17.375 20,17.375 C20.5403125,17.375 21.0591875,17.344375 21.5579375,17.29625 C21.638,17.865 21.6979375,18.473125 21.724625,19.125 L18.2749375,19.125 L18.2749375,19.125 Z M21.75,20 C21.75,20.97125 21.6786875,21.88125 21.5631875,22.699375 C21.06225,22.65125 20.5420625,22.625 20,22.625 C19.4579375,22.625 18.9373125,22.65125 18.436375,22.699375 C18.320875,21.88125 18.25,20.97125 18.25,20 L21.75,20 L21.75,20 Z M24.6563125,16.0625 L23.905125,16.0625 C23.441375,16.189375 22.8730625,16.294375 22.2386875,16.373125 C22.0225625,15.42375 21.7268125,14.623125 21.372875,14.04125 C22.68275,14.343125 23.8189375,15.069375 24.6563125,16.0625 L24.6563125,16.0625 Z M24.9686875,16.45625 C25.5225625,17.230625 25.90625,18.13625 26.048875,19.125 L22.603125,19.125 C22.5711875,18.4425 22.499,17.799375 22.39925,17.195625 C23.4365625,17.03375 24.3203125,16.78 24.9686875,16.45625 L24.9686875,16.45625 Z M20,13 C16.1338125,13 13,16.1325 13,20 C13,23.863125 16.1338125,27 20,27 C23.86575,27 27,23.863125 27,20 C27,16.1325 23.86575,13 20,13 L20,13 Z"
            ></path>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
const ArrowIconSvg = () => (
  <svg
    aria-hidden="true"
    focusable="false"
    width="5px"
    height="10px"
    viewBox="0 0 5 10"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box auth0-lock-icon-arrow"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g
        id="Lock"
        transform="translate(-396.000000, -3521.000000)"
        fill="#000000"
        opacity="0.539999962"
      >
        <g id="SMS" transform="translate(153.000000, 3207.000000)">
          <g transform="translate(35.000000, 299.000000)">
            <g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)">
              <path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path>
            </g>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
      <InputWrap focused={focused} isValid={true} name="location" icon={IconSvg}>
        <span>
          <ArrowIconSvg />
        </span>
import { IconSvg } from './password_input';
        icon={IconSvg}
export const IconSvg = (
  <svg
    aria-hidden="true"
    focusable="false"
    width="11px"
    height="14px"
    viewBox="0 0 13 16"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g transform="translate(-288.000000, -1508.000000)" fill="#888888">
        <path d="M299,1523.998 L290,1523.998 C288.896,1523.998 288,1523.102 288,1521.999 L288,1515.999 C288,1514.895 288.896,1513.998 290,1513.998 L290,1513.998 L290,1512.499 C290,1510.015 292.015,1507.999 294.5,1507.999 C296.985,1507.999 299,1510.015 299,1512.499 L299,1513.999 C300.104,1513.999 301,1514.895 301,1515.999 L301,1521.999 C301,1523.103 300.104,1523.998 299,1523.998 L299,1523.998 Z M298,1512.499 C298,1510.566 296.433,1508.999 294.5,1508.999 C292.567,1508.999 291,1510.566 291,1512.499 L291,1513.998 L298,1513.998 L298,1512.499 L298,1512.499 Z M300,1515.999 C300,1515.446 299.552,1514.998 299,1514.998 L290,1514.998 C289.447,1514.998 289,1515.446 289,1515.999 L289,1521.999 C289,1522.551 289.447,1522.998 290,1522.998 L299,1522.998 C299.552,1522.998 300,1522.551 300,1521.999 L300,1515.999 L300,1515.999 Z M294.5,1520.998 C294.224,1520.998 294,1520.774 294,1520.498 L294,1517.498 C294,1517.223 294.224,1516.999 294.5,1516.999 C294.776,1516.999 295,1517.223 295,1517.498 L295,1520.498 C295,1520.774 294.776,1520.998 294.5,1520.998 L294.5,1520.998 Z"></path>
      </g>
    </g>
  </svg>
);
        icon={IconSvg}
const IconSvg = (
  <svg
    aria-hidden="true"
    focusable="false"
    width="9px"
    height="14px"
    viewBox="0 0 9 14"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-mobile"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g id="Lock" transform="translate(-204.000000, -3459.000000)" fill="#888888">
        <g id="SMS" transform="translate(153.000000, 3207.000000)">
          <g transform="translate(35.000000, 239.000000)">
            <path d="M24.1,15.625 L16.9,15.625 L16.9,14.75 C16.9,14.264375 17.30275,13.875 17.8,13.875 L23.2,13.875 C23.6968,13.875 24.1,14.264375 24.1,14.75 L24.1,15.625 L24.1,15.625 Z M16.9,16.5 L24.1,16.5 L24.1,21.75 L16.9,21.75 L16.9,16.5 Z M24.1,25.25 C24.1,25.73125 23.6968,26.125 23.2,26.125 L17.8,26.125 C17.30275,26.125 16.9,25.73125 16.9,25.25 L16.9,22.625 L24.1,22.625 L24.1,25.25 L24.1,25.25 Z M23.2,13 L17.8,13 C16.80595,13 16,13.783125 16,14.75 L16,25.25 C16,26.216875 16.80595,27 17.8,27 L23.2,27 C24.19405,27 25,26.216875 25,25.25 L25,14.75 C25,13.783125 24.19405,13 23.2,13 L23.2,13 Z M20.5,25.25 C20.9968,25.25 21.4,24.85625 21.4,24.375 C21.4,23.889375 20.9968,23.5 20.5,23.5 C20.00275,23.5 19.6,23.889375 19.6,24.375 C19.6,24.85625 20.00275,25.25 20.5,25.25 L20.5,25.25 Z"></path>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
        icon={IconSvg}
const ArrowIconSvg = () => (
  <svg
    aria-hidden="true"
    focusable="false"
    width="5px"
    height="10px"
    viewBox="0 0 5 10"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon-arrow"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g
        id="Lock"
        transform="translate(-396.000000, -3521.000000)"
        fill="#000000"
        opacity="0.539999962"
      >
        <g id="SMS" transform="translate(153.000000, 3207.000000)">
          <g transform="translate(35.000000, 299.000000)">
            <g transform="translate(210.000000, 20.000000) rotate(-90.000000) translate(-210.000000, -20.000000) translate(198.000000, 8.000000)">
              <path id="Shape" d="M7,10 L12,15 L17,10 L7,10 Z"></path>
            </g>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
        <span>
          <ArrowIconSvg />
        </span>
const IconSvg = (
  <svg
    aria-hidden="true"
    focusable="false"
    width="13px"
    height="14px"
    viewBox="0 0 15 16"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g transform="translate(-11.000000, -1471.000000)" fill="#888888">
        <path d="M25.552,1486.998 L11.449,1486.998 C10.667,1485.799 10.984,1483.399 11.766,1482.6 C12.139,1482.219 14.931,1481.5 16.267,1481.172 C14.856,1480.076 13.995,1478.042 13.995,1476.103 C13.995,1473.284 14.813,1470.999 18.498,1470.999 C22.182,1470.999 23,1473.284 23,1476.103 C23,1478.037 22.145,1480.065 20.74,1481.163 C22.046,1481.489 24.88,1482.228 25.241,1482.601 C26.019,1483.399 26.328,1485.799 25.552,1486.998 L25.552,1486.998 Z M24.6,1483.443 C24.087,1483.169 21.881,1482.548 20,1482.097 L20,1480.513 C21.254,1479.659 21.997,1477.806 21.997,1476.12 C21.997,1473.841 21.414,1471.993 18.499,1471.993 C15.583,1471.993 15,1473.841 15,1476.12 C15,1477.807 15.744,1479.662 17,1480.515 L17,1482.112 C15.109,1482.556 12.914,1483.166 12.409,1483.442 C12.082,1483.854 11.797,1485.173 12,1486 L25,1486 C25.201,1485.174 24.922,1483.858 24.6,1483.443 L24.6,1483.443 Z"></path>
      </g>
    </g>
  </svg>
);
        icon={IconSvg}
const IconSvg = (
  <svg
    aria-hidden="true"
    focusable="false"
    width="12px"
    height="14px"
    viewBox="0 0 12 14"
    version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlnsXlink="http://www.w3.org/1999/xlink"
    className="auth0-lock-icon auth0-lock-icon-box"
  >
    <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
      <g transform="translate(-964.000000, -3509.000000)" fill="#888888">
        <g transform="translate(915.000000, 3207.000000)">
          <g transform="translate(35.000000, 289.000000)">
            <path
              id="Fill-42"
              d="M25.0523108,22.8115806 L20.455448,26.0692401 L20.455448,20.6336024 L25.0523108,17.6924012 L25.0523108,22.8115806 L25.0523108,22.8115806 Z M20.1658456,19.763342 C20.1060864,19.786611 20.050924,19.8145338 19.9957617,19.8471103 C19.9451962,19.8191876 19.8946307,19.786611 19.8394683,19.7679958 L14.9392126,16.7616414 L19.986568,13.8949009 L25.0523108,16.7616414 L25.043117,16.7662952 L20.1658456,19.763342 L20.1658456,19.763342 Z M19.5360754,20.6336024 L19.5360754,26.0692401 L14.9392126,22.8115806 L14.9392126,17.6924012 L19.5360754,20.6336024 L19.5360754,20.6336024 Z M25.9716833,17.6924012 C25.9716833,17.5574411 25.9395053,17.4317885 25.8889398,17.3154435 C26.0728143,16.9664085 26.0314425,16.5242976 25.7418402,16.2311082 L20.4002856,13.2340614 C19.7980966,12.9408721 20.2393954,12.9036417 19.5590597,13.2340614 L14.2634738,16.2311082 C13.9692745,16.5242976 13.9279028,16.9571009 14.1071804,17.3107897 C14.0520181,17.4271347 14.01984,17.5527873 14.01984,17.6924012 L14.01984,22.8115806 C14.01984,23.3234985 14.4335577,23.7423404 14.9392126,23.7423404 L19.5360754,27 C19.7061593,27 19.8578558,26.9395006 19.9957617,26.8557322 C20.1336676,26.9395006 20.285364,27 20.455448,27 L25.511997,23.7423404 C26.017652,23.7423404 25.9716833,23.3234985 25.9716833,22.8115806 L25.9716833,17.6924012 L25.9716833,17.6924012 Z"
            ></path>
          </g>
        </g>
      </g>
    </g>
  </svg>
);
      <InputWrap focused={focused} isValid={isValid} name="vcode" icon={IconSvg}>
dompurify@^2.2.8:
  version "2.2.8"
  resolved "https://registry.yarnpkg.com/dompurify/-/dompurify-2.2.8.tgz#ce88e395f6d00b6dc53f80d6b2a6fdf5446873c6"
  integrity sha512-9H0UL59EkDLgY3dUFjLV6IEUaHm5qp3mxSqWw7Yyx4Zhk2Jn2cmLe+CNPP3xy13zl8Bqg+0NehQzkdMoVhGRww==

prop-types@^15.5.10, prop-types@^15.6.2, prop-types@^15.7.0, prop-types@^15.7.2: