import * as classNames from "classnames";
import * as _ from "lodash";
import * as React from "react";

import { IStringMap } from "../../utilities/collections";

const icons: IStringMap<string> = {
  "tap-and-hold": "M6.4037037,12.1564374 C9.55377228,12.1564374 12.1074074,9.60280225 12.1074074,6.45273368 C12.1074074,3.3026651 9.55377228,0.749029972 6.4037037,0.749029972 C3.25363513,0.749029972 0.7,3.3026651 0.7,6.45273368 C0.7,9.60280225 3.25363513,12.1564374 6.4037037,12.1564374 Z M6.4037037,12.8564374 C2.86703581,12.8564374 1.0658141e-14,9.98940157 1.0658141e-14,6.45273368 C1.0658141e-14,2.91606578 2.86703581,0.0490299724 6.4037037,0.0490299724 C9.9403716,0.0490299724 12.8074074,2.91606578 12.8074074,6.45273368 C12.8074074,9.98940157 9.9403716,12.8564374 6.4037037,12.8564374 Z M6.36284213,9.6960052 C8.08106135,9.6960052 9.47395324,8.30311331 9.47395324,6.58489409 C9.47395324,4.86667487 8.08106135,3.47378298 6.36284213,3.47378298 C4.64462291,3.47378298 3.25173102,4.86667487 3.25173102,6.58489409 C3.25173102,8.30311331 4.64462291,9.6960052 6.36284213,9.6960052 Z M6.36284213,10.4960052 C4.20279511,10.4960052 2.45173102,8.74494111 2.45173102,6.58489409 C2.45173102,4.42484707 4.20279511,2.67378298 6.36284213,2.67378298 C8.52288915,2.67378298 10.2739532,4.42484707 10.2739532,6.58489409 C10.2739532,8.74494111 8.52288915,10.4960052 6.36284213,10.4960052 Z M3.99086306,17.641501 L5.68837344,17.2631495 L4.93572755,20.2818473 L3.42637864,19.9055243 L3.99086306,17.641501 Z M4.89040719,15.8354278 L4.89040719,7.1909748 C4.89040719,6.3962984 5.5346197,5.75208589 6.3292961,5.75208589 C7.1239725,5.75208589 7.76818501,6.3962984 7.76818501,7.1909748 L7.76818501,14.3744193 L7.81204385,13.7472086 C7.86897589,12.9330426 8.57514038,12.3191831 9.38930639,12.3761152 C10.2034724,12.4330472 10.8173318,13.1392117 10.7603998,13.9533777 L10.7165601,14.5803143 C10.9464803,13.9480019 11.5890311,13.534398 12.2853297,13.6198927 C13.0954003,13.7193569 13.6714606,14.4566805 13.5719965,15.2667512 L13.4563691,16.2084607 C13.5637047,15.38282 14.3174412,14.7972159 15.1451863,14.8988502 C15.9765746,15.0009318 16.5677945,15.7576587 16.4657128,16.589047 L16.4175887,16.9809866 C16.4345801,17.0809935 16.4417366,17.1842083 16.4380577,17.289558 L16.2181909,23.5857202 C16.2115874,23.7748199 16.1706379,23.9546225 16.1015472,24.119342 C16.0578214,25.0037674 15.4231769,25.7327404 14.5842196,25.9196549 C14.430972,25.9717459 14.266708,26 14.0958449,26 L5.85140058,26 C5.6854062,26 5.5256402,25.9733331 5.37615291,25.9240496 C4.94964992,25.8331612 4.56941675,25.550227 4.37092195,25.1245535 L0.327873928,16.4542091 C-0.00797083043,15.7339877 0.303628011,14.8778769 1.02384942,14.5420321 C1.74407083,14.2061874 2.60018161,14.5177862 2.93602637,15.2380076 L3.45061507,16.3415466 L3.47292556,16.3305877 L3.95281495,17.3075553 C3.97144364,17.3218983 3.99011916,17.3358778 4.00880798,17.3494561 C4.26224955,17.5335922 4.51621848,17.5280931 4.80147697,17.3237498 L4.87950655,15.8348565 L4.89040719,15.8354278 Z M4.23526508,18.024234 L4.89040719,19.4291908 L4.89040719,17.5049194 C4.62487059,17.685064 4.36509813,17.7296808 4.11297333,17.6336086 L4.29132382,17.9966978 L4.23526508,18.024234 Z",
  star: "M11,16.7L4.53436222 20.099187 5.76918916 12.8995935 0.538378321 7.80081311 7.76718111 6.75040658 11 0.200000048 14.2328189 6.75040658 21.4616217 7.80081311 16.2308108 12.8995935 17.4656378 20.099187z",
  camera: "M18,4 C18,4.07642781 17,4.07834926 15,4.00576435 C14.4685696,4.00576435 13.9589897,3.79425975 13.5837528,3.41794138 L12.1698865,2 L7.83011354,2 L6.41624717,3.41794138 C6.0410103,3.79425975 5.53143035,4.00576435 5,4.00576435 L2,4.00576435 C2.07232452,4.00576435 2.07232452,8.0038429 2,16 L18,16 L18,4 Z M20,16.2222222 C20,17.2040618 19.1859723,18 18.1818182,18 L1.81818182,18 C0.814027728,18 2.08166817e-16,17.2040618 0,16.2222222 L0,4 C-6.9388939e-17,3.01816044 0.995845909,2.00576435 2,2.00576435 L5,2.00576435 L7,0 L13,0 L15,2.00576435 L18,2.00576435 C19.0041541,2.00576435 20,3.01816044 20,4 L20,16.2222222 Z M10,15 C7.23857625,15 5,12.7614237 5,10 C5,7.23857625 7.23857625,5 10,5 C12.7614237,5 15,7.23857625 15,10 C15,12.7614237 12.7614237,15 10,15 Z M10,13 C11.6568542,13 13,11.6568542 13,10 C13,8.34314575 11.6568542,7 10,7 C8.34314575,7 7,8.34314575 7,10 C7,11.6568542 8.34314575,13 10,13 Z",
  door: "M18.5857864,9 L15.2928932,5.70710678 C14.9023689,5.31658249 14.9023689,4.68341751 15.2928932,4.29289322 C15.6834175,3.90236893 16.3165825,3.90236893 16.7071068,4.29289322 L21.7071068,9.29289322 C22.0976311,9.68341751 22.0976311,10.3165825 21.7071068,10.7071068 L16.7071068,15.7071068 C16.3165825,16.0976311 15.6834175,16.0976311 15.2928932,15.7071068 C14.9023689,15.3165825 14.9023689,14.6834175 15.2928932,14.2928932 L18.5857864,11 L9,11 C8.44771525,11 8,10.5522847 8,10 C8,9.44771525 8.44771525,9 9,9 L18.5857864,9 Z M7,20 L3,20 C1.34314575,20 0,18.6568542 0,17 L0,3 C0,1.34314575 1.34314575,0 3,0 L7,0 L10,0 C11.6568542,0 13,1.34314575 13,3 L13,5 C13,5.55228475 12.5522847,6 12,6 C11.4477153,6 11,5.55228475 11,5 L11,3 C11,2.44771525 10.5522847,2 10,2 L7,2 L3,2 C2.44771525,2 2,2.44771525 2,3 L2,17 C2,17.5522847 2.44771525,18 3,18 L7,18 L10,18 C10.5522847,18 11,17.5522847 11,17 L11,15 C11,14.4477153 11.4477153,14 12,14 C12.5522847,14 13,14.4477153 13,15 L13,17 C13,18.6568542 11.6568542,20 10,20 L7,20 Z",
  search: "M19.804053,18.0544242 C20.0453157,18.2960668 20.0453157,18.6877861 19.804053,18.9290487 L18.9290487,19.804053 C18.6877861,20.0453157 18.2962568,20.0453157 18.0549942,19.804053 L13.1983969,14.9476458 C13.1322872,14.8807762 13.088214,14.8021283 13.0581987,14.7185413 C11.8021133,15.6360991 10.2589825,16.1841641 8.58534195,16.1841641 C4.38737263,16.1841641 0.985,12.7817915 0.985,8.58458206 C0.985,4.3875626 4.38737263,0.985 8.58534195,0.985 C12.7823614,0.985 16.1841641,4.3875626 16.1841641,8.58458206 C16.1841641,10.2587926 15.6360991,11.8019234 14.7193012,13.0581987 C14.8023183,13.0876441 14.881536,13.1319072 14.9476458,13.1983969 L19.804053,18.0544242 Z M8.58534195,3.51825735 C5.78669574,3.51825735 3.51901723,5.78650577 3.51901723,8.58458206 C3.51901723,11.3826584 5.78669574,13.6512867 8.58534195,13.6512867 C11.3832283,13.6512867 13.6518566,11.3826584 13.6518566,8.58458206 C13.6518566,5.78650577 11.3832283,3.51825735 8.58534195,3.51825735 Z",
  share: "M8,3.41421356 L5.70710678,5.70710678 C5.31658249,6.09763107 4.68341751,6.09763107 4.29289322,5.70710678 C3.90236893,5.31658249 3.90236893,4.68341751 4.29289322,4.29289322 L8.29289322,0.292893219 C8.68341751,-0.0976310729 9.31658249,-0.0976310729 9.70710678,0.292893219 L13.7071068,4.29289322 C14.0976311,4.68341751 14.0976311,5.31658249 13.7071068,5.70710678 C13.3165825,6.09763107 12.6834175,6.09763107 12.2928932,5.70710678 L10,3.41421356 L10,14 C10,14.5522847 9.55228475,15 9,15 C8.44771525,15 8,14.5522847 8,14 L8,3.41421356 Z M0,11 C0,10.4477153 0.44771525,10 1,10 C1.55228475,10 2,10.4477153 2,11 L2,19 C2,19.5522847 2.44771525,20 3,20 L15,20 C15.5522847,20 16,19.5522847 16,19 L16,11 C16,10.4477153 16.4477153,10 17,10 C17.5522847,10 18,10.4477153 18,11 L18,19 C18,20.6568542 16.6568542,22 15,22 L3,22 C1.34314575,22 0,20.6568542 0,19 L0,11 Z",
  eye: "M2.57441438,9.70747457 C3.149187,10.5974451 3.82824869,11.4880178 4.6045372,12.3160589 C6.77619226,14.6324909 9.25480244,16 12,16 C14.7451976,16 17.2238077,14.6324909 19.3954628,12.3160589 C20.1717513,11.4880178 20.850813,10.5974451 21.4255856,9.70747457 C21.5887228,9.45487513 21.7334114,9.21763031 21.8592878,9 C21.7334114,8.78236969 21.5887228,8.54512487 21.4255856,8.29252543 C20.850813,7.40255491 20.1717513,6.51198221 19.3954628,5.68394113 C17.2238077,3.36750906 14.7451976,2 12,2 C9.25480244,2 6.77619226,3.36750906 4.6045372,5.68394113 C3.82824869,6.51198221 3.149187,7.40255491 2.57441438,8.29252543 C2.41127724,8.54512487 2.26658862,8.78236969 2.14071218,9 C2.26658862,9.21763031 2.41127724,9.45487513 2.57441438,9.70747457 Z M0.105572809,8.5527864 C0.246140906,8.27165021 0.50996726,7.80262558 0.894335622,7.20747457 C1.5305005,6.22244509 2.28112631,5.23801779 3.1454628,4.31605887 C5.66130774,1.63249094 8.62019756,0 12,0 C15.3798024,0 18.3386923,1.63249094 20.8545372,4.31605887 C21.7188737,5.23801779 22.4694995,6.22244509 23.1056644,7.20747457 C23.4900327,7.80262558 23.7538591,8.27165021 23.8944272,8.5527864 C24.0351909,8.8343139 24.0351909,9.1656861 23.8944272,9.4472136 C23.7538591,9.72834979 23.4900327,10.1973744 23.1056644,10.7925254 C22.4694995,11.7775549 21.7188737,12.7619822 20.8545372,13.6839411 C18.3386923,16.3675091 15.3798024,18 12,18 C8.62019756,18 5.66130774,16.3675091 3.1454628,13.6839411 C2.28112631,12.7619822 1.5305005,11.7775549 0.894335622,10.7925254 C0.50996726,10.1973744 0.246140906,9.72834979 0.105572809,9.4472136 C-0.0351909363,9.1656861 -0.0351909363,8.8343139 0.105572809,8.5527864 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z M12,11 C13.1045695,11 14,10.1045695 14,9 C14,7.8954305 13.1045695,7 12,7 C10.8954305,7 10,7.8954305 10,9 C10,10.1045695 10.8954305,11 12,11 Z",
  image: "M3.04412316,19.9998288 C3.01469051,20.0003647 2.98523917,19.9996424 2.95585693,19.9976619 C1.31263585,19.9340833 1.38940389e-16,18.5818714 0,16.9230771 L0,3.07692291 C-1.42336286e-16,1.37758531 1.37758531,2.84672572e-16 3.07692291,0 L16.9230771,0 C18.6224147,-2.84672572e-16 20,1.37758531 20,3.07692291 L20,16.9230771 C20,18.6224147 18.6224147,20 16.9230771,20 L3.07692291,20 C3.06597622,20 3.05504287,19.9999428 3.04412316,19.9998288 Z M18,10.5804358 L18,3.032258 C18,2.46215765 17.5378424,2 16.967742,2 L3.032258,2 C2.46215765,2 2,2.46215765 2,3.032258 L2,16.967742 C2,17.396177 2.26101013,17.7636498 2.63269275,17.9198227 L13.2654982,7.29994315 C13.6659091,6.90001895 14.3151036,6.90001895 14.7155145,7.29994315 L18,10.5804358 Z M18,13.4769431 L13.9905063,9.47232361 L5.45245063,18 L16.967742,18 C17.5378424,18 18,17.5378424 18,16.967742 L18,13.4769431 Z M7,10 C5.34314575,10 4,8.65685425 4,7 C4,5.34314575 5.34314575,4 7,4 C8.65685425,4 10,5.34314575 10,7 C10,8.65685425 8.65685425,10 7,10 Z M7,8 C7.55228475,8 8,7.55228475 8,7 C8,6.44771525 7.55228475,6 7,6 C6.44771525,6 6,6.44771525 6,7 C6,7.55228475 6.44771525,8 7,8 Z",
  permalink: "M14.4545455,8.5 C13.9022607,8.5 13.4545455,8.05228475 13.4545455,7.5 C13.4545455,6.94771525 13.9022607,6.5 14.4545455,6.5 L16.9090909,6.5 C18.2592839,6.5 19.5541766,7.0363621 20.5089072,7.99109275 C21.4636379,8.9458234 22,10.2407161 22,11.5909091 C22,14.4025405 19.7207224,16.6818182 16.9090909,16.6818182 L14.4545455,16.6818182 C13.9022607,16.6818182 13.4545455,16.2341029 13.4545455,15.6818182 C13.4545455,15.1295334 13.9022607,14.6818182 14.4545455,14.6818182 L16.9090909,14.6818182 C18.6161529,14.6818182 20,13.297971 20,11.5909091 C20,10.771149 19.6743516,9.98496421 19.0946937,9.40530631 C18.5150358,8.82564842 17.728851,8.5 16.9090909,8.5 L14.4545455,8.5 Z M9.54545455,14.6818182 C10.0977393,14.6818182 10.5454545,15.1295334 10.5454545,15.6818182 C10.5454545,16.2341029 10.0977393,16.6818182 9.54545455,16.6818182 L7.09090909,16.6818182 C5.74071605,16.6818182 4.4458234,16.1454561 3.49109275,15.1907254 C2.5363621,14.2359948 2,12.9411021 2,11.5909091 C2,8.77927764 4.27927764,6.5 7.09090909,6.5 L9.54545455,6.5 C10.0977393,6.5 10.5454545,6.94771525 10.5454545,7.5 C10.5454545,8.05228475 10.0977393,8.5 9.54545455,8.5 L7.09090909,8.5 C5.38384714,8.5 4,9.88384714 4,11.5909091 C4,12.4106692 4.32564842,13.196854 4.90530631,13.7765119 C5.48496421,14.3561698 6.27114903,14.6818182 7.09090909,14.6818182 L9.54545455,14.6818182 Z M8.72727273,12.5909091 C8.17498798,12.5909091 7.72727273,12.1431938 7.72727273,11.5909091 C7.72727273,11.0386243 8.17498798,10.5909091 8.72727273,10.5909091 L15.2727273,10.5909091 C15.825012,10.5909091 16.2727273,11.0386243 16.2727273,11.5909091 C16.2727273,12.1431938 15.825012,12.5909091 15.2727273,12.5909091 L8.72727273,12.5909091 Z",
  x: "M8.41421356,7 L13.7071068,12.2928932 C14.0976311,12.6834175 14.0976311,13.3165825 13.7071068,13.7071068 C13.3165825,14.0976311 12.6834175,14.0976311 12.2928932,13.7071068 L7,8.41421356 L1.70710678,13.7071068 C1.31658249,14.0976311 0.683417511,14.0976311 0.292893219,13.7071068 C-0.0976310729,13.3165825 -0.0976310729,12.6834175 0.292893219,12.2928932 L5.58578644,7 L0.292893219,1.70710678 C-0.0976310729,1.31658249 -0.0976310729,0.683417511 0.292893219,0.292893219 C0.683417511,-0.0976310729 1.31658249,-0.0976310729 1.70710678,0.292893219 L7,5.58578644 L12.2928932,0.292893219 C12.6834175,-0.0976310729 13.3165825,-0.0976310729 13.7071068,0.292893219 C14.0976311,0.683417511 14.0976311,1.31658249 13.7071068,1.70710678 L8.41421356,7 Z",
  // Using `--` here to conform to BEM-like syntax given that these keys build out to classNames
  "arrow--left": "M0.292893219,1.70710678 C-0.0976310729,1.31658249 -0.0976310729,0.683417511 0.292893219,0.292893219 C0.683417511,-0.0976310729 1.31658249,-0.0976310729 1.70710678,0.292893219 L7.70710678,6.29289322 C8.09763107,6.68341751 8.09763107,7.31658249 7.70710678,7.70710678 L1.70710678,13.7071068 C1.31658249,14.0976311 0.683417511,14.0976311 0.292893219,13.7071068 C-0.0976310729,13.3165825 -0.0976310729,12.6834175 0.292893219,12.2928932 L5.58578644,7 L0.292893219,1.70710678 Z",
  "arrow--right": "M0.292893219,1.70710678 C-0.0976310729,1.31658249 -0.0976310729,0.683417511 0.292893219,0.292893219 C0.683417511,-0.0976310729 1.31658249,-0.0976310729 1.70710678,0.292893219 L7.70710678,6.29289322 C8.09763107,6.68341751 8.09763107,7.31658249 7.70710678,7.70710678 L1.70710678,13.7071068 C1.31658249,14.0976311 0.683417511,14.0976311 0.292893219,13.7071068 C-0.0976310729,13.3165825 -0.0976310729,12.6834175 0.292893219,12.2928932 L5.58578644,7 L0.292893219,1.70710678 Z",
  send: "M4.29289322,14.2928932 C4.4804296,14.1053568 4.73478351,14 5,14 L17,14 C17.5522847,14 18,13.5522847 18,13 L18,3 C18,2.44771525 17.5522847,2 17,2 L3,2 C2.44771525,2 2,2.44771525 2,3 L2,16.5857864 L4.29289322,14.2928932 Z M5.41421356,16 L1.70710678,19.7071068 C1.07714192,20.3370716 0,19.8909049 0,19 L0,3 C0,1.34314575 1.34314575,0 3,0 L17,0 C18.6568542,0 20,1.34314575 20,3 L20,13 C20,14.6568542 18.6568542,16 17,16 L5.41421356,16 Z",
  download: "M11,10.5857864 L14.2928932,7.29289322 C14.6834175,6.90236893 15.3165825,6.90236893 15.7071068,7.29289322 C16.0976311,7.68341751 16.0976311,8.31658249 15.7071068,8.70710678 L10.7071068,13.7071068 C10.3165825,14.0976311 9.68341751,14.0976311 9.29289322,13.7071068 L4.29289322,8.70710678 C3.90236893,8.31658249 3.90236893,7.68341751 4.29289322,7.29289322 C4.68341751,6.90236893 5.31658249,6.90236893 5.70710678,7.29289322 L9,10.5857864 L9,1 C9,0.44771525 9.44771525,0 10,0 C10.5522847,0 11,0.44771525 11,1 L11,10.5857864 Z M18,13 C18,12.4477153 18.4477153,12 19,12 C19.5522847,12 20,12.4477153 20,13 L20,17 C20,18.6568542 18.6568542,20 17,20 L3,20 C1.34314575,20 0,18.6568542 0,17 L0,13 C0,12.4477153 0.44771525,12 1,12 C1.55228475,12 2,12.4477153 2,13 L2,17 C2,17.5522847 2.44771525,18 3,18 L17,18 C17.5522847,18 18,17.5522847 18,17 L18,13 Z",
  check: "M6,10.5857864 L16.2928932,0.292893219 C16.6834175,-0.0976310729 17.3165825,-0.0976310729 17.7071068,0.292893219 C18.0976311,0.683417511 18.0976311,1.31658249 17.7071068,1.70710678 L6.70710678,12.7071068 C6.31658249,13.0976311 5.68341751,13.0976311 5.29289322,12.7071068 L0.292893219,7.70710678 C-0.0976310729,7.31658249 -0.0976310729,6.68341751 0.292893219,6.29289322 C0.683417511,5.90236893 1.31658249,5.90236893 1.70710678,6.29289322",
  lock: "M2,10 L2,17 L16,17 L16,10 L2,10 Z M3.5,8 L3.5,5.66666667 C3.5,2.59841806 5.56721869,3.82176786e-16 9,0 C12.4327813,0 14.5,2.59841806 14.5,5.66666667 L14.5,8 L16,8 C17.1045695,8 18,8.8954305 18,10 L18,17 C18,18.1045695 17.1045695,19 16,19 L2,19 C0.8954305,19 1.3527075e-16,18.1045695 0,17 L0,10 C-1.3527075e-16,8.8954305 0.8954305,8 2,8 L3.5,8 Z M5.5,8 L12.5,8 L12.5,5.66666667 C12.5,3.49525104 11.1310011,2 9,2 C6.86899887,2 5.5,3.49525104 5.5,5.66666667 L5.5,8 Z",
  "lock--filled": "M2,4 L5,4 L5,2.5 C5,1.67157288 4.32842712,1 3.5,1 C2.67157288,1 2,1.67157288 2,2.5 L2,4 Z M6,4 L6.5,4 C6.77614237,4 7,4.22385763 7,4.5 L7,7.5 C7,7.77614237 6.77614237,8 6.5,8 L0.5,8 C0.223857625,8 3.38176876e-17,7.77614237 0,7.5 L0,4.5 C-3.38176876e-17,4.22385763 0.223857625,4 0.5,4 L1,4 L1,2.5 C1,1.11928813 2.11928813,2.53632657e-16 3.5,0 C4.88071187,-2.53632657e-16 6,1.11928813 6,2.5 L6,4 Z",
  "photos--add": "M16.5,3.66666667 L16.5,-1.50046023e-13 L18.3333333,-1.50158283e-13 L18.3333333,3.66666667 L22,3.66666667 L22,5.5 L18.3333333,5.5 L18.3333333,9.16666667 L16.5,9.16666667 L16.5,5.5 L12.8333333,5.5 L12.8333333,3.66666667 L16.5,3.66666667 Z M18.3333333,11 L18.3333333,19.4361148 C18.3333333,20.3276335 18.2405077,20.6509198 18.0662006,20.9768457 C17.8918935,21.3027716 17.636105,21.5585602 17.310179,21.7328673 C16.9842531,21.9071744 16.6609669,22 15.7694481,22 L2.5638852,22 C1.67236646,22 1.34908022,21.9071744 1.0231543,21.7328673 C0.697228371,21.5585602 0.441439796,21.3027716 0.267132704,20.9768457 C0.0928256111,20.6509198 4.01235366e-17,20.3276335 -6.90560205e-17,19.4361148 L6.90560205e-17,6.23055187 C-4.01235366e-17,5.33903313 0.0928256111,5.01574689 0.267132704,4.68982096 C0.441439796,4.36389504 0.697228371,4.10810646 1.0231543,3.93379937 C1.34908022,3.75949228 1.67236646,3.66666667 2.5638852,3.66666667 L11,3.66666667 L11,7.33333333 L14.6666667,7.33333333 L14.6666667,11 L18.3333333,11 Z M2.75,19.25 L15.5833333,19.2488526 L11.9166667,12.8333333 L8.25,17.4166667 L5.5,14.6666667 L2.75,19.25 Z",
  "photos--add-empty": "M11,6 L2,6 L2,20 L16,20 L16,11 L18,11 L18,19.4361148 C18,20.3276335 17.9071744,20.6509198 17.7328673,20.9768457 C17.5585602,21.3027716 17.3027716,21.5585602 16.9768457,21.7328673 C16.6509198,21.9071744 16.3276335,22 15.4361148,22 L2.5638852,22 C1.67236646,22 1.34908022,21.9071744 1.0231543,21.7328673 C0.697228371,21.5585602 0.441439796,21.3027716 0.267132704,20.9768457 C0.0928256111,20.6509198 4.01235366e-17,20.3276335 -6.90560205e-17,19.4361148 L6.90560205e-17,6.5638852 C-4.01235366e-17,5.67236646 0.0928256111,5.34908022 0.267132704,5.0231543 C0.441439796,4.69722837 0.697228371,4.4414398 1.0231543,4.2671327 C1.34908022,4.09282561 1.67236646,4 2.5638852,4 L11,4 L11,6 Z M16.5,3.66666667 L16.5,-1.50046023e-13 L18.3333333,-1.50158283e-13 L18.3333333,3.66666667 L22,3.66666667 L22,5.5 L18.3333333,5.5 L18.3333333,9.16666667 L16.5,9.16666667 L16.5,5.5 L12.8333333,5.5 L12.8333333,3.66666667 L16.5,3.66666667 Z M4,18 L6,14 L8.25,16 L12,12 L14,18 L4,18 Z",
  globe: "M17.9381062,11 L13.9802499,11 C13.8764055,13.6147788 13.369682,15.9332625 12.617462,17.5619946 C15.4473215,16.5826382 17.55658,14.0595963 17.9381062,11 Z M17.9381062,9 C17.55658,5.94040375 15.4473215,3.41736175 12.617462,2.4380054 C13.369682,4.06673745 13.8764055,6.38522123 13.9802499,9 L17.9381062,9 C17.9789567,9.32759424 18,9.66133965 18,10 Z M14,10 C14,9.6625006 13.9933122,9.32890624 13.9802499,9 Z M2.06189375,9 L6.0197501,9 C6.12359452,6.38522123 6.63031803,4.06673745 7.38253796,2.4380054 C4.55267854,3.41736175 2.44342001,5.94040375 2.06189375,9 Z M2.06189375,11 C2.44342001,14.0595963 4.55267854,16.5826382 7.38253796,17.5619946 C6.63031803,15.9332625 6.12359452,13.6147788 6.0197501,11 L2.06189375,11 C2.02104333,10.6724058 2,10.3386603 2,10 Z M6.0197501,11 C6.00668778,10.6710938 6,10.3374994 6,10 Z M11.9784594,11 L8.02154062,11 C8.11074989,13.0600576 8.47281618,14.9390113 9.02852626,16.3282865 C9.30628524,17.0226839 9.6127382,17.5402728 9.89613021,17.8399346 C10.033613,17.9853103 10.0623276,18 10,18 C9.93767239,18 9.96638702,17.9853103 10.1038698,17.8399346 C10.3872618,17.5402728 10.6937148,17.0226839 10.9714737,16.3282865 C11.5271838,14.9390113 11.8892501,13.0600576 11.9784594,11 Z M11.9784594,9 C11.8892501,6.93994236 11.5271838,5.06098872 10.9714737,3.67171354 C10.6937148,2.97731607 10.3872618,2.45972721 10.1038698,2.16006542 C9.96638702,2.01468966 9.93767239,2 10,2 C10.0623276,2 10.033613,2.01468966 9.89613021,2.16006542 C9.6127382,2.45972721 9.30628524,2.97731607 9.02852626,3.67171354 C8.47281618,5.06098872 8.11074989,6.93994236 8.02154062,9 L11.9784594,9 C11.9927121,9.32913001 12,9.66288282 12,10 Z M8.02154062,11 C8.00728789,10.67087 8,10.3371172 8,10 Z M10,20 C4.4771525,20 0,15.5228475 0,10 C0,4.4771525 4.4771525,0 10,0 C15.5228475,0 20,4.4771525 20,10 C20,15.5228475 15.5228475,20 10,20 Z",
  external: "M16.5857864,2 L13,2 C12.4477153,2 12,1.55228475 12,1 C12,0.44771525 12.4477153,0 13,0 L19,0 C19.5522847,0 20,0.44771525 20,1 L20,7 C20,7.55228475 19.5522847,8 19,8 C18.4477153,8 18,7.55228475 18,7 L18,3.41421356 L8.70710678,12.7071068 C8.31658249,13.0976311 7.68341751,13.0976311 7.29289322,12.7071068 C6.90236893,12.3165825 6.90236893,11.6834175 7.29289322,11.2928932 L16.5857864,2 Z M15,11 C15,10.4477153 15.4477153,10 16,10 C16.5522847,10 17,10.4477153 17,11 L17,17 C17,18.6568542 15.6568542,20 14,20 L3,20 C1.34314575,20 0,18.6568542 0,17 L0,6 C0,4.34314575 1.34314575,3 3,3 L9,3 C9.55228475,3 10,3.44771525 10,4 C10,4.55228475 9.55228475,5 9,5 L3,5 C2.44771525,5 2,5.44771525 2,6 L2,17 C2,17.5522847 2.44771525,18 3,18 L14,18 C14.5522847,18 15,17.5522847 15,17 L15,11 Z",
  pencil: "M13,2.82842712 L2,13.8284271 L2,16 L4.17157288,16 L15.1715729,5 L13,2.82842712 Z M13,0 L18,5 L5,18 L0,18 L0,13 L13,0 Z",
  delete: "M13.28571,20 L4.714286,20 C3.210559,20 2,18.764221 2,17.25 L2,6 L1,6 C0.447715,6 0,5.55228 0,5 C0,4.44772 0.447715,4 1,4 L4,4 L4,3 C4,1.34315 5.343146,0 7,0 L11,0 C12.65685,0 14,1.34315 14,3 L14,4 L17,4 C17.55228,4 18,4.44772 18,5 C18,5.55228 17.55228,6 17,6 L16,6 L16,17.25 C16,18.764221 14.78944,20 13.28571,20 Z M12,4 L12,3 C12,2.44772 11.55228,2 11,2 L7,2 C6.447715,2 6,2.44772 6,3 L6,4 L12,4 Z M14,6 L4,6 L4,17.25 C4,17.668776 4.324464,18 4.714286,18 L13.28571,18 C13.67554,18 14,17.668776 14,17.25 L14,6 Z",
};

export interface IIconProps {
  icon: string;
  width: number;
  height: number;
  vwidth?: number;
  vheight?: number;
  onClick?: (e: React.SyntheticEvent<SVGElement | HTMLSpanElement>) => void;
  /**
   * This increases the clickable area of the element
   */
  fatClick?: boolean;
  style?: any;
  innerRef?: React.RefObject<SVGSVGElement>;
  className?: string;
}

export class Icon extends React.Component<IIconProps, {}> {
  public shouldComponentUpdate(nextProps: IIconProps) {
    const { onClick, innerRef, ...simpleProps } = this.props;
    const { onClick: nextOnClick, innerRef: nextInnerRef, ...nextSimpleProps } = nextProps;

    return !_.isEqual(simpleProps, nextSimpleProps);
  }

  public render() {
    return (
      <React.Fragment>
        <svg
          width={this.props.width}
          height={this.props.height}
          viewBox={`0 0 ${this.props.vwidth || this.props.width} ${this.props.vheight || this.props.height}`}
          className={classNames("icon", {
            [`icon-${this.props.icon}`]: true,
            "icon--clickable": this.props.onClick || this.props.fatClick,
            [this.props.className]: _.isString(this.props.className),
          })}
          {..._.isFunction(this.props.onClick) && !this.props.fatClick && { onClick: this.props.onClick }}
          {..._.isObject(this.props.style) && { style: this.props.style }}
          {...this.props.innerRef && { ref: this.props.innerRef }}
        >
          <path d={icons[this.props.icon]} />
        </svg>
        {this.props.fatClick && _.isFunction(this.props.onClick) && (
          <span
            className="icon__fat-click"
            onClick={this.props.onClick}
            style={{
              height: this.props.height,
              width: this.props.width,
              marginTop: `-${this.props.height/2}px`,
              marginLeft: `-${this.props.width/2}px`,
              ...this.props.style
            }}
          />
        )}
      </React.Fragment>
    );
  }
}