vue-rating-input/dist/rating-input.umd.js

[](https://www.npmjs.com/package/vue-rating-input)

(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s["Vue Star Rating Input"]={},s.Vue))})(this,function(s,e){"use strict";var _=document.createElement("style");_.textContent=`.rating-svg-icons__defs[data-v-81a86319]{position:fixed;width:0;height:0;bottom:0;left:0;overflow:hidden}.v-rating__stars[data-v-96aa76e2]{display:flex;align-items:center}.v-rating__star[data-v-96aa76e2]{cursor:pointer;padding:.125rem;border:none;background:none;outline:none}.v-rating__star--is-readonly[data-v-96aa76e2]{cursor:default}.v-rating__star[data-v-96aa76e2]:focus{outline:2px solid black}.v-rating__star[data-v-96aa76e2]:focus-visible{outline:4px dashed darkorange}
/*$vite$:1*/`,document.head.appendChild(_);const k=["fill","height","width"],v=["id"],V=["width"],y=["fill"],S={key:1,"xlink:href":"#outline"},E=["clip-path"],B=e.defineComponent({__name:"StarSVG",props:{value:{default:0},color:{default:"#ffb74b"},size:{default:"2rem"},enableOutline:{type:Boolean,default:!0},backgroundColor:{}},setup(n){const a=e.ref(null),t=n,l=e.useId(),d=e.computed(()=>t.value*100),p=e.computed(()=>(document.querySelectorAll(".rating-svg-icons__defs").length||0)>0);return(r,m)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[(e.openBlock(),e.createElementBlock("svg",{class:"rating-svg-icon",fill:t.color,height:t.size,width:t.size},[e.createElementVNode("defs",null,[e.createElementVNode("clipPath",{id:`clip-star-${e.unref(l)}`},[e.createElementVNode("rect",{x:"0",y:"0",width:`${d.value}%`,height:"100%"},null,8,V)],8,v)]),t.backgroundColor?(e.openBlock(),e.createElementBlock("use",{key:0,"xlink:href":"#filled",fill:t.backgroundColor},null,8,y)):e.createCommentVNode("",!0),t.enableOutline?(e.openBlock(),e.createElementBlock("use",S)):e.createCommentVNode("",!0),e.createElementVNode("use",{"xlink:href":"#filled","clip-path":`url(#clip-star-${e.unref(l)})`},null,8,E)],8,k)),p.value?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.Teleport,{key:0,to:"body"},[e.createElementVNode("div",{class:"rating-svg-icons__defs",ref_key:"iconsDefs",ref:a},m[0]||(m[0]=[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[e.createElementVNode("defs",null,[e.createElementVNode("symbol",{viewBox:"0 0 14 13",id:"outline"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M13.85 4.96a.38.38 0 0 0-.34-.27l-4.18-.3L7.75.32A.38.38 0 0 0 7.4.08a.38.38 0 0 0-.35.25L5.5 4.38l-4.2.3a.38.38 0 0 0-.32.27.4.4 0 0 0 .11.43l3.22 2.8-1.02 4.25a.4.4 0 0 0 .14.41.36.36 0 0 0 .42.02l3.56-2.32 3.56 2.32c.06.04.13.06.2.06a.38.38 0 0 0 .22-.08.4.4 0 0 0 .15-.41L10.5 8.19l3.22-2.81a.4.4 0 0 0 .12-.42Zm-7.82.14-3.8.28 2.92 2.54-.9 3.77L7.4 9.63l3.16 2.06-.9-3.77 2.9-2.54L8.8 5.1 7.4 1.53 6.03 5.1Z","clip-rule":"evenodd"})]),e.createElementVNode("symbol",{viewBox:"0 0 14 13",id:"filled"},[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M13.48 4.96a.38.38 0 0 0-.33-.27l-4.19-.3L7.4.32a.38.38 0 0 0-.35-.25.38.38 0 0 0-.34.25L5.12 4.38l-4.18.3a.38.38 0 0 0-.33.28.4.4 0 0 0 .11.42l3.22 2.8-1.02 4.25a.4.4 0 0 0 .14.41.37.37 0 0 0 .43.02l3.56-2.32 3.55 2.32a.36.36 0 0 0 .42-.02.4.4 0 0 0 .15-.41l-1.02-4.24 3.22-2.81a.4.4 0 0 0 .11-.42Z","clip-rule":"evenodd"})])])],-1)]),512)]))],64))}}),g=(n,a)=>{const t=n.__vccOpts||n;for(const[l,d]of a)t[l]=d;return t},w=g(B,[["__scopeId","data-v-81a86319"]]);function N(){const n=e.ref(null),a=e.ref(null),t=e.ref(!1),l=r=>{a.value?t.value=r.clientX<a.value.left+a.value.width/2:t.value=!1};return{startObserve:r=>{r&&(n.value=r,a.value=r.getBoundingClientRect(),r.addEventListener("mousemove",l))},endObserve:()=>{n.value&&(n.value.removeEventListener("mousemove",l),n.value=null,a.value=null)},mouseInLeftHalf:t}}const O={class:"v-rating"},C={class:"v-rating__stars"},$={key:0,class:"v-rating__star"},L=["onMouseover","onClick"],M={key:1,class:"v-rating__star"},b=g(e.defineComponent({__name:"rating-input",props:{numberOfStars:{default:5},size:{default:"2rem"},color:{default:"#ffb74b"},backgroundColor:{},enableOutline:{type:Boolean,default:!0},readonly:{type:Boolean,default:!1},allowHalfSelect:{type:Boolean,default:!1},modelValue:{default:0}},emits:["update:modelValue"],setup(n,{emit:a}){const t={min:2,max:10},l=n,d=a,{startObserve:p,endObserve:r,mouseInLeftHalf:m}=N(),c=e.ref(l.modelValue),u=e.ref(0);e.onMounted(()=>{if(l.numberOfStars){if(Number.isNaN(l.numberOfStars))throw new Error("numberOfStars must be a number between 0 10");if(l.numberOfStars<t.min||l.numberOfStars>t.max)throw new RangeError(`The prop \`numberOfStars\` is out of range [${t.min}, ${t.max}].`)}});const x=o=>{if(u.value!==0)return l.allowHalfSelect?u.value>=o?u.value==o&&m.value?.5:1:0:u.value>=o?1:0;const i=c.value-(o-1);return Math.max(0,Math.min(i,1))},z=(o,i)=>{l.readonly||(p(i.currentTarget),u.value=o)},T=()=>{u.value=0,r()},I=o=>{if(!(l.readonly||c.value===o)){if(l.allowHalfSelect){const i=o-(m.value?.5:0);c.value=i}else c.value=o;d("update:modelValue",c.value)}};return(o,i)=>(e.openBlock(),e.createElementBlock("div",O,[e.createElementVNode("div",C,[o.$slots.before?(e.openBlock(),e.createElementBlock("div",$,[e.renderSlot(o.$slots,"before",{},void 0,!0)])):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.numberOfStars,f=>(e.openBlock(),e.createElementBlock("div",{key:`v-rating-${f}`,class:e.normalizeClass(["v-rating__star",l.readonly&&"v-rating__star--is-readonly"]),type:"button",tabindex:"0",onMouseover:h=>z(f,h),onMouseleave:T,onClick:h=>I(f)},[e.createVNode(w,{value:x(f),color:o.color,size:o.size,"enable-outline":o.enableOutline,"background-color":o.backgroundColor},null,8,["value","color","size","enable-outline","background-color"])],42,L))),128)),o.$slots.after?(e.openBlock(),e.createElementBlock("div",M,[e.renderSlot(o.$slots,"after",{},void 0,!0)])):e.createCommentVNode("",!0)]),e.withDirectives(e.createElementVNode("input",{type:"hidden","onUpdate:modelValue":i[0]||(i[0]=f=>c.value=f)},null,512),[[e.vModelText,c.value]])]))}}),[["__scopeId","data-v-96aa76e2"]]),R={install(n){n.component("RatingInput",b)}};s.VueRatingInput=R,s.default=b,Object.defineProperties(s,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});