npm - @element-plus/nightly - Versions diffs - 0.0.20220117 → 0.0.20220118 - Mend

@element-plus/nightly 0.0.20220117 → 0.0.20220118

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.

Files changed (663) hide show

package/lib/components/popover/src/index.vue.d.ts CHANGED Viewed

@@ -103,9 +103,8 @@ declare const _default: import("vue").DefineComponent<{
             style: StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -168,6 +167,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -221,9 +221,8 @@ declare const _default: import("vue").DefineComponent<{
             style: StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -286,6 +285,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -303,7 +303,7 @@ declare const _default: import("vue").DefineComponent<{
             virtualTriggering?: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown> | undefined;
         }> & {
             [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "style" | "transition" | "offset" | "visible" | "content" | "effect" | "arrowOffset" | "boundariesPadding" | "fallbackPlacements" | "gpuAcceleration" | "placement" | "popperOptions" | "strategy" | "className" | "enterable" | "pure" | "popperClass" | "popperStyle" | "referenceEl" | "stopPopperMouseEvent" | "showAfter" | "hideAfter" | "appendTo" | "rawContent" | "persistent" | "teleported" | "trigger" | "virtualRef" | "virtualTriggering" | "openDelay" | "visibleArrow" | "showArrow">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "style" | "transition" | "offset" | "effect" | "visible" | "arrowOffset" | "boundariesPadding" | "fallbackPlacements" | "gpuAcceleration" | "placement" | "popperOptions" | "strategy" | "className" | "enterable" | "pure" | "popperClass" | "popperStyle" | "referenceEl" | "stopPopperMouseEvent" | "content" | "showAfter" | "hideAfter" | "appendTo" | "rawContent" | "persistent" | "teleported" | "trigger" | "virtualRef" | "virtualTriggering" | "openDelay" | "visibleArrow" | "showArrow">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -358,9 +358,8 @@ declare const _default: import("vue").DefineComponent<{
             style: StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -423,6 +422,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -482,6 +482,7 @@ declare const _default: import("vue").DefineComponent<{
                 $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
             } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("../..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null>;
             open: import("vue").Ref<boolean>;
+            hide: () => void;
             updatePopper: () => void;
             onOpen: () => void;
             onClose: () => void;
@@ -490,9 +491,8 @@ declare const _default: import("vue").DefineComponent<{
             style: StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -555,6 +555,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -628,9 +629,8 @@ declare const _default: import("vue").DefineComponent<{
         style: StyleValue;
         transition: string;
         offset: number;
-        visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-        content: string;
         effect: string;
+        visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
         arrowOffset: number;
         boundariesPadding: number;
         fallbackPlacements: import("@popperjs/core").Placement[];
@@ -693,6 +693,7 @@ declare const _default: import("vue").DefineComponent<{
         popperStyle: StyleValue;
         referenceEl: HTMLElement;
         stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+        content: string;
         showAfter: number;
         hideAfter: number;
         appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -752,6 +753,7 @@ declare const _default: import("vue").DefineComponent<{
             $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
         } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("../..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null>;
         open: import("vue").Ref<boolean>;
+        hide: () => void;
         updatePopper: () => void;
         onOpen: () => void;
         onClose: () => void;
@@ -794,6 +796,7 @@ declare const _default: import("vue").DefineComponent<{
         $nextTick: typeof import("vue").nextTick;
         $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
     } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("../..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null | undefined>;
+    hide: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     title?: unknown;
     hideAfter?: unknown;
@@ -805,7 +808,6 @@ declare const _default: import("vue").DefineComponent<{
     effect?: unknown;
 } & {
     width: import("../../../utils/props").BuildPropType<(StringConstructor | NumberConstructor)[], unknown, unknown>;
-    content: string;
     effect: string;
     enterable: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     popperClass: string | {
@@ -834,6 +836,7 @@ declare const _default: import("vue").DefineComponent<{
         [x: string]: any;
     } | any)[])[])[])[])[])[])[])[])[])[])[];
     popperStyle: StyleValue;
+    content: string;
     hideAfter: number;
 } & {
     title?: string | undefined;
@@ -841,7 +844,6 @@ declare const _default: import("vue").DefineComponent<{
     [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
 }, {
     width: import("../../../utils/props").BuildPropType<(StringConstructor | NumberConstructor)[], unknown, unknown>;
-    content: string;
     effect: string;
     enterable: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
     popperClass: string | {
@@ -870,6 +872,7 @@ declare const _default: import("vue").DefineComponent<{
         [x: string]: any;
     } | any)[])[])[])[])[])[])[])[])[])[])[];
     popperStyle: StyleValue;
+    content: string;
     hideAfter: number;
 }>;
 export default _default;

package/lib/components/popover/src/index.vue_vue_type_script_lang.js CHANGED Viewed

@@ -44,11 +44,16 @@ var script = vue.defineComponent({
         props.popperClass
       ];
     });
+    const hide = () => {
+      var _a;
+      (_a = tooltipRef.value) == null ? void 0 : _a.hide();
+    };
     return {
       kls,
       style,
       tooltipRef,
-      popperRef
+      popperRef,
+      hide
     };
   }
 });

package/lib/components/popover/src/index.vue_vue_type_script_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/popover/src/index.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-bind=\"$attrs\"\n :aria-label=\"title\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :popper-class=\"kls\"\n :popper-style=\"style\"\n persistent\n >\n <template v-if=\"$slots.reference\">\n <slot name=\"reference\" />\n </template>\n\n <template #content>\n <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n {{ title }}\n </div>\n <slot>\n {{ content }}\n </slot>\n </template>\n </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n name: NAME,\n components: {\n ElTooltip,\n },\n props: usePopoverProps,\n emits,\n setup(props) {\n const tooltipRef = ref<InstanceType<typeof ElTooltip> \| null>(null)\n const popperRef = computed(() => {\n return unref(tooltipRef)?.popperRef\n })\n const width = computed(() => {\n if (isString(props.width)) {\n return props.width as string\n }\n return `${props.width}px`\n })\n\n const style = computed(() => {\n return [\n {\n width: width.value,\n },\n props.popperStyle,\n ] as StyleValue\n })\n\n const kls = computed(() => {\n return [\n { 'el-popover--plain': !!props.content },\n 'el-popover',\n props.popperClass,\n ]\n })\n\n return {\n kls,\n style,\n tooltipRef,\n popperRef,\n }\n },\n})\n</script>\n"],"names":["defineComponent","unref","isString","computed"],"mappings":";;;;;;;;;;AA6BA,WAAW,GAAG,CAAC,kBAAkB;;AAEjC,aAAeA,mBAAe;;AAE9B,EAAE,UAAU,EAAE;;AAEd,GAAG;;AAEH,EAAE,KAAK;EACL,MAAM;IACJ,MAAM;IACN,MAAM;;MAEJ,OAAO,CAAC,EAAE,GAAGC,SAAK;KACnB,CAAC,CAAC;IACH,MAAM,KAAK;MACT,IAAIC,eAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;QACzB,OAAO,KAAK,MAAM,CAAC;OACpB;;KAEF,CAAC,CAAC;UACG,KAAK,GAAGC,YAAQ,CAAC,MAAM;aACpB;;UAEH,KAAK,EAAE,KAAK,CAAC,KAAK;;;OAGrB,CAAC;MACF,CAAC;;aAEM;QACL;QACA,YAAY;QACZ,KAAK,CAAC;;;IAGV,~~OAAO~~;~~MACL~~,GAAG;~~WACE~~;~~gBACK~~;~~eACD;~~MACT~~;;;;;;~~"}
1	+ {"version":3,"file":"index.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/popover/src/index.vue"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-bind=\"$attrs\"\n :aria-label=\"title\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :popper-class=\"kls\"\n :popper-style=\"style\"\n persistent\n >\n <template v-if=\"$slots.reference\">\n <slot name=\"reference\" />\n </template>\n\n <template #content>\n <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n {{ title }}\n </div>\n <slot>\n {{ content }}\n </slot>\n </template>\n </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n name: NAME,\n components: {\n ElTooltip,\n },\n props: usePopoverProps,\n emits,\n setup(props) {\n const tooltipRef = ref<InstanceType<typeof ElTooltip> \| null>(null)\n const popperRef = computed(() => {\n return unref(tooltipRef)?.popperRef\n })\n const width = computed(() => {\n if (isString(props.width)) {\n return props.width as string\n }\n return `${props.width}px`\n })\n\n const style = computed(() => {\n return [\n {\n width: width.value,\n },\n props.popperStyle,\n ] as StyleValue\n })\n\n const kls = computed(() => {\n return [\n { 'el-popover--plain': !!props.content },\n 'el-popover',\n props.popperClass,\n ]\n })\n\n const hide = () => {\n tooltipRef.value?.hide()\n }\n\n return {\n kls,\n style,\n tooltipRef,\n popperRef,\n hide,\n }\n },\n})\n</script>\n"],"names":["defineComponent","unref","isString","computed"],"mappings":";;;;;;;;;;AA6BA,WAAW,GAAG,CAAC,kBAAkB;;AAEjC,aAAeA,mBAAe;;AAE9B,EAAE,UAAU,EAAE;;AAEd,GAAG;;AAEH,EAAE,KAAK;EACL,MAAM;IACJ,MAAM;IACN,MAAM;;MAEJ,OAAO,CAAC,EAAE,GAAGC,SAAK;KACnB,CAAC,CAAC;IACH,MAAM,KAAK;MACT,IAAIC,eAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;QACzB,OAAO,KAAK,MAAM,CAAC;OACpB;;KAEF,CAAC,CAAC;UACG,KAAK,GAAGC,YAAQ,CAAC,MAAM;aACpB;;UAEH,KAAK,EAAE,KAAK,CAAC,KAAK;;;OAGrB,CAAC;MACF,CAAC;;aAEM;QACL;QACA,YAAY;QACZ,KAAK,CAAC;;;IAGV,MAAM,IAAI,GAAG,MAAM;MACjB,IAAI,GAAG;YACD,UAAU,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK;;WAElC;MACL;;;MAGA,SAAS;MACT,IAAI;;;;;;;"}

package/lib/components/popover/src/index.vue_vue_type_template_id_15486cf0_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue_vue_type_template_id_15486cf0_lang.js","sources":["../../../../../../packages/components/popover/src/index.vue?vue&type=template&id=15486cf0&lang.js"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-bind=\"$attrs\"\n :aria-label=\"title\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :popper-class=\"kls\"\n :popper-style=\"style\"\n persistent\n >\n <template v-if=\"$slots.reference\">\n <slot name=\"reference\" />\n </template>\n\n <template #content>\n <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n {{ title }}\n </div>\n <slot>\n {{ content }}\n </slot>\n </template>\n </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n name: NAME,\n components: {\n ElTooltip,\n },\n props: usePopoverProps,\n emits,\n setup(props) {\n const tooltipRef = ref<InstanceType<typeof ElTooltip> \| null>(null)\n const popperRef = computed(() => {\n return unref(tooltipRef)?.popperRef\n })\n const width = computed(() => {\n if (isString(props.width)) {\n return props.width as string\n }\n return `${props.width}px`\n })\n\n const style = computed(() => {\n return [\n {\n width: width.value,\n },\n props.popperStyle,\n ] as StyleValue\n })\n\n const kls = computed(() => {\n return [\n { 'el-popover--plain': !!props.content },\n 'el-popover',\n props.popperClass,\n ]\n })\n\n return {\n kls,\n style,\n tooltipRef,\n popperRef,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;EAgBwB;EAA0B;;;;;;;IAZ7C,cAAY,UAAK;IACjB;IACA;IACA;IACA;gBACD;;;OAOa;;;MAGX,2CAAA;;;;;;;;"}
1	+ {"version":3,"file":"index.vue_vue_type_template_id_15486cf0_lang.js","sources":["../../../../../../packages/components/popover/src/index.vue?vue&type=template&id=15486cf0&lang.js"],"sourcesContent":["<template>\n <el-tooltip\n ref=\"tooltipRef\"\n v-bind=\"$attrs\"\n :aria-label=\"title\"\n :effect=\"effect\"\n :enterable=\"enterable\"\n :popper-class=\"kls\"\n :popper-style=\"style\"\n persistent\n >\n <template v-if=\"$slots.reference\">\n <slot name=\"reference\" />\n </template>\n\n <template #content>\n <div v-if=\"title\" class=\"el-popover__title\" role=\"title\">\n {{ title }}\n </div>\n <slot>\n {{ content }}\n </slot>\n </template>\n </el-tooltip>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, computed, ref, unref } from 'vue'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { isString } from '@element-plus/utils/util'\nimport { usePopoverProps } from './popover'\n\nimport type { StyleValue } from 'vue'\n\nconst emits = ['update:visible', 'after-enter', 'after-leave']\n\nconst NAME = 'ElPopover'\n\nexport default defineComponent({\n name: NAME,\n components: {\n ElTooltip,\n },\n props: usePopoverProps,\n emits,\n setup(props) {\n const tooltipRef = ref<InstanceType<typeof ElTooltip> \| null>(null)\n const popperRef = computed(() => {\n return unref(tooltipRef)?.popperRef\n })\n const width = computed(() => {\n if (isString(props.width)) {\n return props.width as string\n }\n return `${props.width}px`\n })\n\n const style = computed(() => {\n return [\n {\n width: width.value,\n },\n props.popperStyle,\n ] as StyleValue\n })\n\n const kls = computed(() => {\n return [\n { 'el-popover--plain': !!props.content },\n 'el-popover',\n props.popperClass,\n ]\n })\n\n const hide = () => {\n tooltipRef.value?.hide()\n }\n\n return {\n kls,\n style,\n tooltipRef,\n popperRef,\n hide,\n }\n },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;EAgBwB;EAA0B;;;;;;;IAZ7C,cAAY,UAAK;IACjB;IACA;IACA;IACA;gBACD;;;OAOa;;;MAGX,2CAAA;;;;;;;;"}

package/lib/components/rate/index.d.ts CHANGED Viewed

@@ -18,6 +18,17 @@ export declare const ElRate: import("../../utils/types").SFCWithInstall<import("
     readonly scoreTemplate: import("../../utils/props").BuildPropReturn<StringConstructor, "{value}", unknown, unknown, unknown>;
     readonly size: import("../../utils/props").BuildPropReturn<(new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../utils/types").ComponentSize & {}) | (() => import("../../utils/types").ComponentSize))[], unknown, unknown, unknown, unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     hoverIndex: import("vue").Ref<number>;
     currentValue: import("vue").Ref<number>;
     rateDisabled: import("vue").ComputedRef<boolean | undefined>;

package/lib/components/rate/src/rate.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import type { ComponentSize } from 'element-plus/es/utils/types';
 import type { Component, ExtractPropTypes } from 'vue';
+import type Rate from './rate.vue';
 export declare const rateProps: {
     readonly modelValue: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 0, unknown, unknown, unknown>;
     readonly lowThreshold: import("element-plus/es/utils/props").BuildPropReturn<NumberConstructor, 2, unknown, unknown, unknown>;
@@ -26,3 +27,4 @@ export declare const rateEmits: {
     "update:modelValue": (value: number) => boolean;
 };
 export declare type RateEmits = typeof rateEmits;
+export declare type RateInstance = InstanceType<typeof Rate>;

package/lib/components/rate/src/rate.js CHANGED Viewed

@@ -69,7 +69,7 @@ const rateProps = props.buildProps({
     default: "#1f2d3d"
   },
   texts: {
-    type: props.definePropType([Array]),
+    type: props.definePropType(Array),
     default: () => props.mutable([
       "Extremely bad",
       "Disappointed",

package/lib/components/rate/src/rate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"rate.js","sources":["../../../../../../packages/components/rate/src/rate.ts"],"sourcesContent":["import { Star, StarFilled } from '@element-plus/icons-vue'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { buildProps, definePropType, mutable } from '@element-plus/utils/props'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { Component, ExtractPropTypes, PropType } from 'vue'\n\nexport const rateProps = buildProps({\n modelValue: {\n type: Number,\n default: 0,\n },\n lowThreshold: {\n type: Number,\n default: 2,\n },\n highThreshold: {\n type: Number,\n default: 4,\n },\n max: {\n type: Number,\n default: 5,\n },\n colors: {\n type: definePropType<string[] \| Record<number, string>>([Array, Object]),\n default: () => mutable(['#F7BA2A', '#F7BA2A', '#F7BA2A'] as const),\n },\n voidColor: {\n type: String,\n default: '#C6D1DE',\n },\n disabledVoidColor: {\n type: String,\n default: '#EFF2F7',\n },\n icons: {\n type: definePropType<\n Array<string \| Component> \| Record<number, string \| Component>\n >([Array, Object]),\n default: () => [StarFilled, StarFilled, StarFilled],\n },\n voidIcon: {\n type: definePropType<string \| Component>([String, Object]),\n default: () => Star,\n },\n disabledvoidIcon: {\n type: definePropType<string \| Component>([String, Object]),\n default: () => StarFilled,\n },\n disabled: {\n type: Boolean,\n default: false,\n },\n allowHalf: {\n type: Boolean,\n default: false,\n },\n showText: {\n type: Boolean,\n default: false,\n },\n showScore: {\n type: Boolean,\n default: false,\n },\n textColor: {\n type: String,\n default: '#1f2d3d',\n },\n texts: {\n type: definePropType<string[]>([Array]),\n default: () =>\n mutable([\n 'Extremely bad',\n 'Disappointed',\n 'Fair',\n 'Satisfied',\n 'Surprise',\n ] as const),\n },\n scoreTemplate: {\n type: String,\n default: '{value}',\n },\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n} as const)\n\nexport type RateProps = ExtractPropTypes<typeof rateProps>\n\nexport const rateEmits = {\n change: (value: number) => typeof value === 'number',\n [UPDATE_MODEL_EVENT]: (value: number) => typeof value === 'number',\n}\nexport type RateEmits = typeof rateEmits\n"],"names":["buildProps","definePropType","mutable","StarFilled","Star","isValidComponentSize","UPDATE_MODEL_EVENT"],"mappings":";;;;;;;;;AAIY,MAAC,SAAS,GAAGA,gBAAU,CAAC;AACpC,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,aAAa,EAAE;AACjB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;AACzC,IAAI,OAAO,EAAE,MAAMC,aAAO,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,CAAC,CAAC;AAC7D,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG;AACH,EAAE,iBAAiB,EAAE;AACrB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAED,oBAAc,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;AACzC,IAAI,OAAO,EAAE,MAAM,CAACE,mBAAU,EAAEA,mBAAU,EAAEA,mBAAU,CAAC;AACvD,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAEF,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAMG,aAAI;AACvB,GAAG;AACH,EAAE,gBAAgB,EAAE;AACpB,IAAI,IAAI,EAAEH,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,MAAME,mBAAU;AAC7B,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAEF,oBAAc,CAAC,~~CAAC,~~KAAK,CAAC~~,CAAC~~;~~AACjC~~,IAAI,OAAO,EAAE,MAAMC,aAAO,CAAC;AAC3B,MAAM,eAAe;AACrB,MAAM,cAAc;AACpB,MAAM,MAAM;AACZ,MAAM,WAAW;AACjB,MAAM,UAAU;AAChB,KAAK,CAAC;AACN,GAAG;AACH,EAAE,aAAa,EAAE;AACjB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,SAAS;AACtB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,SAAS,EAAEG,+BAAoB;AACnC,GAAG;AACH,CAAC,EAAE;AACS,MAAC,SAAS,GAAG;AACzB,EAAE,MAAM,EAAE,CAAC,KAAK,KAAK,OAAO,KAAK,KAAK,QAAQ;AAC9C,EAAE,CAACC,4BAAkB,GAAG,CAAC,KAAK,KAAK,OAAO,KAAK,KAAK,QAAQ;AAC5D;;;;;"}
1	+ {"version":3,"file":"rate.js","sources":["../../../../../../packages/components/rate/src/rate.ts"],"sourcesContent":["import { Star, StarFilled } from '@element-plus/icons-vue'\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { buildProps, definePropType, mutable } from '@element-plus/utils/props'\nimport { isValidComponentSize } from '@element-plus/utils/validators'\nimport type { ComponentSize } from '@element-plus/utils/types'\nimport type { Component, ExtractPropTypes, PropType } from 'vue'\nimport type Rate from './rate.vue'\n\nexport const rateProps = buildProps({\n modelValue: {\n type: Number,\n default: 0,\n },\n lowThreshold: {\n type: Number,\n default: 2,\n },\n highThreshold: {\n type: Number,\n default: 4,\n },\n max: {\n type: Number,\n default: 5,\n },\n colors: {\n type: definePropType<string[] \| Record<number, string>>([Array, Object]),\n default: () => mutable(['#F7BA2A', '#F7BA2A', '#F7BA2A'] as const),\n },\n voidColor: {\n type: String,\n default: '#C6D1DE',\n },\n disabledVoidColor: {\n type: String,\n default: '#EFF2F7',\n },\n icons: {\n type: definePropType<\n Array<string \| Component> \| Record<number, string \| Component>\n >([Array, Object]),\n default: () => [StarFilled, StarFilled, StarFilled],\n },\n voidIcon: {\n type: definePropType<string \| Component>([String, Object]),\n default: () => Star,\n },\n disabledvoidIcon: {\n type: definePropType<string \| Component>([String, Object]),\n default: () => StarFilled,\n },\n disabled: {\n type: Boolean,\n default: false,\n },\n allowHalf: {\n type: Boolean,\n default: false,\n },\n showText: {\n type: Boolean,\n default: false,\n },\n showScore: {\n type: Boolean,\n default: false,\n },\n textColor: {\n type: String,\n default: '#1f2d3d',\n },\n texts: {\n type: definePropType<string[]>(Array),\n default: () =>\n mutable([\n 'Extremely bad',\n 'Disappointed',\n 'Fair',\n 'Satisfied',\n 'Surprise',\n ] as const),\n },\n scoreTemplate: {\n type: String,\n default: '{value}',\n },\n size: {\n type: String as PropType<ComponentSize>,\n validator: isValidComponentSize,\n },\n} as const)\n\nexport type RateProps = ExtractPropTypes<typeof rateProps>\n\nexport const rateEmits = {\n change: (value: number) => typeof value === 'number',\n [UPDATE_MODEL_EVENT]: (value: number) => typeof value === 'number',\n}\nexport type RateEmits = typeof rateEmits\n\nexport type RateInstance = InstanceType<typeof Rate>\n"],"names":["buildProps","definePropType","mutable","StarFilled","Star","isValidComponentSize","UPDATE_MODEL_EVENT"],"mappings":"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"}

package/lib/components/rate/src/rate.vue.d.ts CHANGED Viewed

@@ -18,6 +18,17 @@ declare const _default: import("vue").DefineComponent<{
     readonly scoreTemplate: import("../../../utils/props").BuildPropReturn<StringConstructor, "{value}", unknown, unknown, unknown>;
     readonly size: import("../../../utils/props").BuildPropReturn<(new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize) | ((new (...args: any[]) => import("../../../utils/types").ComponentSize & {}) | (() => import("../../../utils/types").ComponentSize))[], unknown, unknown, unknown, unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     hoverIndex: import("vue").Ref<number>;
     currentValue: import("vue").Ref<number>;
     rateDisabled: import("vue").ComputedRef<boolean | undefined>;

package/lib/components/rate/src/rate.vue_vue_type_script_lang.js CHANGED Viewed

@@ -14,6 +14,7 @@ require('../../../hooks/index.js');
 var rate = require('./rate.js');
 var form = require('../../../tokens/form.js');
 var index$1 = require('../../../hooks/use-common-props/index.js');
+var index$2 = require('../../../hooks/use-namespace/index.js');
 function getValueFromMap(value, map) {
   const isExcludedObject = (val) => shared.isObject(val);
@@ -37,11 +38,11 @@ var script = vue.defineComponent({
   setup(props, { emit }) {
     const elForm = vue.inject(form.elFormKey, {});
     const rateSize = index$1.useSize();
+    const ns = index$2.useNamespace("rate");
     const currentValue = vue.ref(props.modelValue);
     const hoverIndex = vue.ref(-1);
     const pointerAtLeftHalf = vue.ref(true);
-    const prefix = "el-rate";
-    const rateKls = vue.computed(() => [prefix, `${prefix}--${rateSize.value}`]);
+    const rateKls = vue.computed(() => [ns.b(), ns.m(rateSize.value)]);
     const rateDisabled = vue.computed(() => props.disabled || elForm.disabled);
     const text = vue.computed(() => {
       let result = "";
@@ -151,10 +152,10 @@ var script = vue.defineComponent({
       }
       if (props.allowHalf) {
         let target = event.target;
-        if (dom.hasClass(target, "el-rate__item")) {
-          target = target.querySelector(".el-rate__icon");
+        if (dom.hasClass(target, ns.e("item"))) {
+          target = target.querySelector(`.${ns.e("icon")}`);
         }
-        if (target.clientWidth === 0 || dom.hasClass(target, "el-rate__decimal")) {
+        if (target.clientWidth === 0 || dom.hasClass(target, ns.e("decimal"))) {
           target = target.parentNode;
         }
         pointerAtLeftHalf.value = event.offsetX * 2 <= target.clientWidth;
@@ -182,6 +183,7 @@ var script = vue.defineComponent({
       emit(constants.UPDATE_MODEL_EVENT, 0);
     }
     return {
+      ns,
       hoverIndex,
       currentValue,
       rateDisabled,

package/lib/components/rate/src/rate.vue_vue_type_script_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"rate.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/rate/src/rate.vue"],"sourcesContent":["<template>\n <div\n :class=\"rateKls\"\n role=\"slider\"\n :aria-valuenow=\"currentValue\"\n :aria-valuetext=\"text\"\n aria-valuemin=\"0\"\n :aria-valuemax=\"max\"\n tabindex=\"0\"\n @keydown=\"handleKey\"\n >\n <span\n v-for=\"(item, key) in max\"\n :key=\"key\"\n class=\"el-rate__item\"\n :style=\"{ cursor: rateDisabled ? 'auto' : 'pointer' }\"\n @mousemove=\"setCurrentValue(item, $event)\"\n @mouseleave=\"resetCurrentValue\"\n @click=\"selectValue(item)\"\n >\n <el-icon\n :class=\"[{ hover: hoverIndex === item }]\"\n class=\"el-rate__icon\"\n :style=\"getIconStyle(item)\"\n >\n <component :is=\"iconComponents[item - 1]\" />\n <el-icon\n v-if=\"showDecimalIcon(item)\"\n :style=\"decimalStyle\"\n class=\"el-rate__icon el-rate__decimal\"\n >\n <component :is=\"decimalIconComponent\" />\n </el-icon>\n </el-icon>\n </span>\n <span\n v-if=\"showText \|\| showScore\"\n class=\"el-rate__text\"\n :style=\"{ color: textColor }\"\n >\n {{ text }}\n </span>\n </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, inject, computed, ref, watch } from 'vue'\nimport { isObject, isArray } from '@vue/shared'\nimport { elFormKey } from '@element-plus/tokens'\nimport { hasClass } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\n\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { StarFilled, Star } from '@element-plus/icons-vue'\nimport { useSize } from '@element-plus/hooks'\nimport { rateProps, rateEmits } from './rate'\nimport type { ElFormContext } from '@element-plus/tokens'\n\nfunction getValueFromMap<T>(\n value: number,\n map: Record<string, T \| { excluded?: boolean; value: T }>\n) {\n const isExcludedObject = (\n val: unknown\n ): val is { excluded?: boolean } & Record<any, unknown> => isObject(val)\n\n const matchedKeys = Object.keys(map)\n .map((key) => +key)\n .filter((key) => {\n const val = map[key]\n const excluded = isExcludedObject(val) ? val.excluded : false\n return excluded ? value < key : value <= key\n })\n .sort((a, b) => a - b)\n const matchedValue = map[matchedKeys[0]]\n return (isExcludedObject(matchedValue) && matchedValue.value) \|\| matchedValue\n}\n\nexport default defineComponent({\n name: 'ElRate',\n components: {\n ElIcon,\n StarFilled,\n Star,\n },\n props: rateProps,\n emits: rateEmits,\n\n setup(props, { emit }) {\n const elForm = inject(elFormKey, {} as ElFormContext)\n\n const rateSize = useSize()\n const currentValue = ref(props.modelValue)\n const hoverIndex = ref(-1)\n const pointerAtLeftHalf = ref(true)\n\n const prefix = 'el-rate'\n const rateKls = computed(() => [prefix, `${prefix}--${rateSize.value}`])\n\n const rateDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const text = computed(() => {\n let result = ''\n if (props.showScore) {\n result = props.scoreTemplate.replace(\n /\\{\\svalue\\s\\}/,\n rateDisabled.value ? `${props.modelValue}` : `${currentValue.value}`\n )\n } else if (props.showText) {\n result = props.texts[Math.ceil(currentValue.value) - 1]\n }\n return result\n })\n const valueDecimal = computed(\n () => props.modelValue * 100 - Math.floor(props.modelValue) * 100\n )\n const colorMap = computed(() =>\n isArray(props.colors)\n ? {\n [props.lowThreshold]: props.colors[0],\n [props.highThreshold]: { value: props.colors[1], excluded: true },\n [props.max]: props.colors[2],\n }\n : props.colors\n )\n const activeColor = computed(() =>\n getValueFromMap(currentValue.value, colorMap.value)\n )\n const decimalStyle = computed(() => {\n let width = ''\n if (rateDisabled.value) {\n width = `${valueDecimal.value}%`\n } else if (props.allowHalf) {\n width = '50%'\n }\n return {\n color: activeColor.value,\n width,\n }\n })\n const componentMap = computed(() =>\n isArray(props.icons)\n ? {\n [props.lowThreshold]: props.icons[0],\n [props.highThreshold]: {\n value: props.icons[1],\n excluded: true,\n },\n [props.max]: props.icons[2],\n }\n : props.icons\n )\n const decimalIconComponent = computed(() =>\n getValueFromMap(props.modelValue, componentMap.value)\n )\n const voidComponent = computed(() =>\n rateDisabled.value ? props.disabledvoidIcon : props.voidIcon\n )\n const activeComponent = computed(() =>\n getValueFromMap(currentValue.value, componentMap.value)\n )\n const iconComponents = computed(() => {\n const result = Array(props.max)\n const threshold = currentValue.value\n result.fill(activeComponent.value, 0, threshold)\n result.fill(voidComponent.value, threshold, props.max)\n return result\n })\n\n function showDecimalIcon(item: number) {\n const showWhenDisabled =\n rateDisabled.value &&\n valueDecimal.value > 0 &&\n item - 1 < props.modelValue &&\n item > props.modelValue\n const showWhenAllowHalf =\n props.allowHalf &&\n pointerAtLeftHalf.value &&\n item - 0.5 <= currentValue.value &&\n item > currentValue.value\n return showWhenDisabled \|\| showWhenAllowHalf\n }\n\n function getIconStyle(item: number) {\n const voidColor = rateDisabled.value\n ? props.disabledVoidColor\n : props.voidColor\n return {\n color: item <= currentValue.value ? activeColor.value : voidColor,\n }\n }\n\n function selectValue(value: number) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf && pointerAtLeftHalf.value) {\n emit(UPDATE_MODEL_EVENT, currentValue.value)\n if (props.modelValue !== currentValue.value) {\n emit('change', currentValue.value)\n }\n } else {\n emit(UPDATE_MODEL_EVENT, value)\n if (props.modelValue !== value) {\n emit('change', value)\n }\n }\n }\n\n function handleKey(e: KeyboardEvent) {\n if (rateDisabled.value) {\n return\n }\n let _currentValue = currentValue.value\n const code = e.code\n if (code === EVENT_CODE.up \|\| code === EVENT_CODE.right) {\n if (props.allowHalf) {\n _currentValue += 0.5\n } else {\n _currentValue += 1\n }\n e.stopPropagation()\n e.preventDefault()\n } else if (code === EVENT_CODE.left \|\| code === EVENT_CODE.down) {\n if (props.allowHalf) {\n _currentValue -= 0.5\n } else {\n _currentValue -= 1\n }\n e.stopPropagation()\n e.preventDefault()\n }\n _currentValue = _currentValue < 0 ? 0 : _currentValue\n _currentValue = _currentValue > props.max ? props.max : _currentValue\n emit(UPDATE_MODEL_EVENT, _currentValue)\n emit('change', _currentValue)\n return _currentValue\n }\n\n function setCurrentValue(value: number, event: MouseEvent) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n let target = event.target as HTMLElement\n if (hasClass(target, 'el-rate__item')) {\n target = target.querySelector('.el-rate__icon')!\n }\n if (target.clientWidth === 0 \|\| hasClass(target, 'el-rate__decimal')) {\n target = target.parentNode as HTMLElement\n }\n pointerAtLeftHalf.value = event.offsetX * 2 <= target.clientWidth\n currentValue.value = pointerAtLeftHalf.value ? value - 0.5 : value\n } else {\n currentValue.value = value\n }\n hoverIndex.value = value\n }\n\n function resetCurrentValue() {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n currentValue.value = props.modelValue\n hoverIndex.value = -1\n }\n\n watch(\n () => props.modelValue,\n (val) => {\n currentValue.value = val\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n )\n\n if (!props.modelValue) {\n emit(UPDATE_MODEL_EVENT, 0)\n }\n\n return {\n hoverIndex,\n currentValue,\n rateDisabled,\n text,\n decimalStyle,\n decimalIconComponent,\n iconComponents,\n rateKls,\n\n showDecimalIcon,\n getIconStyle,\n selectValue,\n handleKey,\n setCurrentValue,\n resetCurrentValue,\n }\n },\n})\n</script>\n"],"names":["defineComponent","ElIcon","StarFilled","rateProps","inject","elFormKey","useSize","ref","computed","isArray","UPDATE_MODEL_EVENT","EVENT_CODE"],"mappings":"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"}
1	+ {"version":3,"file":"rate.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/rate/src/rate.vue"],"sourcesContent":["<template>\n <div\n :class=\"rateKls\"\n role=\"slider\"\n :aria-valuenow=\"currentValue\"\n :aria-valuetext=\"text\"\n aria-valuemin=\"0\"\n :aria-valuemax=\"max\"\n tabindex=\"0\"\n @keydown=\"handleKey\"\n >\n <span\n v-for=\"(item, key) in max\"\n :key=\"key\"\n :class=\"ns.e('item')\"\n :style=\"{ cursor: rateDisabled ? 'auto' : 'pointer' }\"\n @mousemove=\"setCurrentValue(item, $event)\"\n @mouseleave=\"resetCurrentValue\"\n @click=\"selectValue(item)\"\n >\n <el-icon\n :class=\"[ns.e('icon'), { hover: hoverIndex === item }]\"\n :style=\"getIconStyle(item)\"\n >\n <component :is=\"iconComponents[item - 1]\" />\n <el-icon\n v-if=\"showDecimalIcon(item)\"\n :style=\"decimalStyle\"\n :class=\"[ns.e('icon'), ns.e('decimal')]\"\n >\n <component :is=\"decimalIconComponent\" />\n </el-icon>\n </el-icon>\n </span>\n <span\n v-if=\"showText \|\| showScore\"\n :class=\"ns.e('text')\"\n :style=\"{ color: textColor }\"\n >\n {{ text }}\n </span>\n </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, inject, computed, ref, watch } from 'vue'\nimport { isObject, isArray } from '@vue/shared'\nimport { elFormKey } from '@element-plus/tokens'\nimport { hasClass } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\n\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { StarFilled, Star } from '@element-plus/icons-vue'\nimport { useNamespace, useSize } from '@element-plus/hooks'\nimport { rateProps, rateEmits } from './rate'\nimport type { ElFormContext } from '@element-plus/tokens'\n\nfunction getValueFromMap<T>(\n value: number,\n map: Record<string, T \| { excluded?: boolean; value: T }>\n) {\n const isExcludedObject = (\n val: unknown\n ): val is { excluded?: boolean } & Record<any, unknown> => isObject(val)\n\n const matchedKeys = Object.keys(map)\n .map((key) => +key)\n .filter((key) => {\n const val = map[key]\n const excluded = isExcludedObject(val) ? val.excluded : false\n return excluded ? value < key : value <= key\n })\n .sort((a, b) => a - b)\n const matchedValue = map[matchedKeys[0]]\n return (isExcludedObject(matchedValue) && matchedValue.value) \|\| matchedValue\n}\n\nexport default defineComponent({\n name: 'ElRate',\n components: {\n ElIcon,\n StarFilled,\n Star,\n },\n props: rateProps,\n emits: rateEmits,\n\n setup(props, { emit }) {\n const elForm = inject(elFormKey, {} as ElFormContext)\n const rateSize = useSize()\n const ns = useNamespace('rate')\n\n const currentValue = ref(props.modelValue)\n const hoverIndex = ref(-1)\n const pointerAtLeftHalf = ref(true)\n\n const rateKls = computed(() => [ns.b(), ns.m(rateSize.value)])\n\n const rateDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const text = computed(() => {\n let result = ''\n if (props.showScore) {\n result = props.scoreTemplate.replace(\n /\\{\\svalue\\s\\}/,\n rateDisabled.value ? `${props.modelValue}` : `${currentValue.value}`\n )\n } else if (props.showText) {\n result = props.texts[Math.ceil(currentValue.value) - 1]\n }\n return result\n })\n const valueDecimal = computed(\n () => props.modelValue * 100 - Math.floor(props.modelValue) * 100\n )\n const colorMap = computed(() =>\n isArray(props.colors)\n ? {\n [props.lowThreshold]: props.colors[0],\n [props.highThreshold]: { value: props.colors[1], excluded: true },\n [props.max]: props.colors[2],\n }\n : props.colors\n )\n const activeColor = computed(() =>\n getValueFromMap(currentValue.value, colorMap.value)\n )\n const decimalStyle = computed(() => {\n let width = ''\n if (rateDisabled.value) {\n width = `${valueDecimal.value}%`\n } else if (props.allowHalf) {\n width = '50%'\n }\n return {\n color: activeColor.value,\n width,\n }\n })\n const componentMap = computed(() =>\n isArray(props.icons)\n ? {\n [props.lowThreshold]: props.icons[0],\n [props.highThreshold]: {\n value: props.icons[1],\n excluded: true,\n },\n [props.max]: props.icons[2],\n }\n : props.icons\n )\n const decimalIconComponent = computed(() =>\n getValueFromMap(props.modelValue, componentMap.value)\n )\n const voidComponent = computed(() =>\n rateDisabled.value ? props.disabledvoidIcon : props.voidIcon\n )\n const activeComponent = computed(() =>\n getValueFromMap(currentValue.value, componentMap.value)\n )\n const iconComponents = computed(() => {\n const result = Array(props.max)\n const threshold = currentValue.value\n result.fill(activeComponent.value, 0, threshold)\n result.fill(voidComponent.value, threshold, props.max)\n return result\n })\n\n function showDecimalIcon(item: number) {\n const showWhenDisabled =\n rateDisabled.value &&\n valueDecimal.value > 0 &&\n item - 1 < props.modelValue &&\n item > props.modelValue\n const showWhenAllowHalf =\n props.allowHalf &&\n pointerAtLeftHalf.value &&\n item - 0.5 <= currentValue.value &&\n item > currentValue.value\n return showWhenDisabled \|\| showWhenAllowHalf\n }\n\n function getIconStyle(item: number) {\n const voidColor = rateDisabled.value\n ? props.disabledVoidColor\n : props.voidColor\n return {\n color: item <= currentValue.value ? activeColor.value : voidColor,\n }\n }\n\n function selectValue(value: number) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf && pointerAtLeftHalf.value) {\n emit(UPDATE_MODEL_EVENT, currentValue.value)\n if (props.modelValue !== currentValue.value) {\n emit('change', currentValue.value)\n }\n } else {\n emit(UPDATE_MODEL_EVENT, value)\n if (props.modelValue !== value) {\n emit('change', value)\n }\n }\n }\n\n function handleKey(e: KeyboardEvent) {\n if (rateDisabled.value) {\n return\n }\n let _currentValue = currentValue.value\n const code = e.code\n if (code === EVENT_CODE.up \|\| code === EVENT_CODE.right) {\n if (props.allowHalf) {\n _currentValue += 0.5\n } else {\n _currentValue += 1\n }\n e.stopPropagation()\n e.preventDefault()\n } else if (code === EVENT_CODE.left \|\| code === EVENT_CODE.down) {\n if (props.allowHalf) {\n _currentValue -= 0.5\n } else {\n _currentValue -= 1\n }\n e.stopPropagation()\n e.preventDefault()\n }\n _currentValue = _currentValue < 0 ? 0 : _currentValue\n _currentValue = _currentValue > props.max ? props.max : _currentValue\n emit(UPDATE_MODEL_EVENT, _currentValue)\n emit('change', _currentValue)\n return _currentValue\n }\n\n function setCurrentValue(value: number, event: MouseEvent) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n // TODO: use cache via computed https://github.com/element-plus/element-plus/pull/5456#discussion_r786472092\n let target = event.target as HTMLElement\n if (hasClass(target, ns.e('item'))) {\n target = target.querySelector(`.${ns.e('icon')}`)!\n }\n if (target.clientWidth === 0 \|\| hasClass(target, ns.e('decimal'))) {\n target = target.parentNode as HTMLElement\n }\n pointerAtLeftHalf.value = event.offsetX * 2 <= target.clientWidth\n currentValue.value = pointerAtLeftHalf.value ? value - 0.5 : value\n } else {\n currentValue.value = value\n }\n hoverIndex.value = value\n }\n\n function resetCurrentValue() {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n currentValue.value = props.modelValue\n hoverIndex.value = -1\n }\n\n watch(\n () => props.modelValue,\n (val) => {\n currentValue.value = val\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n )\n\n if (!props.modelValue) {\n emit(UPDATE_MODEL_EVENT, 0)\n }\n\n return {\n ns,\n hoverIndex,\n currentValue,\n rateDisabled,\n text,\n decimalStyle,\n decimalIconComponent,\n iconComponents,\n rateKls,\n\n showDecimalIcon,\n getIconStyle,\n selectValue,\n handleKey,\n setCurrentValue,\n resetCurrentValue,\n }\n },\n})\n</script>\n"],"names":["defineComponent","ElIcon","StarFilled","rateProps","inject","elFormKey","useSize","ref","computed","UPDATE_MODEL_EVENT","EVENT_CODE"],"mappings":"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"}

package/lib/components/rate/src/rate.vue_vue_type_template_id_38c42df6_lang.js CHANGED Viewed

@@ -21,14 +21,14 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.max, (item, key) => {
       return vue.openBlock(), vue.createElementBlock("span", {
         key,
-        class: "el-rate__item",
+        class: vue.normalizeClass(_ctx.ns.e("item")),
         style: vue.normalizeStyle({ cursor: _ctx.rateDisabled ? "auto" : "pointer" }),
         onMousemove: ($event) => _ctx.setCurrentValue(item, $event),
         onMouseleave: _cache[0] || (_cache[0] = (...args) => _ctx.resetCurrentValue && _ctx.resetCurrentValue(...args)),
         onClick: ($event) => _ctx.selectValue(item)
       }, [
         vue.createVNode(_component_el_icon, {
-          class: vue.normalizeClass([[{ hover: _ctx.hoverIndex === item }], "el-rate__icon"]),
+          class: vue.normalizeClass([_ctx.ns.e("icon"), { hover: _ctx.hoverIndex === item }]),
           style: vue.normalizeStyle(_ctx.getIconStyle(item))
         }, {
           default: vue.withCtx(() => [
@@ -36,23 +36,23 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
             _ctx.showDecimalIcon(item) ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
               key: 0,
               style: vue.normalizeStyle(_ctx.decimalStyle),
-              class: "el-rate__icon el-rate__decimal"
+              class: vue.normalizeClass([_ctx.ns.e("icon"), _ctx.ns.e("decimal")])
             }, {
               default: vue.withCtx(() => [
                 (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.decimalIconComponent)))
               ]),
               _: 1
-            }, 8, ["style"])) : vue.createCommentVNode("v-if", true)
+            }, 8, ["style", "class"])) : vue.createCommentVNode("v-if", true)
           ]),
           _: 2
         }, 1032, ["class", "style"])
-      ], 44, _hoisted_2);
+      ], 46, _hoisted_2);
     }), 128)),
     _ctx.showText || _ctx.showScore ? (vue.openBlock(), vue.createElementBlock("span", {
       key: 0,
-      class: "el-rate__text",
+      class: vue.normalizeClass(_ctx.ns.e("text")),
       style: vue.normalizeStyle({ color: _ctx.textColor })
-    }, vue.toDisplayString(_ctx.text), 5)) : vue.createCommentVNode("v-if", true)
+    }, vue.toDisplayString(_ctx.text), 7)) : vue.createCommentVNode("v-if", true)
   ], 42, _hoisted_1);
 }

package/lib/components/rate/src/rate.vue_vue_type_template_id_38c42df6_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"rate.vue_vue_type_template_id_38c42df6_lang.js","sources":["../../../../../../packages/components/rate/src/rate.vue?vue&type=template&id=38c42df6&lang.js"],"sourcesContent":["<template>\n <div\n :class=\"rateKls\"\n role=\"slider\"\n :aria-valuenow=\"currentValue\"\n :aria-valuetext=\"text\"\n aria-valuemin=\"0\"\n :aria-valuemax=\"max\"\n tabindex=\"0\"\n @keydown=\"handleKey\"\n >\n <span\n v-for=\"(item, key) in max\"\n :key=\"key\"\n class=\"~~el-rate__item~~\"\n :style=\"{ cursor: rateDisabled ? 'auto' : 'pointer' }\"\n @mousemove=\"setCurrentValue(item, $event)\"\n @mouseleave=\"resetCurrentValue\"\n @click=\"selectValue(item)\"\n >\n <el-icon\n :class=\"[{ hover: hoverIndex === item }]\"\n ~~class=\"el-rate__icon\"\n~~ :style=\"getIconStyle(item)\"\n >\n <component :is=\"iconComponents[item - 1]\" />\n <el-icon\n v-if=\"showDecimalIcon(item)\"\n :style=\"decimalStyle\"\n class=\"~~el-rate__icon~~ ~~el-rate__decimal~~\"\n >\n <component :is=\"decimalIconComponent\" />\n </el-icon>\n </el-icon>\n </span>\n <span\n v-if=\"showText \|\| showScore\"\n class=\"~~el-rate__text~~\"\n :style=\"{ color: textColor }\"\n >\n {{ text }}\n </span>\n </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, inject, computed, ref, watch } from 'vue'\nimport { isObject, isArray } from '@vue/shared'\nimport { elFormKey } from '@element-plus/tokens'\nimport { hasClass } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\n\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { StarFilled, Star } from '@element-plus/icons-vue'\nimport { useSize } from '@element-plus/hooks'\nimport { rateProps, rateEmits } from './rate'\nimport type { ElFormContext } from '@element-plus/tokens'\n\nfunction getValueFromMap<T>(\n value: number,\n map: Record<string, T \| { excluded?: boolean; value: T }>\n) {\n const isExcludedObject = (\n val: unknown\n ): val is { excluded?: boolean } & Record<any, unknown> => isObject(val)\n\n const matchedKeys = Object.keys(map)\n .map((key) => +key)\n .filter((key) => {\n const val = map[key]\n const excluded = isExcludedObject(val) ? val.excluded : false\n return excluded ? value < key : value <= key\n })\n .sort((a, b) => a - b)\n const matchedValue = map[matchedKeys[0]]\n return (isExcludedObject(matchedValue) && matchedValue.value) \|\| matchedValue\n}\n\nexport default defineComponent({\n name: 'ElRate',\n components: {\n ElIcon,\n StarFilled,\n Star,\n },\n props: rateProps,\n emits: rateEmits,\n\n setup(props, { emit }) {\n const elForm = inject(elFormKey, {} as ElFormContext)\n\n const rateSize = useSize()\n const currentValue = ref(props.modelValue)\n const hoverIndex = ref(-1)\n const pointerAtLeftHalf = ref(true)\n\n const ~~prefix = 'el-rate'\n const~~ rateKls = computed(() => [~~prefix~~, ~~`${prefix}--${~~rateSize.value}`])\n\n const rateDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const text = computed(() => {\n let result = ''\n if (props.showScore) {\n result = props.scoreTemplate.replace(\n /\\{\\svalue\\s\\}/,\n rateDisabled.value ? `${props.modelValue}` : `${currentValue.value}`\n )\n } else if (props.showText) {\n result = props.texts[Math.ceil(currentValue.value) - 1]\n }\n return result\n })\n const valueDecimal = computed(\n () => props.modelValue * 100 - Math.floor(props.modelValue) * 100\n )\n const colorMap = computed(() =>\n isArray(props.colors)\n ? {\n [props.lowThreshold]: props.colors[0],\n [props.highThreshold]: { value: props.colors[1], excluded: true },\n [props.max]: props.colors[2],\n }\n : props.colors\n )\n const activeColor = computed(() =>\n getValueFromMap(currentValue.value, colorMap.value)\n )\n const decimalStyle = computed(() => {\n let width = ''\n if (rateDisabled.value) {\n width = `${valueDecimal.value}%`\n } else if (props.allowHalf) {\n width = '50%'\n }\n return {\n color: activeColor.value,\n width,\n }\n })\n const componentMap = computed(() =>\n isArray(props.icons)\n ? {\n [props.lowThreshold]: props.icons[0],\n [props.highThreshold]: {\n value: props.icons[1],\n excluded: true,\n },\n [props.max]: props.icons[2],\n }\n : props.icons\n )\n const decimalIconComponent = computed(() =>\n getValueFromMap(props.modelValue, componentMap.value)\n )\n const voidComponent = computed(() =>\n rateDisabled.value ? props.disabledvoidIcon : props.voidIcon\n )\n const activeComponent = computed(() =>\n getValueFromMap(currentValue.value, componentMap.value)\n )\n const iconComponents = computed(() => {\n const result = Array(props.max)\n const threshold = currentValue.value\n result.fill(activeComponent.value, 0, threshold)\n result.fill(voidComponent.value, threshold, props.max)\n return result\n })\n\n function showDecimalIcon(item: number) {\n const showWhenDisabled =\n rateDisabled.value &&\n valueDecimal.value > 0 &&\n item - 1 < props.modelValue &&\n item > props.modelValue\n const showWhenAllowHalf =\n props.allowHalf &&\n pointerAtLeftHalf.value &&\n item - 0.5 <= currentValue.value &&\n item > currentValue.value\n return showWhenDisabled \|\| showWhenAllowHalf\n }\n\n function getIconStyle(item: number) {\n const voidColor = rateDisabled.value\n ? props.disabledVoidColor\n : props.voidColor\n return {\n color: item <= currentValue.value ? activeColor.value : voidColor,\n }\n }\n\n function selectValue(value: number) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf && pointerAtLeftHalf.value) {\n emit(UPDATE_MODEL_EVENT, currentValue.value)\n if (props.modelValue !== currentValue.value) {\n emit('change', currentValue.value)\n }\n } else {\n emit(UPDATE_MODEL_EVENT, value)\n if (props.modelValue !== value) {\n emit('change', value)\n }\n }\n }\n\n function handleKey(e: KeyboardEvent) {\n if (rateDisabled.value) {\n return\n }\n let _currentValue = currentValue.value\n const code = e.code\n if (code === EVENT_CODE.up \|\| code === EVENT_CODE.right) {\n if (props.allowHalf) {\n _currentValue += 0.5\n } else {\n _currentValue += 1\n }\n e.stopPropagation()\n e.preventDefault()\n } else if (code === EVENT_CODE.left \|\| code === EVENT_CODE.down) {\n if (props.allowHalf) {\n _currentValue -= 0.5\n } else {\n _currentValue -= 1\n }\n e.stopPropagation()\n e.preventDefault()\n }\n _currentValue = _currentValue < 0 ? 0 : _currentValue\n _currentValue = _currentValue > props.max ? props.max : _currentValue\n emit(UPDATE_MODEL_EVENT, _currentValue)\n emit('change', _currentValue)\n return _currentValue\n }\n\n function setCurrentValue(value: number, event: MouseEvent) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n let target = event.target as HTMLElement\n if (hasClass(target, '~~el-rate__item~~')) {\n target = target.querySelector('.~~el-rate__icon~~')!\n }\n if (target.clientWidth === 0 \|\| hasClass(target, '~~el-rate__decimal~~')) {\n target = target.parentNode as HTMLElement\n }\n pointerAtLeftHalf.value = event.offsetX * 2 <= target.clientWidth\n currentValue.value = pointerAtLeftHalf.value ? value - 0.5 : value\n } else {\n currentValue.value = value\n }\n hoverIndex.value = value\n }\n\n function resetCurrentValue() {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n currentValue.value = props.modelValue\n hoverIndex.value = -1\n }\n\n watch(\n () => props.modelValue,\n (val) => {\n currentValue.value = val\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n )\n\n if (!props.modelValue) {\n emit(UPDATE_MODEL_EVENT, 0)\n }\n\n return {\n hoverIndex,\n currentValue,\n rateDisabled,\n text,\n decimalStyle,\n decimalIconComponent,\n iconComponents,\n rateKls,\n\n showDecimalIcon,\n getIconStyle,\n selectValue,\n handleKey,\n setCurrentValue,\n resetCurrentValue,\n }\n },\n})\n</script>\n"],"names":["_openBlock","_createVNode"],"mappings":";;;;;;;;;;;;;;IAEK,uBAAO;IACR;IACC,eAAa,EAAE;IACf;IACD,iBAAc;;;aAGNA,gDAAE;;;;QAIP;~~QACD~~;~~QACC~~;;QAEAC,eAAU;eACL,gCAAa,~~KAAK;;;UAGrB;;;;;;;;;;;;;;;;;;;;;;KAeG~~;;;;;"}
1	+ {"version":3,"file":"rate.vue_vue_type_template_id_38c42df6_lang.js","sources":["../../../../../../packages/components/rate/src/rate.vue?vue&type=template&id=38c42df6&lang.js"],"sourcesContent":["<template>\n <div\n :class=\"rateKls\"\n role=\"slider\"\n :aria-valuenow=\"currentValue\"\n :aria-valuetext=\"text\"\n aria-valuemin=\"0\"\n :aria-valuemax=\"max\"\n tabindex=\"0\"\n @keydown=\"handleKey\"\n >\n <span\n v-for=\"(item, key) in max\"\n :key=\"key\"\n :class=\"ns.e('item')\"\n :style=\"{ cursor: rateDisabled ? 'auto' : 'pointer' }\"\n @mousemove=\"setCurrentValue(item, $event)\"\n @mouseleave=\"resetCurrentValue\"\n @click=\"selectValue(item)\"\n >\n <el-icon\n :class=\"[ns.e('icon'), { hover: hoverIndex === item }]\"\n :style=\"getIconStyle(item)\"\n >\n <component :is=\"iconComponents[item - 1]\" />\n <el-icon\n v-if=\"showDecimalIcon(item)\"\n :style=\"decimalStyle\"\n :class=\"[ns.e('icon'), ns.e('decimal')]\"\n >\n <component :is=\"decimalIconComponent\" />\n </el-icon>\n </el-icon>\n </span>\n <span\n v-if=\"showText \|\| showScore\"\n :class=\"ns.e('text')\"\n :style=\"{ color: textColor }\"\n >\n {{ text }}\n </span>\n </div>\n</template>\n<script lang=\"ts\">\nimport { defineComponent, inject, computed, ref, watch } from 'vue'\nimport { isObject, isArray } from '@vue/shared'\nimport { elFormKey } from '@element-plus/tokens'\nimport { hasClass } from '@element-plus/utils/dom'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\n\nimport { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { StarFilled, Star } from '@element-plus/icons-vue'\nimport { useNamespace, useSize } from '@element-plus/hooks'\nimport { rateProps, rateEmits } from './rate'\nimport type { ElFormContext } from '@element-plus/tokens'\n\nfunction getValueFromMap<T>(\n value: number,\n map: Record<string, T \| { excluded?: boolean; value: T }>\n) {\n const isExcludedObject = (\n val: unknown\n ): val is { excluded?: boolean } & Record<any, unknown> => isObject(val)\n\n const matchedKeys = Object.keys(map)\n .map((key) => +key)\n .filter((key) => {\n const val = map[key]\n const excluded = isExcludedObject(val) ? val.excluded : false\n return excluded ? value < key : value <= key\n })\n .sort((a, b) => a - b)\n const matchedValue = map[matchedKeys[0]]\n return (isExcludedObject(matchedValue) && matchedValue.value) \|\| matchedValue\n}\n\nexport default defineComponent({\n name: 'ElRate',\n components: {\n ElIcon,\n StarFilled,\n Star,\n },\n props: rateProps,\n emits: rateEmits,\n\n setup(props, { emit }) {\n const elForm = inject(elFormKey, {} as ElFormContext)\n const rateSize = useSize()\n const ns = useNamespace('rate')\n\n const currentValue = ref(props.modelValue)\n const hoverIndex = ref(-1)\n const pointerAtLeftHalf = ref(true)\n\n const rateKls = computed(() => [ns.b(), ns.m(rateSize.value)])\n\n const rateDisabled = computed(() => props.disabled \|\| elForm.disabled)\n const text = computed(() => {\n let result = ''\n if (props.showScore) {\n result = props.scoreTemplate.replace(\n /\\{\\svalue\\s\\}/,\n rateDisabled.value ? `${props.modelValue}` : `${currentValue.value}`\n )\n } else if (props.showText) {\n result = props.texts[Math.ceil(currentValue.value) - 1]\n }\n return result\n })\n const valueDecimal = computed(\n () => props.modelValue * 100 - Math.floor(props.modelValue) * 100\n )\n const colorMap = computed(() =>\n isArray(props.colors)\n ? {\n [props.lowThreshold]: props.colors[0],\n [props.highThreshold]: { value: props.colors[1], excluded: true },\n [props.max]: props.colors[2],\n }\n : props.colors\n )\n const activeColor = computed(() =>\n getValueFromMap(currentValue.value, colorMap.value)\n )\n const decimalStyle = computed(() => {\n let width = ''\n if (rateDisabled.value) {\n width = `${valueDecimal.value}%`\n } else if (props.allowHalf) {\n width = '50%'\n }\n return {\n color: activeColor.value,\n width,\n }\n })\n const componentMap = computed(() =>\n isArray(props.icons)\n ? {\n [props.lowThreshold]: props.icons[0],\n [props.highThreshold]: {\n value: props.icons[1],\n excluded: true,\n },\n [props.max]: props.icons[2],\n }\n : props.icons\n )\n const decimalIconComponent = computed(() =>\n getValueFromMap(props.modelValue, componentMap.value)\n )\n const voidComponent = computed(() =>\n rateDisabled.value ? props.disabledvoidIcon : props.voidIcon\n )\n const activeComponent = computed(() =>\n getValueFromMap(currentValue.value, componentMap.value)\n )\n const iconComponents = computed(() => {\n const result = Array(props.max)\n const threshold = currentValue.value\n result.fill(activeComponent.value, 0, threshold)\n result.fill(voidComponent.value, threshold, props.max)\n return result\n })\n\n function showDecimalIcon(item: number) {\n const showWhenDisabled =\n rateDisabled.value &&\n valueDecimal.value > 0 &&\n item - 1 < props.modelValue &&\n item > props.modelValue\n const showWhenAllowHalf =\n props.allowHalf &&\n pointerAtLeftHalf.value &&\n item - 0.5 <= currentValue.value &&\n item > currentValue.value\n return showWhenDisabled \|\| showWhenAllowHalf\n }\n\n function getIconStyle(item: number) {\n const voidColor = rateDisabled.value\n ? props.disabledVoidColor\n : props.voidColor\n return {\n color: item <= currentValue.value ? activeColor.value : voidColor,\n }\n }\n\n function selectValue(value: number) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf && pointerAtLeftHalf.value) {\n emit(UPDATE_MODEL_EVENT, currentValue.value)\n if (props.modelValue !== currentValue.value) {\n emit('change', currentValue.value)\n }\n } else {\n emit(UPDATE_MODEL_EVENT, value)\n if (props.modelValue !== value) {\n emit('change', value)\n }\n }\n }\n\n function handleKey(e: KeyboardEvent) {\n if (rateDisabled.value) {\n return\n }\n let _currentValue = currentValue.value\n const code = e.code\n if (code === EVENT_CODE.up \|\| code === EVENT_CODE.right) {\n if (props.allowHalf) {\n _currentValue += 0.5\n } else {\n _currentValue += 1\n }\n e.stopPropagation()\n e.preventDefault()\n } else if (code === EVENT_CODE.left \|\| code === EVENT_CODE.down) {\n if (props.allowHalf) {\n _currentValue -= 0.5\n } else {\n _currentValue -= 1\n }\n e.stopPropagation()\n e.preventDefault()\n }\n _currentValue = _currentValue < 0 ? 0 : _currentValue\n _currentValue = _currentValue > props.max ? props.max : _currentValue\n emit(UPDATE_MODEL_EVENT, _currentValue)\n emit('change', _currentValue)\n return _currentValue\n }\n\n function setCurrentValue(value: number, event: MouseEvent) {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n // TODO: use cache via computed https://github.com/element-plus/element-plus/pull/5456#discussion_r786472092\n let target = event.target as HTMLElement\n if (hasClass(target, ns.e('item'))) {\n target = target.querySelector(`.${ns.e('icon')}`)!\n }\n if (target.clientWidth === 0 \|\| hasClass(target, ns.e('decimal'))) {\n target = target.parentNode as HTMLElement\n }\n pointerAtLeftHalf.value = event.offsetX * 2 <= target.clientWidth\n currentValue.value = pointerAtLeftHalf.value ? value - 0.5 : value\n } else {\n currentValue.value = value\n }\n hoverIndex.value = value\n }\n\n function resetCurrentValue() {\n if (rateDisabled.value) {\n return\n }\n if (props.allowHalf) {\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n currentValue.value = props.modelValue\n hoverIndex.value = -1\n }\n\n watch(\n () => props.modelValue,\n (val) => {\n currentValue.value = val\n pointerAtLeftHalf.value =\n props.modelValue !== Math.floor(props.modelValue)\n }\n )\n\n if (!props.modelValue) {\n emit(UPDATE_MODEL_EVENT, 0)\n }\n\n return {\n ns,\n hoverIndex,\n currentValue,\n rateDisabled,\n text,\n decimalStyle,\n decimalIconComponent,\n iconComponents,\n rateKls,\n\n showDecimalIcon,\n getIconStyle,\n selectValue,\n handleKey,\n setCurrentValue,\n resetCurrentValue,\n }\n },\n})\n</script>\n"],"names":["_openBlock","_createVNode"],"mappings":";;;;;;;;;;;;;;IAEK,uBAAO;IACR;IACC,eAAa,EAAE;IACf;IACD,iBAAc;;;aAGNA,gDAAE;;;;QAIP;QACA,uBAAO;QACP;;QAEAC,eAAU;eACL,gCAAa;;;UAGhB,2BAAQ;;;;;yCAKmB;;;;;;oCAI1B;;;;;;;;;;;KAKE;;;;;"}

package/lib/components/result/index.d.ts CHANGED Viewed

@@ -3,6 +3,17 @@ export declare const ElResult: import("../../utils/types").SFCWithInstall<import
     readonly subTitle: import("../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly icon: import("../../utils/props").BuildPropReturn<unknown, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     resultIcon: import("vue").ComputedRef<{
         class: "icon-success" | "icon-warning" | "icon-error" | "icon-info";
         component: import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;

package/lib/components/result/src/result.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import type { Component, ExtractPropTypes } from 'vue';
+import type Result from './result.vue';
 export declare const IconMap: {
     readonly success: "icon-success";
     readonly warning: "icon-warning";
@@ -12,3 +13,4 @@ export declare const resultProps: {
     readonly icon: import("element-plus/es/utils/props").BuildPropReturn<unknown, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
 };
 export declare type ResultProps = ExtractPropTypes<typeof resultProps>;
+export declare type ResultInstance = InstanceType<typeof Result>;

package/lib/components/result/src/result.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"result.js","sources":["../../../../../../packages/components/result/src/result.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport {\n WarningFilled,\n CircleCheckFilled,\n CircleCloseFilled,\n InfoFilled,\n} from '@element-plus/icons-vue'\nimport type { Component, ExtractPropTypes } from 'vue'\n\nexport const IconMap = {\n success: 'icon-success',\n warning: 'icon-warning',\n error: 'icon-error',\n info: 'icon-info',\n} as const\n\nexport const IconComponentMap: Record<\n typeof IconMap[keyof typeof IconMap],\n Component\n> = {\n [IconMap.success]: CircleCheckFilled,\n [IconMap.warning]: WarningFilled,\n [IconMap.error]: CircleCloseFilled,\n [IconMap.info]: InfoFilled,\n}\n\nexport const resultProps = buildProps({\n title: {\n type: String,\n default: '',\n },\n subTitle: {\n type: String,\n default: '',\n },\n icon: {\n values: ['success', 'warning', 'info', 'error'],\n default: 'info',\n },\n} as const)\n\nexport type ResultProps = ExtractPropTypes<typeof resultProps>\n"],"names":["CircleCheckFilled","WarningFilled","CircleCloseFilled","InfoFilled","buildProps"],"mappings":";;;;;;;AAOY,MAAC,OAAO,GAAG;AACvB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,KAAK,EAAE,YAAY;AACrB,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE;AACU,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGA,0BAAiB;AACtC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGC,sBAAa;AAClC,EAAE,CAAC,OAAO,CAAC,KAAK,GAAGC,0BAAiB;AACpC,EAAE,CAAC,OAAO,CAAC,IAAI,GAAGC,mBAAU;AAC5B,EAAE;AACU,MAAC,WAAW,GAAGC,gBAAU,CAAC;AACtC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC;AACnD,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,CAAC;;;;;;"}
1	+ {"version":3,"file":"result.js","sources":["../../../../../../packages/components/result/src/result.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils/props'\nimport {\n WarningFilled,\n CircleCheckFilled,\n CircleCloseFilled,\n InfoFilled,\n} from '@element-plus/icons-vue'\nimport type { Component, ExtractPropTypes } from 'vue'\nimport type Result from './result.vue'\n\nexport const IconMap = {\n success: 'icon-success',\n warning: 'icon-warning',\n error: 'icon-error',\n info: 'icon-info',\n} as const\n\nexport const IconComponentMap: Record<\n typeof IconMap[keyof typeof IconMap],\n Component\n> = {\n [IconMap.success]: CircleCheckFilled,\n [IconMap.warning]: WarningFilled,\n [IconMap.error]: CircleCloseFilled,\n [IconMap.info]: InfoFilled,\n}\n\nexport const resultProps = buildProps({\n title: {\n type: String,\n default: '',\n },\n subTitle: {\n type: String,\n default: '',\n },\n icon: {\n values: ['success', 'warning', 'info', 'error'],\n default: 'info',\n },\n} as const)\n\nexport type ResultProps = ExtractPropTypes<typeof resultProps>\n\nexport type ResultInstance = InstanceType<typeof Result>\n"],"names":["CircleCheckFilled","WarningFilled","CircleCloseFilled","InfoFilled","buildProps"],"mappings":";;;;;;;AAOY,MAAC,OAAO,GAAG;AACvB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,OAAO,EAAE,cAAc;AACzB,EAAE,KAAK,EAAE,YAAY;AACrB,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE;AACU,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGA,0BAAiB;AACtC,EAAE,CAAC,OAAO,CAAC,OAAO,GAAGC,sBAAa;AAClC,EAAE,CAAC,OAAO,CAAC,KAAK,GAAGC,0BAAiB;AACpC,EAAE,CAAC,OAAO,CAAC,IAAI,GAAGC,mBAAU;AAC5B,EAAE;AACU,MAAC,WAAW,GAAGC,gBAAU,CAAC;AACtC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,MAAM,EAAE,CAAC,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,CAAC;AACnD,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,CAAC;;;;;;"}

package/lib/components/result/src/result.vue.d.ts CHANGED Viewed

@@ -3,6 +3,17 @@ declare const _default: import("vue").DefineComponent<{
     readonly subTitle: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly icon: import("../../../utils/props").BuildPropReturn<unknown, "info", unknown, "success" | "warning" | "info" | "error", unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     resultIcon: import("vue").ComputedRef<{
         class: "icon-success" | "icon-warning" | "icon-error" | "icon-info";
         component: import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>;

package/lib/components/result/src/result.vue_vue_type_script_lang.js CHANGED Viewed

@@ -3,12 +3,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 var vue = require('vue');
+require('../../../hooks/index.js');
 var result = require('./result.js');
+var index = require('../../../hooks/use-namespace/index.js');
 var script = vue.defineComponent({
   name: "ElResult",
   props: result.resultProps,
   setup(props) {
+    const ns = index.useNamespace("result");
     const resultIcon = vue.computed(() => {
       const icon = props.icon;
       const iconClass = icon && result.IconMap[icon] ? result.IconMap[icon] : "icon-info";
@@ -19,6 +22,7 @@ var script = vue.defineComponent({
       };
     });
     return {
+      ns,
       resultIcon
     };
   }

package/lib/components/result/src/result.vue_vue_type_script_lang.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"result.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/result/src/result.vue"],"sourcesContent":["<template>\n <div class=\"~~el-result~~\">\n <div class=\"~~el-result__icon~~\">\n <slot name=\"icon\">\n <component\n :is=\"resultIcon.component\"\n v-if=\"resultIcon.component\"\n :class=\"resultIcon.class\"\n />\n </slot>\n </div>\n <div v-if=\"title \|\| $slots.title\" class=\"~~el-result__title~~\">\n <slot name=\"title\">\n <p>{{ title }}</p>\n </slot>\n </div>\n <div v-if=\"subTitle \|\| $slots.subTitle\" class=\"~~el-result__subtitle~~\">\n <slot name=\"subTitle\">\n <p>{{ subTitle }}</p>\n </slot>\n </div>\n <div v-if=\"$slots.extra\" class=\"~~el-result__extra~~\">\n <slot name=\"extra\"></slot>\n </div>\n </div>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { resultProps, IconComponentMap, IconMap } from './result'\n\nexport default defineComponent({\n name: 'ElResult',\n props: resultProps,\n setup(props) {\n const resultIcon = computed(() => {\n const icon = props.icon\n const iconClass = icon && IconMap[icon] ? IconMap[icon] : 'icon-info'\n const iconComponent =\n IconComponentMap[iconClass] \|\| IconComponentMap['icon-info']\n\n return {\n class: iconClass,\n component: iconComponent,\n }\n })\n\n return {\n resultIcon,\n }\n },\n})\n</script>\n"],"names":["defineComponent","resultProps","~~IconMap~~","IconComponentMap"],"mappings":"~~;;;;;;;AA4BA~~,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,kBAAW;EAClB,MAAM,KAAK,EAAE;IACX,MAAM,~~UAAU~~;~~MACd~~,MAAM;~~MACN~~,~~MAAM~~,~~SAAS,~~GAAG,IAAI,~~IAAIC;MAC1B~~,MAAM,aAAa,GAAGC;MACtB,OAAO;QACL,KAAK,EAAE,SAAS;QAChB,SAAS,EAAE~~,aAAa~~;;~~MAE1B,CAAC~~;~~WACI~~;~~gBACK~~;MACV;;;;;;"}
1	+ {"version":3,"file":"result.vue_vue_type_script_lang.js","sources":["../../../../../../packages/components/result/src/result.vue"],"sourcesContent":["<template>\n <div :class=\"ns.b()\">\n <div :class=\"ns.e('icon')\">\n <slot name=\"icon\">\n <component\n :is=\"resultIcon.component\"\n v-if=\"resultIcon.component\"\n :class=\"resultIcon.class\"\n />\n </slot>\n </div>\n <div v-if=\"title \|\| $slots.title\" :class=\"ns.e('title')\">\n <slot name=\"title\">\n <p>{{ title }}</p>\n </slot>\n </div>\n <div v-if=\"subTitle \|\| $slots.subTitle\" :class=\"ns.e('subtitle')\">\n <slot name=\"subTitle\">\n <p>{{ subTitle }}</p>\n </slot>\n </div>\n <div v-if=\"$slots.extra\" :class=\"ns.e('extra')\">\n <slot name=\"extra\"></slot>\n </div>\n </div>\n</template>\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { resultProps, IconComponentMap, IconMap } from './result'\n\nexport default defineComponent({\n name: 'ElResult',\n props: resultProps,\n setup(props) {\n const ns = useNamespace('result')\n\n const resultIcon = computed(() => {\n const icon = props.icon\n const iconClass = icon && IconMap[icon] ? IconMap[icon] : 'icon-info'\n const iconComponent =\n IconComponentMap[iconClass] \|\| IconComponentMap['icon-info']\n\n return {\n class: iconClass,\n component: iconComponent,\n }\n })\n\n return {\n ns,\n resultIcon,\n }\n },\n})\n</script>\n"],"names":["defineComponent","resultProps","useNamespace","IconComponentMap"],"mappings":";;;;;;;;;AA6BA,aAAeA,mBAAe,CAAC;;AAE/B,EAAE,KAAK,EAAEC,kBAAW;EAClB,MAAM,KAAK,EAAE;IACX,MAAM,EAAE,GAAGC;IACX,MAAM;MACJ,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC;;MAExB,MAAM,aAAa,GAAGC;MACtB,OAAO;QACL,KAAK,EAAE,SAAS;QAChB,SAAS,EAAE;QACX;;WAEG;QACH;gBACQ;MACV;;;;;;"}