UNPKG

eslink-ui-plus

Version:

vue3 component library, css framework

165 lines (164 loc) 20.7 kB
(function(o,O){typeof exports=="object"&&typeof module!="undefined"?module.exports=O(require("vue"),require("lodash-es")):typeof define=="function"&&define.amd?define(["vue","lodash-es"],O):(o=typeof globalThis!="undefined"?globalThis:o||self,o["es-option"]=O(o.Vue,o._))})(this,function(o,O){"use strict";const j={labelKey:"label",valueKey:"value",disabledKey:"disabled",childrenKey:"children"},Y={type:Object,default:()=>j},K={type:Boolean,default:!1},D=(n=null)=>{const i=o.ref(n);return[i,g=>{i.value=g},()=>i.value]};var H=typeof globalThis!="undefined"?globalThis:typeof window!="undefined"?window:typeof global!="undefined"?global:typeof self!="undefined"?self:{},M={exports:{}};/*! * clipboard.js v2.0.8 * https://clipboardjs.com/ * * Licensed MIT © Zeno Rocha */(function(n,i){(function(m,g){n.exports=g()})(H,function(){return function(){var f={134:function(d,c,e){e.d(c,{default:function(){return xe}});var a=e(279),p=e.n(a),y=e(370),x=e.n(y),l=e(817),_=e.n(l);function b(s){return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?b=function(t){return typeof t}:b=function(t){return t&&typeof Symbol=="function"&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},b(s)}function k(s,r){if(!(s instanceof r))throw new TypeError("Cannot call a class as a function")}function v(s,r){for(var t=0;t<r.length;t++){var u=r[t];u.enumerable=u.enumerable||!1,u.configurable=!0,"value"in u&&(u.writable=!0),Object.defineProperty(s,u.key,u)}}function E(s,r,t){return r&&v(s.prototype,r),t&&v(s,t),s}var de=function(){function s(r){k(this,s),this.resolveOptions(r),this.initSelection()}return E(s,[{key:"resolveOptions",value:function(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.action=t.action,this.container=t.container,this.emitter=t.emitter,this.target=t.target,this.text=t.text,this.trigger=t.trigger,this.selectedText=""}},{key:"initSelection",value:function(){this.text?this.selectFake():this.target&&this.selectTarget()}},{key:"createFakeElement",value:function(){var t=document.documentElement.getAttribute("dir")==="rtl";this.fakeElem=document.createElement("textarea"),this.fakeElem.style.fontSize="12pt",this.fakeElem.style.border="0",this.fakeElem.style.padding="0",this.fakeElem.style.margin="0",this.fakeElem.style.position="absolute",this.fakeElem.style[t?"right":"left"]="-9999px";var u=window.pageYOffset||document.documentElement.scrollTop;return this.fakeElem.style.top="".concat(u,"px"),this.fakeElem.setAttribute("readonly",""),this.fakeElem.value=this.text,this.fakeElem}},{key:"selectFake",value:function(){var t=this,u=this.createFakeElement();this.fakeHandlerCallback=function(){return t.removeFake()},this.fakeHandler=this.container.addEventListener("click",this.fakeHandlerCallback)||!0,this.container.appendChild(u),this.selectedText=_()(u),this.copyText(),this.removeFake()}},{key:"removeFake",value:function(){this.fakeHandler&&(this.container.removeEventListener("click",this.fakeHandlerCallback),this.fakeHandler=null,this.fakeHandlerCallback=null),this.fakeElem&&(this.container.removeChild(this.fakeElem),this.fakeElem=null)}},{key:"selectTarget",value:function(){this.selectedText=_()(this.target),this.copyText()}},{key:"copyText",value:function(){var t;try{t=document.execCommand(this.action)}catch(u){t=!1}this.handleResult(t)}},{key:"handleResult",value:function(t){this.emitter.emit(t?"success":"error",{action:this.action,text:this.selectedText,trigger:this.trigger,clearSelection:this.clearSelection.bind(this)})}},{key:"clearSelection",value:function(){this.trigger&&this.trigger.focus(),document.activeElement.blur(),window.getSelection().removeAllRanges()}},{key:"destroy",value:function(){this.removeFake()}},{key:"action",set:function(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:"copy";if(this._action=t,this._action!=="copy"&&this._action!=="cut")throw new Error('Invalid "action" value, use either "copy" or "cut"')},get:function(){return this._action}},{key:"target",set:function(t){if(t!==void 0)if(t&&b(t)==="object"&&t.nodeType===1){if(this.action==="copy"&&t.hasAttribute("disabled"))throw new Error('Invalid "target" attribute. Please use "readonly" instead of "disabled" attribute');if(this.action==="cut"&&(t.hasAttribute("readonly")||t.hasAttribute("disabled")))throw new Error(`Invalid "target" attribute. You can't cut text from elements with "readonly" or "disabled" attributes`);this._target=t}else throw new Error('Invalid "target" value, use a valid Element')},get:function(){return this._target}}]),s}(),pe=de;function C(s){return typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?C=function(t){return typeof t}:C=function(t){return t&&typeof Symbol=="function"&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},C(s)}function he(s,r){if(!(s instanceof r))throw new TypeError("Cannot call a class as a function")}function z(s,r){for(var t=0;t<r.length;t++){var u=r[t];u.enumerable=u.enumerable||!1,u.configurable=!0,"value"in u&&(u.writable=!0),Object.defineProperty(s,u.key,u)}}function be(s,r,t){return r&&z(s.prototype,r),t&&z(s,t),s}function ye(s,r){if(typeof r!="function"&&r!==null)throw new TypeError("Super expression must either be null or a function");s.prototype=Object.create(r&&r.prototype,{constructor:{value:s,writable:!0,configurable:!0}}),r&&V(s,r)}function V(s,r){return V=Object.setPrototypeOf||function(u,h){return u.__proto__=h,u},V(s,r)}function me(s){var r=_e();return function(){var u=P(s),h;if(r){var w=P(this).constructor;h=Reflect.construct(u,arguments,w)}else h=u.apply(this,arguments);return ge(this,h)}}function ge(s,r){return r&&(C(r)==="object"||typeof r=="function")?r:ve(s)}function ve(s){if(s===void 0)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return s}function _e(){if(typeof Reflect=="undefined"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],function(){})),!0}catch(s){return!1}}function P(s){return P=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)},P(s)}function N(s,r){var t="data-clipboard-".concat(s);if(!!r.hasAttribute(t))return r.getAttribute(t)}var ke=function(s){ye(t,s);var r=me(t);function t(u,h){var w;return he(this,t),w=r.call(this),w.resolveOptions(h),w.listenClick(u),w}return be(t,[{key:"resolveOptions",value:function(){var h=arguments.length>0&&arguments[0]!==void 0?arguments[0]:{};this.action=typeof h.action=="function"?h.action:this.defaultAction,this.target=typeof h.target=="function"?h.target:this.defaultTarget,this.text=typeof h.text=="function"?h.text:this.defaultText,this.container=C(h.container)==="object"?h.container:document.body}},{key:"listenClick",value:function(h){var w=this;this.listener=x()(h,"click",function(A){return w.onClick(A)})}},{key:"onClick",value:function(h){var w=h.delegateTarget||h.currentTarget;this.clipboardAction&&(this.clipboardAction=null),this.clipboardAction=new pe({action:this.action(w),target:this.target(w),text:this.text(w),container:this.container,trigger:w,emitter:this})}},{key:"defaultAction",value:function(h){return N("action",h)}},{key:"defaultTarget",value:function(h){var w=N("target",h);if(w)return document.querySelector(w)}},{key:"defaultText",value:function(h){return N("text",h)}},{key:"destroy",value:function(){this.listener.destroy(),this.clipboardAction&&(this.clipboardAction.destroy(),this.clipboardAction=null)}}],[{key:"isSupported",value:function(){var h=arguments.length>0&&arguments[0]!==void 0?arguments[0]:["copy","cut"],w=typeof h=="string"?[h]:h,A=!!document.queryCommandSupported;return w.forEach(function(we){A=A&&!!document.queryCommandSupported(we)}),A}}]),t}(p()),xe=ke},828:function(d){var c=9;if(typeof Element!="undefined"&&!Element.prototype.matches){var e=Element.prototype;e.matches=e.matchesSelector||e.mozMatchesSelector||e.msMatchesSelector||e.oMatchesSelector||e.webkitMatchesSelector}function a(p,y){for(;p&&p.nodeType!==c;){if(typeof p.matches=="function"&&p.matches(y))return p;p=p.parentNode}}d.exports=a},438:function(d,c,e){var a=e(828);function p(l,_,b,k,v){var E=x.apply(this,arguments);return l.addEventListener(b,E,v),{destroy:function(){l.removeEventListener(b,E,v)}}}function y(l,_,b,k,v){return typeof l.addEventListener=="function"?p.apply(null,arguments):typeof b=="function"?p.bind(null,document).apply(null,arguments):(typeof l=="string"&&(l=document.querySelectorAll(l)),Array.prototype.map.call(l,function(E){return p(E,_,b,k,v)}))}function x(l,_,b,k){return function(v){v.delegateTarget=a(v.target,_),v.delegateTarget&&k.call(l,v)}}d.exports=y},879:function(d,c){c.node=function(e){return e!==void 0&&e instanceof HTMLElement&&e.nodeType===1},c.nodeList=function(e){var a=Object.prototype.toString.call(e);return e!==void 0&&(a==="[object NodeList]"||a==="[object HTMLCollection]")&&"length"in e&&(e.length===0||c.node(e[0]))},c.string=function(e){return typeof e=="string"||e instanceof String},c.fn=function(e){var a=Object.prototype.toString.call(e);return a==="[object Function]"}},370:function(d,c,e){var a=e(879),p=e(438);function y(b,k,v){if(!b&&!k&&!v)throw new Error("Missing required arguments");if(!a.string(k))throw new TypeError("Second argument must be a String");if(!a.fn(v))throw new TypeError("Third argument must be a Function");if(a.node(b))return x(b,k,v);if(a.nodeList(b))return l(b,k,v);if(a.string(b))return _(b,k,v);throw new TypeError("First argument must be a String, HTMLElement, HTMLCollection, or NodeList")}function x(b,k,v){return b.addEventListener(k,v),{destroy:function(){b.removeEventListener(k,v)}}}function l(b,k,v){return Array.prototype.forEach.call(b,function(E){E.addEventListener(k,v)}),{destroy:function(){Array.prototype.forEach.call(b,function(E){E.removeEventListener(k,v)})}}}function _(b,k,v){return p(document.body,b,k,v)}d.exports=y},817:function(d){function c(e){var a;if(e.nodeName==="SELECT")e.focus(),a=e.value;else if(e.nodeName==="INPUT"||e.nodeName==="TEXTAREA"){var p=e.hasAttribute("readonly");p||e.setAttribute("readonly",""),e.select(),e.setSelectionRange(0,e.value.length),p||e.removeAttribute("readonly"),a=e.value}else{e.hasAttribute("contenteditable")&&e.focus();var y=window.getSelection(),x=document.createRange();x.selectNodeContents(e),y.removeAllRanges(),y.addRange(x),a=y.toString()}return a}d.exports=c},279:function(d){function c(){}c.prototype={on:function(e,a,p){var y=this.e||(this.e={});return(y[e]||(y[e]=[])).push({fn:a,ctx:p}),this},once:function(e,a,p){var y=this;function x(){y.off(e,x),a.apply(p,arguments)}return x._=a,this.on(e,x,p)},emit:function(e){var a=[].slice.call(arguments,1),p=((this.e||(this.e={}))[e]||[]).slice(),y=0,x=p.length;for(y;y<x;y++)p[y].fn.apply(p[y].ctx,a);return this},off:function(e,a){var p=this.e||(this.e={}),y=p[e],x=[];if(y&&a)for(var l=0,_=y.length;l<_;l++)y[l].fn!==a&&y[l].fn._!==a&&x.push(y[l]);return x.length?p[e]=x:delete p[e],this}},d.exports=c,d.exports.TinyEmitter=c}},m={};function g(d){if(m[d])return m[d].exports;var c=m[d]={exports:{}};return f[d](c,c.exports,g),c.exports}return function(){g.n=function(d){var c=d&&d.__esModule?function(){return d.default}:function(){return d};return g.d(c,{a:c}),c}}(),function(){g.d=function(d,c){for(var e in c)g.o(c,e)&&!g.o(d,e)&&Object.defineProperty(d,e,{enumerable:!0,get:c[e]})}}(),function(){g.o=function(d,c){return Object.prototype.hasOwnProperty.call(d,c)}}(),g(134)}().default})})(M);var U=Object.defineProperty,q=Object.defineProperties,G=Object.getOwnPropertyDescriptors,B=Object.getOwnPropertySymbols,X=Object.prototype.hasOwnProperty,J=Object.prototype.propertyIsEnumerable,R=(n,i,f)=>i in n?U(n,i,{enumerable:!0,configurable:!0,writable:!0,value:f}):n[i]=f,Q=(n,i)=>{for(var f in i||(i={}))X.call(i,f)&&R(n,f,i[f]);if(B)for(var f of B(i))J.call(i,f)&&R(n,f,i[f]);return n},W=(n,i)=>q(n,G(i)),S=o.defineComponent({props:{modelValue:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},labelText:{type:String,default:""},indeterminate:Boolean},emits:["update:modelValue","change","select"],setup(n,i){const{emit:f}=i,m=o.reactive({checked:n.modelValue,indeterminate:n.indeterminate}),{modelValue:g,disabled:d}=o.toRefs(n),c=e=>{if(d.value)return;const a=!g.value;m.indeterminate?(m.checked=!0,m.indeterminate=!1):(m.checked=!m.checked,m.checked&&(m.indeterminate=!1)),f("select",{e,data:a}),f("update:modelValue",a)};return o.watch(g,(e,a)=>{e!==a&&(m.checked=e,f("change",e))}),o.watch(()=>m.indeterminate,()=>{m.indeterminate&&(m.checked=!1)}),W(Q({},o.toRefs(m)),{toggleChecked:c})}});o.pushScopeId("data-v-ab10b2fe");const Z=["checked"],ee={class:"es-checkbox__name"};o.popScopeId();function te(n,i,f,m,g,d){return o.openBlock(),o.createElementBlock("label",{class:o.normalizeClass(["es-checkbox",{"is-disabled":n.disabled}]),onClick:i[0]||(i[0]=o.withModifiers((...c)=>n.toggleChecked&&n.toggleChecked(...c),["prevent"]))},[o.createElementVNode("span",{class:o.normalizeClass(["es-checkbox__label",{"is-checked":n.checked,"is-disabled":n.disabled,"is-indeterminate":n.indeterminate}])},null,2),o.createElementVNode("input",{class:"es-checkbox__value",type:"checkbox",checked:n.checked},null,8,Z),o.createElementVNode("span",ee,[o.renderSlot(n.$slots,"default",{},()=>[o.createTextVNode(o.toDisplayString(n.labelText),1)])])],2)}function L(n,i){i===void 0&&(i={});var f=i.insertAt;if(!(!n||typeof document=="undefined")){var m=document.head||document.getElementsByTagName("head")[0],g=document.createElement("style");g.type="text/css",f==="top"&&m.firstChild?m.insertBefore(g,m.firstChild):m.appendChild(g),g.styleSheet?g.styleSheet.cssText=n:g.appendChild(document.createTextNode(n))}}var ne=`.es-checkbox[data-v-ab10b2fe] { height: 22px; line-height: 22px; -webkit-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; display: inline-block; } .es-checkbox.is-disabled[data-v-ab10b2fe] { cursor: not-allowed; } .es-checkbox:hover .es-checkbox__label[data-v-ab10b2fe] { border-color: #1b9dde; } .es-checkbox:hover .es-checkbox__label.is-disabled[data-v-ab10b2fe] { border-color: #e4e7ec; } .es-checkbox__label[data-v-ab10b2fe] { width: 16px; height: 16px; background: #ffffff; border: 1px solid #e4e7ec; box-sizing: border-box; border-radius: 2px; display: inline-block; position: relative; vertical-align: middle; } .es-checkbox__label[data-v-ab10b2fe]::after { content: ""; position: absolute; width: 1px; height: 9px; left: 8px; top: 3px; background: #ffffff; border-radius: 1px; -webkit-transform-origin: center; transform-origin: center; } .es-checkbox__label[data-v-ab10b2fe]::before { content: ""; position: absolute; width: 1px; height: 4px; left: 4px; top: 7px; background: #ffffff; border-radius: 1px; -webkit-transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(0); transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(0); -webkit-transform-origin: center; transform-origin: center; } .es-checkbox__label.is-checked[data-v-ab10b2fe] { background: #148dd2; border: 0; } .es-checkbox__label.is-checked[data-v-ab10b2fe]::before { -webkit-transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1); transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1); } .es-checkbox__label.is-checked[data-v-ab10b2fe]::after { -webkit-transform: rotate(42deg) scaleY(1); transform: rotate(42deg) scaleY(1); } .es-checkbox__label.is-indeterminate[data-v-ab10b2fe] { background-color: #148dd2; border-color: #148dd2; } .es-checkbox__label.is-indeterminate[data-v-ab10b2fe]::before { content: ""; position: absolute; display: block; background-color: #fff; width: 14px; height: 3px; -webkit-transform: scale(0.5); transform: scale(0.5); left: 0; right: 0; top: 5px; } .es-checkbox__label.is-indeterminate[data-v-ab10b2fe]::after { display: none; } .es-checkbox__label.is-disabled[data-v-ab10b2fe] { background: #f5f7fa; border: 1px solid #e4e7ec; } .es-checkbox__label.is-disabled ~ span.es-checkbox__name[data-v-ab10b2fe] { color: #a3a9b3; } .es-checkbox__label.is-checked.is-disabled[data-v-ab10b2fe]::before { background: #a3a9b3; -webkit-transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1); transform: matrix(-0.74, 0.67, 0.67, 0.74, 0, 0) scaleY(1); } .es-checkbox__label.is-checked.is-disabled[data-v-ab10b2fe]::after { background: #a3a9b3; -webkit-transform: rotate(42deg) scaleY(1); transform: rotate(42deg) scaleY(1); } .es-checkbox__value[data-v-ab10b2fe] { opacity: 0; outline: none; position: absolute; margin: 0; width: 0; height: 0; z-index: -1; } .es-checkbox__name[data-v-ab10b2fe] { height: 22px; color: #515c70; font-family: PingFangSC; font-size: 14px; line-height: 22px; margin-left: 8px; vertical-align: middle; }`;L(ne),S.render=te,S.__scopeId="data-v-ab10b2fe",S.__file="components/checkbox/index.vue",S.install=n=>{n.component("es-checkbox",S)};var oe=Object.defineProperty,$=Object.getOwnPropertySymbols,re=Object.prototype.hasOwnProperty,ie=Object.prototype.propertyIsEnumerable,F=(n,i,f)=>i in n?oe(n,i,{enumerable:!0,configurable:!0,writable:!0,value:f}):n[i]=f,I=(n,i)=>{for(var f in i||(i={}))re.call(i,f)&&F(n,f,i[f]);if($)for(var f of $(i))ie.call(i,f)&&F(n,f,i[f]);return n},T=o.defineComponent({components:{EsCheckbox:S},props:{styles:{type:Object,default:()=>({})},modelValue:{type:[Array,String,Number],default:""},keyConfig:Y,source:{type:Object,default:()=>[]},multiple:K,showCheckBox:{type:Boolean,default:!0},maxLen:{type:Number,default:10}},emits:["change","select","update:modelValue"],setup(n,{emit:i}){const{valueKey:f,labelKey:m,disabledKey:g,childrenKey:d}=I(I({},j),n.keyConfig),c=l=>{if(l=o.toRaw(l),!n.multiple)return new Set([l]);const _=Array.isArray(l);return new Set(_?[...l]:[l])},[e]=D(c(n.modelValue)),a=o.computed(()=>n.multiple?[...e.value]:[...e.value][0]);return o.watch(()=>n.modelValue,(l,_)=>{O.isEqual(l,_)||(e.value=c(l))}),{active:e,isActived:l=>e.value.has(l[f]),toggleActived:l=>{const _=l[f];n.multiple?e.value.has(_)?e.value.delete(_):e.value.add(_):e.value=new Set([_]);const b=a.value;i("select",{item:l,value:b}),i("change",a.value),i("update:modelValue",b)},valueKey:f,labelKey:m,disabledKey:g,childrenKey:d,emitValue:a,useShow:l=>Reflect.has(l,"show")?l.show:!0}}});o.pushScopeId("data-v-bfbc4d1a");const ae={class:"es-option__content"},se=["onClick"],ce={key:1,class:"es-option__content__item__label"},le={key:1,class:"es-option__content__no-source"};o.popScopeId();function fe(n,i,f,m,g,d){const c=o.resolveComponent("es-checkbox");return o.openBlock(),o.createElementBlock("div",{class:"es-option",style:o.normalizeStyle(n.styles)},[o.createElementVNode("div",ae,[n.source&&n.source.length?(o.openBlock(!0),o.createElementBlock(o.Fragment,{key:0},o.renderList(n.source,(e,a)=>o.withDirectives((o.openBlock(),o.createElementBlock("div",{class:o.normalizeClass(["es-option__content__item",{active:n.isActived(e)}]),key:e[n.valueKey],onClick:p=>n.toggleActived(e)},[o.renderSlot(n.$slots,"default",{item:e,active:n.emitValue},()=>[n.multiple&&n.showCheckBox?(o.openBlock(),o.createBlock(c,{key:0,class:"es-option__content__item__checkbox",modelValue:n.isActived(e)},{default:o.withCtx(()=>[o.createTextVNode(o.toDisplayString(e[n.labelKey]),1)]),_:2},1032,["modelValue"])):(o.openBlock(),o.createElementBlock("span",ce,o.toDisplayString(e[n.labelKey]),1))])],10,se)),[[o.vShow,n.useShow(e)&&a+1<=n.maxLen]])),128)):(o.openBlock(),o.createElementBlock("div",le,"\u6682\u65E0\u6570\u636E"))])],4)}var ue=`.es-option[data-v-bfbc4d1a] { display: inline-block; width: 100%; background: #ffffff; box-shadow: 0px 6px 12px -6px rgba(24, 39, 75, 0.12), 0px 8px 24px -4px rgba(24, 39, 75, 0.08); border-radius: 4px; } .es-option__content[data-v-bfbc4d1a] { display: flex; flex-direction: column; } .es-option__content__no-source[data-v-bfbc4d1a] { display: flex; align-items: center; justify-content: center; color: #bbbcc9; } .es-option__content__item[data-v-bfbc4d1a] { display: flex; align-items: center; color: #3e4051; line-height: 21px; min-width: 331px; font-size: 14px; margin-top: 1px; cursor: pointer; padding: 6px 12px 5px 12px; } .es-option__content__item.active[data-v-bfbc4d1a] { background: #eaf1ff; color: #282934; font-weight: 600; } .es-option__content__item[data-v-bfbc4d1a]:hover { background: #eaf1ff; }`;return L(ue),T.render=fe,T.__scopeId="data-v-bfbc4d1a",T.__file="components/option/index.vue",T.install=n=>{n.component("es-option",T)},T});