mirror of
https://github.com/atisawd/boxicons.git
synced 2024-11-13 19:04:52 +01:00
2 lines
No EOL
41 KiB
JavaScript
2 lines
No EOL
41 KiB
JavaScript
webpackJsonp([1],{458: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:E.changeSideIcon,setSelectedIcon:E.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: ",";\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: ",";\n }\n &:active {\n background: #edefed;\n }\n @media screen and (max-width: ",") {\n top: 27px;\n right: 6px;}\n"],["\n background: #fff;\n color: ",";\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: ",";\n }\n &:active {\n background: #edefed;\n }\n @media screen and (max-width: ",") {\n top: 27px;\n right: 6px;}\n"]),p=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: ",") {\n display: block;\n float: right;\n margin-top: 0px;\n margin-right: 25px;\n }\n .button.icon-download {\n \n transition: .15s;\n background: ",";\n color:#fff;\n padding: 0px 10px;\n height: 40px;\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: 40px;\n transtion:0.15s;\n &:hover{\n box-shadow: 0 1px 2px 0 rgba(26,115,232,0.451), 0 1px 3px 1px rgba(26,115,232,0.302);\n background-color: #3fb2e2;\n color: #fff!important;\n }\n &:active {\n box-shadow: 0 1px 2px 0 rgba(26,115,232,0.451), 0 2px 6px 2px rgba(26,115,232,0.302);\n background-color: #359ac5;\n color: #fff!important;\n}\n @media screen and (max-width: ",") {\n padding: 5px;\n width: 42px;\n }\n .button-name {\n line-height: 24px;\n flex: 1;\n @media screen and (max-width: ",") {\n display:none;\n }\n }\n i {\n font-size: 22px;\n fill: #fff;\n padding-left: 10px;\n @media screen and (max-width: ",") {\n padding-right: 0px;\n }\n }\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: ",") {\n display: block;\n float: right;\n margin-top: 0px;\n margin-right: 25px;\n }\n .button.icon-download {\n \n transition: .15s;\n background: ",";\n color:#fff;\n padding: 0px 10px;\n height: 40px;\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: 40px;\n transtion:0.15s;\n &:hover{\n box-shadow: 0 1px 2px 0 rgba(26,115,232,0.451), 0 1px 3px 1px rgba(26,115,232,0.302);\n background-color: #3fb2e2;\n color: #fff!important;\n }\n &:active {\n box-shadow: 0 1px 2px 0 rgba(26,115,232,0.451), 0 2px 6px 2px rgba(26,115,232,0.302);\n background-color: #359ac5;\n color: #fff!important;\n}\n @media screen and (max-width: ",") {\n padding: 5px;\n width: 42px;\n }\n .button-name {\n line-height: 24px;\n flex: 1;\n @media screen and (max-width: ",") {\n display:none;\n }\n }\n i {\n font-size: 22px;\n fill: #fff;\n padding-left: 10px;\n @media screen and (max-width: ",") {\n padding-right: 0px;\n }\n }\n \n }\n\n"]),u=l(["\n flex: 1;\n position: relative;\n cursor: pointer;\n overflow: hidden;\n width: 270px;\n margin-left: 5px;\n .code-hover{\n padding:.3em .7em;\n background:",";\n z-index: 0;\n display: flex;\n width:100%;\n border-radius: 5px;\n }\n .hljs {\n line-height: 20px!important;\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: 0px;\n }\n pre {\n margin: 0!important;\n z-index: 1212;\n overflow: hidden;\n padding-left: 0px;\n height: 28px;\n display: flex;\n align-items: flex-start;\n }\n &:hover code {\n background: rgba(60, 180, 110, 0.07);\n }\n .code-options {\n line-height: 12px;\n margin: 0px;\n .code-option {\n display: inline-block;\n font-size: 13px;\n padding: 5px 12px;\n padding-bottom: 14px;\n line-height: 12px;\n height: 12px;\n font-weight: 500;\n color: ",";\n margin-bottom: -8px;\n &.active {\n background: ",";\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\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: #36b167;\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 margin-left: 5px;\n .code-hover{\n padding:.3em .7em;\n background:",";\n z-index: 0;\n display: flex;\n width:100%;\n border-radius: 5px;\n }\n .hljs {\n line-height: 20px!important;\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: 0px;\n }\n pre {\n margin: 0!important;\n z-index: 1212;\n overflow: hidden;\n padding-left: 0px;\n height: 28px;\n display: flex;\n align-items: flex-start;\n }\n &:hover code {\n background: rgba(60, 180, 110, 0.07);\n }\n .code-options {\n line-height: 12px;\n margin: 0px;\n .code-option {\n display: inline-block;\n font-size: 13px;\n padding: 5px 12px;\n padding-bottom: 14px;\n line-height: 12px;\n height: 12px;\n font-weight: 500;\n color: ",";\n margin-bottom: -8px;\n &.active {\n background: ",";\n border-top-left-radius: 5px;\n border-top-right-radius: 5px;\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: #36b167;\n border-radius: 5px;\n opacity: 0;\n display: none;\n &.active {\n opacity: 1;\n display: block;\n }\n }\n\n "]),h=l(["\n display: flex;\n position: absolute;\n background: #fff;\n height: 24px;\n bottom: -5px;\n right: -15px;\n border-radius: 5px;\n padding: 3px;\ni{\n font-size: 21px!important;\n color: #737373!important;\n}\n"],["\n display: flex;\n position: absolute;\n background: #fff;\n height: 24px;\n bottom: -5px;\n right: -15px;\n border-radius: 5px;\n padding: 3px;\ni{\n font-size: 21px!important;\n color: #737373!important;\n}\n"]),f=l(["\n height: 20px;\n width: 20px;\n margin: 0;\n cursor: pointer;\n border-radius: 40px;\n padding: 1px 2px;\n margin-top: 0px;\n flex: 1;\n \n\n i {\n font-size: 24px;\n display: block;\n color: ",";\n }\n &:active {\n background: ",";\n }\n .animate-choices {\n display: flex;\n background: #fff;\n padding: 7px;\n position: absolute;\n top: -50px;\n height: 32px;\n line-height: 32px;\n z-index: 121212;\n overflow: hidden;\n -webkit-border-radius: 2px;\n border-radius: 2px;\n -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.1), 0 1px 10px 0 rgba(0,0,0,0.06), 0 2px 4px -1px rgba(0,0,0,0.1);\n box-shadow: 0 4px 5px 0 rgba(0,0,0,0.1), 0 1px 10px 0 rgba(0,0,0,0.06), 0 2px 4px -1px rgba(0,0,0,0.1);\n div {\n line-height: 20px;\n margin: 3px!important;\n font-size: 12px;\n cursor: pointer;\n max-width: 30px;\n overflow: hidden;\n padding: 2px 5px;\n color: ",";\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: ",";\n }\n }\n\n\n }\n "],["\n height: 20px;\n width: 20px;\n margin: 0;\n cursor: pointer;\n border-radius: 40px;\n padding: 1px 2px;\n margin-top: 0px;\n flex: 1;\n \n\n i {\n font-size: 24px;\n display: block;\n color: ",";\n }\n &:active {\n background: ",";\n }\n .animate-choices {\n display: flex;\n background: #fff;\n padding: 7px;\n position: absolute;\n top: -50px;\n height: 32px;\n line-height: 32px;\n z-index: 121212;\n overflow: hidden;\n -webkit-border-radius: 2px;\n border-radius: 2px;\n -webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.1), 0 1px 10px 0 rgba(0,0,0,0.06), 0 2px 4px -1px rgba(0,0,0,0.1);\n box-shadow: 0 4px 5px 0 rgba(0,0,0,0.1), 0 1px 10px 0 rgba(0,0,0,0.06), 0 2px 4px -1px rgba(0,0,0,0.1);\n div {\n line-height: 20px;\n margin: 3px!important;\n font-size: 12px;\n cursor: pointer;\n max-width: 30px;\n overflow: hidden;\n padding: 2px 5px;\n color: ",";\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: ",";\n }\n }\n\n\n }\n "]),x=l(["\n padding: 20px;\n display: flex;\n pointer-events: auto;\n position: relative;\n @media screen and (max-width: ",") {\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: ",") {\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: ",";\n line-height: 25px;\n font-weight: 700;\n font-size: 20px;\n margin: 0px 2px;\n margin-bottom: 15px;\n margin-top: 4px;\n @media screen and (max-width: ",") { \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: ",") {\n display:none;\n }\n\n }\n\n }\n .box-bg{\n border-radius: 5px;\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: 96px;\n position: relative;\n height: 96px;\n @media screen and (max-width: ",") {\n display: inline-block;\n flex: none;\n width: 48px;\n height: 48px;\n i {\n font-size: 36px!important;\n position: absolute;\n left: 8px;\n top: 8px;\n }\n }\n i {\n color: ",";\n font-size: 48px;\n }\n &.white{\n background: ",";\n i{\n color: #fff;\n z-index: 121212;\n }\n }\n\n &.orange i{\n color: #FF9800;\n }\n &.yellow i{\n color: #f9cf57;\n }\n &.blue i{\n color: #2196f3;\n }\n &.red i{\n color: #f44336;\n }\n &.purple i{\n color: #9c27b0;\n }\n &.green i{\n color: #4caf50;\n }\n }\n \n"],["\n padding: 20px;\n display: flex;\n pointer-events: auto;\n position: relative;\n @media screen and (max-width: ",") {\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: ",") {\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: ",";\n line-height: 25px;\n font-weight: 700;\n font-size: 20px;\n margin: 0px 2px;\n margin-bottom: 15px;\n margin-top: 4px;\n @media screen and (max-width: ",") { \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: ",") {\n display:none;\n }\n\n }\n\n }\n .box-bg{\n border-radius: 5px;\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: 96px;\n position: relative;\n height: 96px;\n @media screen and (max-width: ",") {\n display: inline-block;\n flex: none;\n width: 48px;\n height: 48px;\n i {\n font-size: 36px!important;\n position: absolute;\n left: 8px;\n top: 8px;\n }\n }\n i {\n color: ",";\n font-size: 48px;\n }\n &.white{\n background: ",";\n i{\n color: #fff;\n z-index: 121212;\n }\n }\n\n &.orange i{\n color: #FF9800;\n }\n &.yellow i{\n color: #f9cf57;\n }\n &.blue i{\n color: #2196f3;\n }\n &.red i{\n color: #f44336;\n }\n &.purple i{\n color: #9c27b0;\n }\n &.green i{\n color: #4caf50;\n }\n }\n \n"]),g=t(5),m=a(g),b=t(51),v=t(40),E=t(61),y=t(461),w=a(y),N=t(462),_=a(N),k=t(463),C=a(k),O=t(31),j=a(O),R=t(30),A=t(80),S=a(A);t(35);w.default.registerLanguage("xml",_.default);var D=j.default.div(d,R.ICON_COLOR,R.LIGHT_BACKGROUND,R.BREAKPOINT_MD),M=j.default.div(p,R.BREAKPOINT_MD,R.BLUE_COLOR,R.BREAKPOINT_MD,R.BREAKPOINT_MD,R.BREAKPOINT_MD),L=j.default.div(u,R.LIGHT_BACKGROUND,R.ICON_COLOR,R.LIGHT_BACKGROUND),T=j.default.div(h),z=j.default.div(f,R.ICON_COLOR,R.LIGHT_BACKGROUND,R.ICON_COLOR,R.FADE_FONT_COLOR),B=j.default.div(x,R.BREAKPOINT_MD,R.BREAKPOINT_MD,R.FADE_FONT_COLOR,R.BREAKPOINT_MD,R.BREAKPOINT_MD,R.BREAKPOINT_MD,R.FADE_FONT_COLOR,R.FADE_FONT_COLOR),I=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++)w.default.highlightBlock(n[e])}},{key:"componentDidUpdate",value:function(){for(var n=document.querySelectorAll("code"),e=0;e<n.length;e++)w.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,S.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(T,null," ",m.default.createElement(z,{onClick:this.handleRotate},m.default.createElement("i",{className:"bx bx-rotate"})),m.default.createElement(z,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-tada"})),m.default.createElement("div",{className:"animate flashing",onClick:function(){return n.handleAnimate("flashing")}},m.default.createElement("i",{className:"bx "+i+" bx-flashing"})),m.default.createElement("div",{className:"animate burst",onClick:function(){return n.handleAnimate("burst")}},m.default.createElement("i",{className:"bx "+i+" bx-burst"})),m.default.createElement("div",{className:"animate spin",onClick:function(){return n.handleAnimate("spin")}},m.default.createElement("i",{className:"bx "+i+" 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-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-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-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-fade-down"})),m.default.createElement("div",{className:"animate none",onClick:function(){return n.handleAnimate("none")}},"none"))))),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(L,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(C.default,null,m.default.createElement("div",{className:"code-hover"}," ",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(C.default,null," ",m.default.createElement("div",{className:"code-hover"},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(M,null,m.default.createElement("a",{href:t,download:i,className:"button icon-download "},m.default.createElement("i",{className:"bx bxs-download-alt"}),m.default.createElement("div",{className:"button-name"},"SVG"))),m.default.createElement(D,{onClick:this.handleBoxClose},m.default.createElement("i",{className:"bx bx-x"}))))}}]),e}(g.Component);e.default=(0,b.connect)(null,s)(I)},461: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,"&").replace(/</g,"<").replace(/>/g,">")}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 C.test(n)}function o(n){var e,t,a,o,r=n.className+" ";if(r+=n.parentNode?n.parentNode.className:"",t=O.exec(r))return y(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)||y(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('"',""")+'"'}d+="<"+t(n)+w.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):N(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?"":A.classPrefix,o='<span class="'+i,r=t?"":R;return(o+=n+'">')+e+r}function f(){var n,t,a,i;if(!w.keywords)return e(C);for(i="",t=0,w.lexemesRe.lastIndex=0,a=w.lexemesRe.exec(C);a;)i+=e(C.substring(t,a.index)),n=c(w,a),n?(O+=n[1],i+=h(n[0],e(a[0]))):i+=e(a[0]),t=w.lexemesRe.lastIndex,a=w.lexemesRe.exec(C);return i+e(C.substr(t))}function x(){var n="string"==typeof w.subLanguage;if(n&&!_[w.subLanguage])return e(C);var t=n?p(w.subLanguage,C,!0,N[w.subLanguage]):u(C,w.subLanguage.length?w.subLanguage:void 0);return w.relevance>0&&(O+=t.relevance),n&&(N[w.subLanguage]=t.top),h(t.language,t.value,!1,!0)}function g(){k+=null!=w.subLanguage?x():f(),C=""}function m(n){k+=n.className?h(n.className,"",!0):"",w=Object.create(n,{parent:{value:w}})}function b(n,e){if(C+=n,null==e)return g(),0;var t=r(e,w);if(t)return t.skip?C+=e:(t.excludeBegin&&(C+=e),g(),t.returnBegin||t.excludeBegin||(C=e)),m(t,e),t.returnBegin?0:e.length;var a=l(w,e);if(a){var i=w;i.skip?C+=e:(i.returnEnd||i.excludeEnd||(C+=e),g(),i.excludeEnd&&(C=e));do{w.className&&(k+=R),w.skip||(O+=w.relevance),w=w.parent}while(w!==a.parent);return a.starts&&m(a.starts,""),i.returnEnd?0:e.length}if(s(e,w))throw new Error('Illegal lexeme "'+e+'" for mode "'+(w.className||"<unnamed>")+'"');return C+=e,e.length||1}var v=y(n);if(!v)throw new Error('Unknown language: "'+n+'"');d(v);var E,w=o||v,N={},k="";for(E=w;E!==v;E=E.parent)E.className&&(k=h(E.className,"",!0)+k);var C="",O=0;try{for(var j,S,D=0;;){if(w.terminators.lastIndex=D,!(j=w.terminators.exec(t)))break;S=b(t.substring(D,j.index),j[0]),D=j.index+S}for(b(t.substr(D)),E=w;E.parent;E=E.parent)E.className&&(k+=R);return{relevance:O,value:k,language:n,top:w}}catch(n){if(n.message&&-1!==n.message.indexOf("Illegal"))return{relevance:0,value:e(t)};throw n}}function u(n,t){t=t||A.languages||N(_);var a={relevance:0,value:e(n)},i=a;return t.filter(y).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 A.tabReplace||A.useBR?n.replace(j,function(n,e){return A.useBR&&"\n"===n?"<br>":A.tabReplace?e.replace(/\t/g,A.tabReplace):""}):n}function f(n,e,t){var a=e?k[e]:t,i=[n.trim()];return n.match(/\bhljs\b/)||i.push("hljs"),-1===n.indexOf(a)&&i.push(a),i.join(" ").trim()}function x(n){var e,t,a,r,c,d=o(n);i(d)||(A.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=f(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 g(n){A=r(A,n)}function m(){if(!m.called){m.called=!0;var n=document.querySelectorAll("pre code");w.forEach.call(n,x)}}function b(){addEventListener("DOMContentLoaded",m,!1),addEventListener("load",m,!1)}function v(e,t){var a=_[e]=t(n);a.aliases&&a.aliases.forEach(function(n){k[n]=e})}function E(){return N(_)}function y(n){return n=(n||"").toLowerCase(),_[n]||_[k[n]]}var w=[],N=Object.keys,_={},k={},C=/^(no-?highlight|plain|text)$/i,O=/\blang(?:uage)?-([\w-]+)\b/i,j=/((^(<[^>]+>|\t|)+|(?:\n)))/gm,R="</span>",A={classPrefix:"hljs-",tabReplace:null,useBR:!1,languages:void 0};return n.highlight=p,n.highlightAuto=u,n.fixMarkup=h,n.highlightBlock=x,n.configure=g,n.initHighlighting=m,n.initHighlightingOnLoad=b,n.registerLanguage=v,n.listLanguages=E,n.getLanguage=y,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})},462: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]}]}}},463: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: rgba(93,97,117,0.05);\n padding: 0.7em;\n font-size: 14px;\n border-radius: 5px; \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: #2f6f9f;\n}\n\n.hljs-literal {\n color: #0184bb;\n}\n\n.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string {\n color: #d44950;\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: #4f9fcf;\n}\n\n.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title {\n color: #099;\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: rgba(93,97,117,0.05);\n padding: 0.7em;\n font-size: 14px;\n border-radius: 5px; \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: #2f6f9f;\n}\n\n.hljs-literal {\n color: #0184bb;\n}\n\n.hljs-string, .hljs-regexp, .hljs-addition, .hljs-attribute, .hljs-meta-string {\n color: #d44950;\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: #4f9fcf;\n}\n\n.hljs-symbol, .hljs-bullet, .hljs-link, .hljs-meta, .hljs-selector-id, .hljs-title {\n color: #099;\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(31),o=function(n){return n&&n.__esModule?n:{default:n}}(i),r=(t(30),o.default.pre(a));e.default=r}});
|
|
//# sourceMappingURL=1.bundle.js.map
|