tooltip-ff
Version:
react tiny auto suggest component
1 lines • 15.2 kB
JavaScript
module.exports=function(t){var n={};function e(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return t[o].call(r.exports,r,r.exports,e),r.l=!0,r.exports}return e.m=t,e.c=n,e.d=function(t,n,o){e.o(t,n)||Object.defineProperty(t,n,{enumerable:!0,get:o})},e.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},e.t=function(t,n){if(1&n&&(t=e(t)),8&n)return t;if(4&n&&"object"==typeof t&&t&&t.__esModule)return t;var o=Object.create(null);if(e.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:t}),2&n&&"string"!=typeof t)for(var r in t)e.d(o,r,function(n){return t[n]}.bind(null,r));return o},e.n=function(t){var n=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(n,"a",n),n},e.o=function(t,n){return Object.prototype.hasOwnProperty.call(t,n)},e.p="",e(e.s=7)}([function(t,n){t.exports=require("prop-types")},function(t,n){t.exports=require("react")},function(t,n,e){var o=e(3);"string"==typeof o&&(o=[[t.i,o,""]]);var r={hmr:!0,transform:void 0};e(5)(o,r);o.locals&&(t.exports=o.locals)},function(t,n,e){(t.exports=e(4)(!1)).push([t.i,"html {\n font-size: 100px; }\n\nhtml,\nbody,\ndiv,\np,\nul,\nol,\nli {\n margin: 0;\n padding: 0;\n font-family: PingFangSC, Source Han Sans CN, Helvetica, Arial;\n font-weight: 400; }\n\n* {\n font-size: 0.14rem; }\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 0; }\n\nul,\nli {\n list-style: none; }\n\na {\n text-decoration: none;\n color: #595959; }\n a:hover {\n color: #595959; }\n\nbutton {\n border-width: 0;\n outline: none;\n cursor: pointer; }\n\n.tooltip-ff {\n position: relative; }\n .tooltip-ff-top {\n display: inline-flex;\n flex-direction: column;\n align-items: center; }\n .tooltip-ff-tl {\n display: inline-flex;\n flex-direction: column;\n align-items: flex-start; }\n .tooltip-ff-tr {\n display: inline-flex;\n flex-direction: column;\n align-items: flex-end; }\n .tooltip-ff-bottom {\n display: inline-flex;\n flex-direction: column-reverse;\n align-items: center; }\n .tooltip-ff-bl {\n display: inline-flex;\n flex-direction: column-reverse;\n align-items: flex-start; }\n .tooltip-ff-br {\n display: inline-flex;\n flex-direction: column-reverse;\n align-items: flex-end; }\n .tooltip-ff-left {\n display: inline-flex;\n flex-direction: row;\n align-items: center; }\n .tooltip-ff-lt {\n display: inline-flex;\n flex-direction: row;\n align-items: flex-start; }\n .tooltip-ff-lb {\n display: inline-flex;\n flex-direction: row;\n align-items: flex-end; }\n .tooltip-ff-right {\n display: inline-flex;\n flex-direction: row-reverse;\n align-items: center; }\n .tooltip-ff-rt {\n display: inline-flex;\n flex-direction: row-reverse;\n align-items: flex-start; }\n .tooltip-ff-rb {\n display: inline-flex;\n flex-direction: row-reverse;\n align-items: flex-end; }\n .tooltip-ff .content {\n cursor: pointer; }\n .tooltip-ff .active:hover + .box {\n opacity: 1; }\n .tooltip-ff .box {\n display: inline-flex;\n width: max-content;\n background-color: rgba(0, 0, 0, 0.647);\n color: #fff;\n padding: 0.08rem 0.2rem;\n border-radius: 4px;\n max-width: 2rem;\n word-break: break-word;\n z-index: 1;\n line-height: 0.14rem;\n opacity: 0;\n transition: opacity 1s; }\n .tooltip-ff .visible {\n opacity: 1; }\n .tooltip-ff .box-top,\n .tooltip-ff .box-tl,\n .tooltip-ff .box-tr {\n transform: translate(0, calc(-100% - 6px));\n position: absolute; }\n .tooltip-ff .box-top::before,\n .tooltip-ff .box-tl::before,\n .tooltip-ff .box-tr::before {\n border-left: 3px solid transparent;\n border-right: 3px solid transparent;\n border-top: 6px solid rgba(0, 0, 0, 0.647); }\n .tooltip-ff .box-top::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: 100%;\n left: calc(50% - 3px); }\n .tooltip-ff .box-tl::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: 100%;\n left: calc(25% - 3px); }\n .tooltip-ff .box-tr::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: 100%;\n left: calc(75% - 3px); }\n .tooltip-ff .box-right,\n .tooltip-ff .box-rt,\n .tooltip-ff .box-rb {\n transform: translate(calc(100% + 6px), 0);\n position: absolute; }\n .tooltip-ff .box-right::before,\n .tooltip-ff .box-rt::before,\n .tooltip-ff .box-rb::before {\n border-top: 3px solid transparent;\n border-bottom: 3px solid transparent;\n border-right: 6px solid rgba(0, 0, 0, 0.647); }\n .tooltip-ff .box-right::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: calc(50% - 3px);\n left: -6px; }\n .tooltip-ff .box-rt::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: calc(25% - 3px);\n left: -6px; }\n .tooltip-ff .box-rb::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: calc(75% - 3px);\n left: -6px; }\n .tooltip-ff .box-bottom,\n .tooltip-ff .box-bl,\n .tooltip-ff .box-br {\n transform: translate(0, calc(100% + 6px));\n position: absolute; }\n .tooltip-ff .box-bottom::before,\n .tooltip-ff .box-bl::before,\n .tooltip-ff .box-br::before {\n border-left: 3px solid transparent;\n border-right: 3px solid transparent;\n border-bottom: 6px solid rgba(0, 0, 0, 0.647); }\n .tooltip-ff .box-bottom::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: -6px;\n left: calc(50% - 3px); }\n .tooltip-ff .box-bl::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: -6px;\n left: calc(25% - 3px); }\n .tooltip-ff .box-br::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: -6px;\n left: calc(75% - 3px); }\n .tooltip-ff .box-left,\n .tooltip-ff .box-lt,\n .tooltip-ff .box-lb {\n transform: translate(calc(-100% - 6px), 0);\n position: absolute; }\n .tooltip-ff .box-left::before,\n .tooltip-ff .box-lt::before,\n .tooltip-ff .box-lb::before {\n border-top: 3px solid transparent;\n border-bottom: 3px solid transparent;\n border-left: 6px solid rgba(0, 0, 0, 0.647); }\n .tooltip-ff .box-left::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: calc(50% - 3px);\n left: 100%; }\n .tooltip-ff .box-lt::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: calc(25% - 3px);\n left: 100%; }\n .tooltip-ff .box-lb::before {\n content: '';\n position: absolute;\n width: 0;\n height: 0;\n top: calc(75% - 3px);\n left: 100%; }\n",""])},function(t,n){t.exports=function(t){var n=[];return n.toString=function(){return this.map(function(n){var e=function(t,n){var e=t[1]||"",o=t[3];if(!o)return e;if(n&&"function"==typeof btoa){var r=(l=o,"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(l))))+" */"),i=o.sources.map(function(t){return"/*# sourceURL="+o.sourceRoot+t+" */"});return[e].concat(i).concat([r]).join("\n")}var l;return[e].join("\n")}(n,t);return n[2]?"@media "+n[2]+"{"+e+"}":e}).join("")},n.i=function(t,e){"string"==typeof t&&(t=[[null,t,""]]);for(var o={},r=0;r<this.length;r++){var i=this[r][0];"number"==typeof i&&(o[i]=!0)}for(r=0;r<t.length;r++){var l=t[r];"number"==typeof l[0]&&o[l[0]]||(e&&!l[2]?l[2]=e:e&&(l[2]="("+l[2]+") and ("+e+")"),n.push(l))}},n}},function(t,n,e){var o,r,i={},l=(o=function(){return window&&document&&document.all&&!window.atob},function(){return void 0===r&&(r=o.apply(this,arguments)),r}),f=function(t){var n={};return function(t){if(void 0===n[t]){var e=function(t){return document.querySelector(t)}.call(this,t);if(e instanceof window.HTMLIFrameElement)try{e=e.contentDocument.head}catch(t){e=null}n[t]=e}return n[t]}}(),s=null,a=0,p=[],c=e(6);function u(t,n){for(var e=0;e<t.length;e++){var o=t[e],r=i[o.id];if(r){r.refs++;for(var l=0;l<r.parts.length;l++)r.parts[l](o.parts[l]);for(;l<o.parts.length;l++)r.parts.push(g(o.parts[l],n))}else{var f=[];for(l=0;l<o.parts.length;l++)f.push(g(o.parts[l],n));i[o.id]={id:o.id,refs:1,parts:f}}}}function b(t,n){for(var e=[],o={},r=0;r<t.length;r++){var i=t[r],l=n.base?i[0]+n.base:i[0],f={css:i[1],media:i[2],sourceMap:i[3]};o[l]?o[l].parts.push(f):e.push(o[l]={id:l,parts:[f]})}return e}function d(t,n){var e=f(t.insertInto);if(!e)throw new Error("Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.");var o=p[p.length-1];if("top"===t.insertAt)o?o.nextSibling?e.insertBefore(n,o.nextSibling):e.appendChild(n):e.insertBefore(n,e.firstChild),p.push(n);else if("bottom"===t.insertAt)e.appendChild(n);else{if("object"!=typeof t.insertAt||!t.insertAt.before)throw new Error("[Style Loader]\n\n Invalid value for parameter 'insertAt' ('options.insertAt') found.\n Must be 'top', 'bottom', or Object.\n (https://github.com/webpack-contrib/style-loader#insertat)\n");var r=f(t.insertInto+" "+t.insertAt.before);e.insertBefore(n,r)}}function h(t){if(null===t.parentNode)return!1;t.parentNode.removeChild(t);var n=p.indexOf(t);n>=0&&p.splice(n,1)}function x(t){var n=document.createElement("style");return t.attrs.type="text/css",m(n,t.attrs),d(t,n),n}function m(t,n){Object.keys(n).forEach(function(e){t.setAttribute(e,n[e])})}function g(t,n){var e,o,r,i;if(n.transform&&t.css){if(!(i=n.transform(t.css)))return function(){};t.css=i}if(n.singleton){var l=a++;e=s||(s=x(n)),o=w.bind(null,e,l,!1),r=w.bind(null,e,l,!0)}else t.sourceMap&&"function"==typeof URL&&"function"==typeof URL.createObjectURL&&"function"==typeof URL.revokeObjectURL&&"function"==typeof Blob&&"function"==typeof btoa?(e=function(t){var n=document.createElement("link");return t.attrs.type="text/css",t.attrs.rel="stylesheet",m(n,t.attrs),d(t,n),n}(n),o=function(t,n,e){var o=e.css,r=e.sourceMap,i=void 0===n.convertToAbsoluteUrls&&r;(n.convertToAbsoluteUrls||i)&&(o=c(o));r&&(o+="\n/*# sourceMappingURL=data:application/json;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(r))))+" */");var l=new Blob([o],{type:"text/css"}),f=t.href;t.href=URL.createObjectURL(l),f&&URL.revokeObjectURL(f)}.bind(null,e,n),r=function(){h(e),e.href&&URL.revokeObjectURL(e.href)}):(e=x(n),o=function(t,n){var e=n.css,o=n.media;o&&t.setAttribute("media",o);if(t.styleSheet)t.styleSheet.cssText=e;else{for(;t.firstChild;)t.removeChild(t.firstChild);t.appendChild(document.createTextNode(e))}}.bind(null,e),r=function(){h(e)});return o(t),function(n){if(n){if(n.css===t.css&&n.media===t.media&&n.sourceMap===t.sourceMap)return;o(t=n)}else r()}}t.exports=function(t,n){if("undefined"!=typeof DEBUG&&DEBUG&&"object"!=typeof document)throw new Error("The style-loader cannot be used in a non-browser environment");(n=n||{}).attrs="object"==typeof n.attrs?n.attrs:{},n.singleton||"boolean"==typeof n.singleton||(n.singleton=l()),n.insertInto||(n.insertInto="head"),n.insertAt||(n.insertAt="bottom");var e=b(t,n);return u(e,n),function(t){for(var o=[],r=0;r<e.length;r++){var l=e[r];(f=i[l.id]).refs--,o.push(f)}t&&u(b(t,n),n);for(r=0;r<o.length;r++){var f;if(0===(f=o[r]).refs){for(var s=0;s<f.parts.length;s++)f.parts[s]();delete i[f.id]}}}};var v,y=(v=[],function(t,n){return v[t]=n,v.filter(Boolean).join("\n")});function w(t,n,e,o){var r=e?"":o.css;if(t.styleSheet)t.styleSheet.cssText=y(n,r);else{var i=document.createTextNode(r),l=t.childNodes;l[n]&&t.removeChild(l[n]),l.length?t.insertBefore(i,l[n]):t.appendChild(i)}}},function(t,n){t.exports=function(t){var n="undefined"!=typeof window&&window.location;if(!n)throw new Error("fixUrls requires window.location");if(!t||"string"!=typeof t)return t;var e=n.protocol+"//"+n.host,o=e+n.pathname.replace(/\/[^\/]*$/,"/");return t.replace(/url\s*\(((?:[^)(]|\((?:[^)(]+|\([^)(]*\))*\))*)\)/gi,function(t,n){var r,i=n.trim().replace(/^"(.*)"$/,function(t,n){return n}).replace(/^'(.*)'$/,function(t,n){return n});return/^(#|data:|http:\/\/|https:\/\/|file:\/\/\/)/i.test(i)?t:(r=0===i.indexOf("//")?i:0===i.indexOf("/")?e+i:o+i.replace(/^\.\//,""),"url("+JSON.stringify(r)+")")})}},function(t,n,e){"use strict";e.r(n);var o=e(1),r=e.n(o),i=e(0),l=e.n(i);e(2);function f(t){return(f="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function s(t,n){for(var e=0;e<n.length;e++){var o=n[e];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(t,o.key,o)}}function a(t,n){return!n||"object"!==f(n)&&"function"!=typeof n?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):n}function p(t){return(p=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function c(t,n){return(c=Object.setPrototypeOf||function(t,n){return t.__proto__=n,t})(t,n)}var u=["top","tl","tr","left","lt","lb","right","rt","rb","bottom","bl","br"],b=function(t){function n(t){var e;return function(t,n){if(!(t instanceof n))throw new TypeError("Cannot call a class as a function")}(this,n),(e=a(this,p(n).call(this,t))).state={position:u.includes(e.props.position)?e.props.position:"right",content:e.props.content,isVisible:e.props.defaultVisible,trigger:e.props.trigger},e}var e,o,i;return function(t,n){if("function"!=typeof n&&null!==n)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(n&&n.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),n&&c(t,n)}(n,r.a.Component),e=n,(o=[{key:"mouseEnter",value:function(){this.props.mouseEnter&&this.props.mouseEnter()}},{key:"mouseLeave",value:function(){this.setState({isVisible:!1,isFocus:!1}),this.props.mouseLeave&&this.props.mouseLeave()}},{key:"click",value:function(){"click"===this.state.trigger&&this.setState({isVisible:!0}),this.props.click&&this.props.click()}},{key:"render",value:function(){return r.a.createElement("span",{className:"tooltip-ff tooltip-ff-".concat(this.state.position," ").concat(this.props.className)},r.a.createElement("span",{className:"content ".concat("hover"===this.state.trigger?"active":""),onMouseEnter:this.mouseEnter.bind(this),onMouseLeave:this.mouseLeave.bind(this),onClick:this.click.bind(this)},this.props.children),this.state.content?r.a.createElement("span",{className:"box box-".concat(this.state.position," ").concat(this.state.isVisible?"visible":"")},this.state.content):null)}}])&&s(e.prototype,o),i&&s(e,i),n}();b.propTypes={position:l.a.oneOf(["top","tl","tr","left","lt","lb","right","rt","rb","bottom","bl","br"]),defaultVisible:l.a.oneOfType([l.a.bool,l.a.string]),trigger:l.a.string,mouseEnter:l.a.func,mouseLeave:l.a.func,click:l.a.func},b.defaultProps={position:"right",defaultVisible:!1,trigger:"hover"};var d=b;n.default=d}]);