boxicons/static/dist/1.bundle.js
2018-07-08 07:47:31 +05:30

2 lines
No EOL
45 KiB
JavaScript

webpackJsonp([1],{454:function(n,e,t){"use strict";function a(n){return n&&n.__esModule?n:{default:n}}function i(n,e){if(!(n instanceof e))throw new TypeError("Cannot call a class as a function")}function o(n,e){if(!n)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!e||"object"!=typeof e&&"function"!=typeof e?n:e}function r(n,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function, not "+typeof e);n.prototype=Object.create(e&&e.prototype,{constructor:{value:n,enumerable:!1,writable:!0,configurable:!0}}),e&&(Object.setPrototypeOf?Object.setPrototypeOf(n,e):n.__proto__=e)}function l(n,e){return Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(e)}}))}function s(n){return(0,v.bindActionCreators)({changeSideIcon:y.changeSideIcon,setSelectedIcon:y.setSelectedIcon},n)}Object.defineProperty(e,"__esModule",{value:!0});var c=function(){function n(n,e){for(var t=0;t<e.length;t++){var a=e[t];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(n,a.key,a)}}return function(e,t,a){return t&&n(e.prototype,t),a&&n(e,a),e}}(),d=l(["\n background: #fff;\n color: #999;\n width: 24px;\n align-self: flex-start;\n padding-top: 3px;\n padding-left: 0px;\n pointer-events: auto;\n cursor: pointer;\n height: 21px;\n text-align: center;\n line-height: 18px;\n border-radius: 30px;\n position: absolute;\n right: 10px;\n top: 10px;\n i{\n font-size: 18px;\n }\n &:hover {\n background: #f7f7f7;\n }\n &:active {\n background: #edefed;\n }\n @media screen and (max-width: 568px) {\n top: 27px;\n right: 6px;}\n"],["\n background: #fff;\n color: #999;\n width: 24px;\n align-self: flex-start;\n padding-top: 3px;\n padding-left: 0px;\n pointer-events: auto;\n cursor: pointer;\n height: 21px;\n text-align: center;\n line-height: 18px;\n border-radius: 30px;\n position: absolute;\n right: 10px;\n top: 10px;\n i{\n font-size: 18px;\n }\n &:hover {\n background: #f7f7f7;\n }\n &:active {\n background: #edefed;\n }\n @media screen and (max-width: 568px) {\n top: 27px;\n right: 6px;}\n"]),p=l(["\n \n margin-top: 15px;\n .color-choices {\n display: flex;\n background: #fff;\n padding: 7px; height: 26px;\n border-radius: 44px;\n position: absolute;\n top: 20px;\n z-index: 121212;\n box-shadow: 0 1px 1px 0 rgba(60,64,67,.08), 0 1px 3px 1px rgba(60,64,67,.16);\n div {\n margin: 5px!important;\n }\n }\n .current-color {\n height: 16px;\n width: 16px;\n margin: 0;\n cursor: pointer;\n border-radius: 40px;\n margin-right: 10px;\n padding: 9px;\n border: 1px solid rgba(0,0,0,.1);\n &:active {\n border-color: rgba(0,0,0,.25);\n }\n }\n .color {\n border: 1px solid rgba(0,0,0,.1);\n height: 14px;\n width: 14px;\n border-radius: 40px;\n cursor: pointer;\n opacity: .95;\n position: relative;\n margin: 0!important;\n\n\n &.black {\n background: #484848;\n }\n &.orange {\n background: #FF9800;\n }\n &.yellow {\n background: #ffeb3b;\n }\n &.blue {\n background: #2196f3;\n }\n &.red {\n background: #f44336;\n }\n &.purple {\n background: #9c27b0;\n }\n &.green {\n background: #4caf50;\n }\n i {\n position: absolute;\n color: #fff;\n left: 0;\n font-size: 21px;\n right: 0;\n margin: 0 auto;\n text-align: center;\n top: 0;\n bottom: 0;\n top: 17%;\n display: none;\n }\n &.active i {\n display: block;\n }\n &.white i {\n color:#484848;\n }\n &:hover {\n opacity: 1;\n }\n }\n"],["\n \n margin-top: 15px;\n .color-choices {\n display: flex;\n background: #fff;\n padding: 7px; height: 26px;\n border-radius: 44px;\n position: absolute;\n top: 20px;\n z-index: 121212;\n box-shadow: 0 1px 1px 0 rgba(60,64,67,.08), 0 1px 3px 1px rgba(60,64,67,.16);\n div {\n margin: 5px!important;\n }\n }\n .current-color {\n height: 16px;\n width: 16px;\n margin: 0;\n cursor: pointer;\n border-radius: 40px;\n margin-right: 10px;\n padding: 9px;\n border: 1px solid rgba(0,0,0,.1);\n &:active {\n border-color: rgba(0,0,0,.25);\n }\n }\n .color {\n border: 1px solid rgba(0,0,0,.1);\n height: 14px;\n width: 14px;\n border-radius: 40px;\n cursor: pointer;\n opacity: .95;\n position: relative;\n margin: 0!important;\n\n\n &.black {\n background: #484848;\n }\n &.orange {\n background: #FF9800;\n }\n &.yellow {\n background: #ffeb3b;\n }\n &.blue {\n background: #2196f3;\n }\n &.red {\n background: #f44336;\n }\n &.purple {\n background: #9c27b0;\n }\n &.green {\n background: #4caf50;\n }\n i {\n position: absolute;\n color: #fff;\n left: 0;\n font-size: 21px;\n right: 0;\n margin: 0 auto;\n text-align: center;\n top: 0;\n bottom: 0;\n top: 17%;\n display: none;\n }\n &.active i {\n display: block;\n }\n &.white i {\n color:#484848;\n }\n &:hover {\n opacity: 1;\n }\n }\n"]),u=l(["\n padding-left: 15px;\n pointer-events: auto;\n cursor: pointer; \n margin-bottom: 2px;\n align-self: flex-end;\n @media screen and (max-width: 568px) {\n display: block;\n float: right;\n margin-top: 0px;\n margin-right: 25px;\n }\n .button.icon-download {\n background: rgba(60, 180, 110, 0.025);\n transition: .15s;\n color:#3cb46e;\n border: 1px solid #3cb46e;\n height: 34px;\n text-align: center;\n border-radius: 5px;\n font-weight: 700;\n font-size: 14px;\n display: flex;\n width: 90px;\n align-items: center;\n line-height: 38px;\n @media screen and (max-width: 568px) {\n padding: 5px;\n width: 42px;\n }\n .button-name {\n line-height: 24px;\n flex: 1;\n @media screen and (max-width: 568px) {\n display:none;\n }\n }\n i {\n font-size: 22px;\n fill: #fff;\n padding-left: 10px;\n @media screen and (max-width: 568px) {\n padding-right: 0px;\n }\n }\n &:active {\n border-color:rgba(0,0,0,.25);\n }\n }\n\n"],["\n padding-left: 15px;\n pointer-events: auto;\n cursor: pointer; \n margin-bottom: 2px;\n align-self: flex-end;\n @media screen and (max-width: 568px) {\n display: block;\n float: right;\n margin-top: 0px;\n margin-right: 25px;\n }\n .button.icon-download {\n background: rgba(60, 180, 110, 0.025);\n transition: .15s;\n color:#3cb46e;\n border: 1px solid #3cb46e;\n height: 34px;\n text-align: center;\n border-radius: 5px;\n font-weight: 700;\n font-size: 14px;\n display: flex;\n width: 90px;\n align-items: center;\n line-height: 38px;\n @media screen and (max-width: 568px) {\n padding: 5px;\n width: 42px;\n }\n .button-name {\n line-height: 24px;\n flex: 1;\n @media screen and (max-width: 568px) {\n display:none;\n }\n }\n i {\n font-size: 22px;\n fill: #fff;\n padding-left: 10px;\n @media screen and (max-width: 568px) {\n padding-right: 0px;\n }\n }\n &:active {\n border-color:rgba(0,0,0,.25);\n }\n }\n\n"]),h=l(["\n flex: 1;\n position: relative;\n cursor: pointer;\n overflow: hidden;\n width: 270px;\n .hljs {\n line-height: 20px!important;\n border-radius: 5px;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n transition: .1s;\n overflow: hidden;\n vertical-align: top;\n width: 100%;\n padding: .3em .7em;\n }\n pre {\n margin: 0!important;\n z-index: 1212;\n overflow: hidden;\n padding-left: 5px;\n height: 28px;\n display: flex;\n align-items: flex-start;\n }\n &:hover .hljs-tag {\n background: rgba(60, 180, 110, 0.07);\n }\n .code-options {\n line-height: 12px;\n margin: 0px 5px;\n .code-option {\n display: inline-block;\n font-size: 12px;\n padding: 5px 7px;\n padding-bottom: 14px;\n line-height: 12px;\n height: 12px;\n color: #999;\n margin-bottom: -8px;\n &.active {\n background: #f7f7f7;\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n font-weight: 500;\n }\n }\n\n\n }\n\n .copied {\n position: absolute;\n right: 0;\n transition: .1s;\n z-index: 99999;\n top: 0;\n line-height: 20px;\n font-size: 12px;\n font-weight: 700;\n padding: 2px 7px;\n color: #3cb46e;\n border-radius: 5px;\n opacity: 0;\n display: none;\n &.active {\n opacity: 1;\n display: block;\n }\n }\n\n "],["\n flex: 1;\n position: relative;\n cursor: pointer;\n overflow: hidden;\n width: 270px;\n .hljs {\n line-height: 20px!important;\n border-radius: 5px;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n transition: .1s;\n overflow: hidden;\n vertical-align: top;\n width: 100%;\n padding: .3em .7em;\n }\n pre {\n margin: 0!important;\n z-index: 1212;\n overflow: hidden;\n padding-left: 5px;\n height: 28px;\n display: flex;\n align-items: flex-start;\n }\n &:hover .hljs-tag {\n background: rgba(60, 180, 110, 0.07);\n }\n .code-options {\n line-height: 12px;\n margin: 0px 5px;\n .code-option {\n display: inline-block;\n font-size: 12px;\n padding: 5px 7px;\n padding-bottom: 14px;\n line-height: 12px;\n height: 12px;\n color: #999;\n margin-bottom: -8px;\n &.active {\n background: #f7f7f7;\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\n font-weight: 500;\n }\n }\n\n\n }\n\n .copied {\n position: absolute;\n right: 0;\n transition: .1s;\n z-index: 99999;\n top: 0;\n line-height: 20px;\n font-size: 12px;\n font-weight: 700;\n padding: 2px 7px;\n color: #3cb46e;\n border-radius: 5px;\n opacity: 0;\n display: none;\n &.active {\n opacity: 1;\n display: block;\n }\n }\n\n "]),g=l(["\n height: 24px;\n width: 24px;\n margin: 0;\n cursor: pointer;\n border-radius: 40px;\n margin-right: 10px;\n padding: 5px;\n margin-top: 15px;\n border: 1px solid rgba(0,0,0,.1);\n i {\n font-size: 25px;\n display: block;\n color: #999;\n }\n &:active {\n border-color: rgba(0,0,0,.25);\n }\n .animate-choices {\n display: flex;\n background: #fff;\n padding: 7px;\n border-radius: 44px;\n position: absolute;\n top: 20px;\n height: 26px;\n line-height: 26px;\n z-index: 121212;\n overflow: hidden;\n box-shadow: 0 1px 1px 0 rgba(60,64,67,.08), 0 1px 3px 1px rgba(60,64,67,.16);\n div {\n line-height: 15px;\n margin: 3px!important;\n font-size: 12px;\n cursor: pointer;\n max-width: 30px;\n overflow: hidden;\n padding: 2px 5px;\n color: #999;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n &:hover {\n\n color: #484848;\n }\n }\n\n\n }\n "],["\n height: 24px;\n width: 24px;\n margin: 0;\n cursor: pointer;\n border-radius: 40px;\n margin-right: 10px;\n padding: 5px;\n margin-top: 15px;\n border: 1px solid rgba(0,0,0,.1);\n i {\n font-size: 25px;\n display: block;\n color: #999;\n }\n &:active {\n border-color: rgba(0,0,0,.25);\n }\n .animate-choices {\n display: flex;\n background: #fff;\n padding: 7px;\n border-radius: 44px;\n position: absolute;\n top: 20px;\n height: 26px;\n line-height: 26px;\n z-index: 121212;\n overflow: hidden;\n box-shadow: 0 1px 1px 0 rgba(60,64,67,.08), 0 1px 3px 1px rgba(60,64,67,.16);\n div {\n line-height: 15px;\n margin: 3px!important;\n font-size: 12px;\n cursor: pointer;\n max-width: 30px;\n overflow: hidden;\n padding: 2px 5px;\n color: #999;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -khtml-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n &:hover {\n\n color: #484848;\n }\n }\n\n\n }\n "]),f=l(["\n padding: 20px;\n display: flex;\n pointer-events: auto;\n position: relative;\n @media screen and (max-width: 568px) {\n display: block;\n height: 48px;\n padding: 15px;\n }\n .icon-head {\n margin: 0px;\n margin-left: 15px;\n font-size: 16px;\n font-weight: 400;\n line-height: 64px;\n flex: 1;\n width: 366px;\n overflow: hidden;\n @media screen and (max-width: 568px) {\n display: inline-block;\n flex: none;\n width: auto;\n line-height: 48px;\n height: 48px;\n margin-left: 10px;\n }\n .icon-head-name {\n color: #484848;\n line-height: 25px;\n font-weight: 700;\n font-size: 20px;\n margin: 0px 2px;\n margin-bottom: 9px;\n @media screen and (max-width: 568px) { \n height: 48px;\n font-size: 13px;\n font-weight: 400;\n line-height: 48px;\n margin: 0px !important;\n max-width: 150px;\n overflow: hidden;\n }\n }\n }\n .icon-footer{\n display: flex;\n @media screen and (max-width: 568px) {\n display:none;\n }\n\n }\n\n }\n .box-bg{\n border-radius: 5px;\n overflow: hidden;\n background: #fff;\n align-items: center;\n background-image: linear-gradient(45deg, #eee 25%, transparent 25%), linear-gradient(-45deg, #eee 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #eee 75%), linear-gradient(-45deg, transparent 75%, #eee 75%);\n \n background-image: -moz-linear-gradient(to top,#eee ,#eee );\n background-position: 0 0, 0 5px, 5px -5px, -5px 0px;\n background-size: 10px 10px;\n display: flex;\n justify-content: center;\n width: 85px;\n position: relative;\n height: 85px;\n @media screen and (max-width: 568px) {\n display: inline-block;\n flex: none;\n width: 48px;\n height: 48px;\n i {\n font-size: 32px!important;\n position: absolute;\n left: 8px;\n top: 8px;\n }\n }\n i {\n color: #484848;\n font-size: 3rem;\n }\n &.white i,&.orange i,&.blue i,&.red i,&.purple i,&.green i{\n color: #fff;\n z-index: 121212;\n }\n\n &.orange{\n background: #FF9800;\n }\n &.yellow{\n background: #ffeb3b;\n }\n &.blue{\n background: #2196f3;\n }\n &.red{\n background: #f44336;\n }\n &.purple{\n background: #9c27b0;\n }\n &.green{\n background: #4caf50;\n }\n }\n \n"],["\n padding: 20px;\n display: flex;\n pointer-events: auto;\n position: relative;\n @media screen and (max-width: 568px) {\n display: block;\n height: 48px;\n padding: 15px;\n }\n .icon-head {\n margin: 0px;\n margin-left: 15px;\n font-size: 16px;\n font-weight: 400;\n line-height: 64px;\n flex: 1;\n width: 366px;\n overflow: hidden;\n @media screen and (max-width: 568px) {\n display: inline-block;\n flex: none;\n width: auto;\n line-height: 48px;\n height: 48px;\n margin-left: 10px;\n }\n .icon-head-name {\n color: #484848;\n line-height: 25px;\n font-weight: 700;\n font-size: 20px;\n margin: 0px 2px;\n margin-bottom: 9px;\n @media screen and (max-width: 568px) { \n height: 48px;\n font-size: 13px;\n font-weight: 400;\n line-height: 48px;\n margin: 0px !important;\n max-width: 150px;\n overflow: hidden;\n }\n }\n }\n .icon-footer{\n display: flex;\n @media screen and (max-width: 568px) {\n display:none;\n }\n\n }\n\n }\n .box-bg{\n border-radius: 5px;\n overflow: hidden;\n background: #fff;\n align-items: center;\n background-image: linear-gradient(45deg, #eee 25%, transparent 25%), linear-gradient(-45deg, #eee 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #eee 75%), linear-gradient(-45deg, transparent 75%, #eee 75%);\n \n background-image: -moz-linear-gradient(to top,#eee ,#eee );\n background-position: 0 0, 0 5px, 5px -5px, -5px 0px;\n background-size: 10px 10px;\n display: flex;\n justify-content: center;\n width: 85px;\n position: relative;\n height: 85px;\n @media screen and (max-width: 568px) {\n display: inline-block;\n flex: none;\n width: 48px;\n height: 48px;\n i {\n font-size: 32px!important;\n position: absolute;\n left: 8px;\n top: 8px;\n }\n }\n i {\n color: #484848;\n font-size: 3rem;\n }\n &.white i,&.orange i,&.blue i,&.red i,&.purple i,&.green i{\n color: #fff;\n z-index: 121212;\n }\n\n &.orange{\n background: #FF9800;\n }\n &.yellow{\n background: #ffeb3b;\n }\n &.blue{\n background: #2196f3;\n }\n &.red{\n background: #f44336;\n }\n &.purple{\n background: #9c27b0;\n }\n &.green{\n background: #4caf50;\n }\n }\n \n"]),x=t(5),m=a(x),b=t(55),v=t(49),y=t(78),w=t(457),E=a(w),k=t(458),N=a(k),C=t(459),j=a(C),_=t(36),S=a(_),O=t(79),R=a(O);t(37);E.default.registerLanguage("xml",N.default);var A=S.default.div(d),M=S.default.div(p),z=S.default.div(u),D=S.default.div(h),L=S.default.div(g),B=S.default.div(f),T=function(n){function e(n){i(this,e);var t=o(this,(e.__proto__||Object.getPrototypeOf(e)).call(this,n));return t.state={color:"black",copied:!1,code:null,componentCode:null,colorChoiceDisplay:!1,animateChoiceDisplay:!1,rotate:0,type:"component",animation:"none"},t.handleBoxClose=t.handleBoxClose.bind(t),t.handleColor=t.handleColor.bind(t),t.handleRotate=t.handleRotate.bind(t),t.copyCode=t.copyCode.bind(t),t.handleCurrentColor=t.handleCurrentColor.bind(t),t.handleAnimate=t.handleAnimate.bind(t),t.handleCurrentAnimation=t.handleCurrentAnimation.bind(t),t.changeType=t.changeType.bind(t),t}return r(e,n),c(e,[{key:"changeType",value:function(n){this.setState({type:n})}},{key:"componentWillMount",value:function(){"SOLID"===this.props.icon.type_of_icon?this.setState({code:"<i class='bx bxs-"+this.props.icon.name+"'></i>",componentCode:"<box-icon type='solid' name='"+this.props.icon.name+"'></box-icon>"}):"LOGO"===this.props.icon.type_of_icon?this.setState({code:"<i class='bx bxl-"+this.props.icon.name+"'></i>",componentCode:"<box-icon type='logo' name='"+this.props.icon.name+"'></box-icon>"}):this.setState({code:"<i class='bx bx-"+this.props.icon.name+"'></i>",componentCode:"<box-icon name='"+this.props.icon.name+"'></box-icon>"})}},{key:"componentDidMount",value:function(){for(var n=document.querySelectorAll("code"),e=0;e<n.length;e++)E.default.highlightBlock(n[e])}},{key:"componentDidUpdate",value:function(){for(var n=document.querySelectorAll("code"),e=0;e<n.length;e++)E.default.highlightBlock(n[e])}},{key:"componentWillReceiveProps",value:function(n){if(this.props.icon.slug!==n.icon.slug){var e="bx bx-"+n.icon.name,t="name='"+n.icon.name+"' ";"SOLID"===n.icon.type_of_icon?(e="bx bxs-"+n.icon.name,t+="type='solid' "):"LOGO"===n.icon.type_of_icon&&(e="bx bxl-"+n.icon.name,t+="type='logo' "),"none"!==this.state.animation&&(e+=" bx-"+this.state.animation,t+="animation='"+this.state.animation+"' "),this.state.rotate>0&&(e+=" bx-rotate-"+this.state.rotate,t+="rotate='"+this.state.rotate+"' "),this.setState({code:"<i class='"+e+"'></i>",componentCode:"<box-icon "+t+"></box-icon>"})}}},{key:"handleRotate",value:function(){var n="bx bx-"+this.props.icon.name,e="name='"+this.props.icon.name+"' ";"SOLID"===this.props.icon.type_of_icon?(n="bx bxs-"+this.props.icon.name,e+="type='solid' "):"LOGO"===this.props.icon.type_of_icon&&(n="bx bxl-"+this.props.icon.name,e+="type='logo' "),"none"!==this.state.animation&&(n+=" bx-"+this.state.animation,e+="animation='"+this.state.animation+"' "),this.state.rotate+90!==360?(this.setState({rotate:this.state.rotate+90}),n+=" bx-rotate-"+(this.state.rotate+90),e+="rotate='"+(this.state.rotate+90)+"' "):this.setState({rotate:0}),this.setState({code:"<i class='"+n+"'></i>",componentCode:"<box-icon "+e+"></box-icon>"})}},{key:"handleAnimate",value:function(n){this.setState({animation:n}),this.setState({animateChoiceDisplay:!1});var e="bx bx-"+this.props.icon.name,t="name='"+this.props.icon.name+"' ";"SOLID"===this.props.icon.type_of_icon?(e="bx bxs-"+this.props.icon.name,t+="type='solid' "):"LOGO"===this.props.icon.type_of_icon&&(e="bx bxl-"+this.props.icon.name,t+="type='logo' "),"none"!==n&&(e+=" bx-"+n,t+="animation='"+n+"' "),this.state.rotate>0&&(e+=" bx-rotate-"+this.state.rotate,t+="animation='"+this.state.rotate+"' "),this.setState({code:"<i class='"+e+"'></i>",componentCode:"<box-icon "+t+"></box-icon>"})}},{key:"handleColor",value:function(n){this.setState({color:n}),this.setState({colorChoiceDisplay:!1})}},{key:"handleCurrentColor",value:function(){this.setState({colorChoiceDisplay:!this.state.colorChoiceDisplay}),this.setState({animateChoiceDisplay:!1})}},{key:"handleCurrentAnimation",value:function(){this.setState({animateChoiceDisplay:!this.state.animateChoiceDisplay}),this.setState({colorChoiceDisplay:!1})}},{key:"copyCode",value:function(){document.querySelector("#code").select(),document.execCommand("copy"),this.setState({copied:!0}),setTimeout(function(){this.setState({copied:!1})}.bind(this),1e3)}},{key:"handleBoxClose",value:function(){this.props.changeSideIcon(!1),this.props.setSelectedIcon(null,null)}},{key:"render",value:function(){var n=this,e=(0,R.default)({active:this.state.copied,copied:!0}),t="/static/img/svg/bx-"+this.props.icon.name+".svg",a=this.props.icon,i="bx-"+a.name;return"SOLID"===a.type_of_icon?(t="/static/img/svg/bxs-"+this.props.icon.name+".svg",i="bxs-"+a.name):"LOGO"===a.type_of_icon&&(t="/static/img/svg/bxl-"+this.props.icon.name+".svg",i="bxl-"+a.name),m.default.createElement("div",{className:" "},m.default.createElement(B,{className:"icon"},m.default.createElement("div",{className:"box-bg "+this.state.color},m.default.createElement("i",{className:"bx "+i+" bx-rotate-"+this.state.rotate+" bx-"+this.state.animation})),m.default.createElement("div",{className:" icon-head"},m.default.createElement("div",{className:" icon-head-name"},a.name),m.default.createElement("div",{className:" icon-footer"},m.default.createElement(M,null,this.state.colorChoiceDisplay&&m.default.createElement("div",{className:" color-choices"},m.default.createElement("div",{className:"color black",onClick:function(){return n.handleColor("black")}}),m.default.createElement("div",{className:"color orange",onClick:function(){return n.handleColor("orange")}}),m.default.createElement("div",{className:"color yellow",onClick:function(){return n.handleColor("yellow")}}),m.default.createElement("div",{className:"color green",onClick:function(){return n.handleColor("green")}}),m.default.createElement("div",{className:"color blue",onClick:function(){return n.handleColor("blue")}}),m.default.createElement("div",{className:"color purple",onClick:function(){return n.handleColor("purple")}}),m.default.createElement("div",{className:"color red",onClick:function(){return n.handleColor("red")}}),m.default.createElement("div",{className:"color white",onClick:function(){return n.handleColor("white")}})),m.default.createElement("div",{className:" current-color",onClick:this.handleCurrentColor},m.default.createElement("div",{className:"color "+this.state.color}))),m.default.createElement(L,{onClick:this.handleRotate},m.default.createElement("i",{className:"bx bx-rotate"})),m.default.createElement(L,null,m.default.createElement("div",{onClick:this.handleCurrentAnimation},m.default.createElement("i",{className:"bx bx-play"})),this.state.animateChoiceDisplay&&m.default.createElement("div",{className:"animate-choices"},m.default.createElement("div",{className:"animate tada",onClick:function(){return n.handleAnimate("tada")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-tada"})),m.default.createElement("div",{className:"animate flashing",onClick:function(){return n.handleAnimate("flashing")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-flashing"})),m.default.createElement("div",{className:"animate burst",onClick:function(){return n.handleAnimate("burst")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-burst"})),m.default.createElement("div",{className:"animate spin",onClick:function(){return n.handleAnimate("spin")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-spin"})),m.default.createElement("div",{className:"animate fade-left",onClick:function(){return n.handleAnimate("fade-left")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-fade-left"})),m.default.createElement("div",{className:"animate fade-right",onClick:function(){return n.handleAnimate("fade-right")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-fade-right"})),m.default.createElement("div",{className:"animate fade-up",onClick:function(){return n.handleAnimate("fade-up")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-fade-up"})),m.default.createElement("div",{className:"animate fade-down",onClick:function(){return n.handleAnimate("fade-down")}},m.default.createElement("i",{className:"bx "+i+" bx-xs bx-fade-down"})),m.default.createElement("div",{className:"animate none",onClick:function(){return n.handleAnimate("none")}},"none"))),m.default.createElement(D,null,m.default.createElement("div",{className:"code-options"},m.default.createElement("div",{className:"component"===this.state.type?"code-option active":"code-option",onClick:function(){return n.changeType("component")}},"Web Component"),m.default.createElement("div",{className:"font"===this.state.type?"code-option active":"code-option",onClick:function(){return n.changeType("font")}},"Font")),m.default.createElement("div",{className:"icon-code-in",onClick:this.copyCode},"component"===this.state.type?m.default.createElement("div",null,m.default.createElement(j.default,null," ",m.default.createElement("code",{className:"html"},this.state.componentCode)),m.default.createElement("input",{className:"hidden",type:"text",onChange:function(){},value:this.state.componentCode,id:"code"}),m.default.createElement("div",{className:e},"Copied ",m.default.createElement("i",{className:"bx bx-check"}))):m.default.createElement("div",null," ",m.default.createElement(j.default,null," ",m.default.createElement("code",{className:"html"},this.state.code)),m.default.createElement("input",{className:"hidden",type:"text",onChange:function(){},value:this.state.code,id:"code"}),m.default.createElement("div",{className:e},"Copied ",m.default.createElement("i",{className:"bx bx-check"})))," ")))),m.default.createElement(z,null,m.default.createElement("a",{href:t,download:i,className:"button icon-download "},m.default.createElement("i",{className:"bx bx-download"}),m.default.createElement("div",{className:"button-name"},"SVG"))),m.default.createElement(A,{onClick:this.handleBoxClose},m.default.createElement("i",{className:"bx bx-x"}))))}}]),e}(x.Component);e.default=(0,b.connect)(null,s)(T)},457:function(n,e,t){!function(n){"object"==typeof window&&window||"object"==typeof self&&self;n(e)}(function(n){function e(n){return n.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;")}function t(n){return n.nodeName.toLowerCase()}function a(n,e){var t=n&&n.exec(e);return t&&0===t.index}function i(n){return j.test(n)}function o(n){var e,t,a,o,r=n.className+" ";if(r+=n.parentNode?n.parentNode.className:"",t=_.exec(r))return w(t[1])?t[1]:"no-highlight";for(r=r.split(/\s+/),e=0,a=r.length;e<a;e++)if(o=r[e],i(o)||w(o))return o}function r(n){var e,t={},a=Array.prototype.slice.call(arguments,1);for(e in n)t[e]=n[e];return a.forEach(function(n){for(e in n)t[e]=n[e]}),t}function l(n){var e=[];return function n(a,i){for(var o=a.firstChild;o;o=o.nextSibling)3===o.nodeType?i+=o.nodeValue.length:1===o.nodeType&&(e.push({event:"start",offset:i,node:o}),i=n(o,i),t(o).match(/br|hr|img|input/)||e.push({event:"stop",offset:i,node:o}));return i}(n,0),e}function s(n,a,i){function o(){return n.length&&a.length?n[0].offset!==a[0].offset?n[0].offset<a[0].offset?n:a:"start"===a[0].event?n:a:n.length?n:a}function r(n){function a(n){return" "+n.nodeName+'="'+e(n.value).replace('"',"&quot;")+'"'}d+="<"+t(n)+E.map.call(n.attributes,a).join("")+">"}function l(n){d+="</"+t(n)+">"}function s(n){("start"===n.event?r:l)(n.node)}for(var c=0,d="",p=[];n.length||a.length;){var u=o();if(d+=e(i.substring(c,u[0].offset)),c=u[0].offset,u===n){p.reverse().forEach(l);do{s(u.splice(0,1)[0]),u=o()}while(u===n&&u.length&&u[0].offset===c);p.reverse().forEach(r)}else"start"===u[0].event?p.push(u[0].node):p.pop(),s(u.splice(0,1)[0])}return d+e(i.substr(c))}function c(n){return n.variants&&!n.cached_variants&&(n.cached_variants=n.variants.map(function(e){return r(n,{variants:null},e)})),n.cached_variants||n.endsWithParent&&[r(n)]||[n]}function d(n){function e(n){return n&&n.source||n}function t(t,a){return new RegExp(e(t),"m"+(n.case_insensitive?"i":"")+(a?"g":""))}function a(i,o){if(!i.compiled){if(i.compiled=!0,i.keywords=i.keywords||i.beginKeywords,i.keywords){var r={},l=function(e,t){n.case_insensitive&&(t=t.toLowerCase()),t.split(" ").forEach(function(n){var t=n.split("|");r[t[0]]=[e,t[1]?Number(t[1]):1]})};"string"==typeof i.keywords?l("keyword",i.keywords):k(i.keywords).forEach(function(n){l(n,i.keywords[n])}),i.keywords=r}i.lexemesRe=t(i.lexemes||/\w+/,!0),o&&(i.beginKeywords&&(i.begin="\\b("+i.beginKeywords.split(" ").join("|")+")\\b"),i.begin||(i.begin=/\B|\b/),i.beginRe=t(i.begin),i.end||i.endsWithParent||(i.end=/\B|\b/),i.end&&(i.endRe=t(i.end)),i.terminator_end=e(i.end)||"",i.endsWithParent&&o.terminator_end&&(i.terminator_end+=(i.end?"|":"")+o.terminator_end)),i.illegal&&(i.illegalRe=t(i.illegal)),null==i.relevance&&(i.relevance=1),i.contains||(i.contains=[]),i.contains=Array.prototype.concat.apply([],i.contains.map(function(n){return c("self"===n?i:n)})),i.contains.forEach(function(n){a(n,i)}),i.starts&&a(i.starts,o);var s=i.contains.map(function(n){return n.beginKeywords?"\\.?("+n.begin+")\\.?":n.begin}).concat([i.terminator_end,i.illegal]).map(e).filter(Boolean);i.terminators=s.length?t(s.join("|"),!0):{exec:function(){return null}}}}a(n)}function p(n,t,i,o){function r(n,e){var t,i;for(t=0,i=e.contains.length;t<i;t++)if(a(e.contains[t].beginRe,n))return e.contains[t]}function l(n,e){if(a(n.endRe,e)){for(;n.endsParent&&n.parent;)n=n.parent;return n}if(n.endsWithParent)return l(n.parent,e)}function s(n,e){return!i&&a(e.illegalRe,n)}function c(n,e){var t=v.case_insensitive?e[0].toLowerCase():e[0];return n.keywords.hasOwnProperty(t)&&n.keywords[t]}function h(n,e,t,a){var i=a?"":R.classPrefix,o='<span class="'+i,r=t?"":O;return(o+=n+'">')+e+r}function g(){var n,t,a,i;if(!E.keywords)return e(j);for(i="",t=0,E.lexemesRe.lastIndex=0,a=E.lexemesRe.exec(j);a;)i+=e(j.substring(t,a.index)),n=c(E,a),n?(_+=n[1],i+=h(n[0],e(a[0]))):i+=e(a[0]),t=E.lexemesRe.lastIndex,a=E.lexemesRe.exec(j);return i+e(j.substr(t))}function f(){var n="string"==typeof E.subLanguage;if(n&&!N[E.subLanguage])return e(j);var t=n?p(E.subLanguage,j,!0,k[E.subLanguage]):u(j,E.subLanguage.length?E.subLanguage:void 0);return E.relevance>0&&(_+=t.relevance),n&&(k[E.subLanguage]=t.top),h(t.language,t.value,!1,!0)}function x(){C+=null!=E.subLanguage?f():g(),j=""}function m(n){C+=n.className?h(n.className,"",!0):"",E=Object.create(n,{parent:{value:E}})}function b(n,e){if(j+=n,null==e)return x(),0;var t=r(e,E);if(t)return t.skip?j+=e:(t.excludeBegin&&(j+=e),x(),t.returnBegin||t.excludeBegin||(j=e)),m(t,e),t.returnBegin?0:e.length;var a=l(E,e);if(a){var i=E;i.skip?j+=e:(i.returnEnd||i.excludeEnd||(j+=e),x(),i.excludeEnd&&(j=e));do{E.className&&(C+=O),E.skip||(_+=E.relevance),E=E.parent}while(E!==a.parent);return a.starts&&m(a.starts,""),i.returnEnd?0:e.length}if(s(e,E))throw new Error('Illegal lexeme "'+e+'" for mode "'+(E.className||"<unnamed>")+'"');return j+=e,e.length||1}var v=w(n);if(!v)throw new Error('Unknown language: "'+n+'"');d(v);var y,E=o||v,k={},C="";for(y=E;y!==v;y=y.parent)y.className&&(C=h(y.className,"",!0)+C);var j="",_=0;try{for(var S,A,M=0;;){if(E.terminators.lastIndex=M,!(S=E.terminators.exec(t)))break;A=b(t.substring(M,S.index),S[0]),M=S.index+A}for(b(t.substr(M)),y=E;y.parent;y=y.parent)y.className&&(C+=O);return{relevance:_,value:C,language:n,top:E}}catch(n){if(n.message&&-1!==n.message.indexOf("Illegal"))return{relevance:0,value:e(t)};throw n}}function u(n,t){t=t||R.languages||k(N);var a={relevance:0,value:e(n)},i=a;return t.filter(w).forEach(function(e){var t=p(e,n,!1);t.language=e,t.relevance>i.relevance&&(i=t),t.relevance>a.relevance&&(i=a,a=t)}),i.language&&(a.second_best=i),a}function h(n){return R.tabReplace||R.useBR?n.replace(S,function(n,e){return R.useBR&&"\n"===n?"<br>":R.tabReplace?e.replace(/\t/g,R.tabReplace):""}):n}function g(n,e,t){var a=e?C[e]:t,i=[n.trim()];return n.match(/\bhljs\b/)||i.push("hljs"),-1===n.indexOf(a)&&i.push(a),i.join(" ").trim()}function f(n){var e,t,a,r,c,d=o(n);i(d)||(R.useBR?(e=document.createElementNS("http://www.w3.org/1999/xhtml","div"),e.innerHTML=n.innerHTML.replace(/\n/g,"").replace(/<br[ \/]*>/g,"\n")):e=n,c=e.textContent,a=d?p(d,c,!0):u(c),t=l(e),t.length&&(r=document.createElementNS("http://www.w3.org/1999/xhtml","div"),r.innerHTML=a.value,a.value=s(t,l(r),c)),a.value=h(a.value),n.innerHTML=a.value,n.className=g(n.className,d,a.language),n.result={language:a.language,re:a.relevance},a.second_best&&(n.second_best={language:a.second_best.language,re:a.second_best.relevance}))}function x(n){R=r(R,n)}function m(){if(!m.called){m.called=!0;var n=document.querySelectorAll("pre code");E.forEach.call(n,f)}}function b(){addEventListener("DOMContentLoaded",m,!1),addEventListener("load",m,!1)}function v(e,t){var a=N[e]=t(n);a.aliases&&a.aliases.forEach(function(n){C[n]=e})}function y(){return k(N)}function w(n){return n=(n||"").toLowerCase(),N[n]||N[C[n]]}var E=[],k=Object.keys,N={},C={},j=/^(no-?highlight|plain|text)$/i,_=/\blang(?:uage)?-([\w-]+)\b/i,S=/((^(<[^>]+>|\t|)+|(?:\n)))/gm,O="</span>",R={classPrefix:"hljs-",tabReplace:null,useBR:!1,languages:void 0};return n.highlight=p,n.highlightAuto=u,n.fixMarkup=h,n.highlightBlock=f,n.configure=x,n.initHighlighting=m,n.initHighlightingOnLoad=b,n.registerLanguage=v,n.listLanguages=y,n.getLanguage=w,n.inherit=r,n.IDENT_RE="[a-zA-Z]\\w*",n.UNDERSCORE_IDENT_RE="[a-zA-Z_]\\w*",n.NUMBER_RE="\\b\\d+(\\.\\d+)?",n.C_NUMBER_RE="(-?)(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)",n.BINARY_NUMBER_RE="\\b(0b[01]+)",n.RE_STARTERS_RE="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~",n.BACKSLASH_ESCAPE={begin:"\\\\[\\s\\S]",relevance:0},n.APOS_STRING_MODE={className:"string",begin:"'",end:"'",illegal:"\\n",contains:[n.BACKSLASH_ESCAPE]},n.QUOTE_STRING_MODE={className:"string",begin:'"',end:'"',illegal:"\\n",contains:[n.BACKSLASH_ESCAPE]},n.PHRASAL_WORDS_MODE={begin:/\b(a|an|the|are|I'm|isn't|don't|doesn't|won't|but|just|should|pretty|simply|enough|gonna|going|wtf|so|such|will|you|your|they|like|more)\b/},n.COMMENT=function(e,t,a){var i=n.inherit({className:"comment",begin:e,end:t,contains:[]},a||{});return i.contains.push(n.PHRASAL_WORDS_MODE),i.contains.push({className:"doctag",begin:"(?:TODO|FIXME|NOTE|BUG|XXX):",relevance:0}),i},n.C_LINE_COMMENT_MODE=n.COMMENT("//","$"),n.C_BLOCK_COMMENT_MODE=n.COMMENT("/\\*","\\*/"),n.HASH_COMMENT_MODE=n.COMMENT("#","$"),n.NUMBER_MODE={className:"number",begin:n.NUMBER_RE,relevance:0},n.C_NUMBER_MODE={className:"number",begin:n.C_NUMBER_RE,relevance:0},n.BINARY_NUMBER_MODE={className:"number",begin:n.BINARY_NUMBER_RE,relevance:0},n.CSS_NUMBER_MODE={className:"number",begin:n.NUMBER_RE+"(%|em|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|px|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?",relevance:0},n.REGEXP_MODE={className:"regexp",begin:/\//,end:/\/[gimuy]*/,illegal:/\n/,contains:[n.BACKSLASH_ESCAPE,{begin:/\[/,end:/\]/,relevance:0,contains:[n.BACKSLASH_ESCAPE]}]},n.TITLE_MODE={className:"title",begin:n.IDENT_RE,relevance:0},n.UNDERSCORE_TITLE_MODE={className:"title",begin:n.UNDERSCORE_IDENT_RE,relevance:0},n.METHOD_GUARD={begin:"\\.\\s*"+n.UNDERSCORE_IDENT_RE,relevance:0},n})},458:function(n,e){n.exports=function(n){var e={endsWithParent:!0,illegal:/</,relevance:0,contains:[{className:"attr",begin:"[A-Za-z0-9\\._:-]+",relevance:0},{begin:/=\s*/,relevance:0,contains:[{className:"string",endsParent:!0,variants:[{begin:/"/,end:/"/},{begin:/'/,end:/'/},{begin:/[^\s"'=<>`]+/}]}]}]};return{aliases:["html","xhtml","rss","atom","xjb","xsd","xsl","plist"],case_insensitive:!0,contains:[{className:"meta",begin:"<!DOCTYPE",end:">",relevance:10,contains:[{begin:"\\[",end:"\\]"}]},n.COMMENT("\x3c!--","--\x3e",{relevance:10}),{begin:"<\\!\\[CDATA\\[",end:"\\]\\]>",relevance:10},{begin:/<\?(php)?/,end:/\?>/,subLanguage:"php",contains:[{begin:"/\\*",end:"\\*/",skip:!0}]},{className:"tag",begin:"<style(?=\\s|>|$)",end:">",keywords:{name:"style"},contains:[e],starts:{end:"</style>",returnEnd:!0,subLanguage:["css","xml"]}},{className:"tag",begin:"<script(?=\\s|>|$)",end:">",keywords:{name:"script"},contains:[e],starts:{end:"<\/script>",returnEnd:!0,subLanguage:["actionscript","javascript","handlebars","xml"]}},{className:"meta",variants:[{begin:/<\?xml/,end:/\?>/,relevance:10},{begin:/<\?\w+/,end:/\?>/}]},{className:"tag",begin:"</?",end:"/?>",contains:[{className:"name",begin:/[^\/><\s]+/,relevance:0},e]}]}}},459:function(n,e,t){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var a=function(n,e){return Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(e)}}))}(['\n.hljs {\n display: block;\n overflow-x: auto;\n color: #555;\n background: #f7f7f7;\n padding: 0.7em;\n font-size: 14px;\n border-radius: 5px; text-shadow: 0 1px 0 rgba(255,255,255,.6);\n font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;\n}\n\n.hljs-doctag, .hljs-keyword, .hljs-formula {\n color: #a626a4;\n}\n\n.hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst {\n color: #d81b60;\n}\n\n.hljs-literal {\n color: #0184bb;\n}\n\n.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string {\n color: #0d904f;\n}\n\n.hljs-built_in, .hljs-class .hljs-title {\n color: #c18401;\n}\n\n.hljs-attr, .hljs-variable, .hljs-template-variable, .hljs-type, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-number {\n color: #37474f;\n}\n\n.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title {\n color: #3b78e7;\n}\n\n\n\n.hljs-comment, .hljs-quote {\n color: #a0a1a7;\n font-style: italic;\n}\n.hljs-emphasis {\n font-style: italic;\n}\n\n.hljs-strong {\n font-weight: bold;\n}\n\n.hljs-link {\n text-decoration: underline;\n}\n '],['\n.hljs {\n display: block;\n overflow-x: auto;\n color: #555;\n background: #f7f7f7;\n padding: 0.7em;\n font-size: 14px;\n border-radius: 5px; text-shadow: 0 1px 0 rgba(255,255,255,.6);\n font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif;\n}\n\n.hljs-doctag, .hljs-keyword, .hljs-formula {\n color: #a626a4;\n}\n\n.hljs-section, .hljs-name, .hljs-selector-tag, .hljs-deletion, .hljs-subst {\n color: #d81b60;\n}\n\n.hljs-literal {\n color: #0184bb;\n}\n\n.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string {\n color: #0d904f;\n}\n\n.hljs-built_in, .hljs-class .hljs-title {\n color: #c18401;\n}\n\n.hljs-attr, .hljs-variable, .hljs-template-variable, .hljs-type, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo, .hljs-number {\n color: #37474f;\n}\n\n.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title {\n color: #3b78e7;\n}\n\n\n\n.hljs-comment, .hljs-quote {\n color: #a0a1a7;\n font-style: italic;\n}\n.hljs-emphasis {\n font-style: italic;\n}\n\n.hljs-strong {\n font-weight: bold;\n}\n\n.hljs-link {\n text-decoration: underline;\n}\n ']),i=t(36),o=function(n){return n&&n.__esModule?n:{default:n}}(i),r=o.default.pre(a);e.default=r}});
//# sourceMappingURL=1.bundle.js.map