@opentiny/vue-renderless 3.6.0 → 3.6.1-alpha.2

package/option/vue.js

@@ -1,219 +1,106 @@
-import _typeof from "@babel/runtime/helpers/typeof";
-import { isEqual, contains, handleGroupDisabled, hoverItem, selectOptionClick, queryChange, toggleEvent } from './index';
-export var api = ['state', 'visible', 'hoverItem', 'selectOptionClick'];
-var initState = function initState(_ref) {
-  var reactive = _ref.reactive,
-    computed = _ref.computed,
-    props = _ref.props,
-    api = _ref.api,
-    markRaw = _ref.markRaw,
-    select = _ref.select,
-    parent = _ref.parent;
-  var state = reactive({
+import "../chunk-PKUHTIDK.js";
+import { isEqual, contains, handleGroupDisabled, hoverItem, selectOptionClick, queryChange, toggleEvent } from "./index";
+const api = ["state", "visible", "hoverItem", "selectOptionClick"];
+const initState = ({ reactive, computed, props, api: api2, markRaw, select, parent }) => {
+  const state = reactive({
     parent: markRaw(parent),
-    created: computed(function () {
-      return props.created;
-    }),
+    created: computed(() => props.created),
     index: -1,
     select: markRaw(select),
     hover: false,
     visible: true,
     hitState: false,
     groupDisabled: false,
-    disabled: computed(function () {
-      return props.disabled;
-    }),
-    isObject: computed(function () {
-      return Object.prototype.toString.call(props.value).toLowerCase() === '[object object]';
-    }),
-    currentLabel: computed(function () {
-      return props.label || (state.isObject ? '' : props.value);
-    }),
-    currentValue: computed(function () {
-      return props.value || props.label || '';
-    }),
-    itemSelected: computed(function () {
+    disabled: computed(() => props.disabled),
+    isObject: computed(() => Object.prototype.toString.call(props.value).toLowerCase() === "[object object]"),
+    currentLabel: computed(() => props.label || (state.isObject ? "" : props.value)),
+    currentValue: computed(() => props.value || props.label || ""),
+    itemSelected: computed(() => {
       if (!select.multiple) {
-        return api.isEqual(props.value, select.modelValue);
+        return api2.isEqual(props.value, select.modelValue);
       } else {
-        return api.contains(select.modelValue, props.value);
+        return api2.contains(select.modelValue, props.value);
       }
     }),
-    limitReached: computed(function () {
+    limitReached: computed(() => {
       if (select.multiple) {
-        var multipleLimit = select.state.multipleLimit;
+        const multipleLimit = select.state.multipleLimit;
         return !state.itemSelected && (select.modelValue || []).length >= multipleLimit && multipleLimit > 0;
       } else {
         return false;
       }
     }),
-    selectCls: computed(function () {
-      return state.itemSelected ? 'checked-sur' : 'check';
-    })
+    selectCls: computed(() => state.itemSelected ? "checked-sur" : "check")
   });
   return state;
 };
-var initApi = function initApi(_ref2) {
-  var api = _ref2.api,
-    props = _ref2.props,
-    state = _ref2.state,
-    select = _ref2.select,
-    constants = _ref2.constants,
-    vm = _ref2.vm;
-  Object.assign(api, {
-    state: state,
-    isEqual: isEqual({
-      select: select,
-      state: state
-    }),
-    contains: contains({
-      select: select,
-      state: state
-    }),
-    hoverItem: hoverItem({
-      select: select,
-      vm: vm,
-      props: props,
-      state: state
-    }),
-    queryChange: queryChange({
-      select: select,
-      props: props,
-      state: state
-    }),
-    selectOptionClick: selectOptionClick({
-      constants: constants,
-      vm: vm,
-      props: props,
-      state: state,
-      select: select
-    }),
+const initApi = ({ api: api2, props, state, select, constants, vm }) => {
+  Object.assign(api2, {
+    state,
+    isEqual: isEqual({ select, state }),
+    contains: contains({ select, state }),
+    hoverItem: hoverItem({ select, vm, props, state }),
+    queryChange: queryChange({ select, props, state }),
+    selectOptionClick: selectOptionClick({ constants, vm, props, state, select }),
     handleGroupDisabled: handleGroupDisabled(state)
   });
 };
-var initWatch = function initWatch(_ref3) {
-  var watch = _ref3.watch,
-    props = _ref3.props,
-    state = _ref3.state,
-    select = _ref3.select,
-    constants = _ref3.constants;
-  watch(function () {
-    return state.currentLabel;
-  }, function () {
-    if (!props.created && !select.remote) {
-      select.state.selectEmitter.emit(constants.EVENT_NAME.setSelected);
+const initWatch = ({ watch, props, state, select, constants }) => {
+  watch(
+    () => state.currentLabel,
+    () => {
+      if (!props.created && !select.remote) {
+        select.state.selectEmitter.emit(constants.EVENT_NAME.setSelected);
+      }
     }
-  });
-  watch(function () {
-    return props.value;
-  }, function (value, oldVal) {
-    var remote = select.remote,
-      valueKey = select.valueKey;
-    if (!props.created && !remote) {
-      if (valueKey && _typeof(value) === 'object' && _typeof(oldVal) === 'object' && value[valueKey] === oldVal[valueKey]) {
-        return;
+  );
+  watch(
+    () => props.value,
+    (value, oldVal) => {
+      const { remote, valueKey } = select;
+      if (!props.created && !remote) {
+        if (valueKey && typeof value === "object" && typeof oldVal === "object" && value[valueKey] === oldVal[valueKey]) {
+          return;
+        }
+        select.state.selectEmitter.emit(constants.EVENT_NAME.setSelected);
       }
-      select.state.selectEmitter.emit(constants.EVENT_NAME.setSelected);
     }
-  });
+  );
 };
-var initOnMounted = function initOnMounted(_ref4) {
-  var onMounted = _ref4.onMounted,
-    props = _ref4.props,
-    api = _ref4.api,
-    vm = _ref4.vm,
-    state = _ref4.state,
-    refs = _ref4.refs,
-    constants = _ref4.constants,
-    select = _ref4.select;
-  onMounted(function () {
+const initOnMounted = ({ onMounted, props, api: api2, vm, state, refs, constants, select }) => {
+  onMounted(() => {
     state.el = vm.$el;
-    toggleEvent({
-      props: props,
-      refs: refs,
-      type: 'add'
-    });
-    select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api.queryChange);
+    toggleEvent({ props, refs, type: "add" });
+    select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api2.queryChange);
   });
 };
-var initOnBeforeUnmount = function initOnBeforeUnmount(_ref5) {
-  var onBeforeUnmount = _ref5.onBeforeUnmount,
-    props = _ref5.props,
-    select = _ref5.select,
-    refs = _ref5.refs,
-    vm = _ref5.vm;
-  onBeforeUnmount(function () {
-    var index = select.state.cachedOptions.indexOf(vm);
-    toggleEvent({
-      props: props,
-      refs: refs,
-      type: 'remove'
-    });
+const initOnBeforeUnmount = ({ onBeforeUnmount, props, select, refs, vm }) => {
+  onBeforeUnmount(() => {
+    const index = select.state.cachedOptions.indexOf(vm);
+    toggleEvent({ props, refs, type: "remove" });
     if (index === -1) {
       select.state.cachedOptions.splice(index, 1);
     }
     select.onOptionDestroy(select.state.options.indexOf(vm));
   });
 };
-export var renderless = function renderless(props, _ref6, _ref7) {
-  var computed = _ref6.computed,
-    onMounted = _ref6.onMounted,
-    onBeforeUnmount = _ref6.onBeforeUnmount,
-    reactive = _ref6.reactive,
-    watch = _ref6.watch,
-    inject = _ref6.inject,
-    markRaw = _ref6.markRaw;
-  var vm = _ref7.vm,
-    refs = _ref7.refs,
-    parent = _ref7.parent;
-  var api = {};
-  var select = inject('select');
-  var constants = select._constants;
-  var state = initState({
-    reactive: reactive,
-    computed: computed,
-    props: props,
-    api: api,
-    markRaw: markRaw,
-    select: select,
-    parent: parent
-  });
-  initApi({
-    api: api,
-    props: props,
-    state: state,
-    select: select,
-    constants: constants,
-    vm: vm
-  });
-  initWatch({
-    watch: watch,
-    props: props,
-    state: state,
-    select: select,
-    constants: constants
-  });
-  initOnMounted({
-    onMounted: onMounted,
-    props: props,
-    api: api,
-    vm: vm,
-    state: state,
-    refs: refs,
-    constants: constants,
-    select: select
-  });
-  initOnBeforeUnmount({
-    onBeforeUnmount: onBeforeUnmount,
-    props: props,
-    select: select,
-    refs: refs,
-    vm: vm
-  });
+const renderless = (props, { computed, onMounted, onBeforeUnmount, reactive, watch, inject, markRaw }, { vm, refs, parent }) => {
+  const api2 = {};
+  const select = inject("select");
+  const constants = select._constants;
+  const state = initState({ reactive, computed, props, api: api2, markRaw, select, parent });
+  initApi({ api: api2, props, state, select, constants, vm });
+  initWatch({ watch, props, state, select, constants });
+  initOnMounted({ onMounted, props, api: api2, vm, state, refs, constants, select });
+  initOnBeforeUnmount({ onBeforeUnmount, props, select, refs, vm });
   select.state.options.push(markRaw(vm));
   select.state.cachedOptions.push(markRaw(vm));
   select.state.optionsCount++;
   select.state.filteredOptionsCount++;
-  vm.$on(constants.EVENT_NAME.handleGroupDisabled, api.handleGroupDisabled);
-  return api;
-};
+  vm.$on(constants.EVENT_NAME.handleGroupDisabled, api2.handleGroupDisabled);
+  return api2;
+};
+export {
+  api,
+  renderless
+};

package/option-group/index.js

@@ -1,18 +1,13 @@
-export var queryChange = function queryChange(_ref) {
-  var select = _ref.select,
-    state = _ref.state,
-    vm = _ref.vm;
-  return function () {
-    state.visible = true;
-    if (Array.isArray(select.state.options)) {
-      var groupOptions = select.state.options.filter(function (option) {
-        return option.state.parent && vm && option.state.parent.label === vm.label;
-      });
-      if (Array.isArray(groupOptions)) {
-        state.visible = groupOptions.some(function (option) {
-          return option.visible === true;
-        });
-      }
+import "../chunk-PKUHTIDK.js";
+const queryChange = ({ select, state, vm }) => () => {
+  state.visible = true;
+  if (Array.isArray(select.state.options)) {
+    const groupOptions = select.state.options.filter((option) => option.state.parent && vm && option.state.parent.label === vm.label);
+    if (Array.isArray(groupOptions)) {
+      state.visible = groupOptions.some((option) => option.visible === true);
     }
-  };
-};
+  }
+};
+export {
+  queryChange
+};

package/option-group/vue.js

@@ -1,37 +1,32 @@
-import { queryChange } from './index';
-export var api = ['state', 'queryChange'];
-export var renderless = function renderless(props, _ref, _ref2) {
-  var onMounted = _ref.onMounted,
-    reactive = _ref.reactive,
-    watch = _ref.watch,
-    inject = _ref.inject;
-  var broadcast = _ref2.broadcast,
-    vm = _ref2.vm;
-  var select = inject('select');
-  var constants = select._constants;
-  var state = reactive({
+import "../chunk-PKUHTIDK.js";
+import { queryChange } from "./index";
+const api = ["state", "queryChange"];
+const renderless = (props, { onMounted, reactive, watch, inject }, { broadcast, vm }) => {
+  const select = inject("select");
+  const constants = select._constants;
+  const state = reactive({
     visible: true
   });
-  var api = {
-    state: state,
-    queryChange: queryChange({
-      select: select,
-      state: state,
-      vm: vm
-    })
+  const api2 = {
+    state,
+    queryChange: queryChange({ select, state, vm })
   };
-  watch(function () {
-    return props.disabled;
-  }, function (value) {
-    broadcast(constants.COMPONENT_NAME.Option, constants.EVENT_NAME.handleGroupDisabled, value);
-  }, {
-    immediate: true
-  });
-  onMounted(function () {
+  watch(
+    () => props.disabled,
+    (value) => {
+      broadcast(constants.COMPONENT_NAME.Option, constants.EVENT_NAME.handleGroupDisabled, value);
+    },
+    { immediate: true }
+  );
+  onMounted(() => {
     if (props.disabled) {
       broadcast(constants.COMPONENT_NAME.Option, constants.EVENT_NAME.handleGroupDisabled, props.disabled);
     }
-    select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api.queryChange);
+    select.state.selectEmitter.on(constants.EVENT_NAME.queryChange, api2.queryChange);
   });
-  return api;
-};
+  return api2;
+};
+export {
+  api,
+  renderless
+};

package/package.json

@@ -1,84 +1,32 @@
-{
-  "name": "@opentiny/vue-renderless",
-  "version": "3.6.0",
-  "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
-  "homepage": "https://opentiny.design/tiny-vue",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/opentiny/tiny-vue-renderless"
-  },
-  "keywords": [
-    "vue",
-    "vue3",
-    "frontend",
-    "component-library",
-    "components",
-    "vue-components",
-    "opentiny",
-    "renderless-components",
-    "headless-components"
-  ],
-  "author": "OpenTiny Team",
-  "license": "MIT",
-  "sideEffects": false,
-  "scripts": {
-    "clean": "rimraf dist",
-    "create:ui": "node build/create-ui.js",
-    "build": "babel --config-file ./build/babel.config.json src --out-dir dist",
-    "build:all": "npm run lint && npm run clean && npm run build && npm run build:version",
-    "build:version": "node build/build-version.js",
-    "release": "node scripts/release.js",
-    "format": "prettier --write src/**/* build/*.js scripts/*.js",
-    "lint": "eslint src/**/* build/*.js scripts/*.js --fix",
-    "commit": "git-cz"
-  },
-  "dependencies": {
-    "@babel/runtime": "7.18.3",
-    "xss": "1.0.11"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.5.5",
-    "@babel/core": "^7.5.5",
-    "@babel/plugin-transform-runtime": "^7.10.1",
-    "@babel/preset-env": "^7.5.5",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^6.1.0",
-    "eslint-config-standard": "^17.0.0",
-    "eslint-plugin-import": "^2.18.2",
-    "eslint-plugin-node": "^11.1.0 ",
-    "eslint-plugin-promise": "^4.2.1",
-    "eslint-plugin-standard": "^4.0.0",
-    "eslint-plugin-vue": "^9.7.0",
-    "fs-extra": "^10.1.0",
-    "prettier": "2.2.1",
-    "rimraf": "^3.0.2",
-    "@commitlint/cli": "^17.3.0",
-    "@commitlint/config-conventional": "^17.3.0",
-    "commitizen": "^4.2.5",
-    "cz-conventional-changelog": "^3.3.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-prettier": "^4.2.1",
-    "glob": "^8.0.3",
-    "husky": "^8.0.2",
-    "lint-staged": "^13.0.3"
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged",
-      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
-    }
-  },
-  "lint-staged": {
-    "*.{js,ts,jsx,tsx,vue}": [
-      "prettier --write"
-    ]
-  },
-  "config": {
-    "commitizen": {
-      "path": "cz-conventional-changelog"
-    }
-  },
-  "engines": {
-    "node": ">=14.0.0"
-  }
-}
+{
+  "name": "@opentiny/vue-renderless",
+  "version": "3.6.1-alpha.2",
+  "description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
+  "homepage": "https://opentiny.design/tiny-vue",
+  "keywords": [
+    "vue",
+    "vue3",
+    "frontend",
+    "component-library",
+    "components",
+    "vue-components",
+    "opentiny",
+    "renderless-components",
+    "headless-components"
+  ],
+  "author": "OpenTiny Team",
+  "license": "MIT",
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsup",
+    "postversion": "pnpm build",
+    "release": "esno ./scripts/postbuild.ts && cp README.md dist"
+  },
+  "dependencies": {
+    "xss": "1.0.11"
+  },
+  "devDependencies": {
+    "esno": "^0.16.3",
+    "tsup": "^6.5.0"
+  }
+}