vome-core 0.3.64 → 0.3.66

package/dist/admin/components/ui/dialog/DialogContent.vue

@@ -1,267 +1,267 @@
-<script setup lang="ts">
-import type { DialogContentEmits, DialogContentProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { X } from "@lucide/vue"
-import { reactiveOmit } from "@vueuse/core"
-import {
-  DialogClose,
-  DialogContent,
-  DialogPortal,
-  useForwardPropsEmits,
-} from "reka-ui"
-import { cn } from "../../../lib/cn"
-import DialogOverlay from "./DialogOverlay.vue"
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(
-  defineProps<
-    DialogContentProps & {
-      class?: HTMLAttributes["class"]
-      showCloseButton?: boolean
-      /** CRUD 弹窗：桌面 50vw，≤768px 全屏 */
-      shell?: "crud" | "default"
-    }
-  >(),
-  {
-    showCloseButton: true,
-    shell: "default",
-  },
-)
-const emits = defineEmits<DialogContentEmits>()
-
-const delegatedProps = reactiveOmit(props, "class", "shell", "showCloseButton")
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DialogPortal>
-    <DialogOverlay />
-    <DialogContent
-      data-slot="dialog-content"
-      :data-shell="shell"
-      v-bind="{ ...$attrs, ...forwarded }"
-      :aria-describedby="undefined"
-      :class="
-        cn(
-          'bg-card data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed z-50 duration-200',
-          // default：居中卡片；crud：定位交给下方 CSS（避免 top/translate 与移动端全屏打架）
-          shell === 'default' &&
-            'top-[50%] left-[50%] grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg',
-          shell === 'crud' && 'vm-dialog-shell-crud',
-          props.class,
-        )
-      "
-    >
-      <slot />
-
-      <DialogClose
-        v-if="showCloseButton"
-        data-slot="dialog-close"
-        class="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-3 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
-      >
-        <X />
-        <span class="sr-only">Close</span>
-      </DialogClose>
-    </DialogContent>
-  </DialogPortal>
-</template>
-
-<!--
-  宽度写死在此：reka DismissableLayer 会覆盖透传的 style；
-  Tailwind w-full 在 max-w 失效时会撑满视口。CRUD 壳层用属性选择器 + !important。
--->
-<style>
-.vm-dialog-shell-crud[data-slot='dialog-content'],
-[data-slot='dialog-content'][data-shell='crud'] {
-  top: 50%;
-  left: 50%;
-  display: flex !important;
-  width: 50vw !important;
-  max-width: 50vw !important;
-  min-width: 0 !important;
-  min-height: 400px;
-  max-height: 800px;
-  height: auto;
-  flex-direction: column;
-  gap: 0 !important;
-  padding: 0 !important;
-  overflow: hidden;
-  border: none !important;
-  border-radius: 24px !important;
-  box-shadow: var(--shadow-soft) !important;
-  translate: -50% -50%;
-}
-
-/* 列表类弹窗：直接拉满规范最高高度 */
-.vm-dialog-shell-crud.is-fill[data-slot='dialog-content'],
-[data-slot='dialog-content'][data-shell='crud'].is-fill {
-  height: 800px !important;
-  max-height: 800px !important;
-}
-
-/* 指定高度：--vm-dialog-height（如 800px） */
-.vm-dialog-shell-crud.is-height[data-slot='dialog-content'],
-[data-slot='dialog-content'][data-shell='crud'].is-height {
-  height: var(--vm-dialog-height) !important;
-  max-height: var(--vm-dialog-height) !important;
-}
-
-/* 移动端：铺满视口（无上下边距、无圆角） */
-@media (max-width: 768px) {
-  .vm-dialog-shell-crud[data-slot='dialog-content'],
-  [data-slot='dialog-content'][data-shell='crud'] {
-    inset: 0 !important;
-    top: 0 !important;
-    right: 0 !important;
-    bottom: 0 !important;
-    left: 0 !important;
-    width: 100vw !important;
-    max-width: 100vw !important;
-    height: 100dvh !important;
-    max-height: 100dvh !important;
-    min-height: 100dvh !important;
-    margin: 0 !important;
-    border-radius: 0 !important;
-    overflow: hidden !important;
-    translate: none !important;
-    transform: none !important;
-    animation: none !important;
-  }
-}
-
-/* CRUD 弹窗壳：仅 shell=crud 的 Dialog 使用（vm-upsert / form-dialog / adv-search 等） */
-.vm-crud-shell__head {
-  display: flex;
-  flex-direction: row;
-  flex-shrink: 0;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 10px;
-  padding: 12px 22px;
-  border-bottom: 1px solid var(--border);
-}
-
-@media (max-width: 768px) {
-  .vm-crud-shell__head {
-    padding: 8px 12px;
-  }
-}
-
-.vm-crud-shell__title {
-  font-size: 15px;
-  font-weight: 650;
-  letter-spacing: -0.01em;
-  line-height: 1.3;
-  color: var(--foreground);
-}
-
-.vm-crud-shell__close {
-  display: inline-flex;
-  flex-shrink: 0;
-  align-items: center;
-  justify-content: center;
-  width: 28px;
-  height: 28px;
-  margin-left: auto;
-  border: none;
-  border-radius: 8px;
-  background: transparent;
-  color: var(--muted-foreground);
-  opacity: 0.7;
-  cursor: pointer;
-  transition: opacity 0.15s ease, background 0.15s ease;
-}
-
-.vm-crud-shell__close:hover {
-  opacity: 1;
-  background: var(--muted);
-}
-
-.vm-crud-shell__close > i {
-  font-size: 16px;
-  line-height: 1;
-}
-
-.vm-crud-shell__body {
-  display: flex;
-  flex: 1 1 auto;
-  flex-direction: column;
-  min-height: 0;
-  overflow: auto;
-  overscroll-behavior: contain;
-  padding: 18px 22px 16px;
-}
-
-@media (max-width: 768px) {
-  .vm-crud-shell__body {
-    flex: 1;
-    padding: 12px;
-  }
-}
-
-.vm-crud-shell__foot {
-  display: flex;
-  flex-shrink: 0;
-  justify-content: flex-end;
-  gap: 8px;
-  padding: 10px 22px;
-  border-top: 1px solid var(--border);
-}
-
-@media (max-width: 768px) {
-  .vm-crud-shell__foot {
-    flex-direction: column-reverse;
-    gap: 8px;
-    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
-  }
-
-  .vm-crud-shell__foot .vm-crud-shell__btn {
-    width: 100%;
-  }
-}
-
-.vm-crud-shell__btn {
-  height: 36px;
-  padding: 0 16px;
-  border: none;
-  border-radius: 12px;
-  font-size: 13px;
-  font-weight: 600;
-  cursor: pointer;
-  transition:
-    background 0.15s ease,
-    color 0.15s ease;
-}
-
-.vm-crud-shell__btn.is-primary {
-  background: var(--brand);
-  color: #fff;
-}
-
-.vm-crud-shell__btn.is-primary:hover:not(:disabled) {
-  background: var(--brand-deep);
-}
-
-.vm-crud-shell__btn.is-ghost {
-  background: var(--muted);
-  color: var(--foreground);
-}
-
-.vm-crud-shell__btn.is-ghost:hover:not(:disabled) {
-  background: color-mix(in srgb, var(--muted) 70%, var(--foreground) 8%);
-}
-
-.vm-crud-shell__btn.is-danger {
-  background: var(--danger-soft, #fceeee);
-  color: var(--danger, #c45b5e);
-}
-
-.vm-crud-shell__btn:disabled {
-  cursor: wait;
-  opacity: 0.65;
-}
-</style>
+<script setup lang="ts">
+import type { DialogContentEmits, DialogContentProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { X } from "@lucide/vue"
+import { reactiveOmit } from "@vueuse/core"
+import {
+  DialogClose,
+  DialogContent,
+  DialogPortal,
+  useForwardPropsEmits,
+} from "reka-ui"
+import { cn } from "../../../lib/cn"
+import DialogOverlay from "./DialogOverlay.vue"
+
+defineOptions({
+  inheritAttrs: false,
+})
+
+const props = withDefaults(
+  defineProps<
+    DialogContentProps & {
+      class?: HTMLAttributes["class"]
+      showCloseButton?: boolean
+      /** CRUD 弹窗：桌面 50vw，≤768px 全屏 */
+      shell?: "crud" | "default"
+    }
+  >(),
+  {
+    showCloseButton: true,
+    shell: "default",
+  },
+)
+const emits = defineEmits<DialogContentEmits>()
+
+const delegatedProps = reactiveOmit(props, "class", "shell", "showCloseButton")
+
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
+</script>
+
+<template>
+  <DialogPortal>
+    <DialogOverlay />
+    <DialogContent
+      data-slot="dialog-content"
+      :data-shell="shell"
+      v-bind="{ ...$attrs, ...forwarded }"
+      :aria-describedby="undefined"
+      :class="
+        cn(
+          'bg-card data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed z-50 duration-200',
+          // default：居中卡片；crud：定位交给下方 CSS（避免 top/translate 与移动端全屏打架）
+          shell === 'default' &&
+            'top-[50%] left-[50%] grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg',
+          shell === 'crud' && 'vm-dialog-shell-crud',
+          props.class,
+        )
+      "
+    >
+      <slot />
+
+      <DialogClose
+        v-if="showCloseButton"
+        data-slot="dialog-close"
+        class="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-3 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
+      >
+        <X />
+        <span class="sr-only">Close</span>
+      </DialogClose>
+    </DialogContent>
+  </DialogPortal>
+</template>
+
+<!--
+  宽度写死在此：reka DismissableLayer 会覆盖透传的 style；
+  Tailwind w-full 在 max-w 失效时会撑满视口。CRUD 壳层用属性选择器 + !important。
+-->
+<style>
+.vm-dialog-shell-crud[data-slot='dialog-content'],
+[data-slot='dialog-content'][data-shell='crud'] {
+  top: 50%;
+  left: 50%;
+  display: flex !important;
+  width: 50vw !important;
+  max-width: 50vw !important;
+  min-width: 0 !important;
+  min-height: 400px;
+  max-height: 800px;
+  height: auto;
+  flex-direction: column;
+  gap: 0 !important;
+  padding: 0 !important;
+  overflow: hidden;
+  border: none !important;
+  border-radius: 24px !important;
+  box-shadow: var(--shadow-soft) !important;
+  translate: -50% -50%;
+}
+
+/* 列表类弹窗：直接拉满规范最高高度 */
+.vm-dialog-shell-crud.is-fill[data-slot='dialog-content'],
+[data-slot='dialog-content'][data-shell='crud'].is-fill {
+  height: 800px !important;
+  max-height: 800px !important;
+}
+
+/* 指定高度：--vm-dialog-height（如 800px） */
+.vm-dialog-shell-crud.is-height[data-slot='dialog-content'],
+[data-slot='dialog-content'][data-shell='crud'].is-height {
+  height: var(--vm-dialog-height) !important;
+  max-height: var(--vm-dialog-height) !important;
+}
+
+/* 移动端：铺满视口（无上下边距、无圆角） */
+@media (max-width: 768px) {
+  .vm-dialog-shell-crud[data-slot='dialog-content'],
+  [data-slot='dialog-content'][data-shell='crud'] {
+    inset: 0 !important;
+    top: 0 !important;
+    right: 0 !important;
+    bottom: 0 !important;
+    left: 0 !important;
+    width: 100vw !important;
+    max-width: 100vw !important;
+    height: 100dvh !important;
+    max-height: 100dvh !important;
+    min-height: 100dvh !important;
+    margin: 0 !important;
+    border-radius: 0 !important;
+    overflow: hidden !important;
+    translate: none !important;
+    transform: none !important;
+    animation: none !important;
+  }
+}
+
+/* CRUD 弹窗壳：仅 shell=crud 的 Dialog 使用（vm-upsert / form-dialog / adv-search 等） */
+.vm-crud-shell__head {
+  display: flex;
+  flex-direction: row;
+  flex-shrink: 0;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 10px;
+  padding: 12px 22px;
+  border-bottom: 1px solid var(--border);
+}
+
+@media (max-width: 768px) {
+  .vm-crud-shell__head {
+    padding: 8px 12px;
+  }
+}
+
+.vm-crud-shell__title {
+  font-size: 15px;
+  font-weight: 650;
+  letter-spacing: -0.01em;
+  line-height: 1.3;
+  color: var(--foreground);
+}
+
+.vm-crud-shell__close {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  width: 28px;
+  height: 28px;
+  margin-left: auto;
+  border: none;
+  border-radius: 8px;
+  background: transparent;
+  color: var(--muted-foreground);
+  opacity: 0.7;
+  cursor: pointer;
+  transition: opacity 0.15s ease, background 0.15s ease;
+}
+
+.vm-crud-shell__close:hover {
+  opacity: 1;
+  background: var(--muted);
+}
+
+.vm-crud-shell__close > i {
+  font-size: 16px;
+  line-height: 1;
+}
+
+.vm-crud-shell__body {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  min-height: 0;
+  overflow: auto;
+  overscroll-behavior: contain;
+  padding: 18px 22px 16px;
+}
+
+@media (max-width: 768px) {
+  .vm-crud-shell__body {
+    flex: 1;
+    padding: 12px;
+  }
+}
+
+.vm-crud-shell__foot {
+  display: flex;
+  flex-shrink: 0;
+  justify-content: flex-end;
+  gap: 8px;
+  padding: 10px 22px;
+  border-top: 1px solid var(--border);
+}
+
+@media (max-width: 768px) {
+  .vm-crud-shell__foot {
+    flex-direction: column-reverse;
+    gap: 8px;
+    padding: 8px 12px calc(8px + env(safe-area-inset-bottom, 0px));
+  }
+
+  .vm-crud-shell__foot .vm-crud-shell__btn {
+    width: 100%;
+  }
+}
+
+.vm-crud-shell__btn {
+  height: 36px;
+  padding: 0 16px;
+  border: none;
+  border-radius: 12px;
+  font-size: 13px;
+  font-weight: 600;
+  cursor: pointer;
+  transition:
+    background 0.15s ease,
+    color 0.15s ease;
+}
+
+.vm-crud-shell__btn.is-primary {
+  background: var(--brand);
+  color: #fff;
+}
+
+.vm-crud-shell__btn.is-primary:hover:not(:disabled) {
+  background: var(--brand-deep);
+}
+
+.vm-crud-shell__btn.is-ghost {
+  background: var(--muted);
+  color: var(--foreground);
+}
+
+.vm-crud-shell__btn.is-ghost:hover:not(:disabled) {
+  background: color-mix(in srgb, var(--muted) 70%, var(--foreground) 8%);
+}
+
+.vm-crud-shell__btn.is-danger {
+  background: var(--danger-soft, #fceeee);
+  color: var(--danger, #c45b5e);
+}
+
+.vm-crud-shell__btn:disabled {
+  cursor: wait;
+  opacity: 0.65;
+}
+</style>

package/dist/admin/components/ui/dialog/DialogDescription.vue

@@ -1,23 +1,23 @@
-<script setup lang="ts">
-import type { DialogDescriptionProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { DialogDescription, useForwardProps } from "reka-ui"
-import { cn } from "../../../lib/cn"
-
-const props = defineProps<DialogDescriptionProps & { class?: HTMLAttributes["class"] }>()
-
-const delegatedProps = reactiveOmit(props, "class")
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <DialogDescription
-    data-slot="dialog-description"
-    v-bind="forwardedProps"
-    :class="cn('text-muted-foreground text-sm', props.class)"
-  >
-    <slot />
-  </DialogDescription>
-</template>
+<script setup lang="ts">
+import type { DialogDescriptionProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { DialogDescription, useForwardProps } from "reka-ui"
+import { cn } from "../../../lib/cn"
+
+const props = defineProps<DialogDescriptionProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+
+const forwardedProps = useForwardProps(delegatedProps)
+</script>
+
+<template>
+  <DialogDescription
+    data-slot="dialog-description"
+    v-bind="forwardedProps"
+    :class="cn('text-muted-foreground text-sm', props.class)"
+  >
+    <slot />
+  </DialogDescription>
+</template>

package/dist/admin/components/ui/dialog/DialogFooter.vue

@@ -1,27 +1,27 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from "vue"
-import { DialogClose } from "reka-ui"
-import { cn } from "../../../lib/cn"
-import { Button } from '../button'
-
-const props = withDefaults(defineProps<{
-  class?: HTMLAttributes["class"]
-  showCloseButton?: boolean
-}>(), {
-  showCloseButton: false,
-})
-</script>
-
-<template>
-  <div
-    data-slot="dialog-footer"
-    :class="cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', props.class)"
-  >
-    <slot />
-    <DialogClose v-if="showCloseButton" as-child>
-      <Button variant="outline">
-        Close
-      </Button>
-    </DialogClose>
-  </div>
-</template>
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { DialogClose } from "reka-ui"
+import { cn } from "../../../lib/cn"
+import { Button } from '../button'
+
+const props = withDefaults(defineProps<{
+  class?: HTMLAttributes["class"]
+  showCloseButton?: boolean
+}>(), {
+  showCloseButton: false,
+})
+</script>
+
+<template>
+  <div
+    data-slot="dialog-footer"
+    :class="cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', props.class)"
+  >
+    <slot />
+    <DialogClose v-if="showCloseButton" as-child>
+      <Button variant="outline">
+        Close
+      </Button>
+    </DialogClose>
+  </div>
+</template>

package/dist/admin/components/ui/dialog/DialogHeader.vue

@@ -1,17 +1,17 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from "vue"
-import { cn } from "../../../lib/cn"
-
-const props = defineProps<{
-  class?: HTMLAttributes["class"]
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="dialog-header"
-    :class="cn('flex flex-col gap-2 text-center sm:text-left', props.class)"
-  >
-    <slot />
-  </div>
-</template>
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { cn } from "../../../lib/cn"
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+}>()
+</script>
+
+<template>
+  <div
+    data-slot="dialog-header"
+    :class="cn('flex flex-col gap-2 text-center sm:text-left', props.class)"
+  >
+    <slot />
+  </div>
+</template>