hoci 0.0.2 → 0.0.4

package/dist/index.cjs

@@ -56,7 +56,8 @@ const useSelectionItem = defineHookComponent({
     const parentLabel = core.resolveRef(vue.inject(ItemLabelSymbol));
     function render() {
       return vue.renderSlot(slots, "default", {}, () => {
-        let label = props.label ?? parentLabel.value;
+        var _a;
+        let label = (_a = props.label) != null ? _a : parentLabel.value;
         if (label) {
           if (typeof label == "function") {
             label = label(props.value);
@@ -86,14 +87,22 @@ const useSelectionItem = defineHookComponent({
     }
     const isActive = vue.inject(IsActiveSymbol, () => false);
     const changeActive = vue.inject(ChangeActiveSymbol, () => false);
-    const activeClass = vue.computed(() => vue.inject(ActiveClassSymbol)?.value ?? "active");
-    const unactiveClass = vue.computed(() => vue.inject(UnactiveSymbol)?.value ?? "unactive");
+    const activeClass = vue.computed(() => {
+      var _a, _b;
+      return (_b = (_a = vue.inject(ActiveClassSymbol)) == null ? void 0 : _a.value) != null ? _b : "active";
+    });
+    const unactiveClass = vue.computed(() => {
+      var _a, _b;
+      return (_b = (_a = vue.inject(UnactiveSymbol)) == null ? void 0 : _a.value) != null ? _b : "unactive";
+    });
     const itemClass = vue.computed(() => {
-      return [vue.inject(ItemClassSymbol)?.value ?? ""].concat(isActive(props.value) ? activeClass.value : unactiveClass.value);
+      var _a, _b;
+      return [(_b = (_a = vue.inject(ItemClassSymbol)) == null ? void 0 : _a.value) != null ? _b : ""].concat(isActive(props.value) ? activeClass.value : unactiveClass.value);
     });
     const activateEvent = core.resolveRef(() => {
+      var _a, _b;
       const event = vue.inject(ActivateEventSymbol);
-      return props.activateEvent ?? event?.value ?? "click";
+      return (_b = (_a = props.activateEvent) != null ? _a : event == null ? void 0 : event.value) != null ? _b : "click";
     });
     return {
       activate() {
@@ -147,6 +156,9 @@ const selectionListProps = defineHookProps({
     type: [Boolean, Number],
     default: () => false
   },
+  clearable: {
+    type: Boolean
+  },
   defaultValue: {
     type: valuePropType
   },
@@ -160,6 +172,7 @@ const useSelectionList = defineHookComponent({
   props: selectionListProps,
   emits: selectionListEmits,
   setup(props, { slots, emit }) {
+    var _a;
     const options = vue.reactive([]);
     function toArray(value) {
       if (value === void 0) {
@@ -170,7 +183,7 @@ const useSelectionList = defineHookComponent({
       }
       return [value];
     }
-    const actives = vue.reactive([...toArray(props.modelValue ?? props.defaultValue)]);
+    const actives = vue.reactive([...toArray((_a = props.modelValue) != null ? _a : props.defaultValue)]);
     const currentValue = vue.computed({
       get() {
         return props.multiple ? actives : actives[0];
@@ -185,16 +198,15 @@ const useSelectionList = defineHookComponent({
     });
     const modelValue = vue.computed({
       get() {
-        return props.modelValue ?? props.defaultValue;
+        var _a2;
+        return (_a2 = props.modelValue) != null ? _a2 : props.defaultValue;
       },
       set(val) {
         emit("update:modelValue", val);
+        emit("change", val);
       }
     });
     core.syncRef(currentValue, modelValue, { immediate: true, deep: true });
-    vue.watch(currentValue, (val) => {
-      emit("change", val);
-    }, { deep: true });
     vue.provide(
       ActiveClassSymbol,
       vue.computed(() => props.activeClass)
@@ -214,7 +226,7 @@ const useSelectionList = defineHookComponent({
     }
     function changeActive(option) {
       if (isActive(option)) {
-        if (props.multiple) {
+        if (props.multiple || props.clearable) {
           actives.splice(actives.indexOf(option), 1);
         }
       } else {
@@ -315,7 +327,8 @@ const useSwitch = defineHookComponent({
     );
     const modelValue = vue.computed({
       get() {
-        return !!(props.modelValue ?? checked.value);
+        var _a;
+        return !!((_a = props.modelValue) != null ? _a : checked.value);
       },
       set(val) {
         checked.value = val;
@@ -365,6 +378,7 @@ exports.defineHookProps = defineHookProps;
 exports.selectionItemProps = selectionItemProps;
 exports.selectionListEmits = selectionListEmits;
 exports.selectionListProps = selectionListProps;
+exports.switchEmits = switchEmits;
 exports.switchProps = switchProps;
 exports.useSelectionItem = useSelectionItem;
 exports.useSelectionList = useSelectionList;

package/dist/index.d.ts

@@ -133,10 +133,16 @@ declare const selectionListProps: {
     modelValue: {
         type: PropType<any>;
     };
+    /**
+     * 选中时的 class
+     */
     activeClass: {
         type: PropType<string | string[]>;
         default: string;
     };
+    /**
+     *  每个选项的 class
+     */
     itemClass: {
         type: PropType<string | string[]>;
         default: string;
@@ -155,6 +161,12 @@ declare const selectionListProps: {
         type: (BooleanConstructor | NumberConstructor)[];
         default: () => false;
     };
+    /**
+     * 可清除
+     */
+    clearable: {
+        type: BooleanConstructor;
+    };
     defaultValue: {
         type: PropType<any>;
     };
@@ -186,10 +198,16 @@ declare const useSelectionList: HookComponent<{
     modelValue: {
         type: PropType<any>;
     };
+    /**
+     * 选中时的 class
+     */
     activeClass: {
         type: PropType<string | string[]>;
         default: string;
     };
+    /**
+     *  每个选项的 class
+     */
     itemClass: {
         type: PropType<string | string[]>;
         default: string;
@@ -208,6 +226,12 @@ declare const useSelectionList: HookComponent<{
         type: (BooleanConstructor | NumberConstructor)[];
         default: () => false;
     };
+    /**
+     * 可清除
+     */
+    clearable: {
+        type: BooleanConstructor;
+    };
     defaultValue: {
         type: PropType<any>;
     };
@@ -223,10 +247,16 @@ declare const useSelectionList: HookComponent<{
     modelValue: {
         type: PropType<any>;
     };
+    /**
+     * 选中时的 class
+     */
     activeClass: {
         type: PropType<string | string[]>;
         default: string;
     };
+    /**
+     *  每个选项的 class
+     */
     itemClass: {
         type: PropType<string | string[]>;
         default: string;
@@ -245,6 +275,12 @@ declare const useSelectionList: HookComponent<{
         type: (BooleanConstructor | NumberConstructor)[];
         default: () => false;
     };
+    /**
+     * 可清除
+     */
+    clearable: {
+        type: BooleanConstructor;
+    };
     defaultValue: {
         type: PropType<any>;
     };
@@ -261,10 +297,16 @@ declare const HiSelection: vue.DefineComponent<{
     modelValue: {
         type: PropType<any>;
     };
+    /**
+     * 选中时的 class
+     */
     activeClass: {
         type: PropType<string | string[]>;
         default: string;
     };
+    /**
+     *  每个选项的 class
+     */
     itemClass: {
         type: PropType<string | string[]>;
         default: string;
@@ -283,6 +325,12 @@ declare const HiSelection: vue.DefineComponent<{
         type: (BooleanConstructor | NumberConstructor)[];
         default: () => false;
     };
+    /**
+     * 可清除
+     */
+    clearable: {
+        type: BooleanConstructor;
+    };
     defaultValue: {
         type: PropType<any>;
     };
@@ -300,10 +348,16 @@ declare const HiSelection: vue.DefineComponent<{
     modelValue: {
         type: PropType<any>;
     };
+    /**
+     * 选中时的 class
+     */
     activeClass: {
         type: PropType<string | string[]>;
         default: string;
     };
+    /**
+     *  每个选项的 class
+     */
     itemClass: {
         type: PropType<string | string[]>;
         default: string;
@@ -322,6 +376,12 @@ declare const HiSelection: vue.DefineComponent<{
         type: (BooleanConstructor | NumberConstructor)[];
         default: () => false;
     };
+    /**
+     * 可清除
+     */
+    clearable: {
+        type: BooleanConstructor;
+    };
     defaultValue: {
         type: PropType<any>;
     };
@@ -341,6 +401,7 @@ declare const HiSelection: vue.DefineComponent<{
     tag: string;
     activeClass: string | string[];
     unactiveClass: string | string[];
+    clearable: boolean;
 }>;
 
 declare const switchProps: {
@@ -369,6 +430,7 @@ declare const switchProps: {
         default: string;
     };
 };
+declare const switchEmits: ("update:modelValue" | "change")[];
 declare const useSwitch: HookComponent<{
     toggle: (value?: any) => void;
     modelValue: vue.WritableComputedRef<boolean>;
@@ -488,4 +550,4 @@ declare const HiSwitch: vue.DefineComponent<{
     unactiveClass: string | string[];
 }>;
 
-export { HiItem, HiSelection, HiSwitch, HookComponent, HookComponentOptions, defineHookComponent, defineHookEmits, defineHookProps, selectionItemProps, selectionListEmits, selectionListProps, switchProps, useSelectionItem, useSelectionList, useSwitch };
+export { HiItem, HiSelection, HiSwitch, HookComponent, HookComponentOptions, defineHookComponent, defineHookEmits, defineHookProps, selectionItemProps, selectionListEmits, selectionListProps, switchEmits, switchProps, useSelectionItem, useSelectionList, useSwitch };

package/dist/{index.mjs → index.esm.js}

@@ -54,7 +54,8 @@ const useSelectionItem = defineHookComponent({
     const parentLabel = resolveRef(inject(ItemLabelSymbol));
     function render() {
       return renderSlot(slots, "default", {}, () => {
-        let label = props.label ?? parentLabel.value;
+        var _a;
+        let label = (_a = props.label) != null ? _a : parentLabel.value;
         if (label) {
           if (typeof label == "function") {
             label = label(props.value);
@@ -84,14 +85,22 @@ const useSelectionItem = defineHookComponent({
     }
     const isActive = inject(IsActiveSymbol, () => false);
     const changeActive = inject(ChangeActiveSymbol, () => false);
-    const activeClass = computed(() => inject(ActiveClassSymbol)?.value ?? "active");
-    const unactiveClass = computed(() => inject(UnactiveSymbol)?.value ?? "unactive");
+    const activeClass = computed(() => {
+      var _a, _b;
+      return (_b = (_a = inject(ActiveClassSymbol)) == null ? void 0 : _a.value) != null ? _b : "active";
+    });
+    const unactiveClass = computed(() => {
+      var _a, _b;
+      return (_b = (_a = inject(UnactiveSymbol)) == null ? void 0 : _a.value) != null ? _b : "unactive";
+    });
     const itemClass = computed(() => {
-      return [inject(ItemClassSymbol)?.value ?? ""].concat(isActive(props.value) ? activeClass.value : unactiveClass.value);
+      var _a, _b;
+      return [(_b = (_a = inject(ItemClassSymbol)) == null ? void 0 : _a.value) != null ? _b : ""].concat(isActive(props.value) ? activeClass.value : unactiveClass.value);
     });
     const activateEvent = resolveRef(() => {
+      var _a, _b;
       const event = inject(ActivateEventSymbol);
-      return props.activateEvent ?? event?.value ?? "click";
+      return (_b = (_a = props.activateEvent) != null ? _a : event == null ? void 0 : event.value) != null ? _b : "click";
     });
     return {
       activate() {
@@ -145,6 +154,9 @@ const selectionListProps = defineHookProps({
     type: [Boolean, Number],
     default: () => false
   },
+  clearable: {
+    type: Boolean
+  },
   defaultValue: {
     type: valuePropType
   },
@@ -158,6 +170,7 @@ const useSelectionList = defineHookComponent({
   props: selectionListProps,
   emits: selectionListEmits,
   setup(props, { slots, emit }) {
+    var _a;
     const options = reactive([]);
     function toArray(value) {
       if (value === void 0) {
@@ -168,7 +181,7 @@ const useSelectionList = defineHookComponent({
       }
       return [value];
     }
-    const actives = reactive([...toArray(props.modelValue ?? props.defaultValue)]);
+    const actives = reactive([...toArray((_a = props.modelValue) != null ? _a : props.defaultValue)]);
     const currentValue = computed({
       get() {
         return props.multiple ? actives : actives[0];
@@ -183,16 +196,15 @@ const useSelectionList = defineHookComponent({
     });
     const modelValue = computed({
       get() {
-        return props.modelValue ?? props.defaultValue;
+        var _a2;
+        return (_a2 = props.modelValue) != null ? _a2 : props.defaultValue;
       },
       set(val) {
         emit("update:modelValue", val);
+        emit("change", val);
       }
     });
     syncRef(currentValue, modelValue, { immediate: true, deep: true });
-    watch(currentValue, (val) => {
-      emit("change", val);
-    }, { deep: true });
     provide(
       ActiveClassSymbol,
       computed(() => props.activeClass)
@@ -212,7 +224,7 @@ const useSelectionList = defineHookComponent({
     }
     function changeActive(option) {
       if (isActive(option)) {
-        if (props.multiple) {
+        if (props.multiple || props.clearable) {
           actives.splice(actives.indexOf(option), 1);
         }
       } else {
@@ -313,7 +325,8 @@ const useSwitch = defineHookComponent({
     );
     const modelValue = computed({
       get() {
-        return !!(props.modelValue ?? checked.value);
+        var _a;
+        return !!((_a = props.modelValue) != null ? _a : checked.value);
       },
       set(val) {
         checked.value = val;
@@ -354,4 +367,4 @@ const HiSwitch = defineComponent({
   }
 });
 
-export { HiItem, HiSelection, HiSwitch, defineHookComponent, defineHookEmits, defineHookProps, selectionItemProps, selectionListEmits, selectionListProps, switchProps, useSelectionItem, useSelectionList, useSwitch };
+export { HiItem, HiSelection, HiSwitch, defineHookComponent, defineHookEmits, defineHookProps, selectionItemProps, selectionListEmits, selectionListProps, switchEmits, switchProps, useSelectionItem, useSelectionList, useSwitch };

package/package.json

@@ -1,21 +1,28 @@
 {
   "name": "hoci",
-  "version": "0.0.2",
+  "version": "0.0.4",
   "description": "",
   "main": "dist/index.cjs",
-  "module": "dist/index.mjs",
+  "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "files": [
     "dist/"
   ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
   "author": "chizuki",
   "license": "MIT",
   "dependencies": {
-    "@vueuse/core": "^9.5.0",
+    "@vueuse/core": "^9.1.0",
     "maybe-types": "^0.0.3"
   },
-  "peerDependencies": {
-    "vue": "^3.2.45"
+  "devDependencies": {
+    "vue": "^3.2.31"
   },
   "scripts": {
     "build": "unbuild",