siam-ui-utils 1.0.9 → 1.0.10

package/src/iconos/curso-presencial-icon.jsx

@@ -0,0 +1,70 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const CursoPresencial = (props) => {
+  const { sublabel = '' } = props || {};
+  const { size = '' } = props || {};
+  return (
+    <Icon
+      title="Presencial"
+      width={size}
+      display={sublabel !== '' ? 'block' : 'none'}
+    >
+      <svg
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 37.116 43.771"
+      >
+        <g>
+          <path
+            d="M6.004,28.154c0.602-0.504,1.379-0.807,2.221-0.807c0.273,0,0.541,0.035,0.801,0.094v-3.064h0.568v3.25
+		c1.242,0.535,2.117,1.771,2.117,3.207c0,1.098-0.51,2.076-1.303,2.715h0.18c0.023,0,0.047,0,0.076,0.002
+		c0.305,0.008,0.775,0.072,1.305,0.338c0.225,0.113,0.438,0.258,0.646,0.422V16.014c0.592-0.057,1.426-0.148,2.389-0.297
+		c1.904-0.295,4.309-0.803,6.396-1.715c0.496-0.215,0.723-0.791,0.506-1.287c-0.215-0.494-0.795-0.719-1.289-0.502
+		c-1.822,0.797-4.105,1.293-5.908,1.568c-0.906,0.139-1.691,0.227-2.25,0.279c-0.277,0.025-0.5,0.045-0.65,0.055
+		c-0.057,0.002-0.102,0.008-0.137,0.01l0,0H6.947c-0.016,0-0.025,0-0.039,0c-0.217,0.004-0.59,0.053-1.012,0.264
+		c-0.656,0.324-1.365,1.039-1.861,2.303c-0.504,1.27-0.844,3.105-0.844,5.875c0,0.713,0.025,1.492,0.074,2.342
+		C3.297,25.43,3.725,25.83,4.24,25.83c0.02,0,0.039,0,0.059-0.002c0.539-0.033,0.953-0.494,0.92-1.033
+		C5.172,23.98,5.15,23.24,5.15,22.566c-0.004-2.963,0.426-4.625,0.854-5.494V28.154L6.004,28.154z"
+          />
+          <circle cx="9.309" cy="10.676" r="2.752" />
+          <polygon
+            points="14.348,20.439 33.258,20.439 33.258,2.533 6.48,2.533 6.48,7.014 6.969,7.014 6.969,3.02 32.77,3.02 32.77,19.951 
+		14.348,19.951 	"
+          />
+          <path
+            d="M7.777,33.547h0.898c1.305-0.213,2.301-1.346,2.301-2.713c0-1.518-1.232-2.75-2.752-2.75c-1.521,0-2.75,1.232-2.75,2.75
+		C5.475,32.201,6.471,33.334,7.777,33.547z"
+          />
+          <path
+            d="M21.307,30.834c0-1.518-1.23-2.75-2.75-2.75c-1.516,0-2.75,1.232-2.75,2.75c0,1.367,0.996,2.5,2.303,2.713h0.898
+		C20.313,33.334,21.307,32.201,21.307,30.834z"
+          />
+          <path
+            d="M4.92,37.23v4.008h6.611v-4.002c0.074,0.148,0.146,0.32,0.221,0.52c0.268,0.746,0.504,1.863,0.594,3.482h2.094
+		c0.109-2.055,0.463-3.299,0.813-4.008v4.008h6.611v-4.002c0.074,0.148,0.148,0.32,0.219,0.52c0.268,0.746,0.504,1.863,0.596,3.482
+		h2.092c0.115-2.055,0.465-3.299,0.814-4.008v4.008h6.613v-4.004c0.074,0.15,0.145,0.322,0.217,0.521
+		c0.27,0.746,0.506,1.863,0.596,3.482h1.959c-0.145-2.773-0.674-4.426-1.361-5.477c-0.4-0.609-0.871-1-1.307-1.219
+		c-0.418-0.211-0.785-0.256-1.004-0.26c-0.016,0-0.031-0.002-0.045-0.002h-1.859c-0.164,0.023-0.334,0.039-0.504,0.039
+		c-0.172,0-0.338-0.016-0.502-0.039h-1.859c-0.016,0-0.031,0.002-0.049,0.004c-0.221,0.004-0.582,0.049-0.998,0.258
+		c-0.613,0.305-1.273,0.943-1.758,2.053c-0.137-0.314-0.289-0.592-0.449-0.834c-0.402-0.609-0.871-1-1.305-1.219
+		c-0.418-0.211-0.787-0.256-1.006-0.26c-0.01,0-0.029-0.002-0.043-0.002h-4.727c-0.014,0-0.029,0.002-0.045,0.004
+		c-0.223,0.004-0.588,0.049-1.002,0.258c-0.611,0.305-1.266,0.943-1.756,2.053c-0.141-0.314-0.291-0.592-0.449-0.834
+		c-0.402-0.609-0.869-1-1.307-1.219c-0.416-0.211-0.781-0.256-1.004-0.26c-0.016,0-0.027-0.002-0.043-0.002H5.863
+		c-0.018,0-0.031,0.002-0.047,0.004c-0.223,0.004-0.586,0.049-1.002,0.258c-0.656,0.33-1.365,1.043-1.863,2.305
+		c-0.404,1.027-0.705,2.426-0.803,4.391h1.955C4.221,39.184,4.572,37.939,4.92,37.23z"
+          />
+          <path
+            d="M28.889,28.084c1.52,0,2.754,1.232,2.754,2.75c0,1.52-1.234,2.75-2.754,2.75c-1.518,0-2.75-1.23-2.75-2.75
+		C26.139,29.316,27.371,28.084,28.889,28.084z"
+          />
+        </g>
+      </svg>
+
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+CursoPresencial.defaultProps = { theme: {} };
+export default withTheme(CursoPresencial);

package/src/iconos/curso-virtual-color-icon.jsx

@@ -0,0 +1,108 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const CursoVirtualColor = (props) => {
+  const { sublabel = '' } = props || {};
+  const { size = '' } = props || {};
+  return (
+    <Icon
+      title="Virtual"
+      width={size}
+      display={sublabel !== '' ? 'block' : 'none'}
+    >
+      <svg
+        version="1.1"
+        id="Capa_1"
+        xmlns="http://www.w3.org/2000/svg"
+        x="0px"
+        y="0px"
+        width="91.984px"
+        height="107.949px"
+        viewBox="0 0 91.984 107.949"
+        enableBackground="new 0 0 91.984 107.949"
+      >
+        <g>
+          <g>
+            <path
+              fill="#333333"
+              d="M29.447,107.577c-0.459-0.248-0.818-0.592-1.08-1.032s-0.392-0.932-0.392-1.476
+			c0-0.545,0.13-1.036,0.392-1.477c0.262-0.439,0.621-0.783,1.08-1.031s0.974-0.373,1.545-0.373c0.57,0,1.084,0.125,1.543,0.373
+			s0.818,0.59,1.08,1.027s0.393,0.932,0.393,1.48s-0.131,1.043-0.393,1.48c-0.262,0.437-0.621,0.779-1.08,1.027
+			s-0.973,0.372-1.543,0.372C30.421,107.949,29.906,107.825,29.447,107.577z M32,106.785c0.299-0.168,0.533-0.403,0.703-0.704
+			c0.171-0.301,0.256-0.639,0.256-1.012s-0.085-0.711-0.256-1.012c-0.17-0.302-0.404-0.537-0.703-0.705s-0.635-0.252-1.008-0.252
+			c-0.374,0-0.71,0.084-1.009,0.252s-0.533,0.403-0.704,0.705c-0.17,0.301-0.256,0.639-0.256,1.012s0.086,0.711,0.256,1.012
+			c0.171,0.301,0.405,0.536,0.704,0.704s0.635,0.252,1.009,0.252C31.365,107.037,31.701,106.953,32,106.785z"
+            />
+            <path
+              fill="#333333"
+              d="M40.159,102.269v5.601h-0.856l-3.088-3.792v3.792h-1.031v-5.601h0.855l3.088,3.793v-3.793H40.159z"
+            />
+            <path
+              fill="#333333"
+              d="M41.735,102.269h1.04v4.721h2.928v0.88h-3.968V102.269z"
+            />
+            <path fill="#333333" d="M46.6,102.269h1.039v5.601H46.6V102.269z" />
+            <path
+              fill="#333333"
+              d="M54.199,102.269v5.601h-0.855l-3.088-3.792v3.792h-1.033v-5.601h0.856l3.088,3.793v-3.793H54.199z"
+            />
+            <path
+              fill="#333333"
+              d="M59.975,106.997v0.872h-4.199v-5.601h4.088v0.873h-3.049v1.455h2.705v0.856h-2.705v1.544H59.975z"
+            />
+          </g>
+        </g>
+        <linearGradient
+          id="SVGID_1_"
+          gradientUnits="userSpaceOnUse"
+          x1="0"
+          y1="45.9922"
+          x2="91.9844"
+          y2="45.9922"
+        >
+          <stop offset="0.0354" style={{ stopColor: '#FFA98C' }} />
+          <stop offset="0.3169" style={{ stopColor: '#FFB892' }} />
+          <stop offset="0.8601" style={{ stopColor: '#FEE1A3' }} />
+          <stop offset="1" style={{ stopColor: '#FEECA8' }} />
+        </linearGradient>
+        <path
+          fill="url(#SVGID_1_)"
+          d="M45.992,0C20.632,0,0,20.632,0,45.992s20.632,45.992,45.992,45.992s45.992-20.632,45.992-45.992
+	S71.353,0,45.992,0z M45.992,82.657c-20.218,0-36.665-16.447-36.665-36.665S25.774,9.327,45.992,9.327
+	c20.217,0,36.664,16.447,36.664,36.665S66.209,82.657,45.992,82.657z"
+        />
+        <linearGradient
+          id="SVGID_2_"
+          gradientUnits="userSpaceOnUse"
+          x1="26.1768"
+          y1="44.6943"
+          x2="65.8066"
+          y2="44.6943"
+        >
+          <stop offset="0.0354" style={{ stopColor: '#FFA98C' }} />
+          <stop offset="0.3169" style={{ stopColor: '#FFB892' }} />
+          <stop offset="0.8601" style={{ stopColor: '#FEE1A3' }} />
+          <stop offset="1" style={{ stopColor: '#FEECA8' }} />
+        </linearGradient>
+        <path
+          fill="url(#SVGID_2_)"
+          d="M34.174,53.923v-3.339c0-0.682,0.323-1.367,0.845-1.808c3.016-2.449,6.271-4.1,6.953-4.421
+	c0.078-0.04,0.121-0.12,0.121-0.202v-1.728c-0.44-0.762-0.682-1.606-0.803-2.37c-0.284-0.041-0.646-0.403-1.009-1.73
+	c-0.518-1.809,0.043-2.092,0.487-2.049c0,0-1.246-4.261,1.807-6.15c0,0-0.525-0.443-0.482-1.045c0,0,2.976,0.32,4.421,0.041
+	c1.449-0.281,3.015,0.843,3.253,1.928c0,0,3.058-0.24,1.772,5.227c0,0,0,0.121-0.082,0.32h0.082
+	c0.362,0.123,0.604,0.604,0.202,2.012c-0.482,1.728-0.927,1.846-1.207,1.649c-0.121,0.603-0.281,1.243-0.604,1.886
+	c0,0.884,0,1.689,0,2.01c0,0.082,0.039,0.162,0.121,0.202c0.643,0.321,3.938,1.972,6.953,4.421c0.521,0.44,0.845,1.126,0.845,1.808
+	v3.339 M63.356,55.406h-0.12V35.872c0-1.523-1.247-2.773-2.773-2.773h-2.614h-3.98v3.78h3.98h1.609v18.489h-9.77v0.201
+	c0,0.562-0.482,1.045-1.044,1.045h-5.306c-0.564,0-1.043-0.483-1.043-1.045v-0.201h-9.727V36.879h2.488h3.055v-3.78h-3.055h-3.537
+	c-1.526,0-2.773,1.25-2.773,2.773v19.496h-0.12h-2.45v1.889c0,1.69,1.367,3.054,3.054,3.054h2.934h27.652h2.933
+	c1.69,0,3.058-1.363,3.058-3.054v-1.889h-2.45V55.406z"
+        />
+      </svg>
+
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+CursoVirtualColor.defaultProps = { theme: {} };
+export default withTheme(CursoVirtualColor);

package/src/iconos/curso-virtual-icon.jsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const CursoVirtual = (props) => {
+  const { sublabel = '' } = props || {};
+  const { size = '' } = props || {};
+  return (
+    <Icon
+      title="Virtual"
+      width={size}
+      display={sublabel !== '' ? 'block' : 'none'}
+    >
+      <svg
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 37.116 43.771"
+      >
+        <path
+          d="M10.234,28.384v-2.348c0-0.481,0.227-0.964,0.595-1.273c2.124-1.728,4.416-2.89,4.898-3.115
+	c0.056-0.028,0.083-0.085,0.083-0.143v-1.217c-0.31-0.538-0.479-1.13-0.565-1.669c-0.197-0.029-0.452-0.286-0.708-1.217
+	c-0.367-1.277,0.029-1.473,0.341-1.445c0,0-0.878-3,1.274-4.33c0,0-0.369-0.314-0.342-0.739c0,0,2.097,0.229,3.115,0.028
+	c1.021-0.196,2.124,0.596,2.292,1.359c0,0,2.153-0.168,1.247,3.682c0,0,0,0.086-0.058,0.225h0.058
+	c0.255,0.087,0.424,0.425,0.143,1.417c-0.341,1.217-0.653,1.303-0.851,1.163c-0.085,0.424-0.198,0.874-0.425,1.327
+	c0,0.625,0,1.191,0,1.416c0,0.058,0.028,0.114,0.086,0.143c0.453,0.226,2.773,1.388,4.896,3.115c0.367,0.31,0.596,0.792,0.596,1.273
+	v2.348 M30.788,29.433h-0.086V15.672c0-1.073-0.878-1.951-1.953-1.951H26.91h-2.805v2.661h2.805h1.131v13.022h-6.878v0.143
+	c0,0.396-0.341,0.734-0.737,0.734H16.69c-0.398,0-0.737-0.339-0.737-0.734v-0.143H9.104V16.382h1.753h2.151v-2.661h-2.151h-2.49
+	c-1.077,0-1.953,0.878-1.953,1.951v13.732H6.328H4.602v1.33c0,1.188,0.963,2.151,2.151,2.151h2.065h19.478h2.065
+	c1.19,0,2.153-0.963,2.153-2.151v-1.33h-1.727V29.433z"
+        />
+      </svg>
+
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+CursoVirtual.defaultProps = { theme: {} };
+export default withTheme(CursoVirtual);

package/src/iconos/delegaciones-icon.jsx

@@ -0,0 +1,65 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const DelegacionesIcon = (props) => {
+  const { sublabel = '', size = '' } = props || {};
+
+  return (
+    <Icon width={size} display={sublabel !== '' ? 'block' : 'none'}>
+      <svg
+        version="1.1"
+        xmlns="http://www.w3.org/2000/svg"
+        width="20.162px"
+        height="22.261px"
+        viewBox="0 0 22.162 22.261"
+      >
+        <g>
+          <g transform="translate(-1.9999999e-7,60)">
+            <g>
+              <path
+                fill="#666666"
+                d="M11.082-60c-3.335,0-6.044,2.729-6.044,6.079c0,2.766,1.441,5.609,2.847,7.787
+				c1.412,2.178,2.825,3.701,2.825,3.701c0.19,0.205,0.511,0.217,0.715,0.027c0.011-0.011,0.018-0.019,0.027-0.027
+				c0,0,1.413-1.523,2.824-3.701c1.409-2.178,2.85-5.021,2.85-7.787C17.126-57.271,14.414-60,11.082-60z M11.082-58.987
+				c2.783,0,5.033,2.26,5.033,5.066c0,2.406-1.329,5.138-2.688,7.236c-1.064,1.643-1.933,2.66-2.345,3.13
+				c-0.414-0.47-1.284-1.487-2.345-3.13c-1.361-2.099-2.688-4.83-2.688-7.236C6.049-56.728,8.297-58.987,11.082-58.987z"
+              />
+              <path
+                fill="#666666"
+                d="M11.082-56.964c-1.752,0-3.183,1.438-3.183,3.197c0,1.757,1.431,3.195,3.183,3.195
+				c1.75,0,3.178-1.438,3.178-3.195C14.26-55.525,12.832-56.964,11.082-56.964z M11.082-55.952c1.201,0,2.166,0.97,2.166,2.186
+				c0,1.213-0.965,2.185-2.166,2.185c-1.203,0-2.168-0.972-2.168-2.185C8.914-54.982,9.879-55.952,11.082-55.952z"
+              />
+              <path
+                fill="#666666"
+                d="M2.853-44.431c-0.839,0.323-1.52,0.694-2.019,1.134C0.335-42.856,0-42.314,0-41.711
+				c0,0.689,0.422,1.282,1.028,1.751c0.604,0.469,1.426,0.855,2.419,1.182c1.983,0.651,4.668,1.04,7.635,1.04
+				c2.963,0,5.647-0.389,7.634-1.04c0.994-0.326,1.813-0.713,2.42-1.182c0.604-0.469,1.026-1.062,1.026-1.751
+				c0-0.6-0.329-1.14-0.821-1.575c-0.494-0.438-1.165-0.809-1.993-1.13c-0.26-0.102-0.554,0.027-0.655,0.289
+				c-0.102,0.259,0.027,0.553,0.289,0.653c0.753,0.295,1.328,0.625,1.686,0.943c0.358,0.317,0.481,0.59,0.481,0.819
+				c0,0.271-0.17,0.59-0.634,0.95C20.05-40.4,19.32-40.042,18.4-39.74c-1.839,0.604-4.444,0.99-7.318,0.99
+				c-2.876,0-5.479-0.387-7.321-0.99c-0.92-0.302-1.648-0.66-2.112-1.021c-0.465-0.36-0.638-0.68-0.638-0.95
+				c0-0.232,0.129-0.506,0.492-0.827c0.363-0.32,0.947-0.654,1.712-0.947c0.261-0.102,0.391-0.393,0.293-0.653
+				C3.392-44.403,3.063-44.523,2.853-44.431z"
+              />
+              <path
+                fill="#666666"
+                d="M6.611-45.649c-0.754,0.253-1.363,0.563-1.815,0.945c-0.455,0.383-0.767,0.872-0.767,1.423
+				c0,0.525,0.28,0.989,0.679,1.352c0.4,0.36,0.932,0.652,1.563,0.894c1.267,0.485,2.948,0.768,4.811,0.768
+				c1.859,0,3.542-0.282,4.809-0.768c0.633-0.241,1.163-0.533,1.563-0.894c0.396-0.362,0.68-0.826,0.68-1.352
+				c0-0.551-0.313-1.04-0.766-1.423c-0.452-0.382-1.065-0.692-1.817-0.945c-0.265-0.087-0.553,0.056-0.643,0.319
+				c-0.086,0.266,0.057,0.552,0.321,0.641c0.67,0.225,1.176,0.497,1.485,0.759c0.311,0.262,0.403,0.479,0.403,0.649
+				c0,0.168-0.08,0.363-0.343,0.601c-0.267,0.239-0.694,0.488-1.246,0.701c-1.104,0.422-2.692,0.7-4.447,0.7s-3.345-0.278-4.45-0.7
+				c-0.551-0.213-0.979-0.462-1.243-0.701c-0.263-0.237-0.349-0.433-0.349-0.601c0-0.171,0.096-0.388,0.407-0.649
+				c0.308-0.262,0.817-0.534,1.485-0.759c0.265-0.089,0.408-0.375,0.321-0.641C7.157-45.595,6.842-45.729,6.611-45.649z"
+              />
+            </g>
+          </g>
+        </g>
+      </svg>
+    </Icon>
+  );
+};
+DelegacionesIcon.defaultProps = { theme: {} };
+export default withTheme(DelegacionesIcon);

package/src/iconos/forgot-dni-icon.jsx

@@ -0,0 +1,41 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './user/styled-icon';
+
+const ForgotDniIcon = (props) => {
+  const { sublabel = '' } = props || {};
+  const { width, height } = props || {};
+  return (
+    <Icon
+      title=""
+      width={width}
+      height={height}
+      display={sublabel !== '' ? 'block' : 'none'}
+    >
+      <svg version="1.1" xmlns="http://www.w3.org/2000/svg">
+        <g>
+          <path
+            d="M36.3655 60H16.1365C14.1665 60 12.4285 58.99 11.6005 57.366C10.8635 55.919 11.0005 54.262 11.9655 52.93L17.1615 45.773C17.5155 45.287 18.0785 45 18.6805 45H33.8235C34.4235 45 34.9875 45.287 35.3415 45.773L40.5385 52.93C41.5035 54.261 41.6405 55.918 40.9015 57.366C40.0735 58.99 38.3365 60 36.3655 60ZM19.6355 48.75L15.0005 55.133C14.8655 55.32 14.8475 55.479 14.9395 55.662C15.0795 55.933 15.4745 56.25 16.1355 56.25H36.3645C37.0245 56.25 37.4215 55.934 37.5595 55.662C37.6535 55.478 37.6345 55.319 37.4985 55.133L32.8645 48.75H19.6355Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M46.875 48.75H5.625C2.523 48.75 0 46.227 0 43.125V5.625C0 2.523 2.523 0 5.625 0H46.875C49.977 0 52.5 2.523 52.5 5.625V43.125C52.5 46.227 49.977 48.75 46.875 48.75ZM5.625 3.75C4.591 3.75 3.75 4.591 3.75 5.625V43.125C3.75 44.158 4.591 45 5.625 45H46.875C47.91 45 48.75 44.158 48.75 43.125V5.625C48.75 4.591 47.91 3.75 46.875 3.75H5.625Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M25.257 28.6229C24.778 28.6229 24.298 28.4389 23.932 28.0729L21.176 25.3179C20.444 24.5859 20.444 23.3989 21.176 22.6669C21.908 21.9339 23.095 21.9349 23.827 22.6669L25.257 24.0969L28.676 20.6779C29.408 19.9459 30.595 19.9459 31.327 20.6779C32.059 21.4099 32.059 22.5969 31.327 23.3289L26.583 28.0739C26.217 28.4399 25.737 28.6229 25.257 28.6229Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M26.25 37.5C19.014 37.5 13.125 31.612 13.125 24.375C13.125 17.138 19.014 11.25 26.25 11.25C33.486 11.25 39.375 17.138 39.375 24.375C39.375 31.612 33.486 37.5 26.25 37.5ZM26.25 15C21.082 15 16.875 19.206 16.875 24.375C16.875 29.544 21.082 33.75 26.25 33.75C31.42 33.75 35.625 29.544 35.625 24.375C35.625 19.206 31.42 15 26.25 15Z"
+            fill="#B5B4B4"
+          />
+        </g>
+      </svg>
+
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+ForgotDniIcon.defaultProps = { theme: {} };
+export default withTheme(ForgotDniIcon);

package/src/iconos/forgot-password-icon.jsx

@@ -0,0 +1,45 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './user/styled-icon';
+
+const ForgotPasswordIcon = (props) => {
+  const { sublabel = '' } = props || {};
+  const { width, height } = props || {};
+  return (
+    <Icon
+      title=""
+      width={width}
+      height={height}
+      display={sublabel !== '' ? 'block' : 'none'}
+    >
+      <svg version="1.1" xmlns="http://www.w3.org/2000/svg">
+        <g>
+          <path
+            d="M14.879 12.6143C13.948 11.6833 12.439 11.6833 11.508 12.6143C10.578 13.5453 10.578 15.0533 11.508 15.9843L13.398 17.8743L11.508 19.7643C10.578 20.6953 10.578 22.2043 11.508 23.1353C12.439 24.0663 13.948 24.0663 14.879 23.1353L16.769 21.2453L18.659 23.1353C19.589 24.0663 21.098 24.0663 22.029 23.1353C22.959 22.2043 22.959 20.6953 22.029 19.7643L20.139 17.8743L22.029 15.9843C22.959 15.0533 22.959 13.5453 22.029 12.6143C21.098 11.6833 19.589 11.6833 18.659 12.6143L16.769 14.5043L14.879 12.6143Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M29.2705 12.6143C30.2015 11.6833 31.7105 11.6833 32.6415 12.6143L34.5315 14.5043L36.4215 12.6143C37.3515 11.6833 38.8605 11.6833 39.7915 12.6143C40.7225 13.5453 40.7225 15.0533 39.7915 15.9843L37.9015 17.8743L39.7915 19.7643C40.7225 20.6953 40.7225 22.2043 39.7915 23.1353C38.8605 24.0663 37.3515 24.0663 36.4215 23.1353L34.5315 21.2453L32.6415 23.1353C31.7105 24.0663 30.2015 24.0663 29.2705 23.1353C28.3395 22.2043 28.3395 20.6953 29.2705 19.7643L31.1605 17.8743L29.2705 15.9843C28.3395 15.0543 28.3395 13.5453 29.2705 12.6143Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M50.402 12.6143C49.471 11.6833 47.962 11.6833 47.031 12.6143C46.1 13.5453 46.1 15.0533 47.031 15.9843L48.921 17.8743L47.031 19.7643C46.1 20.6953 46.1 22.2043 47.031 23.1353C47.962 24.0663 49.471 24.0663 50.402 23.1353L52.292 21.2453L54.181 23.1353C55.112 24.0663 56.621 24.0663 57.551 23.1353C58.482 22.2043 58.482 20.6953 57.551 19.7643L55.662 17.8743L57.551 15.9843C58.482 15.0533 58.482 13.5453 57.551 12.6143C56.621 11.6833 55.112 11.6833 54.181 12.6143L52.292 14.5043L50.402 12.6143Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M68.1628 12.6143C67.2318 11.6833 65.7227 11.6833 64.7928 12.6143C63.8608 13.5453 63.8608 15.0533 64.7928 15.9843L66.6817 17.8743L64.7928 19.7643C63.8608 20.6953 63.8608 22.2043 64.7928 23.1353C65.7227 24.0663 67.2318 24.0663 68.1628 23.1353L70.0528 21.2453L71.9418 23.1353C72.8738 24.0663 74.3808 24.0663 75.3128 23.1353C76.2438 22.2043 76.2438 20.6953 75.3128 19.7643L73.4227 17.8743L75.3128 15.9843C76.2438 15.0533 76.2438 13.5453 75.3128 12.6143C74.3808 11.6833 72.8738 11.6833 71.9418 12.6143L70.0528 14.5043L68.1628 12.6143Z"
+            fill="#B5B4B4"
+          />
+          <path
+            d="M86.821 9.533C86.821 4.269 82.554 0 77.288 0H9.533C4.268 0 0 4.269 0 9.533V26.217C0 31.483 4.268 35.75 9.533 35.75H77.288C82.554 35.75 86.821 31.482 86.821 26.217V9.533ZM77.288 4.768C79.92 4.768 82.055 6.902 82.055 9.534V26.218C82.055 28.851 79.92 30.986 77.288 30.986H9.533C6.901 30.986 4.766 28.851 4.766 26.218V9.533C4.766 6.901 6.901 4.767 9.533 4.767L77.288 4.768Z"
+            fill="#B5B4B4"
+          />
+        </g>
+      </svg>
+
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+ForgotPasswordIcon.defaultProps = { theme: {} };
+export default withTheme(ForgotPasswordIcon);

package/src/iconos/icon-button-svg.jsx

@@ -0,0 +1,49 @@
+import React, { useState } from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const useSvgToReactEncoded = (svg) => {
+  const svgWrapperRef = React.useRef();
+  React.useEffect(() => {
+    svgWrapperRef.current.innerHTML = svg;
+  }, [svg]);
+
+  return svgWrapperRef;
+};
+
+const IconButtonSvg = (props) => {
+  const {
+    sublabel = '',
+    onClick = () => {
+      undefined;
+    },
+    onTouchStart = () => {
+      undefined;
+    },
+    svg,
+    svgOver,
+    height = '3rem',
+    width = '3rem',
+    title,
+  } = props || {};
+  const [svgActive, setSvgActive] = useState(svg);
+  const svgWrapperRef = useSvgToReactEncoded(svgActive);
+
+  return (
+    <Icon
+      title={title}
+      display={sublabel !== '' ? 'block' : 'none'}
+      onClick={onClick}
+      onTouchStart={onTouchStart}
+      onMouseOver={() => setSvgActive(svgOver || svg)}
+      onMouseOut={() => setSvgActive(svg)}
+      width={width}
+      height={height}
+    >
+      <div ref={svgWrapperRef} />
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+IconButtonSvg.defaultProps = { theme: {} };
+export default withTheme(IconButtonSvg);

package/src/iconos/lapiz-act-contacto-perf-button.jsx

@@ -0,0 +1,43 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const LapizActContactoPerfilButton = (props) => {
+  const { sublabel = '', size = '', onOpen } = props || {};
+  const handleOpen = () => {
+    onOpen(true);
+  };
+
+  return (
+    <>
+      <Icon
+        width={size}
+        display={sublabel !== '' ? 'block' : 'none'}
+        onClick={() => handleOpen()}
+      >
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          version="1.1"
+          width="25.694px"
+          height="25.697px"
+          viewBox="0 0 28.447 28.035"
+        >
+          <g>
+            <g>
+              <path
+                fill="#00CCCC"
+                d="M22.747,10.166l1.074-1.078c1.327-1.253,1.387-3.343,0.135-4.669c-1.253-1.323-3.343-1.384-4.669-0.132    c-0.045,0.043-0.089,0.087-0.131,0.132l-1.08,1.075L22.747,10.166z"
+              />
+              <path
+                fill="#00CCCC"
+                d="M16.804,6.769L5.098,18.475c-0.119,0.112-0.205,0.259-0.244,0.419L3.62,23.518    c-0.126,0.481,0.16,0.975,0.64,1.103c0.076,0.021,0.151,0.029,0.23,0.029c0.081,0,0.159-0.009,0.232-0.029l4.633-1.224    c0.148-0.042,0.29-0.122,0.401-0.235l11.704-11.706L16.804,6.769z"
+              />
+            </g>
+          </g>
+        </svg>
+      </Icon>
+    </>
+  );
+};
+LapizActContactoPerfilButton.defaultProps = { theme: {} };
+export default withTheme(LapizActContactoPerfilButton);

package/src/iconos/styled-icon.jsx

@@ -0,0 +1,25 @@
+import { styled } from 'styled-components';
+
+// eslint-disable-next-line react/react-in-jsx-scope
+const IconDiv = (props) => <div {...props} />;
+
+export const Icon = styled(IconDiv)`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  svg {
+    margin: 0.1rem;
+    margin-right: 0.1rem;
+    margin-top: 0.1rem;
+    justify-content: center;
+    color: red;
+    width: ${(props) => props.width || '3rem'};
+    height: ${(props) => props.height || props.width || '3rem'};
+    cursor: pointer;
+  }
+  label {
+    display: ${(props) => props.display || 'none'};
+  }
+`;
+export default Icon;

package/src/iconos/user/styled-icon.jsx

@@ -0,0 +1,22 @@
+import { styled } from 'styled-components';
+
+// eslint-disable-next-line react/react-in-jsx-scope
+const IconDiv = (props) => <div {...props} />;
+
+export const Icon = styled(IconDiv)`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  svg {
+    margin-top: '0.1rem';
+    justify-content: center;
+    color: red;
+    width: ${(props) => props.width};
+    height: ${(props) => props.height};
+  }
+  label {
+    display: ${(props) => props.display || 'none'};
+  }
+`;
+export default Icon;

package/src/iconos/user/styled-timer-reenv-cod.jsx

@@ -0,0 +1,16 @@
+import { styled } from 'styled-components';
+import { Label } from 'reactstrap';
+
+export const LabelTimer = styled(Label)`
+  color: ${({ color }) => color};
+  font-family: ${({ fontFamily }) => fontFamily};
+  font-style: ${({ fontStyle }) => fontStyle};
+  font-weight: ${({ fontWeight }) => fontWeight};
+  font-size: ${({ fontSize }) => fontSize};
+  padding-left: ${({ paddingLeft }) => paddingLeft};
+  padding-right: ${({ paddingRight }) => paddingRight};
+  width: ${({ width }) => width};
+  text-align: ${({ textAlign }) => textAlign};
+  cursor: ${({ cursor }) => cursor};
+`;
+export default LabelTimer;

package/src/iconos/verificar-sin-verificar-icon.jsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const VerificarSinVerificarIcon = (props) => {
+  const { sublabel = '', size = '', onVerificar } = props || {};
+  const handleVerificar = () => {
+    onVerificar(true);
+  };
+
+  return (
+    <Icon
+      width={size}
+      display={sublabel !== '' ? 'block' : 'none'}
+      onClick={() => handleVerificar()}
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        version="1.1"
+        id="Capa_1"
+        x="0px"
+        y="0px"
+        width="21.694px"
+        height="21.697px"
+        viewBox="0 0 28.694 28.697"
+      >
+        <path
+          fill="#00CCCC"
+          d="M22.382,0H6.313C2.84,0,0,2.84,0,6.314v16.066c0,3.477,2.84,6.316,6.313,6.316h16.069  c3.473,0,6.313-2.84,6.313-6.316V6.314C28.694,2.84,25.854,0,22.382,0z M21.476,10.543l-8.095,9.271l0,0  c-0.695,0.785-1.873,0.877-2.657,0.182c-0.063-0.061-0.122-0.121-0.183-0.182l-3.172-3.686c-0.634-0.725-0.542-1.842,0.183-2.445  c0.693-0.604,1.721-0.543,2.355,0.061l2.054,1.963l7.46-7.158c0.575-0.545,1.48-0.514,2.024,0.029  C21.958,9.152,21.958,9.998,21.476,10.543z"
+        />
+      </svg>
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+VerificarSinVerificarIcon.defaultProps = { theme: {} };
+export default withTheme(VerificarSinVerificarIcon);

package/src/iconos/verificar-verificado-icon.jsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const VerificarVerificadoIcon = (props) => {
+  const { sublabel = '', size = '' } = props || {};
+  return (
+    <Icon width={size} display={sublabel !== '' ? 'block' : 'none'}>
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        version="1.1"
+        id="Capa_1"
+        x="0px"
+        y="0px"
+        width="21.694px"
+        height="21.697px"
+        viewBox="0 0 28.694 28.697"
+      >
+        <path
+          fill="#CCCCCC"
+          d="M22.382,0H6.313C2.84,0,0,2.84,0,6.314v16.068c0,3.475,2.84,6.314,6.313,6.314h16.069  c3.473,0,6.313-2.84,6.313-6.314V6.314C28.694,2.84,25.854,0,22.382,0z M21.476,10.543l-8.095,9.273l0,0  c-0.695,0.785-1.873,0.875-2.657,0.18c-0.063-0.061-0.122-0.119-0.183-0.18l-3.172-3.688c-0.634-0.725-0.542-1.84,0.183-2.445  c0.693-0.604,1.721-0.543,2.355,0.061l2.054,1.963l7.46-7.158c0.575-0.543,1.48-0.514,2.024,0.031  C21.958,9.152,21.958,10,21.476,10.543z"
+        />
+      </svg>
+      <label>{sublabel}</label>
+    </Icon>
+  );
+};
+VerificarVerificadoIcon.defaultProps = { theme: {} };
+export default withTheme(VerificarVerificadoIcon);

package/src/iconos/whatsapp-icon-button.jsx

@@ -0,0 +1,40 @@
+import React from 'react';
+import { withTheme } from 'styled-components';
+import { Icon } from './styled-icon';
+
+const WhatsappIconButton = (props) => {
+  const { phone = '', width = '', height = '', sublabel = '' } = props || {};
+  return (
+    <Icon
+      width={width}
+      height={height}
+      display={sublabel !== '' ? 'block' : 'none'}
+      onClick={() =>
+        window.open(
+          `https://api.whatsapp.com/send/?phone=${phone}&text=&app_absent=0`,
+          '_blank'
+        )
+      }
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        version="1.1"
+        viewBox="0 0 23.687 23.688"
+      >
+        <path
+          fill="#99CC33"
+          d="M12.906,3.301c-5.344,0-9.687,4.348-9.687,9.69c0,1.778,0.482,3.509,1.406,5.022l-1.387,4.159
+	C3.19,22.311,3.227,22.46,3.33,22.566c0.076,0.073,0.175,0.112,0.275,0.112c0.045,0,0.082-0.003,0.126-0.019l4.154-1.385
+	c1.516,0.918,3.246,1.403,5.021,1.403c5.343,0,9.688-4.346,9.688-9.688S18.249,3.301,12.906,3.301z M19.107,16.912
+	c0,0.338-0.14,0.671-0.379,0.91l-1.009,0.996c-0.24,0.241-0.565,0.373-0.899,0.373h-0.05c-5.414-0.233-9.833-4.65-10.065-10.061
+	C6.691,8.778,6.828,8.428,7.078,8.176l0.995-1.008c0.241-0.238,0.574-0.38,0.915-0.38h0.373c0.531,0,1.015,0.333,1.201,0.834
+	l0.883,2.345c0.171,0.457,0.066,0.98-0.271,1.337l-0.364,0.383c-0.168,0.176-0.185,0.444-0.05,0.641
+	c0.448,0.65,1.411,1.88,2.814,2.824c0.192,0.129,0.457,0.105,0.628-0.058l0.395-0.372c0.353-0.336,0.876-0.44,1.333-0.271
+	l2.345,0.884c0.498,0.188,0.833,0.669,0.833,1.201V16.912z"
+        />
+      </svg>
+    </Icon>
+  );
+};
+WhatsappIconButton.defaultProps = { theme: {} };
+export default withTheme(WhatsappIconButton);

package/src/index.js

@@ -0,0 +1,4 @@
+export * from "./CustomBootstrap";
+export * from "./CustomSelectInput"; 
+export * from "./IntlMessages";
+export * from "./iconos";