feat(manager): support npm package version notation

plugins/frontend/client/client/components/common/button.vue

@@ -54,7 +54,7 @@ function onClick(event: MouseEvent) {
   border-radius: 0.4em;
   cursor: pointer;
   padding: 0.4em 1em;
-  transition: color 0.3s ease, border-color 0.3s ease, background-color 0.3s ease;
+  transition: var(--color-transition);
   display: inline-block;
   &.round {
     border-radius: 50%;
@@ -116,22 +116,7 @@ function onClick(event: MouseEvent) {
     }
   }
 
-  .k-button-group > &:not(:first-child) {
-    border-top-left-radius: 0;
-    border-bottom-left-radius: 0;
-  }
-  .k-button-group > &:not(:last-child) {
-    border-top-right-radius: 0;
-    border-bottom-right-radius: 0;
-    &:not(:hover) {
-      border-right-width: 0;
-    }
-  }
-  .k-button-group > &:hover + & {
-    border-left-width: 0;
-  }
-
-  *:not(.k-button-group) > & + & {
+  & + & {
     margin: 0 1rem;
   }
 }

plugins/frontend/client/client/components/style.scss

@@ -131,6 +131,30 @@ html.dark .el-switch {
   --el-switch-off-color: #72767d;
 }
 
+.right-adjacent {
+  &.k-button, &.el-select .el-input__wrapper {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+
+  &:hover {
+    z-index: 100;
+  }
+  &:hover + .left-adjacent {
+    border-left-color: transparent;
+  }
+}
+
+.left-adjacent {
+  z-index: 0;
+  margin-left: -1px;
+
+  &.k-button, &.el-select .el-input__wrapper {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+}
+
 .el-table__body-wrapper,
 .el-table__footer-wrapper,
 .el-table__header-wrapper {

plugins/frontend/console/src/http.ts

@@ -135,6 +135,7 @@ class HttpService extends DataService<string[]> {
       },
       optimizeDeps: {
         include: [
+          'schemastery',
           'element-plus',
         ],
       },

plugins/frontend/manager/client/deps/index.vue

@@ -1,7 +1,7 @@
 <template>
   <k-card class="page-deps">
     <div class="controls">
-      <el-checkbox v-model="config.hideWorkspace">忽略工作区依赖{{ config.override }}</el-checkbox>
+      <el-checkbox v-model="config.hideWorkspace">忽略工作区依赖</el-checkbox>
       <span class="float-right" v-if="!overrideCount">当前没有变更的依赖</span>
       <template v-else>
         <k-button class="float-right" solid @click="install">更新依赖</k-button>

plugins/frontend/manager/client/deps/package.vue

@@ -11,15 +11,15 @@
     </td>
     <td class="target">
       <template v-if="local?.workspace">
-        <k-button @click="send('market/patch', name, null)">移除依赖</k-button>
+        <k-button class="action" @click="send('market/patch', name, null)">移除依赖</k-button>
+      </template>
+      <template v-else>
+        <k-button class="prefix right-adjacent" @click="prefix = matrix[prefix]">{{ prefix || '=' }}</k-button>
+        <el-select class="left-adjacent" v-model="value">
+          <el-option value="">移除依赖</el-option>
+          <el-option v-for="({ version }) in remote?.versions || []" :key="version" :value="version"></el-option>
+        </el-select>
       </template>
-      <el-select v-else v-model="value">
-        <el-option value="">移除依赖</el-option>
-        <el-option
-          v-for="({ version }) in remote?.versions || []"
-          :key="version" :value="version"
-        >{{ version }}{{ version === local?.resolved ? ' (当前)' : '' }}</el-option>
-      </el-select>
     </td>
   </tr>
 </template>
@@ -37,17 +37,34 @@ const props = defineProps({
 const value = computed({
   get() {
     const target = config.override[props.name]
-    return target === '' ? '移除依赖' : target
+    return target === '' ? '移除依赖' : target?.replace(/^[\^~]/, '')
   },
   set(target: string) {
-    if (target === '' && !local.value || target === local.value?.resolved) {
+    if (target === '' && !local.value) {
       delete config.override[props.name]
     } else {
-      config.override[props.name] = target
+      config.override[props.name] = prefix.value + target
+      if (config.override[props.name] === local.value?.request) {
+        delete config.override[props.name]
+      }
     }
   },
 })
 
+const prefix = computed({
+  get() {
+    return /^[\^~]?/.exec(config.override[props.name] || local.value.request)[0]
+  },
+  set(prefix: string) {
+    config.override[props.name] = prefix + (config.override[props.name] || local.value.request).replace(/^[\^~]/, '')
+    if (config.override[props.name] === local.value?.request) {
+      delete config.override[props.name]
+    }
+  },
+})
+
+const matrix = { '': '^', '^': '~', '~': '' }
+
 const state = computed(() => {
   if (!props.name.includes('koishi-plugin-') && !props.name.startsWith('@koishijs/plugin-')) {
     return 'disabled'
@@ -67,15 +84,15 @@ const remote = computed(() => {
 
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 
 .dep-package-view {
   height: 3rem;
   position: relative;
 
   td.name {
     text-align: left;
-    padding-left: 4rem;
+    padding-left: 3.6rem;
 
     &::before {
       content: '';
@@ -84,8 +101,8 @@ const remote = computed(() => {
       width: 0.5rem;
       height: 0.5rem;
       top: 50%;
-      left: 2rem;
-      transform: translateY(-50%);
+      left: 1.8rem;
+      transform: translate(-50%, -50%);
       transition: background-color 0.3s ease;
       box-shadow: 1px 1px 2px #3333;
     }
@@ -108,8 +125,19 @@ const remote = computed(() => {
     }
   }
 
-  .el-select, .k-button {
-    width: 10rem;
+  .k-button.action {
+    width: 9rem;
+  }
+
+  .el-select {
+    width: 7rem;
+  }
+
+  .k-button.prefix {
+    width: 2rem;
+    height: 2rem;
+    vertical-align: bottom;
+    padding: 0;
   }
 }
 

plugins/frontend/manager/src/installer.ts

@@ -81,7 +81,7 @@ class Installer extends DataService<Dict<Dependency>> {
     const filename = resolve(this.cwd, 'package.json')
     for (const key in deps) {
       if (deps[key]) {
-        this.meta.dependencies[key] = '^' + deps[key]
+        this.meta.dependencies[key] = deps[key]
       } else {
         delete this.meta.dependencies[key]
       }