v-nuxt-ui 0.2.7 → 0.2.8

package/dist/module.json

@@ -7,7 +7,7 @@
   "dependencies": [
     "@nuxt/ui"
   ],
-  "version": "0.2.7",
+  "version": "0.2.8",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/runtime/components/button/CircleColor.d.vue.ts

@@ -1,12 +1,12 @@
+import type { FlowColorRole } from '#v/constants';
 type __VLS_Props = {
     /** Tailwind 颜色名 (e.g. 'red', 'blue')，空字符串表示默认 */
     chip?: string;
-    /** 色阶 (默认 500) */
-    shade?: number;
     /** 是否选中 */
     selected?: boolean;
     /** 标题提示 */
     title?: string;
+    colorRole?: FlowColorRole;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => any;

package/dist/runtime/components/button/CircleColor.vue

@@ -1,18 +1,19 @@
 <script setup>
 import { computed } from "vue";
 import { useColorMode } from "@vueuse/core";
+import { resolveFlowColor } from "#v/constants";
 const props = defineProps({
   chip: { type: String, required: false },
-  shade: { type: Number, required: false },
   selected: { type: Boolean, required: false },
-  title: { type: String, required: false }
+  title: { type: String, required: false },
+  colorRole: { type: null, required: false }
 });
 defineEmits(["click"]);
 const colorMode = useColorMode();
 const backgroundStyle = computed(() => {
-  if (!props.chip || props.chip === "primary") return void 0;
-  const shade = props.shade ?? (colorMode.value === "dark" ? 400 : 500);
-  return `background-color: var(--color-${props.chip}-${shade})`;
+  if (!props.chip) return void 0;
+  const varName = resolveFlowColor(props.chip, props.colorRole ?? "border", colorMode.value === "dark");
+  return `background-color: ${varName}`;
 });
 </script>
 

package/dist/runtime/components/button/CircleColor.vue.d.ts

@@ -1,12 +1,12 @@
+import type { FlowColorRole } from '#v/constants';
 type __VLS_Props = {
     /** Tailwind 颜色名 (e.g. 'red', 'blue')，空字符串表示默认 */
     chip?: string;
-    /** 色阶 (默认 500) */
-    shade?: number;
     /** 是否选中 */
     selected?: boolean;
     /** 标题提示 */
     title?: string;
+    colorRole?: FlowColorRole;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     click: () => any;

package/dist/runtime/components/flow/FlowNode.client.vue

@@ -47,18 +47,20 @@ const showBorder = computed(() => props.data.showBorder !== false);
     @mouseleave="isHoveredLocal = false"
     @dblclick="data.onEdit?.()"
   >
-    <!-- Connection handles：仅在可编辑模式下渲染 -->
-    <template v-if="editable">
-      <Handle
-        v-for="handle in activeHandles"
-        :id="`${handle.id}`"
-        :key="`${handle.id}`"
-        type="source"
-        :position="handle.position"
-        :style="handleStyle(handle)"
-        @mousedown.stop
-      />
-    </template>
+    <!-- Connection handles：始终渲染以确保 edge 连接点正确，非编辑模式下隐藏且禁用交互 -->
+    <Handle
+      v-for="handle in activeHandles"
+      :id="`${handle.id}`"
+      :key="`${handle.id}`"
+      type="source"
+      :position="handle.position"
+      :connectable="editable"
+      :style="{
+  ...handleStyle(handle),
+  ...editable ? {} : { opacity: 0, pointerEvents: 'none', width: '1px', height: '1px' }
+}"
+      @mousedown.stop
+    />
 
     <!-- content -->
     <div class="flex items-center justify-center gap-2 w-full">

package/dist/runtime/components/flow/FlowToolbar.vue

@@ -138,7 +138,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="500"
+                      color-role="border"
                       :selected="unifiedColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onUnifiedColorChange?.(opt.color)"
@@ -199,7 +199,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="500"
+                      color-role="border"
                       :selected="nodeBorderColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onNodeBorderColorChange?.(opt.color)"
@@ -218,7 +218,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="50"
+                      color-role="bg"
                       :selected="nodeBgColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onNodeBgColorChange?.(opt.color)"
@@ -252,7 +252,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="600"
+                      color-role="font"
                       :selected="nodeFontColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onNodeFontColorChange?.(opt.color)"
@@ -297,7 +297,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="500"
+                      color-role="border"
                       :selected="nodeHandleColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onNodeHandleColorChange?.(opt.color)"
@@ -558,7 +558,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="500"
+                      color-role="border"
                       :selected="edgeColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onEdgeColorChange?.(opt.color)"
@@ -577,7 +577,7 @@ function getStrokeDasharray(value) {
                       v-for="opt in FLOW_COLORS"
                       :key="opt.color"
                       :chip="opt.chip"
-                      :shade="600"
+                      color-role="font"
                       :selected="edgeLabelColor === opt.color"
                       :title="opt.chip || 'default'"
                       @click="onEdgeLabelColorChange?.(opt.color)"

package/dist/runtime/constants/flow.js

@@ -58,7 +58,8 @@ const FLOW_COLOR_NAMES = [
   "purple",
   "fuchsia",
   "pink",
-  "rose"
+  "rose",
+  "neutral"
 ];
 export const FLOW_COLORS = [
   { color: "primary", chip: "primary" },
@@ -72,7 +73,7 @@ export const FLOW_SHADE_MAP = {
 export function resolveFlowColor(name, role, isDark) {
   if (!name) return "";
   const shade = FLOW_SHADE_MAP[role][isDark ? "dark" : "light"];
-  if (name === "primary") {
+  if (name === "primary" || name === "neutral") {
     return `var(--ui-color-${name}-${shade})`;
   }
   return `var(--color-${name}-${shade})`;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "v-nuxt-ui",
-  "version": "0.2.7",
+  "version": "0.2.8",
   "description": "Veken UI Component Library - Reusable Nuxt UI components, composables, and utilities for enterprise applications",
   "type": "module",
   "style": "./dist/runtime/index.css",