@todovue/tv-search 1.0.4 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/tv-search.cjs.js +2 -2
- package/dist/tv-search.es.js +24 -28
- package/package.json +1 -1
package/dist/tv-search.cjs.js
CHANGED
|
@@ -495,7 +495,7 @@ z"/>
|
|
|
495
495
|
<title>view</title>
|
|
496
496
|
<path d="M12.406 13.844c1.188 0 2.156 0.969 2.156 2.156s-0.969 2.125-2.156 2.125-2.125-0.938-2.125-2.125 0.938-2.156 2.125-2.156zM12.406 8.531c7.063 0 12.156 6.625 12.156 6.625 0.344 0.438 0.344 1.219 0 1.656 0 0-5.094 6.625-12.156 6.625s-12.156-6.625-12.156-6.625c-0.344-0.438-0.344-1.219 0-1.656 0 0 5.094-6.625 12.156-6.625zM12.406 21.344c2.938 0 5.344-2.406 5.344-5.344s-2.406-5.344-5.344-5.344-5.344 2.406-5.344 5.344 2.406 5.344 5.344 5.344z"></path>
|
|
497
497
|
</svg>
|
|
498
|
-
`,i1=(o,
|
|
498
|
+
`,i1=(o,C)=>{const l=e.ref(!1),c=()=>{C("clickButton"),C("click")},a=n=>{l.value=n},g=n=>!n||n[0]!=="#"?n:`#${n.match(/\w\w/g).map(r=>parseInt(r,16)*.9).map(r=>Math.floor(r).toString(16).padStart(2,"0")).join("")}`,p=e.computed(()=>({"tv-btn-rounded":o.isRounded||o.rounded,"tv-btn-full":o.isFull||o.full,"tv-btn-outlined":o.isOutlined||o.outlined,"tv-btn-small":o.isSmall||o.small,"tv-btn-large":o.isLarge||o.large,"tv-btn-success":o.isSuccess||o.success,"tv-btn-info":o.isInfo||o.info,"tv-btn-warning":o.isWarning||o.warning,"tv-btn-error":o.isError||o.error,"tv-btn-disabled":o.isDisabled||o.disabled||o.loading||o.isLoading,"tv-btn-text":o.isText||o.text,"tv-btn-icon":o.type==="icon","tv-btn-icon-only":o.type==="icon"&&o.iconOnly})),d=e.computed(()=>{if(!o.customStyle)return{};const n={backgroundColor:o.customStyle.backgroundColor||"transparent",color:o.customStyle.color||"inherit",boxShadow:`0 0 5px ${o.customStyle.backgroundColor||"transparent"}`};return o.isOutlined||o.outlined?{backgroundColor:"transparent",border:`1px solid ${o.customStyle.backgroundColor}`,color:o.customStyle.backgroundColor,boxShadow:n.boxShadow}:n}),v=e.computed(()=>o.customStyle?o.isOutlined||o.outlined?{backgroundColor:o.customStyle.backgroundColor,color:o.customStyle.color}:{backgroundColor:g(o.customStyle.backgroundColor),boxShadow:"none"}:{});return{isHover:l,handleClick:c,manageHover:a,buttonClasses:p,buttonStyleCustom:d,buttonStyleHover:v}},c1=["aria-label","disabled","type"],a1={class:"tv-btn-content"},C1=["innerHTML"],d1=["innerHTML"],g1={class:"tv-btn-text"},v1=["innerHTML"],x={__name:"TvButton",props:{buttonText:String,customStyle:Object,icon:String,iconColor:{type:String,default:"white"},iconPosition:{type:String,default:"right"},isCircle:Boolean,isDisabled:Boolean,isError:Boolean,isFull:Boolean,isInfo:Boolean,isLarge:Boolean,isOutlined:Boolean,isRounded:Boolean,isSmall:Boolean,isSuccess:Boolean,isText:Boolean,isWarning:Boolean,isLoading:Boolean,iconOnly:Boolean,type:{type:String,default:"button"},ariaLabel:String,circle:Boolean,disabled:Boolean,error:Boolean,full:Boolean,info:Boolean,large:Boolean,outlined:Boolean,rounded:Boolean,small:Boolean,success:Boolean,text:Boolean,warning:Boolean,loading:Boolean},emits:["clickButton","click"],setup(o,{emit:C}){const l=o,c=Object.assign({"../assets/icons/account.svg":M,"../assets/icons/add-user.svg":B,"../assets/icons/alert.svg":b,"../assets/icons/arrow-down.svg":L,"../assets/icons/arrow-left.svg":S,"../assets/icons/arrow-right.svg":V,"../assets/icons/arrow-up.svg":H,"../assets/icons/block.svg":Z,"../assets/icons/calendar.svg":z,"../assets/icons/cancel.svg":A,"../assets/icons/check.svg":j,"../assets/icons/clone.svg":_,"../assets/icons/dark.svg":E,"../assets/icons/download.svg":T,"../assets/icons/edit.svg":N,"../assets/icons/external-link.svg":$,"../assets/icons/favorite.svg":I,"../assets/icons/filter.svg":O,"../assets/icons/help.svg":D,"../assets/icons/info.svg":P,"../assets/icons/light.svg":F,"../assets/icons/loading.svg":K,"../assets/icons/lock.svg":q,"../assets/icons/login.svg":U,"../assets/icons/logout.svg":W,"../assets/icons/menu.svg":G,"../assets/icons/minus.svg":J,"../assets/icons/notification.svg":Q,"../assets/icons/plus.svg":R,"../assets/icons/remove.svg":X,"../assets/icons/search.svg":Y,"../assets/icons/settings.svg":e1,"../assets/icons/share.svg":o1,"../assets/icons/star.svg":s1,"../assets/icons/todovue.svg":t1,"../assets/icons/unlock.svg":n1,"../assets/icons/update.svg":l1,"../assets/icons/view.svg":r1}),a=C,g=e.computed(()=>c[`../assets/icons/${l.icon}.svg`]||""),p=c["../assets/icons/loading.svg"]||"",{buttonClasses:d,buttonStyleCustom:v,buttonStyleHover:n,isHover:r,handleClick:u,manageHover:w}=i1(l,a),k=e.computed(()=>({...v.value,...r.value?n.value:{}}));return(i,t)=>(e.openBlock(),e.createElementBlock("button",{"aria-label":o.ariaLabel,class:e.normalizeClass([e.unref(d),"tv-btn"]),disabled:o.isDisabled||o.isLoading||o.disabled||o.loading,style:e.normalizeStyle(k.value),type:o.type,onClick:t[0]||(t[0]=(...s)=>e.unref(u)&&e.unref(u)(...s)),onMouseleave:t[1]||(t[1]=s=>e.unref(w)(!1)),onMouseover:t[2]||(t[2]=s=>e.unref(w)(!0))},[e.createElementVNode("span",a1,[o.isLoading||o.loading?(e.openBlock(),e.createElementBlock("span",{key:0,class:"tv-spinner",innerHTML:e.unref(p)},null,8,C1)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[o.icon&&o.iconPosition==="left"?(e.openBlock(),e.createElementBlock("span",{key:0,class:"tv-icon icon-left",innerHTML:g.value},null,8,d1)):e.createCommentVNode("",!0),e.createElementVNode("span",g1,[o.buttonText?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(o.buttonText),1)],64)):e.renderSlot(i.$slots,"default",{key:1})]),o.icon&&o.iconPosition==="right"?(e.openBlock(),e.createElementBlock("span",{key:1,class:"tv-icon icon-right",innerHTML:g.value},null,8,v1)):e.createCommentVNode("",!0)],64))])],46,c1))}};x.install=o=>{o.component("TvButton",x)};const u1=`<svg class="tv-icon-svg" version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129">
|
|
499
499
|
<g>
|
|
500
500
|
<path d="M51.6,96.7c11,0,21-3.9,28.8-10.5l35,35c0.8,0.8,1.8,1.2,2.9,1.2s2.1-0.4,2.9-1.2c1.6-1.6,1.6-4.2,0-5.8l-35-35
|
|
501
501
|
c6.5-7.8,10.5-17.9,10.5-28.8c0-24.9-20.2-45.1-45.1-45.1C26.8,6.5,6.5,26.8,6.5,51.6C6.5,76.5,26.8,96.7,51.6,96.7z
|
|
@@ -503,4 +503,4 @@ z"/>
|
|
|
503
503
|
fill="currentColor"/>
|
|
504
504
|
</g>
|
|
505
505
|
</svg>
|
|
506
|
-
`,p1=(o,
|
|
506
|
+
`,p1=(o,C)=>{const l=e.ref(""),c=e.ref(!1),a=e.ref(),g=Object.assign({"../assets/icons/search.svg":u1}),p=e.computed(()=>g["../assets/icons/search.svg"]||""),d=()=>{r(!0),u()},v=(s=null)=>{if(s&&(s instanceof Event||s?.target&&s?.preventDefault)&&(s=null),!(!l.value.trim()&&!s)){if(s){C("search",s),r(!1),l.value="";return}C("search",l.value.trim()),r(!1),l.value=""}},n=()=>{r(!1)},r=s=>{c.value=s},u=()=>{e.nextTick(()=>{a.value?.select()})},w=s=>{(s.ctrlKey||s.metaKey)&&s.key==="k"&&(s.preventDefault(),d()),s.key==="Escape"&&c.value&&n()};e.onMounted(()=>{document.addEventListener("keydown",w)}),e.onBeforeUnmount(()=>{document.removeEventListener("keydown",w)});const k=e.computed(()=>l.value.length<1?[]:o.results?.filter(s=>s.title.toLowerCase().includes(l.value.toLowerCase()))||[]),i=s=>{if(!s||s[0]!=="#")return s;const f=parseInt(s.slice(1,3),16),m=parseInt(s.slice(3,5),16),y=parseInt(s.slice(5,7),16);return`${f}, ${m}, ${y}`},t=e.computed(()=>{const{customStyles:s}=o;return s?{bgBody:{backgroundColor:`rgba(${i(s.bgBody)}, 0.9)`},bgInput:{backgroundColor:s.bgInput,boxShadow:`0 0 15px 0 ${s.bgInput}`},customButton:{backgroundColor:s.bgButton||"#ef233c",color:s.colorButton||"#f4faff"}}:{}});return{inputValue:l,inputSearch:a,openedModal:c,closeModal:n,openModal:d,search:v,filterResults:k,custom:t,iconContent:p}},w1={class:"tv-search"},h1=["innerHTML"],k1={class:"tv-search-modal-content-input"},x1=["placeholder"],f1={key:0,class:"tv-search-results"},m1=["onClick"],h={__name:"TvSearch",props:{placeholder:{type:String,default:""},titleButton:{type:String,default:""},results:{type:Array,default:()=>[]},customStyles:{type:Object,default:()=>({})}},emits:["search"],setup(o,{emit:C}){const l=o,c=C,{inputValue:a,inputSearch:g,openedModal:p,closeModal:d,openModal:v,search:n,filterResults:r,custom:u,iconContent:w}=p1(l,c);return(k,i)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",w1,[e.createElementVNode("i",{class:"tv-cursor-pointer tv-search-icon",innerHTML:e.unref(w),onClick:i[0]||(i[0]=(...t)=>e.unref(v)&&e.unref(v)(...t))},null,8,h1)]),e.unref(p)?(e.openBlock(),e.createElementBlock("div",{key:0,class:"tv-search-modal",onClick:i[4]||(i[4]=e.withModifiers((...t)=>e.unref(d)&&e.unref(d)(...t),["self"])),style:e.normalizeStyle(e.unref(u).bgBody)},[e.createElementVNode("div",{class:"tv-search-modal-content",style:e.normalizeStyle(e.unref(u).bgInput)},[e.createElementVNode("div",k1,[e.withDirectives(e.createElementVNode("input",{type:"text","onUpdate:modelValue":i[1]||(i[1]=t=>e.isRef(a)?a.value=t:null),onKeyup:i[2]||(i[2]=e.withKeys(t=>e.unref(n)(),["enter"])),placeholder:o.placeholder,class:e.normalizeClass(["tv-search-input",{"tv-radius-none-bl":e.unref(r).length>=1}]),ref_key:"inputSearch",ref:g},null,42,x1),[[e.vModelText,e.unref(a)]]),e.createVNode(e.unref(x),{runded:"",icon:"search","icon-position":"left",onClick:i[3]||(i[3]=t=>e.unref(n)()),class:e.normalizeClass({"tv-radius-none-br":e.unref(r).length>=1}),customStyle:e.unref(u).customButton},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.titleButton),1)]),_:1},8,["class","customStyle"])]),e.unref(r).length>=1?(e.openBlock(),e.createElementBlock("div",f1,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(r),t=>(e.openBlock(),e.createElementBlock("p",{key:t.id,class:"tv-search-results-title tv-cursor-pointer",onClick:s=>e.unref(n)(t)},e.toDisplayString(t.title),9,m1))),128))])):e.createCommentVNode("",!0)],4)],4)):e.createCommentVNode("",!0)],64))}};h.install=o=>{o.component("TvSearch",h)};const y1={install(o){o.component("TvSearch",h)}};exports.TvSearch=h;exports.TvSearchPlugin=y1;exports.default=h;
|
package/dist/tv-search.es.js
CHANGED
|
@@ -496,10 +496,10 @@ z"/>
|
|
|
496
496
|
<title>view</title>
|
|
497
497
|
<path d="M12.406 13.844c1.188 0 2.156 0.969 2.156 2.156s-0.969 2.125-2.156 2.125-2.125-0.938-2.125-2.125 0.938-2.156 2.125-2.156zM12.406 8.531c7.063 0 12.156 6.625 12.156 6.625 0.344 0.438 0.344 1.219 0 1.656 0 0-5.094 6.625-12.156 6.625s-12.156-6.625-12.156-6.625c-0.344-0.438-0.344-1.219 0-1.656 0 0 5.094-6.625 12.156-6.625zM12.406 21.344c2.938 0 5.344-2.406 5.344-5.344s-2.406-5.344-5.344-5.344-5.344 2.406-5.344 5.344 2.406 5.344 5.344 5.344z"></path>
|
|
498
498
|
</svg>
|
|
499
|
-
`, Z1 = (s,
|
|
500
|
-
const l = y(!1),
|
|
501
|
-
|
|
502
|
-
},
|
|
499
|
+
`, Z1 = (s, g) => {
|
|
500
|
+
const l = y(!1), C = () => {
|
|
501
|
+
g("clickButton"), g("click");
|
|
502
|
+
}, d = (n) => {
|
|
503
503
|
l.value = n;
|
|
504
504
|
}, u = (n) => !n || n[0] !== "#" ? n : `#${n.match(/\w\w/g).map((r) => parseInt(r, 16) * 0.9).map((r) => Math.floor(r).toString(16).padStart(2, "0")).join("")}`, k = h(() => ({
|
|
505
505
|
"tv-btn-rounded": s.isRounded || s.rounded,
|
|
@@ -537,8 +537,8 @@ z"/>
|
|
|
537
537
|
} : {});
|
|
538
538
|
return {
|
|
539
539
|
isHover: l,
|
|
540
|
-
handleClick:
|
|
541
|
-
manageHover:
|
|
540
|
+
handleClick: C,
|
|
541
|
+
manageHover: d,
|
|
542
542
|
buttonClasses: k,
|
|
543
543
|
buttonStyleCustom: v,
|
|
544
544
|
buttonStyleHover: p
|
|
@@ -591,15 +591,15 @@ z"/>
|
|
|
591
591
|
loading: Boolean
|
|
592
592
|
},
|
|
593
593
|
emits: ["clickButton", "click"],
|
|
594
|
-
setup(s, { emit:
|
|
595
|
-
const l = s,
|
|
594
|
+
setup(s, { emit: g }) {
|
|
595
|
+
const l = s, C = /* @__PURE__ */ Object.assign({ "../assets/icons/account.svg": U, "../assets/icons/add-user.svg": W, "../assets/icons/alert.svg": G, "../assets/icons/arrow-down.svg": J, "../assets/icons/arrow-left.svg": Q, "../assets/icons/arrow-right.svg": R, "../assets/icons/arrow-up.svg": X, "../assets/icons/block.svg": Y, "../assets/icons/calendar.svg": s1, "../assets/icons/cancel.svg": o1, "../assets/icons/check.svg": e1, "../assets/icons/clone.svg": t1, "../assets/icons/dark.svg": n1, "../assets/icons/download.svg": l1, "../assets/icons/edit.svg": r1, "../assets/icons/external-link.svg": i1, "../assets/icons/favorite.svg": c1, "../assets/icons/filter.svg": a1, "../assets/icons/help.svg": C1, "../assets/icons/info.svg": d1, "../assets/icons/light.svg": g1, "../assets/icons/loading.svg": v1, "../assets/icons/lock.svg": u1, "../assets/icons/login.svg": p1, "../assets/icons/logout.svg": w1, "../assets/icons/menu.svg": h1, "../assets/icons/minus.svg": k1, "../assets/icons/notification.svg": x1, "../assets/icons/plus.svg": f1, "../assets/icons/remove.svg": m1, "../assets/icons/search.svg": y1, "../assets/icons/settings.svg": M1, "../assets/icons/share.svg": b1, "../assets/icons/star.svg": B1, "../assets/icons/todovue.svg": L1, "../assets/icons/unlock.svg": S1, "../assets/icons/update.svg": H1, "../assets/icons/view.svg": V1 }), d = g, u = h(() => C[`../assets/icons/${l.icon}.svg`] || ""), k = C["../assets/icons/loading.svg"] || "", {
|
|
596
596
|
buttonClasses: v,
|
|
597
597
|
buttonStyleCustom: p,
|
|
598
598
|
buttonStyleHover: n,
|
|
599
599
|
isHover: r,
|
|
600
600
|
handleClick: w,
|
|
601
601
|
manageHover: x
|
|
602
|
-
} = Z1(l,
|
|
602
|
+
} = Z1(l, d), m = h(() => ({
|
|
603
603
|
...p.value,
|
|
604
604
|
...r.value ? n.value : {}
|
|
605
605
|
}));
|
|
@@ -650,31 +650,27 @@ const I1 = `<svg class="tv-icon-svg" version="1.1" xmlns="http://www.w3.org/2000
|
|
|
650
650
|
fill="currentColor"/>
|
|
651
651
|
</g>
|
|
652
652
|
</svg>
|
|
653
|
-
`, E1 = (s,
|
|
654
|
-
const l = y(""),
|
|
653
|
+
`, E1 = (s, g) => {
|
|
654
|
+
const l = y(""), C = y(!1), d = y(), u = /* @__PURE__ */ Object.assign({ "../assets/icons/search.svg": I1 }), k = h(() => u["../assets/icons/search.svg"] || ""), v = () => {
|
|
655
655
|
r(!0), w();
|
|
656
656
|
}, p = (o = null) => {
|
|
657
657
|
if (o && (o instanceof Event || o?.target && o?.preventDefault) && (o = null), !(!l.value.trim() && !o)) {
|
|
658
658
|
if (o) {
|
|
659
|
-
|
|
659
|
+
g("search", o), r(!1), l.value = "";
|
|
660
660
|
return;
|
|
661
661
|
}
|
|
662
|
-
|
|
663
|
-
C("search", m.value[0]), r(!1), l.value = "";
|
|
664
|
-
return;
|
|
665
|
-
}
|
|
666
|
-
C("search", l.value.trim()), r(!1), l.value = "";
|
|
662
|
+
g("search", l.value.trim()), r(!1), l.value = "";
|
|
667
663
|
}
|
|
668
664
|
}, n = () => {
|
|
669
665
|
r(!1);
|
|
670
666
|
}, r = (o) => {
|
|
671
|
-
|
|
667
|
+
C.value = o;
|
|
672
668
|
}, w = () => {
|
|
673
669
|
I(() => {
|
|
674
|
-
|
|
670
|
+
d.value?.select();
|
|
675
671
|
});
|
|
676
672
|
}, x = (o) => {
|
|
677
|
-
(o.ctrlKey || o.metaKey) && o.key === "k" && (o.preventDefault(), v()), o.key === "Escape" &&
|
|
673
|
+
(o.ctrlKey || o.metaKey) && o.key === "k" && (o.preventDefault(), v()), o.key === "Escape" && C.value && n();
|
|
678
674
|
};
|
|
679
675
|
T(() => {
|
|
680
676
|
document.addEventListener("keydown", x);
|
|
@@ -703,8 +699,8 @@ const I1 = `<svg class="tv-icon-svg" version="1.1" xmlns="http://www.w3.org/2000
|
|
|
703
699
|
});
|
|
704
700
|
return {
|
|
705
701
|
inputValue: l,
|
|
706
|
-
inputSearch:
|
|
707
|
-
openedModal:
|
|
702
|
+
inputSearch: d,
|
|
703
|
+
openedModal: C,
|
|
708
704
|
closeModal: n,
|
|
709
705
|
openModal: v,
|
|
710
706
|
search: p,
|
|
@@ -736,9 +732,9 @@ const I1 = `<svg class="tv-icon-svg" version="1.1" xmlns="http://www.w3.org/2000
|
|
|
736
732
|
}
|
|
737
733
|
},
|
|
738
734
|
emits: ["search"],
|
|
739
|
-
setup(s, { emit:
|
|
740
|
-
const l = s,
|
|
741
|
-
inputValue:
|
|
735
|
+
setup(s, { emit: g }) {
|
|
736
|
+
const l = s, C = g, {
|
|
737
|
+
inputValue: d,
|
|
742
738
|
inputSearch: u,
|
|
743
739
|
openedModal: k,
|
|
744
740
|
closeModal: v,
|
|
@@ -747,7 +743,7 @@ const I1 = `<svg class="tv-icon-svg" version="1.1" xmlns="http://www.w3.org/2000
|
|
|
747
743
|
filterResults: r,
|
|
748
744
|
custom: w,
|
|
749
745
|
iconContent: x
|
|
750
|
-
} = E1(l,
|
|
746
|
+
} = E1(l, C);
|
|
751
747
|
return (m, i) => (a(), c(M, null, [
|
|
752
748
|
f("div", O1, [
|
|
753
749
|
f("i", {
|
|
@@ -769,14 +765,14 @@ const I1 = `<svg class="tv-icon-svg" version="1.1" xmlns="http://www.w3.org/2000
|
|
|
769
765
|
f("div", P1, [
|
|
770
766
|
O(f("input", {
|
|
771
767
|
type: "text",
|
|
772
|
-
"onUpdate:modelValue": i[1] || (i[1] = (t) => F(
|
|
768
|
+
"onUpdate:modelValue": i[1] || (i[1] = (t) => F(d) ? d.value = t : null),
|
|
773
769
|
onKeyup: i[2] || (i[2] = P((t) => e(n)(), ["enter"])),
|
|
774
770
|
placeholder: s.placeholder,
|
|
775
771
|
class: L(["tv-search-input", { "tv-radius-none-bl": e(r).length >= 1 }]),
|
|
776
772
|
ref_key: "inputSearch",
|
|
777
773
|
ref: u
|
|
778
774
|
}, null, 42, F1), [
|
|
779
|
-
[K, e(
|
|
775
|
+
[K, e(d)]
|
|
780
776
|
]),
|
|
781
777
|
D(e(H), {
|
|
782
778
|
runded: "",
|
package/package.json
CHANGED