7c8a3f3e-046f-4ced-b630-a0c6636a0ccb

Committed 09 Jun 2025 08:22AM UTC coverage: 100.0%. Remained the same

Build # 7c8a3f3e-046f-4ced-b630-a0c6636a0ccb

Build Type

push

circleci

Committed by

Haixing-Hu

Commit Message

chore: update yarn.lock after dependency changes

Run Details

151 of 151 branches covered (100.0%)

Branch coverage included in aggregate %.

222 of 222 relevant lines covered (100.0%)

19.39 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

100.0

/src/component.js

////////////////////////////////////////////////////////////////////////////////
//
//    Copyright (c) 2022 - 2023.
//    Haixing Hu, Qubit Co. Ltd.
//
//    All rights reserved.
//
////////////////////////////////////////////////////////////////////////////////
import buildOptions from './impl/build-options';

/**
 * The decorator of Vue class components.
 *
 * This decorator must be used to decorate a class.
 *
 * Usage Example:
 *
 * ```vue
 * <template>
 *   <div class="hello-page">
 *     <div class="message">{{ message }}</div>
 *     <div class="computed-message">{{ computedMessage }}</div>
 *     <div class="value">{{ value }}</div>
 *     <input v-model="newMessage">
 *     <button @click="setMessage(newMessage)">Set Message</button>
 *     <my-component />
 *   </div>
 * </template>
 * <script>
 * import { Component, toVue } from 'vue3-class-component';
 * import MyComponent from './my-component.vue';
 *
 * &#064;Component({
 *   components: {
 *     MyComponent,
 *   },
 * })
 * class HelloPage {
 *   message = 'hello';
 *
 *   value = 0;
 *
 *   newMessage = '';
 *
 *   mounted() {
 *     this.value = this.$route.params.value;
 *   }
 *
 *   get computedMessage() {
 *     return this.message + '!';
 *   }
 *
 *   setMessage(s) {
 *     this.message = s;
 *   }
 * }
 *
 * export default toVue(MyComponent); // don't forget calling `toVue`
 * </script>
 * ```
 *
 * @param {...any} args
 *     The array of arguments for calling this decorator. If it has only one
 *     argument, the only argument is the additional options of this decorator,
 *     and this function should return another function which is the decorator
 *     of a class; If it has two arguments, the first argument is the constructor
 *     of the decorated class, and the second argument is the context object
 *     containing information about the class being decorated.
 * @return {Function}
 *     If this function has only one argument, this function returns another
 *     function which is the decorator of a class; otherwise, this function
 *     returns the decorated class.
 * @see https://babeljs.io/docs/babel-plugin-proposal-decorators#class-decorator
 * @see https://github.com/tc39/proposal-decorators
 * @author Haixing Hu
 */
function Component(...args) {
  if (args.length === 1) {        // the decorator is used with options
    // returns a simple class decorator
    return (Class, context) => buildOptions(Class, context, args[0]);
  } else if (args.length === 2) { // the decorator is used without options
    return buildOptions(args[0], args[1], {});
  } else {
    throw new TypeError('Invalid use of the `@Component` decorator.');
  }
}

export default Component;

1	////////////////////////////////////////////////////////////////////////////////
2	//
3	// Copyright (c) 2022 - 2023.
4	// Haixing Hu, Qubit Co. Ltd.
5	//
6	// All rights reserved.
7	//
8	////////////////////////////////////////////////////////////////////////////////
9	import buildOptions from './impl/build-options';
10
11	/**
12	* The decorator of Vue class components.
13	*
14	* This decorator must be used to decorate a class.
15	*
16	* Usage Example:
17	*
18	* ```vue
19	* <template>
20	* <div class="hello-page">
21	* <div class="message">{{ message }}</div>
22	* <div class="computed-message">{{ computedMessage }}</div>
23	* <div class="value">{{ value }}</div>
24	* <input v-model="newMessage">
25	* <button @click="setMessage(newMessage)">Set Message</button>
26	* <my-component />
27	* </div>
28	* </template>
29	* <script>
30	* import { Component, toVue } from 'vue3-class-component';
31	* import MyComponent from './my-component.vue';
32	*
33	* @Component({
34	* components: {
35	* MyComponent,
36	* },
37	* })
38	* class HelloPage {
39	* message = 'hello';
40	*
41	* value = 0;
42	*
43	* newMessage = '';
44	*
45	* mounted() {
46	* this.value = this.$route.params.value;
47	* }
48	*
49	* get computedMessage() {
50	* return this.message + '!';
51	* }
52	*
53	* setMessage(s) {
54	* this.message = s;
55	* }
56	* }
57	*
58	* export default toVue(MyComponent); // don't forget calling `toVue`
59	* </script>
60	* ```
61	*
62	* @param {...any} args
63	* The array of arguments for calling this decorator. If it has only one
64	* argument, the only argument is the additional options of this decorator,
65	* and this function should return another function which is the decorator
66	* of a class; If it has two arguments, the first argument is the constructor
67	* of the decorated class, and the second argument is the context object
68	* containing information about the class being decorated.
69	* @return {Function}
70	* If this function has only one argument, this function returns another
71	* function which is the decorator of a class; otherwise, this function
72	* returns the decorated class.
73	* @see https://babeljs.io/docs/babel-plugin-proposal-decorators#class-decorator
74	* @see https://github.com/tc39/proposal-decorators
75	* @author Haixing Hu
76	*/
77	function Component(...args) {
78	if (args.length === 1) { // the decorator is used with options	51✔
79	// returns a simple class decorator
80	return (Class, context) => buildOptions(Class, context, args[0]);	18✔
81	} else if (args.length === 2) { // the decorator is used without options	33✔
82	return buildOptions(args[0], args[1], {});	32✔
83	} else {
84	throw new TypeError('Invalid use of the `@Component` decorator.');	1✔
85	}
86	}
87
88	export default Component;

Haixing-Hu / vue3-class-component / 7c8a3f3e-046f-4ced-b630-a0c6636a0ccb

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous