vue3-star-ratings - npm Package Compare versions

Comparing version 3.0.3 to 3.0.4

dist/vue3-star-ratings.iife.js

@@ -1,2 +0,2 @@
-(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".vue3-star-ratings[data-v-3a576d37]{width:fit-content;overflow:hidden;position:relative;white-space:nowrap}.vue3-star-ratings *[data-v-3a576d37]{box-sizing:border-box;margin:0;padding:0;line-height:1}.vue3-star-ratings__inner[data-v-3a576d37],.vue3-star-ratings__outer[data-v-3a576d37]{height:inherit}.vue3-star-ratings__outer[data-v-3a576d37]{position:absolute;top:0;left:0;width:var(--vue3StarRatingOuterWidth);max-width:100%;overflow:hidden;color:var(--vue3StarRatingsOuterColor);transition:width .32s cubic-bezier(.075,.82,.165,1)}.vue3-star-ratings__inner[data-v-3a576d37]{color:var(--vue3StarRatingsInnerColor)}.vue3-star-ratings__icon[data-v-3a576d37]{fill:currentColor;width:var(--vue3StarRatingIconSize);aspect-ratio:1;cursor:pointer;display:inline-block}")),document.head.appendChild(t)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
-var Vue3StarRatings=function(t){"use strict";const _=(a,s)=>{const n=a.__vccOpts||a;for(const[c,u]of s)n[c]=u;return n},p={},g={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512.002 512.002"},S=[t.createElementVNode("path",{d:"M511.267 197.258a14.995 14.995 0 00-12.107-10.209l-158.723-23.065-70.985-143.827a14.998 14.998 0 00-26.901 0l-70.988 143.827-158.72 23.065a14.998 14.998 0 00-8.312 25.585l114.848 111.954-27.108 158.083a14.999 14.999 0 0021.763 15.812l141.967-74.638 141.961 74.637a15 15 0 0021.766-15.813l-27.117-158.081 114.861-111.955a14.994 14.994 0 003.795-15.375z"},null,-1)];function k(a,s){return t.openBlock(),t.createElementBlock("svg",g,S)}const m=_(p,[["render",k]]),h={class:"vue3-star-ratings__outer"},y={class:"vue3-star-ratings__inner"},B=t.defineComponent({__name:"Vue3StarRatings",props:{modelValue:{default:0},numberOfStars:{default:5},starColor:{default:"#ff9800"},inactiveColor:{default:"#333333"},starSize:{default:24},disableClick:{type:Boolean},customSvg:{default:m}},emits:["update:modelValue"],setup(a,{emit:s}){const n=a,c=t.computed(()=>n.customSvg||m),u={rounded(e,o){const r=Math.pow(10,o);return Math.round(e*r)/r}},l=t.ref(),i=t.computed({get(){return n.modelValue},set(e){const o=u.rounded(e,1);s("update:modelValue",o)}});function f(e){if(n.disableClick)return;const{offsetLeft:o,offsetWidth:r}=this,{pageX:d}=e,v=d-o,C=n.numberOfStars,b=v/r*C;i.value=b}const V=t.computed(()=>(i.value<0?0:i.value>n.numberOfStars?n.numberOfStars:i.value)/n.numberOfStars*100);return t.watchEffect(()=>{var o;const e={"--vue3StarRatingsInnerColor":n.inactiveColor,"--vue3StarRatingsOuterColor":n.starColor,"--vue3StarRatingOuterWidth":`${V.value}%`,"--vue3StarRatingIconSize":`${n.starSize}px`};for(const[r,d]of Object.entries(e))(o=l.value)==null||o.style.setProperty(r,d)}),t.onMounted(()=>{var e;(e=l.value)==null||e.addEventListener("click",f)}),t.onBeforeUnmount(()=>{var e;(e=l.value)==null||e.removeEventListener("click",f)}),(e,o)=>(t.openBlock(),t.createElementBlock("div",{class:"vue3-star-ratings",ref_key:"starsContainer",ref:l,style:t.normalizeStyle({pointerEvents:e.disableClick?"none":"auto"})},[t.createElementVNode("div",h,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.numberOfStars,r=>(t.openBlock(),t.createBlock(t.resolveDynamicComponent(c.value),{key:r,class:"vue3-star-ratings__icon"}))),128))]),t.createElementVNode("div",y,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.numberOfStars,r=>(t.openBlock(),t.createBlock(t.resolveDynamicComponent(c.value),{key:r,class:"vue3-star-ratings__icon"}))),128))])],4))}}),R="";return _(B,[["__scopeId","data-v-3a576d37"]])}(Vue);
+(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".vue3-star-ratings[data-v-7fab3f62]{width:fit-content;overflow:hidden;position:relative;white-space:nowrap}.vue3-star-ratings *[data-v-7fab3f62]{box-sizing:border-box;margin:0;padding:0;line-height:1}.vue3-star-ratings__inner[data-v-7fab3f62],.vue3-star-ratings__outer[data-v-7fab3f62]{height:inherit}.vue3-star-ratings__outer[data-v-7fab3f62]{position:absolute;top:0;left:0;width:var(--vue3StarRatingOuterWidth);max-width:100%;overflow:hidden;color:var(--vue3StarRatingsOuterColor);transition:width .32s cubic-bezier(.075,.82,.165,1)}.vue3-star-ratings__inner[data-v-7fab3f62]{color:var(--vue3StarRatingsInnerColor)}.vue3-star-ratings__icon[data-v-7fab3f62]{fill:currentColor;width:var(--vue3StarRatingIconSize);aspect-ratio:1;cursor:pointer;display:inline-block}")),document.head.appendChild(t)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
+var Vue3StarRatings=function(t){"use strict";const _=(a,s)=>{const n=a.__vccOpts||a;for(const[c,u]of s)n[c]=u;return n},p={},g={xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 512.002 512.002"},S=[t.createElementVNode("path",{d:"M511.267 197.258a14.995 14.995 0 00-12.107-10.209l-158.723-23.065-70.985-143.827a14.998 14.998 0 00-26.901 0l-70.988 143.827-158.72 23.065a14.998 14.998 0 00-8.312 25.585l114.848 111.954-27.108 158.083a14.999 14.999 0 0021.763 15.812l141.967-74.638 141.961 74.637a15 15 0 0021.766-15.813l-27.117-158.081 114.861-111.955a14.994 14.994 0 003.795-15.375z"},null,-1)];function k(a,s){return t.openBlock(),t.createElementBlock("svg",g,S)}const m=_(p,[["render",k]]),h={class:"vue3-star-ratings__outer"},y={class:"vue3-star-ratings__inner"},B=t.defineComponent({__name:"Vue3StarRatings",props:{modelValue:{default:0},numberOfStars:{default:5},starColor:{default:"#ff9800"},inactiveColor:{default:"#333333"},starSize:{default:24},disableClick:{type:Boolean},customSvg:{default:m}},emits:["update:modelValue"],setup(a,{emit:s}){const n=a,c=t.computed(()=>n.customSvg||m),u={rounded(e,r){const o=Math.pow(10,r);return Math.round(e*o)/o}},l=t.ref(),i=t.computed({get(){return n.modelValue},set(e){const r=u.rounded(e,1);s("update:modelValue",r)}});function f(e){if(n.disableClick)return;const r=this.getBoundingClientRect(),{pageX:o}=e,d=o-r.left,V=r.width,b=n.numberOfStars,v=d/V*b;i.value=v}const C=t.computed(()=>(i.value<0?0:i.value>n.numberOfStars?n.numberOfStars:i.value)/n.numberOfStars*100);return t.watchEffect(()=>{var r;const e={"--vue3StarRatingsInnerColor":n.inactiveColor,"--vue3StarRatingsOuterColor":n.starColor,"--vue3StarRatingOuterWidth":`${C.value}%`,"--vue3StarRatingIconSize":`${n.starSize}px`};for(const[o,d]of Object.entries(e))(r=l.value)==null||r.style.setProperty(o,d)}),t.onMounted(()=>{var e;(e=l.value)==null||e.addEventListener("click",f)}),t.onBeforeUnmount(()=>{var e;(e=l.value)==null||e.removeEventListener("click",f)}),(e,r)=>(t.openBlock(),t.createElementBlock("div",{class:"vue3-star-ratings",ref_key:"starsContainer",ref:l,style:t.normalizeStyle({pointerEvents:e.disableClick?"none":"auto"})},[t.createElementVNode("div",h,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.numberOfStars,o=>(t.openBlock(),t.createBlock(t.resolveDynamicComponent(c.value),{key:o,class:"vue3-star-ratings__icon"}))),128))]),t.createElementVNode("div",y,[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(e.numberOfStars,o=>(t.openBlock(),t.createBlock(t.resolveDynamicComponent(c.value),{key:o,class:"vue3-star-ratings__icon"}))),128))])],4))}}),O="";return _(B,[["__scopeId","data-v-7fab3f62"]])}(Vue);

dist/vue3-star-ratings.js

@@ -1,4 +0,4 @@
-(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".vue3-star-ratings[data-v-3a576d37]{width:fit-content;overflow:hidden;position:relative;white-space:nowrap}.vue3-star-ratings *[data-v-3a576d37]{box-sizing:border-box;margin:0;padding:0;line-height:1}.vue3-star-ratings__inner[data-v-3a576d37],.vue3-star-ratings__outer[data-v-3a576d37]{height:inherit}.vue3-star-ratings__outer[data-v-3a576d37]{position:absolute;top:0;left:0;width:var(--vue3StarRatingOuterWidth);max-width:100%;overflow:hidden;color:var(--vue3StarRatingsOuterColor);transition:width .32s cubic-bezier(.075,.82,.165,1)}.vue3-star-ratings__inner[data-v-3a576d37]{color:var(--vue3StarRatingsInnerColor)}.vue3-star-ratings__icon[data-v-3a576d37]{fill:currentColor;width:var(--vue3StarRatingIconSize);aspect-ratio:1;cursor:pointer;display:inline-block}")),document.head.appendChild(t)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
-import { openBlock as a, createElementBlock as i, createElementVNode as f, defineComponent as V, computed as v, ref as w, watchEffect as z, onMounted as B, onBeforeUnmount as E, normalizeStyle as x, Fragment as p, renderList as g, createBlock as S, resolveDynamicComponent as h } from "vue";
-const k = (s, o) => {
+(function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");t.appendChild(document.createTextNode(".vue3-star-ratings[data-v-7fab3f62]{width:fit-content;overflow:hidden;position:relative;white-space:nowrap}.vue3-star-ratings *[data-v-7fab3f62]{box-sizing:border-box;margin:0;padding:0;line-height:1}.vue3-star-ratings__inner[data-v-7fab3f62],.vue3-star-ratings__outer[data-v-7fab3f62]{height:inherit}.vue3-star-ratings__outer[data-v-7fab3f62]{position:absolute;top:0;left:0;width:var(--vue3StarRatingOuterWidth);max-width:100%;overflow:hidden;color:var(--vue3StarRatingsOuterColor);transition:width .32s cubic-bezier(.075,.82,.165,1)}.vue3-star-ratings__inner[data-v-7fab3f62]{color:var(--vue3StarRatingsInnerColor)}.vue3-star-ratings__icon[data-v-7fab3f62]{fill:currentColor;width:var(--vue3StarRatingIconSize);aspect-ratio:1;cursor:pointer;display:inline-block}")),document.head.appendChild(t)}}catch(a){console.error("vite-plugin-css-injected-by-js",a)}})();
+import { openBlock as a, createElementBlock as i, createElementVNode as v, defineComponent as V, computed as f, ref as w, watchEffect as z, onMounted as B, onBeforeUnmount as E, normalizeStyle as x, Fragment as p, renderList as g, createBlock as S, resolveDynamicComponent as h } from "vue";
+const b = (s, o) => {
   const t = s.__vccOpts || s;
@@ -11,9 +11,9 @@ for (const [u, d] of o)
   viewBox: "0 0 512.002 512.002"
-}, L = /* @__PURE__ */ f("path", { d: "M511.267 197.258a14.995 14.995 0 00-12.107-10.209l-158.723-23.065-70.985-143.827a14.998 14.998 0 00-26.901 0l-70.988 143.827-158.72 23.065a14.998 14.998 0 00-8.312 25.585l114.848 111.954-27.108 158.083a14.999 14.999 0 0021.763 15.812l141.967-74.638 141.961 74.637a15 15 0 0021.766-15.813l-27.117-158.081 114.861-111.955a14.994 14.994 0 003.795-15.375z" }, null, -1), M = [
-  L
+}, M = /* @__PURE__ */ v("path", { d: "M511.267 197.258a14.995 14.995 0 00-12.107-10.209l-158.723-23.065-70.985-143.827a14.998 14.998 0 00-26.901 0l-70.988 143.827-158.72 23.065a14.998 14.998 0 00-8.312 25.585l114.848 111.954-27.108 158.083a14.999 14.999 0 0021.763 15.812l141.967-74.638 141.961 74.637a15 15 0 0021.766-15.813l-27.117-158.081 114.861-111.955a14.994 14.994 0 003.795-15.375z" }, null, -1), L = [
+  M
 ];
 function j(s, o) {
-  return a(), i("svg", I, M);
+  return a(), i("svg", I, L);
 }
-const y = /* @__PURE__ */ k($, [["render", j]]), D = { class: "vue3-star-ratings__outer" }, W = { class: "vue3-star-ratings__inner" }, X = /* @__PURE__ */ V({
+const y = /* @__PURE__ */ b($, [["render", j]]), D = { class: "vue3-star-ratings__outer" }, W = { class: "vue3-star-ratings__inner" }, X = /* @__PURE__ */ V({
   __name: "Vue3StarRatings",
@@ -31,8 +31,8 @@ props: {
   setup(s, { emit: o }) {
-    const t = s, u = v(() => t.customSvg || y), d = {
-      rounded(e, r) {
-        const n = Math.pow(10, r);
-        return Math.round(e * n) / n;
+    const t = s, u = f(() => t.customSvg || y), d = {
+      rounded(e, n) {
+        const r = Math.pow(10, n);
+        return Math.round(e * r) / r;
       }
-    }, l = w(), c = v({
+    }, l = w(), c = f({
       get() {
@@ -42,4 +42,4 @@ return t.modelValue;
       set(e) {
-        const r = d.rounded(e, 1);
-        o("update:modelValue", r);
+        const n = d.rounded(e, 1);
+        o("update:modelValue", n);
       }
@@ -50,8 +50,8 @@ });
         return;
-      const { offsetLeft: r, offsetWidth: n } = this, { pageX: _ } = e, b = _ - r, O = t.numberOfStars, R = b / n * O;
+      const n = this.getBoundingClientRect(), { pageX: r } = e, _ = r - n.left, k = n.width, O = t.numberOfStars, R = _ / k * O;
       c.value = R;
     }
-    const C = v(() => (c.value < 0 ? 0 : c.value > t.numberOfStars ? t.numberOfStars : c.value) / t.numberOfStars * 100);
+    const C = f(() => (c.value < 0 ? 0 : c.value > t.numberOfStars ? t.numberOfStars : c.value) / t.numberOfStars * 100);
     return z(() => {
-      var r;
+      var n;
       const e = {
@@ -63,4 +63,4 @@ "--vue3StarRatingsInnerColor": t.inactiveColor,
       };
-      for (const [n, _] of Object.entries(e))
-        (r = l.value) == null || r.style.setProperty(n, _);
+      for (const [r, _] of Object.entries(e))
+        (n = l.value) == null || n.style.setProperty(r, _);
     }), B(() => {
@@ -72,3 +72,3 @@ var e;
       (e = l.value) == null || e.removeEventListener("click", m);
-    }), (e, r) => (a(), i("div", {
+    }), (e, n) => (a(), i("div", {
       class: "vue3-star-ratings",
@@ -81,11 +81,11 @@ ref_key: "starsContainer",
     }, [
-      f("div", D, [
-        (a(!0), i(p, null, g(e.numberOfStars, (n) => (a(), S(h(u.value), {
-          key: n,
+      v("div", D, [
+        (a(!0), i(p, null, g(e.numberOfStars, (r) => (a(), S(h(u.value), {
+          key: r,
           class: "vue3-star-ratings__icon"
         }))), 128))
       ]),
-      f("div", W, [
-        (a(!0), i(p, null, g(e.numberOfStars, (n) => (a(), S(h(u.value), {
-          key: n,
+      v("div", W, [
+        (a(!0), i(p, null, g(e.numberOfStars, (r) => (a(), S(h(u.value), {
+          key: r,
           class: "vue3-star-ratings__icon"
@@ -97,5 +97,5 @@ }))), 128))
 });
-const N = /* @__PURE__ */ k(X, [["__scopeId", "data-v-3a576d37"]]);
+const N = /* @__PURE__ */ b(X, [["__scopeId", "data-v-7fab3f62"]]);
 export {
   N as default
 };

package.json

 {
   "name": "vue3-star-ratings",
-  "version": "3.0.3",
+  "version": "3.0.4",
   "license": "MIT",
@@ -5,0 +5,0 @@ "type": "module",

No alert changes

Improved metrics

Total package byte prevSize

25177

increased by0.2%

Lines of code

220

increased by0.46%

No dependency changes